Creating a photo website - part 5

Whoa, what gives? Yes, you are absolutely reading about a Wordpress-based photography site on a blog that is no longer based on Wordpress. I seemed to get a fair bit of traffic on my site from people wondering how to do this, so I am leaving these posts here for posterity. That said, the internet world has evolved quite a bit in the last four years, so I now use a system that is simpler in some ways, but immensely flexible. So read about this newer flat-file CMS approach as I document it over the next few months.

Version 2.0

In the fall of 2007, I decided that I needed to make a little more updated version of my website. I had been reading up on the purported benefits of a nice clean HTML/CSS approach to laying out the website. The philosophy behind this approach is solid: It effectively allows you to (in theory) separate the website content from its appearance. All the content is supposed to go into HTML files which then contain a reference to a external CSS file that tells the browser how to display this content. Don’t like how it looks? Then just change the CSS file and leave your data alone. It all sounded good.

Another development that had come along in the interim was the release of Adobe Lightroom (and Apple’s Aperture). Both of these programs were aimed at helping photographers deal with their rapidly growing pile of digitally captured photographs. They offered some great editing features, but the one feature germane to website creation was the ability to create web galleries with very little effort. Select the photos, and press a button. Wait a few minutes, and a file folder will be created that contains a ready-to-play browser friendly web gallery. All the indexing, naming, thumbnail creation is done for you. This was huge!

So I had the notion that all I needed to do was create a simple site ‘skeleton’ using all these HTML/CSS tricks and just imbed the web galleries in the individual pages that the menus pointed to. Sounded simple.

Conceptually, it was. Practically - well, not so much. No doubt it was a piece of cake to have Lightroom create a Flash gallery of a group of selected photos. Easy. But this notion of a simple basic website ‘wrapper’ to display the galleries? - well, I don’t want to get into the gory details, but suffice it to say that I learned very quickly that Microsoft’s browsers don’t play well with the rest of the world. And that getting things to display properly on the range of possible browsers that have been set loose in the world required a lot more web-coding skill than I possessed when I started the process. But after a few weekends spent reading internet information on goofy shit like Microsoft Internet Explorer Version 6 and ‘quirks’ mode, I was able to get reasonably functional website built that allowed me to add additional content with a lot less effort.

What was good?

  • Creating Flash galleries in Lightroom is a breeze. And it handles all that tedious thumbnail-to-full-size-version linkage plus all the navigation
  • Using a good bit of CSS for styling made making minor changes in the appearance of the site fairly easy

What was bad?

  • Embedding the flash galleries into a basic HTML page required some judicious editing of the source files being used. In short, my approach was a hack.
  • Adding additional galleries was still a bit of a pain in the ass because of the editing I had to do on the HTML file that served up the flash gallery
  • It used Flash galleries. Remember what happened in 2007-2008? Oh yeah, that iPhone thing. Which didn’t do Flash. Still doesn’t. Never will.

Here is what it looked like: Version 2.0 of my website

An improvement, I think. Still, it was a very simple design and layout, in keeping with my philosophy of not having the ‘frame’ draw attention away from the photographs. You can see I was still stuck on using a left hand side menu. I could have saved myself no end CSS layout suffering if I had just sucked it up and used a simple menu above the content. But no, I had to get all fancy.

And, I am ashamed to admit, I finally suffered so much humiliation at the hands of Microsoft’s browsers that the basic framework of the website is still done with a very simple html table layout just to get everything to display properly in IE6. Can you say. “got layout”? (That is an inside joke for code-jockeys). Just don’t tell the CSS2 police.


categories:  marketing, portfolio, presentation, web design