Web 2.0 Design: The New Internet Era
Web 2.0 dominates. Everywhere and all the time. The new design trends are there, on the blog you’ve come from and on the blog you are going to visit next. Every now and again we find new design elements which somehow manage to become essential for every hip, trendy, glossy, stylish web-site which will be developed in the era of its majesty Web 2.0.
Web 2.0 is all about functionality and making a website user-oriented. That is why it is common to use a so-called “Central Design,” making it simple to see and understand the content. Enhanced navigation which is always available to the visitor, leaves no doubt about where to find anything on a Web 2.0 website.
Another marvelous feature of Web 2.0 is its enhancement of the visibility aspect in the design. This includes using bigger text for better readability, using bright colors to “please the eye” and rich surfaces and reflective highlights to enhance the qualitative feel of the design. Another excellent part of the Web 2.0 type of design is the extensive popularization of Icons as the essential design element.
1. Simplicity
Web design is simpler than ever, and that’s a good thing. 2.0 design means focused, clean and simple. Whenever you’re designing, take it as a discipline consciously to remove all unnecessary visual elements.
Concentrate particularly on areas of the layout that are less relevant to the purpose of a page, because visual activity in these areas will distract attention from the key content and navigation.
Use visual detail - whether lines, words, shapes, colour - to communicate the relevant information, not just to decorate.
2. Central Layout
Basically, the vast majority of sites these days are positioned centrally within the browser window. Relatively few are full-screen (liquid) or left-aligned / fixed-size, compared to a few years ago.
This “2.0″ style is simple, bold and honest. Sites that sit straight front & center feel more simple, bold and honest.
Also, because we’re being more economical with our pixels (and content), we’re not as pressurised to cram as much information as possible above the waterline/fold.
We’re using less to say more, so we can be a bit more free and easy with the amount of space used, and pad out our content with lots of lovely white space.
3. Simple Navigation
Permanent navigation - your global site nav that appears on every page as part of the page template - needs to be clearly identifiable as navigation, and should be easy to interpret, target and select. Simply remember the key: navigation should be clearly distinguishable from non-navigation.
4. Bigger Text
Lots of web 2.0 web sites have big text, compared to older-style sites.
If you fill the same amount of space with less “stuff”, you have more room. When you’ve made more room, you can choose to make more important elements bigger than less important elements (if they’re still there).
Making things bigger makes them more noticeable then lesser elements. This effect has been used throughout the history of print design, on headings, title pages and headlines.
Not only does big text stand out, but it’s also more accessible to more people. That’s not just people with visual impairments, but also people looking on LCD screens in sunlight, people sitting a little further from the screen, and people just skimming the page. If you think about it, that could be quite a lot of people!
5. Strong and Bright Color
Bright, strong colours draw the eye. Use them to divide the page into clear sections, and to highlight important elements.
When you have a simple, stripped-out design, you can use a bit of intense colour to help differentiate areas of real-estate and to draw attention to items you want the visitor to notice.
Remember:
If you’re using strong colours to attract the eye, it only works if there’s lots of area that isn’t strongly coloured.
If everything is trying to attract the eye, then the eye just gets confused, and the site will feel confusing and chaotic.
6. Rich Surface and Reflection
Realistic surface affects like drop-shadows, gradients and reflections help make a visual interface feel more real, solid and “finished”. They may also remind us of certain tactile or aesthetic qualities of real-world objects, such as water droplets, shiny plastic buttons, and marble floors.
Realistic effects of water droplets, glass beads, shiny plastic buttons etc. have been very popular over the past couple of years.
7. Icons and Badges
Icons and Badges play an important role in Web 2.0 design. Today we use fewer, better icons and badges that carry more meaning.
Icons can be useful when they’re easily recognisable and carry a clear meaning. In lots of other cases, a simple word is more effective.
Badges are the star-shaped labels that you see stuck on web pages, alerting you to something important. Badges can really work well, but of course should only be used to draw attention to something important.
8. Rounded Corner
Actually, there is a reason why we love rounded corners. This elements simplifies the readability and makes the understanding of presented information easier. In fact, rounded corners are used by emerging web-sites and young projects. All page elements become more round - navigation menus, buttons, input fields, tables and text columns.





