Chicken and egg web design

27th Feb 2008

Interesting subject brought up by Patrick at Hell Yeah Dude about the process involved in designing web sites. He asks Photoshop mock-ups for web design? Or web design for Photoshop mock-ups? The main gist of the article being the process involved in designing a web site. So, do we:

• start from a graphic and build the code round that? Or
• start with the code and drape the design over the top?

Well my answer is a bit of both. In my experience I do the graphics first but this is always based on prior knowledge of the content (it's impossible to design a site without knowing what the content is going to be). So with an understanding of the site content I create a loose document structure on paper and design the site round that. The first stage of coding is the HTML wire-frame and only then does the CSS come. Finally I add JavaScript embellishments if necessary.