WediaBuzz

There is a distinctive “look and feel” to modern websites. The buzz word around this look is “Web 2.0″ This area of the site will explain what that look is and how to achieve it in web design practice.Concepts

Web 2.0 sites share some basic design features:

• Simple layout
• Centered webspace
• Design the content, not the page
• 3D effects, used sparingly
• Soft, neutral background colours & strong colour, used sparingly
• Cute icons, used sparingly
• Plenty of whitespace
• Nice big text

Simple layout

Much of the Web 2.0 sites are simple 1- and 2-column designs. The overall motive is “simple pages work better”. Web 2.0 pages read from top to bottom.

Centered Webspace

Web 2.0 sites are centered. Not liquid or left-justified layouts. The “old” wisdom, inherited from the newspaper field, is content needed to appear “above the fold”. It is now accepted to have easy to read, scrollable pages.

When content is centered – it gives the feeling of importance. It also communicates a simple, elegant, balanced and clean design.

Design the content, not the page

Good modern web designs put less energy into designing the page background – the canvas and permanent page features – and rather focus on designing the content itself.

See Phil Brisk’s article: “Dont’ decorate, communicate!”

It’s really about designing a “style” for the site – not an empty box to be stuff, plugged and bloated later.

3D effects, used sparingly

Modern sites like gradients – but they are very subtle and soft. Mostly they are used to accent and point us to feature of the site. There is also heavy use of reflections – especially with logos and icons. Soft drop shadows are also common. Call-outs which are round, starred or geometric are used a lot.

Soft, neutral background colors

Plain or VERY subtle, striped backgrounds are big. Usually very light or very dark grayscale. They are used to provide stark contrast from the foreground. Its all about directing attention to the “important stuff”.

Strong color is used to accent the most important parts of the page.

Plenty of whitespace

The term “less is more” is huge with modern web design. Leveraging whitespace to draw focus is very important. Whitespace doesn’t have to be white – but it has to be prevalent. This is also very true for the margins.

Nice big text

Big text is king – but should be used with caution. It is not meant for the whole site – but to, again, draw focus. So – make the most important text on the page bigger than normal text.

Resources:

http://www.webdesignfromscratch.com/current-style.cfm