Top 10 Web Design Trends for 2010

Posted on 15. Sep, 2009 by bmackler in Inspiration


Its always tough to predict the future, and that is all the more true when talking about the web.  The internet continues to evolve so fast and in so many directions,  due in large part to  the various social media tools, making the web accessible to  people who never dreamed being part of it.

Here is a list of design trends that I think will play a large role over the next year, well into 2010.

Typography
This trend started over the past year and will continue.  Designs will trend toward the use of typography an integral part of the overall work rather than a liability.  Web designers will start using larger, more exciting fonts in place of system text. Overall, designers are paying closer attention to typographic details such as leading, line height and choice of font.

Typography

Typography

Sketches, hand drawn style and illustrations
Easily noticeable on a page.  Stands out from traditional graphics and gives the website a unique, personalized look.

Sketches, hand drawn style and illustrations

Sketches, hand drawn style and illustrations


Large images/photography

Large Images/Photography

Large Images/Photography


Magazine Layout
With more people going on line who see the web as the source of entertainment and real time information, many sites will be gearing towards this type of look  -  with short concise articles that are  easy to read and concise information.

Magazine Layout

Magazine Layout

Introduction Blocks
The upper-left area of a website is the most important block on the page, because that is the first place your eye goes when you come to a website.  This spot grabs most attention from visitors.  Therefore, this is the ideal place to get your message out and seen quickly.

You see this done in many types of design, including corporate design, web apps, or portfolios.  They take up alot of real estate, but that is ok.  the message is key.

Introduction Blocks

Introduction Blocks

Single Page Layouts
People are in a rush, they are online to find the info and go, they dont have time to look around and see everything.  This is the solution to get them the info they need.

Single Page Layouts

Single Page Layouts

Social Media Sites and Add-ins/Icons
Of course this has been the big thing of the past two years, and it will only continue to get bigger.  Linking to them, using apps from them helps build communities around products, ideas and causes.  More and more people are spending time online, looking to connect with like minded people and to share their lives and information.  Sometimes too much information

Social Media Sites and Add-ins

Social Media Sites and Add-ins

White Space
Its cleaner, easier on the eyes and easy to find what you are looking for.  White is a great color to help something stand out…except if its the carpet under your dining room table.  Sometimes simplicity is key.

White Space

White Space

Icons and Visuals
Not talking about clip art, but stylistically rendered icons that represent in a small image what the entire section is about.  Easy for people to recognize and people notice them quicker than text

Icons and Visuals

Icons and Visuals

Modal Boxes (Lightboxes)
These guys are great.  Open source applications that are, basically the next generation of pop-ups. They are a cleaner, more user-friendly alternative to the basic JavaScript pop up windows that have been around for years.   Clean, crisp, and focuses the user on the information you are presenting, whether it is a picture, text or a video.  This little tool helps the presentation go a long way.

Modal Boxes

Modal Boxes

Tags: , , , ,

