Dec 8 2009

12 Web Design Books for Your Christmas List

The season of giving has arrived and it’s time to pick out a little something special for the web designer in your life.  With Christmas approaching, you better act fast to take advantage of free delivery from Amazon.  Below are 12 excellent books to give to your friendly web designer or to reward yourself for a great year.

Designing with Web Standards

Designing with Web Standards 3rd Edition

By: Jeffrey Zeldman

Designing with Web Standards lays the foundation for modern web design by advocating web standard compliant design.  Although this book is not a short read at a whopping 432 pages, it is filled with plenty of tips to create web designs using standards.  This book, now in it’s third edition is a must have for all web designers.

the-design-of-everyday-things

Design of Everyday Things

Donald Norman

Design of Everyday Things is a classic that many designers swear by.  Focusing on the how and why of design, the Design of Everyday Things will open your eyes and show you how design should work to accentuate your product.

crush-it

Crush It!: Why NOW Is the Time to Cash In on Your Passion

Gary Vaynerchuk

I love Gary Vaynerchuk and it’s as simple as that.  I have not found anyone with as much contagious energy and passion. Crush It! brings the heat and will reinvigorate you to focus on improving your  business and brand.

designing-the-obvious

Designing the Obvious: A Common Sense Approach to Web Application Design

Robert Hoekman Jr.

A great compliment to either Don’t Make Me Think or the Design of Everyday Things, Designing the Obvious focuses on web application design.  Robert Hoekman Jr. brings perspective from working with different clients and offers practical advice on how to conquer many common user experience and design problems.

prioritizing-web-usability

Prioritizing Web Usability

Jakob Nielsen

Jakob Nielsen is hands down the most credible author on this list.  With years of usability research and the goto expert for Web Usability, Jakob Nielsen brings an update to his first classic, Designing Web Usability, to focus on new innovations to the Web that will help usability.

speaking-in-styles

Speaking in Styles: Fundamentals of CSS for Web Designers

Jason Cranford Teague

Teague teaches CSS to new web designers using easy to understand methods.  Speaking in Styles is a great introduction to CSS for aspiring web designers or graphic designers looking to add another skill to their arsenal.

bulletproof-ajax

Bulletproof Ajax

Jeremy Keith

Jeremy Keith is a world renowned expert in JavaScript and rich interaction applications.  Bulletproof Ajax focuses on making Ajax interactions degrade gracefully and are not library reliant.  With lots of tutorials and code examples, Bulletproof Ajax is a great read and nice to keep handy for all the useful examples throughout.

A-PROJECT-GUIDE-TO-UX

A Project Guide to UX Design: For user experience designers in the field or in the making

Russ Unger

A Project Guide to UX Design is a must have for leading a web development team from prototype to production.  This book will help freelance designers and design teams conquer problems that arise in the design process.  Offering tips on prototyping, wireframing, SEO and planning, A Project Guide to UX Design will add value and knowledge to all readers.

elementsofuserexperience1

The Elements of User Experience: User-Centered Design for the Web

Jesse James Garrett

The Elements of User Experience focuses on how different elements of user experience can compliment each other to provide a the best experience for your sites users.  Garrett who created Adaptive Path and is a regular in UX journals/blogs, offers designers concise methods to focus on results and ensuring your user experience is adding value to your site.

dont-make-me-think2

Don’t Make Me Think

Steve Krug

Don’t Make Me Think by Steve Krug changed my eyes as a designer, developer and web user.  After reading this book, I looked at websites I use everyday differently and it will for you to.  Focusing on key elements of web design, Krug’s Don’t Make Me Think is a staple for all web designers and a very short read.

handcrafted-css

Handcrafted CSS: More Bulletproof Web Design

Dan Cederholm

The only book on this list that focuses on CSS3 methods for designing websites, Handcrafted CSS is an outstanding introduction to designers new to CSS3.  This book follows the development of Tugboat Coffee Company and how the website uses graceful degradation to enhance user experience for users with newer browsers while still degrading for browsers that do not support CSS3 and other emerging web technologies.

