Redesign

, None

by · Posted in: website business

I've been itching to spruce up this website for most of the year and just haven't found the time. It competes with cleaning the garage for the distinction of easiest thing in the world to procrastinate (although a quick peek in my garage will tell you it did not win). Since I didn't want to waste a new year's resolution on the website, I spent a good chunk of December recoding it.

The goals of the new design

Include mobile Devices

While the old site performed well enough, it was beginning to show it's age. It didn't work well on the iPad and iPhone, which my logs tell me is becoming increasingly important. And it wasn't taking advantage of new browser support for HTML5 and CSS3 which can create a better user experience. The new design has a fluid, responsive layout that adjusts to display size. (You can see for yourself by shrinking this window down to a skinny size). It should now work as well on an iPhone as it does on a 24-inch monitor. I've also embraced javascript a little more, although everything should still more or less work without it.

Improve readability

Dark backgrounds are nice for images. A dark surround improves perceived contrast and saturation, but dark backgrounds and reversed type are miserable for reading. The dark background on the journal always annoyed me in the previous design, but I liked the way the images looked. It was a difficult choice, but I've ditched the dark gray background to make text a little easier on the eyes and also to lighten up the feel of the site a bit.

Services like Typekit finally allow designers to include arbitrary fonts in websites, but anything other than a simple sans-serif face looks like garbage at body sizes on Windows browsers. As impossible as it seems, with 26 years of development and billions of dollars spent, Microsoft still hasn't figured out how to render fonts. As a result you're reading this in tubby, but very readable Verdana rather than something a little sexier. Larger sizes, however, do render pretty well even on Windows, so we get to use Franklin Gothic and the beautiful Athelas italic for some of the headers.

Larger Images

Large screens, especially among a photographer's target audience, are becoming more prevalent. Photographers are presenting larger and larger images which compete well on these screens, but also create a kind of image-size arms race. Of course, serving screen-filling images assumes the viewer has a fast network connection, which is not universally true. The balance between image size and website speed is tough to achieve; you lose viewers if it's too slow and you lose them if it's too small or the images are compressed too much. I'll be trying to tune in to the sweet spot over the next few weeks. We've got some cool stuff going on under the hood that helps—preloading images in the background, resizing on the fly for mobile devices—but the galleries are going to be a little heavy. On the other hand, the images should look really nice if you stretch the screen out.

Simpler design

The site has been winnowed down to the essentials. The whole site is now just three things: a short about page, the portfolios, and this journal. The older essays are now incorporated into the journal. The contact page is irrelevant since contact info is on every page. And the old contact form, which was nothing more than a spam-bot magnet has been mercifully put down.

Feedback

It's impossible to test everything so I welcome any feedback. If something looks wrong or is not working, please let me know (and include information about your browser and operating system).