Web Design Tips and Guidelines

Below are some of the important web design tips and guidelines i believe are essential for every website design.

1.Layout

In website design starting point is usually to find the layout which best suites your requirements. Layout is actually the location of the content, images and knowledge inside your web site. Normally layout is made in Adobe Photoshop or another graphic tool. Please think about these few things while designing layouts.

Width and height of design screen (What resolution to style?)

Height of header and footer content

Where to position the content so that it can be handy or readable

Keep white spaces (gaps) in your text content and images

Keep it simple and clean, don’t make a lot of information stuck on only one page

You can also draw design on simple paper through your hand

2.Color Scheme

Second part of web site design is usually to pick the right color scheme. Your color scheme could be made up of several colors. But don’t use over 3 colors, it will likely be difficult to control over 3 colors. There are some websites where you can pick up along with schemes like or there is also amazing pallettes @ . Now we will see some tips on color choices.

Choose no less than 2 colors or 3 colors, like black, darkish and dull green.

Keep your text inside a readable color like white text on darkish background.

Keep your links a little bit more sharp in colors than your text

Keep the balance in colors like light colors on dark backgrounds

Dont make a fruity effect through the use of too many colors in a place

Try to use Web 2.0 sleek and clean palettes

3.Content Positioning (Balancing)

Third step would be to position and gaze after your contents so your user seems like all the pages in the site and in balance. It is very crucial step in web page design. You also have to make note of to view your online pages in multiple major browsers. Okay now here are some listed tips.

Keep the distances same on each page like distance from header with the content have to be same on all pages

Left and right margins and positions should also be same on all pages

Keep a balance in positioning so nothing looks odd on the website

These days giving some space or white space is often a fashion in website design

4.Optimization

First three steps were purely design based; now for those who have built your page a bit, you must not neglect the page size and just how it will load inside browser. Web page optimization means a really broad term. It may also include Search engine friendly coding. In the list below i am going to also list some websites/links in order to check your web page performance.

Keep use of images at minimum, loading time will be affected as a result of heavy images

Minimize the application of a lot of scripts and Flash content

Use CSS and div based layout and eliminate any unnecessary code from CSS and HTML

Words inside the title of page and headings as well as your meta tags all counts to Search Engine optimization

Don’t miss to look at your website in various browsers, cross browser compatibility is often a must

Now i will list many of the websites i personally use as a web designer to optimize my pages.

A good Meta Tag analyzer tool SEOcentro Meta Analyzer

A very nice Web Page Optimization tool, Web Page Analyzer 0.98

Pingdom tools is really a great resource to check your loading time along with your page efficiency Pingdom tools

To check your webpage across multiple Operating Systems and browsers Adobe Browser Lab

And in the last be sure to validate your html/CSS code with W3C W3C Markup Validation

5.Design Exposure

In the last, i’ll discuss your design and color scheme sense improvements. Your experience new and latest technologies, design patterns and layouts may also improve your web design overall sense. Some tips are listed below.

Search about latest trends in web site design and latest web page design techniques

View portfolio websites of other great designers

View art related websites like to get some good exposure

Try learning new tutorials of Photoshop and Dreamweaver, this helps a lot

I would try and write another article on Optimization alone sometime soon.