Building alexking.org 2.0, Part 4: Designing for the Future

1024×768 was a pretty good sized monitor resolution, and was probably the standard for laptops, back in 2002. As such, I designed the previous version of this site to fit in an 800×600 screen – or common resolution minus one step.

With version 2.0, I’ve decided to go ahead and push all the way out to the 1024x* resolution width. This decision hurts me a little bit today, as there are undoubtedly folks who either have monitors smaller than 1024px wide, or prefer to browse with a browser window less than 1024px wide. Until I built this new site, I was generally around 900-950px wide in my own browser window.

But here’s the thing. As monitor pixels become smaller and monitors become bigger, so do the standard browser window sizes. My last design lasted four years, and I hope this one will do the same (or better). I’m looking at the trends of monitors growing wider and wider, and I think that the current site width will be pretty common, or at least reasonable, over that time period.

Besides, my site has an undoubtedly tech oriented audience. I’m not going to gear the site towards the good folks who are still running Windows 98 on an 800×600 monitor.

Here is an excellent article by Cameron Moll that breaks down the optimal width for a site at 1024px wide. And yes, 960px is the width I set for my site.

The width of the pages is not the only change that helps with future-proofing the site. Another big change1 is the move of all content into a database. With the content (almost) fully abstracted from the page templates, future site design changes will be significantly easier and faster. Using a CMS for everything, WordPress being my choice of course, makes everything better. :)

I’ve also tried to avoid really trendy stuff like rounded corners with shadows, web 2.0 gradients, reflections and other things I think will look dated in a few years. On my old site I went with all lowercase letters for a few things because it was hip at the time, and I regretted it. It’s a lot more hassle to go back and fix that stuff than it is to not use it in the first place.

The last bit of designing for the future is an area that can be pretty tough; URLs. I’ll get into this more in the next article.

  1. Which, as I’ve covered in previous articles in this series and will continue to expand on. It does lots of good. [back]