You’re a bad web developer
Or: How to build a photographic website.
Photographers are a creative breed: put a camera in our hands and we will give you works that will make you, laugh, cry, and think. I can go up to an unremarkable tree and come away with a stunningly beautiful photo, or I can make you reflect on your whole life in the face of a baby. But I cannot draw a picture or create a graphic, or code to save my life. I accept this limitation, and so I simply hacked together Wordpress themes and tacked on a serioes flash galleries in order to rebuild my website.
That’s not to say that I didn’t look at other websites for inspiration. I searched through Google, followed my blogroll links and followed links through forums and took note of what I saw. What surprised me was the plethora of bad photography sites out there on the web. There are photographer’s websites with no meta information to speak of (this is important), expensive flash templates that just server as a glorified link to a Flickr/MySpace/SmugMug/Whatever gallery.
I found other websites with no persistent navigation between pages or entirely different themes from one section to the next. One photographer’s portfolio is a series of animated .gif images. Although I’m not going to name offenders in this post because you all know who you are already, I express the hope that you feel a slow-burning shame for your laziness.
When I was rebuilding the website I kept to KISS as much as I could. No elaborate graphics. Clean, simple layout and easy navigation. Consistent appearance. Outside of a few rough edges, I think I’ve managed this.
As such, I want to try and communicate not so much the technical side of building a website, as I do things that you might not have considered that are important.
1: Meta Information
The absolute first thing you need to consider is your meta information, which defines you in the eyes of Google. Are you a generic “photographer” or are you a “Saskatchewan outdoor wedding photographer?” You need to specify who you are specifically, and this will influence your page rank and ultimately how much attention you receive. I can’t stress this enough; just by adding some general tags to my website the traffic going through tripled in a week. No expertise or special tools are needed. There are websites out that that will help you to both create and analyse your meta information to help improve your ranking.
All that this boils down to is a few lines in your header, but this is by far the most important part of your website, and in this article. It gets you seen.
2: Load Time
…load what?
If a potential customer has to sit around waiting for your portfolio gallery to load up, they’re more likely to lose interest and close the tab.
There are several steps you can take: If you’re using a theme for Wordpress or another CMS, you can modify the theme to your site and replace the database lookups with static links. You can use a caching plugin which generates and serves static HTML pages from your ordinary index files, and you can reduce the quality of any graphics or images on the front page very easily through the Gimp, Photoshop or any number of other programs.
3: Content
You’re a photographer. This is a photographic website. Why must I click through two pages before I find a single photo? Sure, you have an excellent splash page graphic. And MP3 welcome. And wordy introductory spiel. Absolutely none of this has relevance to your photography. Never forget that a good photo is a thousand words, and so pick pictures accordingly.
4: Navigation
This is another omission on many websites: Persistent navigation. The ability to go from one page to another without having to hit the backspace key or search for the menu which this page uses is taken for granted and there’s really no excuse for not having it.
The easiest way to achieve this is to add a menu to your header script, after the <body> tag and then include your content below it. This (at least it should) takes five minutes in total to achieve. You don’t even need to write code! Just copy and paste suitable code from a Wordpress theme into your style sheet and header.
5: Consistency
It’s easier to just slap up an index page that links to your Pbase page, but that doesn’t mean that it will look professional. Even this morning, I was on one website where I clicked through three pages and was presented with a completely different appearance on each. If I didn’t check the URL I would have sworn that they were separate websites:
Index: Big jpeg link. Looks like just a static HTML page.
Index2/Main page: Spawn of Microsoft Frontpage and cheap web template.
Portfolio Page: Expensive flash gallery.
It was jarring.
On a second website a consistent appearance was maintained, except for the image quality and presentation. I counted no less than six different watermark styles, and multiple images had more than one. Photo resolution quality different. There were 900kb full sized images mixed with with pixelated 20kb pictures.
None of this looks professional and I see it all too often, even though consistency in presentation is easy to achieve. Use a content management system and stick to a set policy regarding image size and website presentation.
6: Simplicity
Keep it simple, stupid. Toss out those tables, those awesome 9-column pages, the esoteric flash menu and those elaborate fonts. Someone coming to your website should never have to hunt for a link or a page. I’m speaking as someone who has trouble reading serif fonts at the best of times, and I never want to suffer your ”handwritten” About page again (you know who you are).
Pick an accessible appearance, no matter how simple it seems to you, and then stick with it. The point of your website isn’t to display your Flash or CSS knowledge, at the end of the day it exists to showcase your photo, no matter your focus, and nothing should interfere with this.
6: Focus
Last, but not least. Know what you want from your website: Print store, photo blog, online portfolio? How do you want to achieve this? Off-the-shelf CMS? All flash or no flash?
Sit down and ask yourself these questions and theb apply your answers to your website.
28. February 2008 at 12:35
Well done Mark and good luck with the new site
28. February 2008 at 13:07
[...] Website Hacks wrote an interesting post today onHere’s a quick excerpt [...]
28. February 2008 at 14:05
Cheers, Rory!
28. February 2008 at 15:28
You’re gonna call me a bad developer, without even looking over the draft layout for my new portfolio site?
It’s here and I really would love to hear your thoughts on it.
Just so you know, none of the links work yet, and in the portfolio section, visitors will navigate from photo to photo by clicking numbers below the frame.
Thanks,
Neil
28. February 2008 at 16:00
I’m arrogant. It lets me get away with those little assumptions…
Joking aside, the look of your new website isn’t at all bad.
I’m honestly not trying to come off as a high-handed web developer. I’m a novice myself, and I’m trying to do what I feel to be a sociable thing - communicating as a photographer to other photographers - by listing some mistakes avoid and concepts that they should keep in mind while designing or building their new websites.
28. February 2008 at 16:23
I was joking, but thanks.
Anything in there you’d like more/less of?
29. February 2008 at 11:28
I’m really not in the business of deciding themes and I don’t want to get into that. It’s not cluttered and it is accessible, which is plenty enough for me.
29. February 2008 at 18:28
I’m an itsy-bit interested in the meta tags, myself.
29. February 2008 at 19:43
Cool.
Cheers Mark for your opinion anyways.
Neil