Web Design Trends for 2009

istock_2009At the beginning of each year, I like to take a spin around the virtual world and see what other designers predict as hot trends for site design.

Spotting a trend that’s going to last a while isn’t always easy. At first glance, some trends might show promise but on closer inspection don’t have the power to last. Others seem like nothing special and end up taking the Internet by storm.

A Look Back at Last Year

My trend predictions for 2008 were pretty close to what actually happened – and here’s a look at what was hot this past year:

The Magazine Theme:Magazine style themes were pretty hot for 2008 – and now they’ve been so done that they’re nothing new.

Footer Navigation: Where there was once only a lonely copyright, there is now footer navigation. This trend got some traction in 2008, and it’s still alive and well in ’09.

Retro/Grunge: The Retro 70s graphic styling with solid geometric shapes and funky colors was popular last year, and so was the gritty look of Grunge. In my opinion, both became over-played.

3D Layers:Nothing is more challenging than creating optical illusions on web pages, and nothing is more fun. 2008 saw plenty of designers creating pages with 3D sticky notes, pens and the occasional coffee stain. Now leaving that trend behind are designers who choose to use rich textures, lighting and color to push the 3D experience further.

A Look Ahead at This Year

So what are the predictions for hot design trends for 2009? Let’s have a peek:

Slideshow/Galleries: Having a slider or rotating gallery on your main page is very hot right now. After magazine-style layouts gained popularity, slideshows started growing in numbers as well. With a slider such as the one in Brian Gardner’s Revolution Office theme, images are generated from a custom field for thumbnails that adds to the slider bar. You still get the benefits of showcasing archives or your most recent posts taking up screen real estate space in the process.

Transparent PNG Images: Before 1995, when PNG files were created, designers worked with GIF images. Although GIF was great for transparencies, the files only used 256 colors as opposed to the PNG file’s sharper compression and ability to use literally millions of colors, which makes for crisper images with better blending between gradients. Even better? PNG has gone transparent.

Wrap-Around Banners:Wrap-around banners come from the evolution of the 3D movement and give the illusion of a banner wrapped around a sidebar, content area or header. For those of you interested in banner wrapping, take a look at this tutorial.

Wood is Good: For backgrounds, that is. This trend got going in 2008 and I don’t see it slowing down for ’09 either. Other types of natural textures, like cloth, paper and stone, make for just as nice backgrounds as well.

All On One Page: Magazine themes were great, but many people didn’t like all the scrolling involved in viewing the full page. Some of those magazine themes can get pretty long. Recent trends have designers working on getting that main page down to a size that fits neatly into a browser window with no scrolling required at all. With the use of slideshows and tabbed (dynamic) navigation in the sidebar, achieving this single-page look is easier than ever.

There are so many good ideas out there the list could go on forever. Which upcoming trends have you spotted? If it isn’t listed here, add it to the comments and tell us what you think. Next year we’ll see which trends held up and which ones bit the dust.

Post by Agent X

Agent X is the name many mysterious and intriguing people take on when they guest post at our site. Their mission is to slip in like a thief in the night, leave you with entertaining, valuable and useful content, and slip away again - without getting caught.