web-standards-solutions

Web Standards Solutions: The Markup and Style Handbook, Special Edition

Dan Cederholm

Dan Cederholm knows how to teach the basics to new users, but still provide value to novice and expert users with his unique perspective.  Web Standards Solutions, the older of the 2 featured Cederholm books, focuses on how web standards improve accessibility, efficiency and provide similar experience across different web browsers.


Oct 16 2009

Why Design Patterns Matter

Do you ever find yourself stuck on how a particular user interface element should look? This happens to me two to three times a day – until I learned about design patterns. Design patterns are useful elements to improve the speed of design and wireframing. Libraries like Pattern Tap, Yahoo! Design Pattern Library and Ember App are now large repositories of best practices for user interface elements. Not only that, but they also help reinforce user’s expectations when they are used across the web, thereby improving the overall usability of your site.

Tools

Yahoo Design Pattern Library

Yahoo! Design Pattern Library is part of the Yahoo Developer Network and is a great repository of quality design patterns. Their design pattern contains some unique sets such as; Talk Like a Person, Leaderboard, and Your vs. My. Patterns are not only organized into sets, but also categories. Categories are great to browse through depending on what you are developing. If you are developing a web application, check Rich Interaction patterns. If you are developing a blog layout, check out the Layout category.

Pattern Tap

Pattern Tap is updated much more frequently than Yahoo! Design Pattern Library in part to the user community around this site. Pattern Tap allows you to register, create your own custom pattern sets. Pattern Tap does have a great user community going for it, but this can also be it’s weak link. If you browse through their pattern sets, you’ll see that quality is varied throughout the sets. Some patterns are excellent while others are downright abysmal. This wide range of quality is due to the user community.

Ember

Ember is a social tool that allows you to view submitted tagged LittleSnapper images throughout their entire user community. This is by far my favorite tool due to its integrated experience with LittleSnapper. LittleSnapper allows you to keep a local repository of design patterns and Ember shares and combines this with other users of LittleSnapper. If you look at Ember, you’ll notice that many of the tagged images relate to design. Howerve, Ember suffers from the same problem as Pattern Tap with over saturation of patterns and dilution of quality but not to the same degree.  This is countered with the ability to follow users and see updates to their tags.  This feature is what puts Ember far and above the other design pattern libraries.

Usage

Design patterns can be used many different ways. I’ll cover inspiration, wireframe assistance, and polishing up the experience your current website below.

Spending thirty minutes browsing through either PatternTap or the Yahoo Pattern Library should speed up your design time and be well worth the investment. Design patterns can help you conceptualize how you want your final product to look. You can also choose patterns which you feel would be perfect and save them to always give you something to review in times of design need. These libraries can also help you pound through mental blocks and find a creative solution to the problem.

Where should my navigation be? How large should image x be? How much space should my contact box be? These are all questions that can be answered during a design’s wireframing. Using design patterns, these questions can be answered faster. Going through these repositories will give you a visual way of thinking how your design should be, instead of just a conceptual idea. Design patterns can help you decide placement and size of UI elements, how to handle different types of user interface elements and much more.

So you completed this kick ass web application and everything is going smoothly until one day you notice your conversion rate on signup drops. You feel it’s time to revisit your signup process. Here is where design patterns can assist you. A quick look on Pattern Tap, and you already have a ton of possible methods to assist your improvements. Let’s say you notice specifically that users are getting a high fail rate and unable to discern what they did not do properly. Head over to the Yahoo! Design Pattern Library and look at notifications, and you can start improving this aspect.

The Good Stuff

In short, design patterns matter because you are designing around your users expectations. Using the tools that are out there, you can get a leg up on fellow designers by building your own pattern libraries. Integrating design pattern research as a part of your initial design process will definitely lessen your design time while improving the quality of your deliverables.