Web Design Trends in 2011

Web Design Trends in 2011

This year is a fantastic year for Web Design. Designers from around the world crack creative juice, break boundaries and presenting web content in a unique, out of the box way. Not only the websites were done creatively, it also challenge the new possibilities of web as medium.

In this post, we will take a look into some design trends that are popular and taking shape in year 2011. Well I did some research and reading, and found out 9 significant trends and would like to share with you all. Continue reading to check them out.

1. Responsive Design

2011 has been the year of responsive or adaptive design. Now, people accessing websites not only on desktop but on tablet and mobile devices. By using CSS3’s media queries, web designers and developers are able to create responsive websites that can be viewed with majority devices that has different resolution. Web-Designer-Wall has a great tutorial on how to build your first responsive layout, plus you can also view more examples of responsive web design at dedicated gallery mediaqueri.es.

10K Apart

Joshua Turner

2. Illustration

This year, more and more websites getting bold with illustrations as base graphics. Illustrations with organic lines and adorable graphics gives great sense of human touch and friendliness. Besides it can also give strong personality to the design too.

Reverend Danger

Redirect Digital

3. Fancy Scrolling

Who say scrolling a website is boring? This year is a booming year of fancy scrolling websites, started by Nike Better World. We can see many examples of parallax scrolling effect websites, as well as other cool effects like zooming in effect, and things flying in and out. Tympanus has a great tutorial, teaches how to achieve the effect. Worth a read!

La Moulade

Hyundai Veloster

4. Going Full Screen

While against the smaller screen world, these websites are viewed best of large screen with high definition resolution. By utilising the full width and height of the screen, we are able to view the website content at best eye pleasure with less noise and clutter. Sometimes, these websites make people thinks that is that made with Flash?

McCormack Morrison

JWI Louvres

5. Infographic-like

In 2011, infographics are just appeared everywhere, to present boring statistics and research contents in a fascinating, entertainment way. We can also see some websites are also presented in infographic-like design. By using custom typefaces to present the data, this typographical based design is really good to look at, and unique too.

Scandalous Dirt

Target Nuclear Weapons

6. Diagonal Lines

In many web galleries, we can see websites that have diagonal lines being featured regularly. This gives a fresh new definition to web layout that normally are boxy and boring. Beside diagonal lines, we also can see some other shapes too getting popular like circle and triangle.



7. Experimental Interface

Experimental design is really popular this year, with the help of new web technologies combining HTML5, CSS3 and Javascript, Web Designers are able to go wild with web as medium for exploration.



8. Story Telling/Experience

I guess this is something new in 2011. These websites’ content, were presented in a way that as if it was telling you a story, guiding you throughout the website. With this, not only the visitors had a very good experience, the message also can be conveyed better.

Slavery Footprint

War Child

9. CSS3 Animation

With CSS3 Animation, Web Creators can animate stuff easily without relying on Javascript. On the other hand, modern browsers also started to commonly support all these CSS3 goodies, despite relying on vendor prefixes to make it work. But in future, I can see that many simple animations will be done with CSS3.


Apple iPhone

10. Beautiful Typography

This year, web typography went into a matured stage. By utilising CSS3 @font-face and web font services that are free and affordable, website typography are no longer boring and conventional. Also with awesome quality open source fonts available and useful plugin like lettering.js (http://letteringjs.com/), websites become a real beauty even without or just minimal usage of images.

Kitchen Sink Studios


End word
Above are my observation of 10 trends of Web Design in 2011. What are the other trends that you think should be in this list too? Well, there are other blog post that talks about the similar topic, here is it:

Hope you enjoy this post! What a great post to wrap up year 2011. Hope you guys enjoy the year end and brace yourself for 2012!

Similar Posts: