And so I’m back on the Eurostar today. With a couple of quiet hours, it seemed a good chance to take stock of what needs to be done in the next couple of days to get this site online, so I’ve started pulling out chunks of code that will become PHP includes, stole the code for the contact form from Minim Media and have built a new page for social media links. So I think that, barring the video page which may be scrapped, pretty much all the content is in place now – huzzah!

Looking ahead, tomorrow I think I need to focus on getting the PHP bits and pieces working – the includes, forms, highlighting menu items, etc. I think that’s the biggest thing. Plus, to go with that, I need to determine how I’m going to identify the various pages as belonging to a particular section. I guess I could just include a variable in each page – it would be nice and clear, but I’ve also been considering whether it might not be easier just to divide up the content into folders and identify the section by folder name from the URL. The problem with this may be one of longevity. There was an article on URL-naming that was referenced from our course materials for the W3C Mobile Web Best Practices course I took earlier this year which I think I may need to re-read – its premise was that addresses of pages should relate directly to what they are about and not reference filetypes, technical approaches or current-but-possibly-unsustainable filing systems. The idea is to end up with a URL that can be used for that content forever – if the page’s focus changes, then it needs a new URL which reflects that. I like the idea of this, that the address for something is permanent because there is no need for it to change – it means that other sites can link with confidence, and archives can be maintained without the need for ever renewing links. So I’ll be re-reading that, I think, and I’ll see what is feasible to implement right now.

And now, back hooooooommme! And then tonight, the concert. Eeek!

Tagged with: code, organisation, programming, travel, web | Add a comment

This morning I left the (metaphorically) sunny shores of England for the (actually) sunny shores of France (the fact that both starting and ending points are inland I’m ignoring because it ruins the poetry). Which gave me a lovely couple of quiet Eurostar hours to do some Creative Pact work, so I fired up Gusto on the iPad and proceeded to see what it could do.

QUICK REVIEW: My verdict is that this is a very neat and useful little app. Of course it’s limited in what it can do, but for anything that just requires simple text edits, well, it does the job nicely. I would say that a certain amount of patience is needed – typing on the iPad’s keyboard is never the easiest, especially when symbols and numbers are regularly employed, but the developers have done a great job of making this easier than it would normally be by including a quick-access bar above the normal keyboard, including brackets and quote marks and other symbols commonly used in web development. From my work today I can say that this is a fantastic addition and what makes Gusto actually usable. For my part, I’d like to see =, : and ; added to the quick access bar, but it’s hardly a complaint – I mean, they even included a tab key so I can keep my code neat! It does lack some of the niceties of desktop editors still – no automatic indenting, for example, and syntax highlighting is yet to be implemented (although it’s apparently in development) but then, it’s not really a rival to desktop systems anyway. As a way to keep working on a project while travelling without carrying tons of equipment, though, it’s just grand. The FTP setup has been great and very easy to use (although the one crash I experienced was when I tried to download a large folder of files into Gusto, so I’m trying to keep the number of files I transfer at a time to a reasonable level) and it also let’s you preview locally, so it’s genuinely useful for making changes offline, unlike using any other random text editor. Overall, I’m pretty impressed – it’ll be very interesting to see how far future updates take this one.

Review done, now back to the Creative Pact stuff. Today on the Eurostar I was working mostly on getting templates ready so that I can forge ahead this week dumping content from the old site into the new and tweaking it to be new and improved. And the result is two templates ready to go, plus the sub-items of the main nav all in place, styled up and working. At the moment the show/hide for these is CSS-driven, but as it’s going to break in IE6 (ah! Adjacent siblings!) I’m thinking I’ll replace this with a PHP-driven approach to include or remove sub-sections according to the section the requested page belongs to. That’s going to have to wait till I get back to London though, as will turning the nav, footer and header into PHP includes, because I’ve not done any PHP in a while and I don’t trust my brain to get it right without a book (plus if I do that, it’ll look broken while I’m previewing the content locally, which would be annoying). I did find a PHP class yesterday to import tweets from my @caitlinrowley Twitter account which I’ve dropped into place in the homepage today, using the demo files as examples, but it seems to be throwing an error and rejecting my login, so I’ll need to look at that a little more closely too.

In unrelated news, today I ate my first mirabelles! I believe they’re a sort of plum, but they tasted more like tiny unfurry apricots. We also indulged and bought some girolles for our evening omelettes. And some awesome cheese. And yummy bread. And Beaujolais. Looking forward to breakfast now!

Tagged with: code, cooking, experimenting, learning, programming, tools, travel, web | Add a comment

VERY excited today. I’ve been playing round with webfonts when I should have been doing any of the ten billion other things on my list, but it’s been such fun I haven’t wanted to stop. Anyway, the short story is that it’s working! Thanks to the marvellous super-easy generator at Font Squirrel (which also has some great fonts, all of which are free for commercial use) I’ve got these up and running really quickly and now have two different fonts working on the page.

