By:Vinnie Garcia, Published:2005-5-22

The following is a collection of web design tips that I’ve collected over my four years of working professionally in the field. They are here for informational purposes only and are not hard and fast rules (even I break them from time to time).

These tips are broken up into various sections as best as I can classify them.

Client Relations

Communicate! No matter how well or badly your project is going, let the client know. The earlier problems are detected and communicated, the easier the client will take it and the less risk there is of damage being done.

The client is always right, except when they’re wrong. Clients will sometimes make silly requests for various reasons. It’s up to you to assess whether this request fits in with their goals. If it doesn’t, explain it tactfully to them. They’ll understand if they’re truly in it for what they said their goals were.

Get it in writing. Any work you do for clients should be in writing before you ever do anything. This is for your protection as well as the client’s, and your client should know this. Take the time to have your contract terms reviewed by others periodically, preferably with the help of legal counsel.

Inspiration

Go outside! The web has many great examples of well-designed sites, but I guarantee you most of those sites didn’t have other webpages as their main sources of inspiration. Design is all around you. When you’re stuck, take a walk around your city or town. Look at the architecture, or the trees, or the clothing on the people walking by you. Look in magazines or on TV. Widening your outlook can bring in a whole new perspective on how you design for the web.

Resist the factory model. Once you’ve done a few different layouts it’s very tempting to re-use large parts of them on other sites. Resist the urge, or you might find yourself never progressing beyond a few specific niches.

Process

Content first! Always get content for a site before you start designing. A website’s design is at its best when it is a natural fit for the content it contains. You can’t get that level of cohesion if you open Photoshop without any content to help you work.

Define your milestones. Set milestones for your project. For example, finishing a sample layout may be a milestone. Having a database design laid out on paper could be another milestone. These show progress both in your mind (so you don’t feel overwhelmed or confused halfway through a huge project) and in your client’s eyes, since they have physical reminders of each milestone.

Markup and Style

Container elements. Even if you don’t think you need one, put it in anyway. Having a <div id="everything"></div> wrapped around all my content has saved me a fair amount of frustration when it comes time to tweak a site’s style.

Content first if at all possible. This is good for search engines as well as those using text-only browsers or browsers with CSS disabled, and it’s just plain common sense. People search the web for content, not your logo or navigation scheme. Give them what they want.

Usability and Accessibility

Never assume anything. Unless all of your work is on a corporate intranet, there is very little you can assume about your site’s visitors. They could have JavaScript disabled, or they could be using a popup blocker, or Flash could be turned off. The visitor’s issue may not even be browser-based. Hell, their mouse could be broken and they have to navigate everything via keyboard until their new mouse ships. Graceful degradation of your site’s enhanced features and accessible coding will go very far here.

Guide, don’t control. I don’t know about you, but personally I hate sites that do their hardest to make me forget that other websites exist. Your “sticky” techniques will only work to a point, and after that they will only annoy. This is a fine line to walk because as a site owner you want visitors to keep coming and remember your name, but you want them to know your name for the right reasons.

Your output is not final. What you store on the server may not always be what the end user sees. Somewhere down the line your code could be stripped of certain elements via a proxy, your images could be compressed as to be unreadable by a web accelerator, your cookies can be blocked, and a whole host of other things can happen. Your user might even make modifications such as using a bookmarklet or other user script to make your site more usable for them, or perhaps they’ve applied a user stylesheet to your site to make it more readable. Understand and accept this and your life as a web developer will be much less stressful.

This is not the full extent of my wisdom and knowledge, but it is a good start and I hope I’ve given everyone a lot to think about.

Vinnie Garcia runs IBeBloggin’ - one of the smartest blogs out there.
mulberry sale spyder womens jacket cheap new balance 574 mulberry outlet cheap new balance 574 arcteryx outlet mulberry sale spyder womens jacket mulberry sale spyder womens jacket mulberry outlet mulberry outlet new balance 574

Popular Articles

Top 10 Commentators


Subscribe to this feed! Subscribe by Email!

Random Bits Podcast

You need to download the Flash player from Adobe

Blogs Worth Reading


    Warning: fopen(./wp-content/themes/big-blue/my_blogroll.php): failed to open stream: Permission denied in /home/mangeletti/search-this.com/wp-content/themes/big-blue/get_blogroll.php on line 5

    Warning: fread() expects parameter 1 to be resource, boolean given in /home/mangeletti/search-this.com/wp-content/themes/big-blue/get_blogroll.php on line 6

    Warning: fclose() expects parameter 1 to be resource, boolean given in /home/mangeletti/search-this.com/wp-content/themes/big-blue/get_blogroll.php on line 7
  • Smashing Magazine