Join the Discussion. Click Here to Leave a Comment.

  1. The lifestream trend (not my favorite) but in all fairness seems to have had its fair amount of limelight last year and I recon we will see more lifestreaming/micro-blogging web-designs appearing during 09.

    Jonathan

  2. Lifetree Creative has one of the cleanest designs I’ve encountered.

  3. Hehe.

    Yeah, I ran across a site yesterday and I remember thinking, “Man, that is SO web 1.0. it’s amazing what I used to think was coolio, now I think, “What a foolio.”

    Cheers!

    George

    Tumblemoose´s last blog post…Dialogue sucks. I aim to kill you with it

  4. I agree with Jonathan. Lifestreaming will get big. With things like sweetcron gaining some ground and getting attention; it will make lifestreaming very accessible.

    Although, I think lifestreaming will die very quickly just because there isn’t much value in viewing lifestreams.

    I also think 2009 will see many more large background pictures used almost like artwork, similar to how Nick La does most of his sites.

    Transparency should also be big with more and more web designers giving up on supporting IE6.

    Jeremy Davis´s last blog post…39 Grunge Websites

  5. I can’t wait until CSS3 comes out and we can make things transparent with a bit of code! Until then, one of the things I’ve noticed is a lot of sites focusing on typography. Big, bold fonts and muted colours that make the text stand out even more. I like that look since it makes you read the actual content instead of just “ooh-ing and ahh-ing” over the pretty graphics and colours.

    Cassie´s last blog post…Blogging Challenge – Publishing those pesky draft posts

  6. @Jonathan: Lifestreaming sounds like what blogs used to be; a means for everyone to chronicle their day to day life. I think that as it is now, the trend may not last, but it’ll evolve like blogging did and a year from now it’ll probably move away from that “reality TV” feel into a powerful marketing tool.

    @web design: They do have some pretty clean looking designs. Good stuff going on there.

    @Tumblemoose: lol, yeah, that’s sort of like looking back at our old high school pictures, huh?

    @Jeremy: I’m already seeing larger background images and I’m wondering how that’s working out for slower connections. I like the look, and Nick’s stuff is gorgeous. It’s definitely time to break that banner out of the box and transparencies are going a long way to help make that happen.

    As for IE6? Don’t get me started ;)

    @Cassie: CSS3 already? I’m still getting caught up with CSS2!

    I do like the way designers are paying more attention to typography. I think that some people when they first start out with design forget that fonts are just as important as any image.

  7. Wood?

    You know I was just musing the other day that the web would be a much nicer place if it looked like the sauna of a tacky two star ski resort. I guess 2009 is going to be my year! :)

    Patrick

  8. @Patrick
    Now I have seen a site that looked like the person had a background of 2″ x 4″ but most of the sites that I have seen with wood use the texture of the grain. If used correctly it works out well.

    @Cassie
    Use CSS3 and just have it downgrade to CSS2 if your viewer is using an older browser.

    Justin Long´s last blog post…Site Update

  9. Thanks for the link up Harry

    David Perel (From the Couch)

  10. @David: You’re welcome! That was a great tutorial. I had the opportunity to try it out on a recent project and it was a lot of fun to work with.

  11. With the ever evolving technology, I see interaction and ease of communication on sites gaining ground in ’09.

    I think building good SEO directly into CMS templates (like a WordPress blog template) will become more popular as well and become a decent selling point. Perfect example is when I see templates where the title tag is coded in h2 when h1 would be a little better.

    I could be getting a little ahead of myself for ’09, but I think at some point we will start seeing a bit of artificial intelligence being built into websites. I’m already on board that idea and can’t wait.

    Ok, and my last prediction, video. I think video will gain popularity with the ever increasing inexpensive products out there which can capture screen video.

    John Hoff´s last blog post…Understanding The Psychology Of Your Website Visitors

  12. Here’s my take on footer navigation.

    Personally, I think it’s only useful for commercial websites. But for blogs? It’s just that I seldom read one blog all the way through, right to the end. I find header and sidebar navigation much more helpful and useful when it comes to blogs.

    MJ Ces´s last blog post…Web Content Writing: Text in Images

  13. Wood is Good: Does this mean Men with Pens will change its brick wall background?

    :) Just kidding. I like it as it is.

    MJ Ces´s last blog post…Pay to Learn How to Blog?

  14. Graham Strong says:

    Five bold predictions:

    – More “out of the box” CMS solutions centred around WordPress and an accompanying theme like Thesis.
    – The rise of sIFR (complete with easier ways to accomplish it)
    – A growing trend towards minimalistic website design for brochure-type sites, and towards magazine-style for informational sites and blogs
    – A growing segmentation in the blogosphere into such areas as blogcasting, video blogcasting, and “integrated” blogs that do more that just act as a web journal
    – More integration of things like Twitter in blogs, with a shift away from today’s “standard” blogging format

    ~Graham

    Graham Strong´s last blog post…5 Steps To Better Brainstorming for the Intrepid Freelancer and Independent Business Owner

  15. I have no idea. I just hope that when I get too far off from being hip, you two will let me know!

    Alex Fayle | Someday Syndrome´s last blog post…Get out of that hole: Someday-busting lessons from Take That

  16. My personal opinion for 2009 design trends is that we’ll be going back to web 1.0 – with accent on simple designs ( plane shapes / typo / etc )

    But that doesn’t mean we won’t see lots of creative designs (“out of the box”)

  17. James

    I like footer nav options, which I have on my site, and I dig the one page layout which begs the question, Should I move to a one page layout? (I’m asking myself). :) Thanks for sharing bro,

    -Mig

    miguel´s last blog post…Revisited: 31 Days to Building A Better Blog

  18. @John: What kind of AI do you see happening?

    @MJ: One of our first drafts for this site did have a wood textured background, but it was a little too “wild west”. Guess we were ahead of our time ;)

    @Alex: You will always be hip in our book!

    @Claudiu: Eventually, everything old is new. Trends do have a way of repeating themselves and I’m sure that in another couple of years, Web 1.0 will be considered the new Retro.

    @Miguel: One page layouts do have their place, especially now that the Magazine style themes have gotten so popular. I see so many Mag themes that are just downright littered with too much going on. When I get a single page to design, it’s a breath of fresh air.

  19. PNG files are generally bigger, is it not? That would be problematic if I’m trying to keep page load time down to a minimum.

    Rudy´s last blog post…PC Tweaking Adventures: Overclocking

  20. @Rudy: PNG files are bigger, so I would say use them sparingly. Most of the PNGs I use are small images to begin with, like for RSS buttons and other icons. If I can get away with a GIF and the transparent image looks good, I’ll use that instead.

  21. You know how you tell yourself you are studying because you have your certification books opened in front of you? But you are really clicking on Stumble Upon to find interesting posts to read?

    Yeah well, I came across yours and had to write to tell you I enjoyed it very much. I gave it the thumbs up, so more people can come across it and enjoy it also.

    Georgia Stath´s last blog post…YOUR study notes

  22. Nice recap, Harry. Personally, I’ve been hearing a lot of positive feedback about the single-page look from clients and colleagues alike. I think you’re right that this trend will only pick up steam in ’09. Condensing a verbose landing page dissertation into a sharp, concise message better serves all involved.

  23. Another trend that we might see more of this year are the footer ads. I’ve seen a few marketing blogs with the really funky looking footer ads that displays either their latest product or an opt-in form.

    Catherina´s last blog post…Instant Home Business with Instant Pay Sites

  24. Good post. Your predictions seem spot on for this coming year, especially regarding the adoption of the PNG format.

    I don’t think there is a better image format for web layouts, because native transparency within images allows designs to much more interesting.

    The only downside to using PNGs is that their file sizes are much larger. However, with today’s download speeds (3G, 4G in the palm of your hand), it seems almost negligible.

    Cheers!

  25. Ben Roberts | EXITrealestate540.com says:

    I’ve just read a post about headway coming out and it employs a lot of the elements that you are describing. Had you in my reader for a while… I’m going to pay more attention to your posts from now on. Thanks from a budding web designer.
    .-= Ben Roberts | EXITrealestate540.com´s last blog ..Northwest Arkansas Home Prices and Market Report – July 2009 =-.

  26. Some good ideas. I played around with a magazine style theme when I was decided to give E.Y.D a facelift, but I went another way.

    Any suggestions on the best slideshow/gallery plugin for a wordpress blog?

    At while your at it, why doesn’t MWP use a comment system like Disqus or Intense debate? I recently starting using Disqus, upon realizing Mashable was using it. Some features I like about it, but it’s frustrating that some apps like Twitter ID and Comment Love don’t work. Do you recommend just using the conventional wordpress comment form?

    Your feedback is greatly appreciated….

    Jonathan

Trackbacks

  1. [...] 9. Web Design Trends 2009 [...]

Leave a Comment

*