This week we learned about Robin Williams and her book, "The Non-Designer's Design Book". I'm quite familiar with Williams as her book was a required reading in my Event Planning class that I was lucky enough to take last quarter. In this book we learn about four elements that Williams highlights as vitally important to designing anything, C.R.A.P., Contrast, Repetition, Alignment, and Proximity.
Contrast: Elements that aren't the same should be very different so they stand out, making them "slightly different" confuses the user into see a relation that doesn't exist. Strong contrast between page elements allows the user's eye to flow from one to another down the page instead of creating a sea of similarity that's boring and not communicative.
Repetition: Repeat styles down the page for a cohesive feel, if you style related elements the same way in one area, continue that trend for other areas for consistency.
Alignment: Everything on the page needs to be visually connected to something else, nothing should be out of place or distinct from all other design elements.
Proximity: Proximity created related meaning: elements that are related should be grouped together, whereas separate design elements should have enough space in between to communicate they are different.
But don't take my word for it, here are three very handy websites that can guide you through these steps. The first being Basic Webpage Layout and Design, though the page itself isn't much to look at, the way it guides you through step-by-step makes the creation process a breeze, and it really lets you see how those elements that Williams talks about come together. The second great website is one that goes over grid design and layout. Grid Design Basics is a neat webpage that talks about your conceptual design and ties into Williams' description of alignment and proximity. It goes over in depth how to start laying out your webpage so that users find it "user friendly". The final webpage that I find useful is The 5 Basic Rules of Webpage Design and Layout, its a nice over view for the begging or ending of your design process, a good way to take an outsider's perspective and make sure the design is cohesive.
"5 Basic Rules of Web Design by Grantastic Designs. "Logo Design, Graphic Design, Search Engine Marketing and More from Grantastic Designs. Web. 19 Jan. 2012. <http://www.grantasticdesigns.com/5rules.html>.
"Basic Web Page Layout and Design. "University at Albany Libraries. Web 19 Jan. 2012. <http://library.albany.edu/imc/webdesign/>.
"Grid Design Basics: Grids for Web Page Layouts." Dev.Opera. Web. 19 Jan. 2012. <http://dev.opera.com/articles/view/grid-design-basics-grids-for-web-page-1>.
Rundle, Mike. "How C.R.A.P. Is Your Site Design?" Think Vitamin - A Blog for Web Designers and Developers. Think Vitamin. Web. 19 Jan. 2012. <http://thinkviatmin.com/design/how-crap-is-your-site-design/>.
No comments:
Post a Comment