alan little’s weblog
photo gallery revamp (2)
29th January 2004 permanent link
On why I hate working with CSS but nevertheless grudgingly accept that it’s on balance not an entirely bad idea.
I’ve just about got the stylesheet for my new-look gallery pages ready after several train journeys and late nights. I really dislike working with CSS: it’s completely unintuitive and getting anything to behave as you want it to requires lots of frustrating trial & error and (if you’re lucky enough not to be on the train at the time) extensive web searching to find out how to do things that should be simple and obvious. At times the temptation to just say stuff it and put everything in html tables, which are conceptually straightforward and work as you expect them to, is overwhelming. But tables are Out (*) so I persisted with CSS because I know it pays off in the long run.
The new look fairly closely copies the look & feel of some of the gallery pages on the Magnum website (always steal from the best!), but I implemented it myself from scratch.
Once you’ve gone through the hours of teeth-grinding frustration and actually have a stylesheet working, it’s worth having. You have a consistent look across all the pages that use the stylesheet without having to do lots of time-consuming and error-prone copying; and you can do fairly major revamps to the look & feel of all the pages just by tweaking the stylesheet. My weblog pages are produced using templates, so the templates are the only html I ever have to edit by hand; but even so, there are several subtly different versions of the template for the main page, for the archives and for individual entries. Even keeping three or four files in synch would be a major pain and would inevitably go wrong sooner or later, so all they contain is a really minimal html skeleton and the real work is mostly done in the stylesheet.
Quite apart from the technical difficulties, I’m also discovering that there’s quite a lot of creative effort involved between having a collection of good pictures, and having a collection of small jpegs with a consistent size and look that I can use as the index to an online gallery.
- I want them all to be the same size and shape (square, probably). The ones I have had so far have been different: I think a gallery index page looks better if they are all the same. What I use as the “small” version of a picture for an index page has also tended to get larger since I started the site four years ago: fewer people are on dialup connections these days, and I’ve become more concerned about visual impact than download times.
- This means I will have to revisit most of the pictures I have had in the gallery and at least re-crop and re-size them – with the attendant danger that I’ll end up completely re-editing them when I look at them again and realise I can do a much better job with them now than I could then.
- I thought about keeping the actual jpeg files I already have, and just using the height and width in my img tags to get them all to display the same size, if only as a stopgap. But I’m not going to. I don’t want to waste my readers’ bandwidth (or mine) sending out larger files than I need to; and more importantly, do I trust the image resizing algorithms in Photoshop, or the ones in some random web browser? You only have to look at the browser itself to see how visually talented browser programmers generally are(n’t).
- I might have a landscape picture that looks stunning as an A3 print or a double-page spread in a magazine, and even ok as a reasonable size web image; but it’s going to look like nothing if I just squeeze the whole thing down to a 200x200 thumbnail. It might take several minutes of looking and trial-and-error in photoshop to find some part of it that actually works as a small square crop, assuming it’s possible at all.
- I’m not sure about mixing black & white and colour pictures on the same page. But if I don’t, then I’ll want to find some way to make it really obvious on the colour page that there’s also a black& white page and vice versa
(*) I make reasonable efforts to build this weblog as standards-compliant xhtml. The main page isn’t valid at the moment, however, because I have an unescaped ampersand – “&” instead of “&” – in a link somewhere, and in xhtml that is a Sin. I’ve checked the text file that the original link is in, and everything is fine there; so somewhere along my production line there is a bug that un-escapes it. Mea culpa. But I really don’t have the time – and frankly don’t care enough – to bother fixing it. The offending link will automatically drop off the bottom of the main page in a month anyway and then I’ll be valid again. For what it’s worth. See also this entertaining rant from Mark Pilgrim on just how little it is, in fact, worth.
related entries: Programming Photography
all text and images © 2003–2008