Sunday, September 16, 2012

50 Resources for Dynamic Web Design

Primarily, I've been more of a print designer, and am finding myself diving into learning more and more about what makes web design so different. I like the fact that print is so tangible. You can hold the finished product in your hand, and don't need an internet connection to be able to experience it. Print can be a physical experience with large format banners and posters, or trade show booth designs. It's a physical thing in the end.

Web design can also be an experience. Depending on your technological involvement, your experience can be dramatically different, and that's one of the great things about web design. It's a little different for everyone. The constant updates to browsers and languages, and the constant flood of new, innovative  technology means a constantly evolving environment to present information on the web.

Adapt or die. Technology will weed out weakly presented information, and if you're not dynamic enough to keep up, you will be forgotten and be less effective as a web resource. has put together a great list of resources for dynamic web design that all designers should take a better look at.

A major focus they include is the importance of consistency between mobile and desktop layout designs. Mobile web isn't anything particularly new, but it's importance and relevance has increasingly grown and become more sophisticated in functionality and design. A lot of the designers are ditching the standard 960px/950px templates and using 1000px to accommodate to a better desktop presentation, and making percentage calculations easier.

1140 CSS Grid

They outline an emphasis on using good grid patterns, and have options for CSS functionality in the creation of such grids. I appreciated the shout out in using good ol' pencil and paper to get drafts started, but feel that the specially designed notebooks for web sketches may be a bit much. Not only are they fairly expensive, but not unique enough to justify having a specific design for that notebook (in my humble opinion). If you made enough to justify the cost, it's a nice luxury, but it's nothing that can't be done with ordinary graph paper.

They include several downloadable grid templates to get your web base started, as well as calculators and tools for customizing your own pixel to percentage grids, text, images, WordPress plugins, and more.

Last but not least, they list a few key testing tools and sites that allow you to view pages and layouts on several different devices, sizes, browsers, and apps.

This is a great resource for web designers to catch up with the developing mobile standards, and to get a foot hold into grid layout.

1 comment:

  1. Thanks for sharing! What a wonderful informative blog.