6 web design trends and resources for 2011 & 2012

Web design trends this year are all about embracing new technologies and moving into the future, which is brighter than ever.

1. App UI influenced web design

This is perhaps the most obvious to-the-day trend consuming the Web Design industry.

User interface design for computer and handheld apps is growing rapidly and with new technology being released every month (including the rumoured iPhone 5 announcement on October 4th) it doesn’t look like it’s going to slow down any time soon.

As a result, we’re seeing UI design elements spill over into standard Web Design. Your average website is taking on the look of an application, with design features like OS-inspired icons, infographic-driven layouts and a focus on usability and simplicity the mainstream.

As technology advances and the line between website and web application becomes more murky, we have to ask ourselves: will computer and handheld UI design’s influence be a passing trend or establish itself firmly in the minds and techniques of web designers for years to come; a trend that evolves with the industry and cements itself into our long-term design aesthetic (at least, until the next big thing comes along)?

Subtle noise textures, bi-colour gradients, three-dimensional effects on 2d elements, reflections, glossy OS-inspired icons and modal boxes are quintessential of on-trend design in 2011 and heavily dominate popular websites like Dribble and 365 PSD.

A few examples of this trend:

Test Pilot – Automated Continuous Integration for Ruby.

Milk Inc – App development company from Digg alum, Kevin Rose.

Jonnotie – A portfolio website.

Foundation Six – Web Design studio.

2. HTML5, CSS3 and embracing semantic markup

With older versions of Internet Explorer on their way out and more browsers supporting new forms of web markup, there’s never been a better time to experiment with HTML5 and CSS3.

HTML4 webpages are structured with divs, which are given appropriate IDs to determine the layout of a page. HTML5 presents web designers with a range of logical pre-defined elements to achieve the same results in a more semantic way.

Remember, not all browsers fully support HTML5 and CSS3 just yet. Make sure you’re aware of their compatibility. Here’s something to help you along the way, courtesy of findmebyip.com.

3. Ruby on Rails

Rails is a fantastic framework, and not as intimidating as you might imagine. With Rails 3 recently released with all the elements to support noSQL, HTML5  and new javascript interactions, now is the time to consider getting on-board with this ever-growing, incredibly active community.

4. Large Images and Photographic Backgrounds

In 2011, internet is more easily accessible and faster than ever. What does this mean for designers? Some of the old rules and restrictions are no longer an issue. Coupled with improved image optimisation and integration with css3, large photographs and illustrations are becoming the focal point of websites across the globe.

Cutting Edge – Brisbane based visual effects company.

5. Dribbble

If you’re not already on Dribbble.com, you should be! This exclusive design community is one of the best ways to keep up to date with current design trends in web and interface design and receive quality feedback on your own work.

6. 365 PSD

365 psd offers you a huge selection of beautiful, detailed PSDs and here’s the best part: they’re free for both personal and commercial use! They’re great if you’re more of a programmer than a designer, if you’re stuck for inspiration or even as a starting point to evolve your own design.

Remember

It’s important to keep up to date in an industry that evolves so rapidly, but at the end of the day, web trends come and go but the fundamentals of design do not change. Think about your client and their audience and base your outcome on what will best serve their product or brand.

Related Post

HTML 5 video – container formats and codecs explained

Read now

Comments

  1. Very nicely described Joelle.
    Some other major trends in website design of 2011 are below.

    1. Less Use of Flash – Flash is a great technology but in the past year or so it has been over used. Today, websites need to have a clean, uncluttered design, fast loading and above all must be Search Engine friendly.

    2. Make simpler and cleaner design

    3. Use mobile ready design

    4. Use large photographic backgrounds

    5. Use thumbnail design for your website

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>