2012 has brought with it a wave of web design trends. Keeping up with these constant developments is essential, but it's important to keep in mind that effective web design is more than just a coat of paint; it always needs to support your business goals. Good web design is a necessary part of your larger web marketing and user experience picture. In keeping with this holistic approach, we selected the following as the top web design trends to implement this year: NOTE: If you find this post useful, check out our webinar on the same topic, "Top Website Design Trends for 2012", along with our blog post, "Top Mobile Website Design Trends for 2012".

1.  HTML5, CSS3 and JQUERY
    In the last couple of years, HTML5 has gained quite a bit of traction, and now all major browsers support it. The capabilities of HTML5 are phenomenal; with it, you can create truly interactive experiences vs. simple animations. With CSS3 and Javascript thrown into the mix, the result is a rich playing field of possibilities for web design. HTML5 is now widely recognized and used by big brands like Apple and Google.

    top website design trends 2012

    2.   Mobile Compatibility and Responsive Layouts

    Designers can no longer ignore the exponential growth in mobile usage, and always have to consider how a website will perform on mobile. When designing a site, for example, one has to determine whether a native app, web app or one website that auto-scales to mobile screen sizes will be optimal.

    Responsive layout refers to how well a layout responds to the size of a screen. It organizes the content to make it just as visually pleasing on a small screen as a large one. Responsive layouts can be great for those organizations that may have a smaller budget and/or resources.

    top website design trends 2012
    3
    .  Typographic Layouts

    Typography is an extremely effective and creative way to instantly grab the attention of your visitors. Before, designers would need to build images to create the effect of rich typography, but now, especially with Typekit and Google Fonts, a site's performance and accessibility are no longer bogged down by extra images.

    top website design trends 2012


    4.
      The Grid

    The original intent of the grid was to streamline web development by using common dimensions in the design layout. Anything but restrictive, grid layouts can be aesthetically pleasing, and allow for creativity in their implementation.

    top website design trends 2012
    5.  Large Background Images

    In many ways, this trend is becoming a best practice. Large background images are a great way to maximize a smaller marketing/advertising budget to engage a wide audience. Large images work to draw a visitor in, creating more of an immersive user experience.

    top website design trends 2012

    6.  Perceived Affordance and Metaphoric Design

    Don Norman, a renowned psychologist and cognitive scientist, expanded on a theory of perceived affordance in design, and it's becoming more prevalent than ever. To get a sense of what perceived affordance is, ask yourself the question: "When I see something for the first time on a website, how do I know how to use it?"  There are many visual metaphors built into user interfaces, including drop shadows, gradients and rounded corners. These visual metaphors help to create perspective, give the illusion of depth and 3-dimensionality, and ultimately guide the user towards taking a specific action (i.e clicking a button).

    Although perceived affordance and metaphoric design have been used for some time, designers have found more strategic and thoughtful ways to apply it recently.
      top website design trends 2012
    7.  Social Media Integration

    Having social media integration on your website is now as crucial as having basic navigation. Although the practice of including social media links on your website is anything but new, designers have recently begun to devise more thoughtful ways of integrating social media into a website's design, giving these channels prominence instead of just relegating them to the footer.

    top website design trends 2012

    8.  Illustration

    Illustration has been used for years now, and it has added a humanistic dimension to design. However, it has evolved and become more popular over the past few years. It was previously used for buttons and select interface elements only, but has now become more integrated with the full user experience.

    top website design trends 2012

    9.  Single Page Websites

    Previously, the concept of the "fold" guided web design. The fold refers to the imaginary barrier on a web page, above which all important content sits.

    This concept, alongside the misperception that "users don't scroll", became very ingrained in web design practices, and it often led to visual clutter. However, with the recent explosion of single page websites, content layouts have morphed to more of a story-book format, and the fold doesn't have as dominant of an influence on web design. It's important to note, though, that key company/product messaging and calls to action are still best to place closer to the top of the page.

    top website design trends 2012

    10.  Parallax

    Parallax has become more popular over the past year or so. What parallax refers to is the design of two parallel objects moving at different speeds. When built correctly, it really helps to disrupt the linear paradigm of scrolling. However, the drawback to this fresh and engaging technology is that most current browsers cannot support it, so we can expect to see this gain even more traction in the next few years.

    top website design trends 2012

    11.  Elegant Modal Boxes

    Gone are the days of the annoying pop-up (well, for the most part!) Modal boxes have become widespread in interface design, particularly for contact forms, login windows, and tool/help windows. Modal boxes are much more elegant and unobtrusive, working to layer information without frustrating or driving the user away from key pages.

    top website design trends 2012

    To sum up, not every trend is worth adopting just for the sake of it being a trend. You need to ensure that when you're redesigning your website, you're aware of the latest trends and best practices, but are only applying those that support your marketing objectives. Ultimately, web design needs to work in conjunction with a solid content strategy, SEO, and conversion optimization to be fully successful.

    Originally posted on Marqui's Web Marketing Blog

    Top Website Design Trends for 2012

    2012 has brought with it a wave of web design trends. Keeping up with these constant developments is essential, but it's important to keep in mind that effective web design is more than just a coat of paint; it always needs to support your business goals. Good web design is a necessary part of your larger web marketing and user experience picture. In keeping with this holistic approach, we selected the following as the top web design trends to implement this year:

    NOTE: If you find this post useful, check out our webinar on the same topic, "Top Website Design Trends for 2012", along with our blog post, "Top Mobile Website Design Trends for 2012".

    1.  HTML5, CSS3 and JQUERY

      In the last couple of years, HTML5 has gained quite a bit of traction, and now all major browsers support it. The capabilities of HTML5 are phenomenal; with it, you can create truly interactive experiences vs. simple animations. With CSS3 and Javascript thrown into the mix, the result is a rich playing field of possibilities for web design. HTML5 is now widely recognized and used by big brands like Apple and Google.

      top website design trends 2012

      2.   Mobile Compatibility and Responsive Layouts

      Designers can no longer ignore the exponential growth in mobile usage, and always have to consider how a website will perform on mobile. When designing a site, for example, one has to determine whether a native app, web app or one website that auto-scales to mobile screen sizes will be optimal.

      Responsive layout refers to how well a layout responds to the size of a screen. It organizes the content to make it just as visually pleasing on a small screen as a large one. Responsive layouts can be great for those organizations that may have a smaller budget and/or resources.

      top website design trends 2012
      3
      .  Typographic Layouts

      Typography is an extremely effective and creative way to instantly grab the attention of your visitors. Before, designers would need to build images to create the effect of rich typography, but now, especially with Typekit and Google Fonts, a site's performance and accessibility are no longer bogged down by extra images.

      top website design trends 2012


      4.
        The Grid

      The original intent of the grid was to streamline web development by using common dimensions in the design layout. Anything but restrictive, grid layouts can be aesthetically pleasing, and allow for creativity in their implementation.

      top website design trends 2012
      5.  Large Background Images

      In many ways, this trend is becoming a best practice. Large background images are a great way to maximize a smaller marketing/advertising budget to engage a wide audience. Large images work to draw a visitor in, creating more of an immersive user experience.

      top website design trends 2012

      6.  Perceived Affordance and Metaphoric Design

      Don Norman, a renowned psychologist and cognitive scientist, expanded on a theory of perceived affordance in design, and it's becoming more prevalent than ever. To get a sense of what perceived affordance is, ask yourself the question: "When I see something for the first time on a website, how do I know how to use it?"  There are many visual metaphors built into user interfaces, including drop shadows, gradients and rounded corners. These visual metaphors help to create perspective, give the illusion of depth and 3-dimensionality, and ultimately guide the user towards taking a specific action (i.e clicking a button).

      Although perceived affordance and metaphoric design have been used for some time, designers have found more strategic and thoughtful ways to apply it recently.
        top website design trends 2012
      7.  Social Media Integration

      Having social media integration on your website is now as crucial as having basic navigation. Although the practice of including social media links on your website is anything but new, designers have recently begun to devise more thoughtful ways of integrating social media into a website's design, giving these channels prominence instead of just relegating them to the footer.

      top website design trends 2012

      8.  Illustration

      Illustration has been used for years now, and it has added a humanistic dimension to design. However, it has evolved and become more popular over the past few years. It was previously used for buttons and select interface elements only, but has now become more integrated with the full user experience.

      top website design trends 2012

      9.  Single Page Websites

      Previously, the concept of the "fold" guided web design. The fold refers to the imaginary barrier on a web page, above which all important content sits.

      This concept, alongside the misperception that "users don't scroll", became very ingrained in web design practices, and it often led to visual clutter. However, with the recent explosion of single page websites, content layouts have morphed to more of a story-book format, and the fold doesn't have as dominant of an influence on web design. It's important to note, though, that key company/product messaging and calls to action are still best to place closer to the top of the page.

      top website design trends 2012

      10.  Parallax

      Parallax has become more popular over the past year or so. What parallax refers to is the design of two parallel objects moving at different speeds. When built correctly, it really helps to disrupt the linear paradigm of scrolling. However, the drawback to this fresh and engaging technology is that most current browsers cannot support it, so we can expect to see this gain even more traction in the next few years.

      top website design trends 2012

      11.  Elegant Modal Boxes

      Gone are the days of the annoying pop-up (well, for the most part!) Modal boxes have become widespread in interface design, particularly for contact forms, login windows, and tool/help windows. Modal boxes are much more elegant and unobtrusive, working to layer information without frustrating or driving the user away from key pages.

      top website design trends 2012

      To sum up, not every trend is worth adopting just for the sake of it being a trend. You need to ensure that when you're redesigning your website, you're aware of the latest trends and best practices, but are only applying those that support your marketing objectives. Ultimately, web design needs to work in conjunction with a solid content strategy, SEO, and conversion optimization to be fully successful.

      Originally posted on Marqui's Web Marketing Blog

      Blogger Profile: Marqui Web Marketing Blog
      Marqui's Web Marketing Blog is brought to you by their marketing and consulting team to share ideas, best practices and trends from the world of web marketing. The blog aims to cover a broad array of topics relating to web marketing including content management, conversion optimization, SEO, email marketing and lead nurturing.

      Posted by Sue Ansell at March 19, 2012 5:30 AM

      Categories: Sales and marketing Trends

      Comments

      TrackBack Link

          Printer-friendly     

      Backbone Mag on Facebook Backbone Mag on Twitter Backbone Mag on Linkedin


      Canadian Wireless Trade Show 2014

      Backbone resource guide

      Backbone magazine latest digital issue

      Backbone magazine September 2013

      Backbone magazine June 2013

      Backbone magazine March 2013

      Backbone magazine November 2012 issue

      Backbone magazine September 2012 issue