nawDsign { Design With Style }

The Way of the Web Designer Part 1

Feb 08, 2007 | Nor Sanavongsay | Comments (0)

rough sketch of web layout

People have often ask me how I go about designing a web site. I’m going to try and walk through my process. This is by no means the way you should do it, but just want to show you my way of approaching it.

Get Inspired

First, when I get a job request from a client, I often write down what they want. I listen to their requests and come back to them with a concept or theme that ties into their brand identity if they have one.  Otherwise, I end up doing that as well; That will be a different topic. 

After I get my concepts and theme down, I surf for inspiration. My first stop is always CSSbeauty. It is a showcase site that features a lot of great web designers out there. Here is a page with all the resources you’ll ever need for web development, Web Developer’s Handbook.

Wireframe

wireframe of web layout

Before I even start designing the web site, I would do some preliminary layouts with shapes just to get an idea of how the page will flow and also figure out placements. It does not have to be too detailed. This step is like sketching. You figure out the main components roughly. I like using Illustrator for this part.

Design

Open up any graphics software package you are most comfortable with. I like using Photoshop. In this step, I start to flesh out the wireframes and put color schemes and finalize placements of contents. This step is where you start to get the ”look and feel” of the site.

It is most often better to start designing the inner pages before you start designing the homepage. At work, we refer to these pages as the core browse pages. When you design the core browse pages first, you will get a better idea of the functionality of the site and also the main components of the site. The homepage or the landing page is where people tend to spend the least amount of time on. You want to get them in through the site to the important information first. For example, if you are designing a portfolio site, you would want the users to go directly to the portfolio by giving them clues on what is important in the homepage. Usually this layout will become your template for the entire site. I sometimes end up using this layout as the homepage itself if I’m doing small brochure sites like these: River East Chiropractic Health Center, Central Dupage Chiropractic, or Franklin Park Chiropractic.

Cameron Moll also suggests to not begin with the homepage design, but he is referring to web apps. He says it is ok to begin with the homepage if you are designing “brochureware” sites. I don’t disagree, but i think it will make life a lot easier to design the core browse first and then come back to the homepage.

Next time I will share my thoughts on converting the beautiful layout into the invisible art of coding.

Blog Index | Previous Entry Next Entry

Share your thoughts:

Add a Smiley :)

Remember my personal information

Notify me of follow-up comments?

Submit the word you see below:

10 Recent Entries

Archive

Authentic Jobs ~ Cameron Moll

Come in, we're hiring

Full-time and freelance job opportunities available at
Authentic Jobs:

Post a job and reach web professionals everywhere.

Advertisement

Resell Web Hosting

Resellers Panel. It's fast, profitable, and FREE!

Places to find me

MyBlogLog

nor sanavongsay