First up is Scriptina, the curly one I’m using for the site name (although I think I’ll leave this as an image so that where the webfonts don’t work at least the site won’t be totally plain), which I’ve used as a webfont for the headings in the right-hand column. I don’t know that this will be used anywhere else much on the site, but I think it gives the homepage a bit more of a sense of occasion. It’s not a very easy font to read though, which is why I’m not using it for the content headings.

The second font I’m using is Bebas, which is on the navigation headings and for the blog post title. I like the feel of this – makes the whole nav feel kind of 50s/60s businessy but I’m having some problems with it with spacing between words. Between characters seems OK, but it’s not really leaving enough of a gap between words for it to be clear where one ends and the next begins. Not sure if there’s a fix for this in CSS. If there isn’t I may go hunting for another font along similar lines.

I’ve also dug up a PHP class which apparently will pull tweets in from a user’s timeline, so I’m hoping to be able to pull the last 3 tweets from my @caitlinrowley account to go on the homepage. I’ve not really used anything like this before, so not sure if I’ll be able to get it working for the launch, but I guess I’ve got to try. It doesn’t look too hard to implement. And I’m about to save down some reading about whether it’s possible to import a WordPress blog post into a normal unconnected PHP page (because the blog is separate, for the time being at least) so I don’t have to manually update the homepage every time I post something.

I’m likely to be a bit quiet here over the next week as I’ll be in Paris and I’m not sure what the wireless situation will be like, or even if I’ll be able to find enough time to get some solid work done on this, but I’ll have the iPad with me and will write posts in the WordPress app, ready to post when I get access to the internet. Crossing fingers I won’t have to spend a whole 7 days without access….

Tagged with: code, design, experimenting, fonts, learning, play, programming, tools, web | Add a comment

Was trying to remember how to do JavaScript today, working on a function to remove the offending Ogg file from the audio tag for iPad, but really not doing very well, and I was lacking in time apart from train-time to do much more work on the site, but I did manage to get at least the logic of the script down, even though I’ll need to work on the actual JS itself to get it working. So not really much achieved, but an attempt. And as the other posts from today will show – got a lot of other stuff done too!

Tagged with: code, programming, web | Add a comment

… because we’re about to go and pick up a van and go out to Ikea. Probably won’t be back until the depths of night. Probably will be completely exhausted by the time we do get back. I’m loading up the iPad with lots to read because Djelibeybi wants to look at some stuff for his new (renting) flat in Scotland, so I’m expecting to be a bit bored.

Today the iPad came into its own for this project. I had to go into town to get my hair cut, so I loaded up Gusto on the iPad with the files I needed from my FTP server and did some editing and tweaking and made up the basis of the two-column template, so barring font thingys and side margins and getting it all to work in IE6 of blessed memory, this is pretty much ready, I think. YAY! Gusto’s actually pretty good. Limited at the moment, but really it’s quite useful. I wouldn’t want to code everything on it but for the moment it’s meeting my limited needs, and of course the iPad is SO much lighter and quicker to turn on than the laptop (also doesn’t have a DVD stuck in the drive which keeps trying to start itself up).

Did discover a slight issue with <audio> which I hadn’t found yesterday though. The gurus of HTML 5 online have been saying things like this:

you need to be careful about the order of the <source> elements. Because of a bug in Firefox, if you list the MP3 first (which Firefox doesn’t support), it will silently fail and refuse to render that particular <audio> element. The trick is to list the Ogg Vorbis file first and the other formats after. Webkit (Safari and Chrome) handle unsupported formats just fine.
HTML5 Doctor: http://html5doctor.com/native-audio-in-the-browser/

This seems to be fine and dandy (although I should say that it seems to be fixed in Firefox 3.6)… until you try to play it on the iPad. I haven’t tried the iPod Touch yet, but I’m guessing it’ll be much the same – with the Ogg file first, the iPad’s version of Safari chucks a wobbly and won’t play anything. With the MP3 file first, all is fine and dandy. Except of course, that it isn’t because by the sounds of things earlier versions of Firefox may break down and cry. I think it’s a case of JavaScript to the rescue here. For my current website audience, Firefox seems to be more important than the iPad, and I think (warning: gross generalisation ahead) that iPad users in general are less likely to be thinking about or switching off JavaScript than desktop users who may be constrained by workplace policies or mostly unfounded fears that their files may be attacked. At any rate, even if this isn’t the case, there are way fewer iPad users currently visiting the site and the proportion of those who may have JavaScript switched off is probably microscopic, so I’m planning on leaving the code set up for Firefox and using JavaScript to (probably) remove the offending ogg file source tag from the DOM at the first available moment. Hopefully this will work.

And now to face the horror that is Ikea…

Tagged with: code, experimenting, learning, music, programming, reading, tools, web | Add a comment

This evening I’ve been cleaning up some bits and pieces with the design – capitalisation, the background graphics making the connector lines between the heading and the nav, spacing out and recolouring the navigation links and so on. I’ve also added in the audio to the Featured work box, as my first attempt to get this working.