70 Responses to “Top 10 Web Design Trends for 2010”

  1. Top 10 Web Design Trends for 2010

    15. Sep, 2009

    [...] Go here to read the rest: Top 10 Web Design Trends for 2010 [...]

  2. Carl Smart

    15. Sep, 2009

    great post!

    [Reply]

  3. Top 10 Web Design Trends for 2010 | Web Design Tutorials and Journal | Learn Photoshop and Dreamweaver Online | Creative Inspiration

    21. Sep, 2009

    [...] here to see the original: Top 10 Web Design Trends for 2010 | Web Design Tutorials and Journal | Learn Photoshop and Dreamweav… Comments0 Leave a Reply Click here to cancel [...]

  4. 10 Web Design Trends for 2010 « dabblindesign

    29. Sep, 2009

    [...] http://designtutorials4u.com/top-10-web-designtrends-for-2010/ [...]

  5. Samoys

    03. Oct, 2009

    lot about you

    [Reply]

  6. dilandinga

    04. Oct, 2009

    Ks95cM I bookmarked this link. Thank you for good job!

    [Reply]

    bmackler Reply:
    October 4th, 2009 at 1:20 pm

    Thank you, glad you liked it, please check back often for updates. There are so many trends that we will see developing over the next year, its hard to keep track.

    [Reply]

  7. dilandinga

    05. Oct, 2009

    b8WjsY I bookmarked this link. Thank you for good job!

    [Reply]

  8. lilikindsli

    05. Oct, 2009

    If you have to do it, you might as well do it right.,

    [Reply]

  9. lilikindsli

    05. Oct, 2009

    Great. Now i can say thank you!,

    [Reply]

  10. Fiesien

    05. Oct, 2009

    Excellent site. It was pleasant to me.,

    [Reply]

  11. Oloiven

    05. Oct, 2009

    It is the coolest site, keep so!,

    [Reply]

  12. Asayma

    05. Oct, 2009

    Great site. Keep doing.,

    [Reply]

  13. Ethinia

    05. Oct, 2009

    I want to say – thank you for this!,

    [Reply]

  14. Unalelian

    05. Oct, 2009

    Very cute :-) ))),

    [Reply]

  15. Cesien

    05. Oct, 2009

    Great work,webmaster,nice design!,

    [Reply]

  16. Sevoerien

    05. Oct, 2009

    Perfect work!,

    [Reply]

  17. Acerrac

    05. Oct, 2009

    Very interesting site. Hope it will always be alive!,

    [Reply]

  18. Yboede

    05. Oct, 2009

    Great site. Keep doing.,

    [Reply]

  19. Agrardoldan

    05. Oct, 2009

    I bookmarked this link. Thank you for good job!,

    [Reply]

  20. loan

    12. Oct, 2009

    cool nice site

    [Reply]

  21. Top 10 de tendencias en diseño web para 2010

    14. Oct, 2009

    [...] Enlace: Ranking de 10 tendencias de diseño web para este 2010 [...]

  22. Groebard

    15. Oct, 2009

    I want to say – thank you for this!

    [Reply]

  23. Etilic

    15. Oct, 2009

    Great site. Keep doing.

    [Reply]

  24. Alendali

    15. Oct, 2009

    Perfect work!

    [Reply]

  25. Griremar

    15. Oct, 2009

    Very cute :-) )))

    [Reply]

  26. typography tuesday: web trends « two smiths and a dog

    20. Oct, 2009

    [...] Lee Munroe Smashing Magazine designtutorials [...]

  27. BayAreaRed

    04. Nov, 2009

    For a beginning web designer, this has been an immense help. I will come back often to see what else you put up. Thanks!!!

    [Reply]

    bmackler Reply:
    November 4th, 2009 at 12:29 pm

    I appreciate the comment. Glad you find this blog of great use as part of your education and I sincerely hope you come back regularly. One of the main goals of this site is to provide information and inspiration for beginner and advanced designers alike.

    [Reply]

  28. 2010 trends

    12. Nov, 2009

    [...] Top- 10 web Design trends for 2010 [...]

  29. Opariuc Mihai

    17. Nov, 2009

    Great article :)

    [Reply]

  30. Web Design Trends « Videdesign's Blog

    18. Nov, 2009

    [...] top-10-web-designtrends-for-2010 [...]

  31. designfollow

    18. Nov, 2009

    great

    thank you

    [Reply]

  32. Top 10 Web Design Trends for 2010 | Design Shack

    18. Nov, 2009

    [...] View Post [...]

  33. Web Designs Home

    18. Nov, 2009

    Great sites.

    http://www.webdesignshome.com

    [Reply]

  34. Web Designs Home

    18. Nov, 2009

    Great Sites. Thanks

    [Reply]

  35. Fresh and Popular Web Design Trends and TemplateMonster Templates | Template Monster Blog

    19. Nov, 2009

    [...] We have even managed to find a couple or reviews of top trends for 2010 done by WebDesignLedger and DesignTutorials4U. These guys have done a great job but we feel like we have a couple of ideas to [...]

  36. tripwire magazine | tripwire magazine

    30. Nov, 2009

    [...] Top 10 Web Design Trends for 2010 [...]

  37. 40+ Awesome News for Web Designers and Developers | tripwire magazine

    30. Nov, 2009

    [...] Top 10 Web Design Trends for 2010 [...]

  38. 40+ Awesome News for Web Designers and Developers | Programming Blog

    01. Dec, 2009

    [...] Top 10 Web Design Trends for 2010 [...]

  39. Sheeba Thukral

    06. Dec, 2009

    Hi, I loved your perspective on web trends. I have posted some views on my blog http://iaskwomen.com/blog
    Thanks for the great article.

    [Reply]

  40. 40+ Awesome News for Web Designers and Developers | Master Design

    12. Dec, 2009

    [...] Top 10 Web Design Trends for 2010 [...]

  41. Website maken @ Reclamebureau

    13. Dec, 2009

    I didn’t see any ‘ widgets design’ ? Widgets seem to be one of the web design trends.

    [Reply]

  42. Tendance du Webdesign pour 2010 : la sobriété du noir et blanc | Wakeup Studio Web Design Blog

    16. Dec, 2009

    [...] Le minimalisme s’annonce comme une tendance forte pour 2010 : « Its cleaner, easier on the eyes and easy to find what you are looking for. White is a great color to help something stand out…except if its the carpet under your dining room table. Sometimes simplicity is key », résume-t-on sur DesignTutorials4u. [...]

  43. Christmas brings a new online portfolio « City&Wool

    21. Dec, 2009

    [...] http://designtutorials4u.com/top-10-web-designtrends-for-2010/ [...]

  44. Shahid

    02. Jan, 2010

    Nice !!!

    [Reply]

  45. ian

    03. Jan, 2010

    yups.. i gree with you

    great info..

    thx.

    [Reply]

  46. 11 Essential New Years Resolutions For Web Designers In 2010 | Dreamcatcher Creative Studio

    04. Jan, 2010

    [...] or Verdana.  This year, find 15 new free fonts to incorporate into your designs.  As I discussed previously, a stronger emphasis on typography in web design is going to be a growing trend in the coming [...]

  47. Web Design Trends and Resolutions for 2010 | Programming Blog

    06. Jan, 2010

    [...] Top 10 Web Design Trends for 2010 from designtutorials4u [...]

  48. Alex Flueras

    06. Jan, 2010

    Excellent article. Thanks for sharing.

    [Reply]

  49. TG Web Media

    06. Jan, 2010

    Not a tremendous change but it seems that clean, bright, and well organized with white space is the bottom line. I wonder if light grunge looks will catch on within those confines. It never truly took root for any kind of bigger business or corporate designs unless the site was entertainment based. Tampa Web Design. http://www.tgwebmedia.com

    [Reply]

  50. WebDesign – tendências para 2010 « Dreamfeel – Joao Ledo Fonseca

    07. Jan, 2010

    [...] http://designtutorials4u.com/top-10-web-designtrends-for-2010/ http://webdesignledger.com/tips/web-design-trends-for-2010 [...]

Newer Comments »

Leave a Reply

My Zimbio

Web Design Tutorials and Online Journal