I should say before I proceed that I’ve done a bit of thinking and I think that I’m not going to have time to re-prep all my web audio in two different formats and have the site ready to go live by 30 September – not least because I’ve discovered that some of the original (ancient) files have got corrupted and barely have a note left intact in them, so I’ll have to see if I can dig out clean versions from the CD copies my mother brought over last time she visited, re-rip, re-make the extracts, re-encode (in two formats) and so on. So I’ve made an executive decision that while I want to get proper HTML 5 audio working on the site for launch, it won’t, alas, be for all the sounds on the site, but just a very few to start with, with the rest being upgraded from their incredibly ancient Flash players (I built those myself! Way back in… um… 1990-something) gradually after launch.

But back to today’s work. The good news is: IT WORKS! Some niggles, but overall I’m very pleased with it – Firefox, Chrome and IE6 all find the sound files and play them nicely (IE6 using the fallback link but really doing quite a nice job of it. Shame it’s not doing such a nice job with the site layout… that one’s on the to-do list). Things to be fixed:

1. Safari’s not playing back the MP3. It’s the same file IE6 is playing without problems but I don’t know if I’ve specified the wrong codec or there’s something off with the encoding (could be, it’s not a recent encoding), but it shows up the controls with a play button but when you click the play button nothing happens [Update: My MIME type was wrong - the problem with everything on HTML 5 apparently thinking that video is more interesting and the two are more or less interchangeable, so not providing MIME types for audio... Anyway, it's working beautifully in Safari now]
2. I’ve been able to resize the controls with CSS so they fit neatly in the ‘featured’ box but Chrome is losing display data when I do this – it’s playing back still and showing the progress bar, but it’s no longer displaying the total track time. Suspect this might have to do with font-size – it was pretty generously sized when the player was using its default size, so maybe it’s just slipped into a hidden overflow or something. Safari’s also not showing much data, but this seems to be because it’s having a problem with the file – setting the width for this browser actually seems to lengthen the control box

I think I need to do some more reading on this topic. Might print some stuff off the web tonight – big Ikea trip tomorrow night. Bound to be bored at some point…

Tagged with: code, experimenting, learning, music, programming, tools, web | Add a comment

Yep, I’ve made a start. Real live code. Real live HTML 5 code. I’m not entirely sure I’ve got the semantics right – I ended up with issues having borders and padding on the positioned elements for the layout so had to do a bit of wrapping to get it all to behave properly and then wasn’t sure whether the non-semantic div should be around the semantic one or inside it. I guess it doesn’t really matter hugely, but it’s too late at night now to be thinking about that. I’m just glad to have the framework in place. Feels like it’s really starting to take shape now and gives me hope that I may actually be on track for the site to go live as planned on the 30th of September. Yay!

Thinking vaguely about using @font-face for the headings in the site, but I’ll need to do a bit of reading up on that. Might not be able to get it happening in time for the launch, but I’ll look into it. Realised that I have a bunch of other tasks apart from just coding pages too – going to have to spend a chunk of time preparing sound files too – all the audio on minim-media.com is embedded in Flash players, but obviously that’s not really the way of the future so I’ll need to re-encode it and really look into the whole codec business – sounds like every file will need to be in at least 2 different formats which is, to say the least, annoying, but it’ll be interesting to see how it works…

Tagged with: code, programming, thinking, tools, web | Add a comment

Yes, I know, *yawn!* it’s dull to read about but the reading itself is still very interesting. Today’s chapter (OK, half-chapter) was on web storage. Haven’t quite got up to Web SQL Databases yet, which will be huge fun, but the Web Storage API stuff (described by Lawson & Sharp as “cookies on steroids”) is more than enough for this project. I have knowledge. This is good

I’ve been trying to get motivated to do some more code, but it’s been a crazy, crazy day, rushing about, the landlord finally coming to take away the excess furniture, a spirited attempt on tackling the dust in this place and subsequent discovery that the vacuum cleaner that came with the flat is, in fact, the worst vacuum cleaner in the world. There is a high probability that I will go out in the next few days to buy vacuum cleaner bags and instead come back with a baby Dyson… Not a fiscally sensible way to begin 4 months off work, but I think it would make life immeasurably happier than weekly wrestling with a sucky vacuum that doesn’t actually suck. I’ll chalk it up to the “stress management” account if I do.

Tagged with: learning, programming, reading, study, web | Add a comment

Read the chapter on the new media tags today – very interesting, and great to see that even though they’re not fully supported there’s a range of fallback options available, both built in to HTML and via JavaScript. It sounds like there’s really a lot of scripting opportunities available (or will be available!) to go with both video and audio, which makes me think that my idea of a mobile piece using <audio> and the geolocation APIs, while possibly not entirely feasible right now, may be in the near future – can’t wait!

Tagged with: learning, programming, reading, research, study, web | Add a comment

Actually managed 7 days in a row on my Creative Pact, so I’m feeling unreasonably pleased with myself.

I also managed to sort out the domain-name-buying issue by using a different card (still don’t know what happened with the first attempt) and pointed to to my hosting space today. So this evening, I had my first stab at HTML5, putting together a placeholder page for the site so it looks a bit more proper as the work is being done rather than advertising the services of my hosting provider It’s simple, and possibly I’ve done something semantically wobbly, but it does validate, and that makes me a happy camper.

Tagged with: blogging, code, learning, programming, publishing, web | Add a comment