+++ WEB DESIGN UPDATE.
- Volume 9, Issue 29, January 15, 2011.

An email newsletter to distribute news and information about web design and development. 

++ISSUE 29 CONTENTS.

SECTION ONE: New references.
What's new at the Web Design Reference site?
http://www.d.umn.edu/itss/training/online/webdesign/
New links in these categories:

01: ACCESSIBILITY.
02: CASCADING STYLE SHEETS.
03: COLOR.
04: EVALUATION & TESTING.
05: EVENTS.
06: MISCELLANEOUS.
07: NAVIGATION.
08: STANDARDS, GUIDELINES & PATTERNS.
09: USABILITY.


SECTION TWO: 
10: What Can You Find at the Web Design Reference Site?

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Death to Captchas
By Tim Kadlec.
"...In conclusion, captchas are inaccessible, inconsiderate and frustrating. In addition, most captchas are not as secure as you would like to believe. A far more elegant solution is to use some sort of filtering system (like Akismet). Such a system can run behind the scenes and work without complicating the user experience. It's time to kill off captchas and stop punishing users for trying to interact with our sites."
http://timkadlec.com/2011/01/death-to-captchas/

Alternatives to Captcha
By Tim Kadlec.
"...Just a warning ahead of time because I know people are going to mention it-none of these solutions are 100% foolproof, just as captchas are not 100% foolproof. I acknowledge that, but that's beside the point. While it would be nice to use a system that detects and eliminates 100% of the spam without any false positives, I don't think that's a realistic expectation at this point in time. My goal is to eliminate as much as spam as possible without negatively affecting the experience of my users. So let's get started shall we?..."
http://timkadlec.com/2011/01/alternatives-to-captcha/

Distance Education Access Guidelines
By California Community College System.
"The California Community College System is committed to providing equal access to education for students with disabilities. The following guidelines represent the latest opinions and advice for delivering accessible distance educational services."
http://www.htctu.net/dlguidelines/dlg_index.html

After Chronicle Story, a Tech Company Improves Accessibility for Blind Users
By Marc Parry.
"A company that sells a social-networking application to colleges is improving the accessibility of its product after problems with the software were spotlighted in a Chronicle report on flawed technology that locks out blind users..."
http://chronicle.com/blogs/wiredcampus/after-chronicle-story-a-tech-company-improves-accessibility-for-blind-users/28891

Making a Difference by Thrusting Accessibility into the Public Sphere
By Blind Access Journal.
"After briefly reviewing the ASU on Facebook app as of Friday, Jan. 7, I can report that significant improvements have already been achieved. The 'Go to App' link can now be followed using keyboard navigation, the website is more usable and I notice fewer images lacking descriptions...The important point I hope readers will take away is that advocating for accessibility does make a difference. One more web-based application is now going to be accessible because a blind person agreed to be part of an article published in a widely-reade higher-education publication..."
http://blindaccessjournal.com/2011/01/making-a-difference-by-thrusting-accessibility-into-the-public-sphere/

Good Document Design is the Key to Accessibility
By John Sheridan.
"...The Portable Document Format (PDF), first created by Adobe Systems in 1993, now in its ninth version, is very widely used for online documents. While it has wide utility, its suitability for accessibility purposes has been criticised. In 2010, AGIMO, working with Vision Australia, and with the cooperation of Adobe, undertook a study of the PDF format's accessibility capabilities. The study's scope was focussed on the PDF format and was designed to increase understanding of its strengths and weaknesses. The main points of the Study are..."
http://agimo.govspace.gov.au/2010/11/30/good-document-design-is-the-key-to-accessibility/

Why do Drive-Through ATMs have Braille Keypads?
By Roger Johansson.
"...The same reasoning can be used to (try to) explain to people who think of the Web as a purely visual medium why we as designers and developers should do our best to make sure the sites and applications we build can be used by people who for instance cannot see or cannot use a mouse. Just as for people who do not have a disability, being able to find information and use applications on the Web is - most of the time - quick, easy, and time-saving compared to physically visiting a bank office for a simple transaction, having someone read today's newspaper for you, or placing a phone call (and waiting for someone to answer) to find out when the next train leaves."
http://www.456bereastreet.com/archive/201101/why_do_drive-through_atms_have_braille_keypads/


+02: CASCADING STYLE SHEETS.

Only Use ems for the Total Width of Em-Based Layouts
By Roger Johansson.
"Using the em unit to specify the width of a website layout is one of several ways of adding a bit of flexibility to your design. If you're not familiar with em-based - or elastic - layouts, I wrote a bit more about how they work a few years ago in Fixed or fluid width? Elastic!..."
http://www.456bereastreet.com/archive/201101/only_use_ems_for_the_total_width_of_em-based_layouts/

CSS3 Transforms: Rotate, Skew, Scale & Translate
By Estelle Weyl.
Supported in Firefox 3.5+. Opera 10.5 and Webkit since 3.1, the transform CSS property lets you modify the coordinate space of the CSS visual formatting model. Using it, elements can be translated, rotated, scaled, and skewed. In this tutorial, you'll learn to manipulate an element's appearance using transform functions. 
http://www.communitymx.com/content/article.cfm?cid=A9F61

Reset 2.0b2: Paring Down
By Eric A. Meyer.
"A few changes for beta 2 of the updated reset, presented here..."
http://meyerweb.com/eric/thoughts/2011/01/10/reset-2-0b2-paring-down/

What's the Difference?
By Chris Coyier.
"What's the difference between .container div { } and div.container { }?"
http://css-tricks.com/whats-the-difference/

The CSS Corner: CSS3 Media Queries
By Sharon Newman.
"As we announced with our second Platform Preview last year, IE9 supports CSS3 Media Queries. CSS3 Media Queries enable you to style pages based on different display surface factors such as width, height, orientation, resolution, etc. Developers can use these factors to customize their sites for viewing on different devices such as a small-screen netbook or a widescreen monitor. In this post, I talk more about CSS3 Media Queries and the various scenarios they enable."
http://blogs.msdn.com/b/ie/archive/2011/01/12/the-css-corner-css3-media-queries.aspx


+03: COLOR.

9 Percent Of Men And .5% Of Women Are Colorblind
By Susan Weinschenk.
"...What colors you use in your photos, illustrations, maps, etc, can become problematic if you are trying to communicate information via the colors...If you are going to use color as a way to communicate - then you need to have a redundant coding scheme, for example color AND line thickness so that people who are color blind will be able to decipher the coding without needing to see specific colors..."
http://www.whatmakesthemclick.net/2011/01/09/100-things-you-should-know-about-people-50-9-percent-of-men-and-5-of-women-are-colorblind/

You React To Colors Based On Your Culture
By Susan Weinschenk.
"...Some colors have similar meanings everywhere, for example, gold stands for success and high quality in most cultures, but most colors have different meanings in different cultures. For example, in the US, white stands for purity and is used at weddings, but in other cultures white is the color used for death and funerals..."
http://www.whatmakesthemclick.net/2011/01/12/100-things-you-should-know-about-people-51-you-react-to-colors-based-on-your-culture/

Web Safe Color Palette - Is It Still Relevant?
By Jennifer Farley.
"...These days, modern computers generally have at least 16-bit color and often 24-bit color which allows millions of colors to be displayed. Even modern phones, iPods and tablets can display more colors than the monitors of the early 90s, so there really is no need to stick with the web safe palette anymore (unless you're working for a client with a REALLY old computer who insists everything looks good on it). Today it's more important to look at the contrast in your images rather than how many colors are used."
http://blogs.sitepoint.com/2011/01/12/web-safe-color-palette-is-it-still-relevant/ 
    

+04: EVALUATION & TESTING.

Protect Usability Tests from Yourself
By Emily Smith.
Whether you're testing an existing product, involved in a site redesign, or working on a completely new site, your biggest challenge is often yourself. Here are a few ways you might unintentionally cause problems..."
http://blogs.sitepoint.com/2011/01/13/protect-usability-tests-from-yourself/

User Testing with Kids: Lessons from the Field
By Gabriel Adauto and Jacob Klein.
"Successful user testing requires a delicate balance of focus and openness - that was one of our greatest takeaways from the classes we took last year at the d.School..."
http://dschool.typepad.com/news/2010/10/user-testing-with-kids-lessons-from-the-field.html


+05: EVENTS.

Retreats 4 Geeks: HTML5 & CSS3 
April 8-10, 2011.
Gatlinburg, Tennessee, U.S.A.
http://retreats4geeks.com/events/2011/html5-css3/

OSCON 2011
July 25-29, 2011.
Portland, Oregon, U.S.A.
http://www.oscon.com/oscon2011/


+06: MISCELLANEOUS.

Design Criticism and the Creative Process
By Cassie McDaniel.
"In every design project, at some point we quit what we're doing and share our unfinished work with colleagues or clients. This begs the question: Just what does the critique do for the design and the rest of the project? Do critiques really help and are they necessary? If so, how do we use their inconsistencies to improve our creative output? Cassie McDaniel explores how critiques can help us navigate complex processes and projects and collaborate effectively to create original and engaging work."
http://www.alistapart.com/articles/design-criticism-creative-process/

How to Maintain a Website
By S.R. Emerson.
"Owning a website or blog has it's responsibilities. You can't just upload it and forget it. Regular website maintenance is a must if you want your site to be successful..."
http://www.webpagemistakes.ca/maintain-website/


+07: NAVIGATION.

Landmark Roles
By Jeremy Keith.
"...In HTML5 you can, for the first time, use ARIA roles and still have a valid document. ARIA landmark roles add an extra layer of semantics onto your document, distinguishing them as navigational landmarks for assistive technology..."
http://adactio.com/journal/4267/

Search Engine Optimization (SEO) Pitfalls
By Gerry McGovern. 
"Bringing someone to your website is just the first step. Unless they complete a task you have wasted time and money...Always optimize for the searcher (the customer), not the search engine."
http://www.gerrymcgovern.com/nt/2011/nt-2011-01-10-Search-marketing.htm

HTML5 and Search Engine Optimisation
by Bruce Lawson.
"Through our handy Ask The Doctor service, we get a lot of e-mails asking us about HTML5's effect on Search Engine Optimisation (SEO). While we can't answer in great detail (Messrs Google, Yahoo, Bing, and their friends haven't sent us in-depth details of their algorithms), we've rounded up some useful facts from Google, the world's most dominant search engine."
http://html5doctor.com/html5-seo-search-engine-optimisation/

Findability and The Information Paradox
By Tom Johnson.
"Last year I started a series on organizing content that spanned nearly 30 posts. I want to return to this thread with a summary of why findability becomes an issue for technical writers, and what the information paradox is that we encounter. Then, in an usual ethical twist, I'll explain why findability might not actually be an issue..."
http://idratherbewriting.com/2011/01/12/findability-and-the-information-paradox/


+08: STANDARDS, GUIDELINES & PATTERNS.

The Design of Datalist
By Jeremy Keith.
"One of the many form enhancements provided by HTML5 is the datalist element. It allows you to turn a regular input field into a combo-box..."
http://adactio.com/journal/4272/

Why the Web Needs WebM
By Anne van Kesteren.
"The other day Google announced it will remove H.264 codec support from Chrome. I think this is great news. Like Mozilla removing support for the spacer element, but much bigger..."
http://annevankesteren.nl/2011/01/why-webm

Get Familiar With HTML5!
By Chris Mills.
"This article gives you an overarching introduction to HTML5, explaining how it came about, why it is good for the Web, and what features it has."
http://dev.opera.com/articles/view/get-familiar-with-html5/

Your HTML5 Questions #15
By Richard Clark.
"The clinic is busy as ever with more HTML5 ills. This week, we'll cover marking up Wikipedia infoboxes, anchors in <hgroup>, <figure> for avatars, header(s), and how to use <code> and <pre>..."
http://html5doctor.com/your-questions-15/


+09: USABILITY.

Well-Designed Error Messages
By Jessica Enders.
"After summarising the principles of well-designed error messages, we walk through a positive example from a live website."
http://formulate.com.au/articles/well-designed-error-messages/

The Dark Side of Usability
By Dmitry Fadeyev.
"By crafting simple and user-friendly interfaces we relieve our users of the need to think - or more accurately, to think about the more trivial and mechanical parts of the task, things which can be outsourced to the machine. But by doing so we are at risk of indadvertedly surrendering more than we planned for, as we are lured into thinking that interface will do our work for us-and so we spend less time thinking about the problem, less time planning."
http://www.usabilitypost.com/2011/01/10/dark-side-of-usability/

Is the Button Dead? The Rise of the Gesture
By Suzanne Ginsburg.
"Not long ago, I followed a thread on Twitter that started with the statement, 'On a touch screen, buttons are a hack.'  It was followed by a few heated responses such as my favorite, 'You'll pry my buttons out of my cold, dead hands.'  I leaned back in my chair, rested my hands on my keyboard, and pondered my 140 character reply. 'Buttons are sometimes a lazy touch designer's easy way out,' I thought, 'but sometimes they're a necessity.'  Not having a pithy answer, I scrolled past the slew of posts and carried on with my day.  Weeks later, with the thread still lingering in the back of my mind, I decided to explore the topic in greater depth.  In this post, I try to explain when gestures are more appropriate than buttons or other GUI (graphical user interface) elements. Although the recommendations can be applied to a variety of touch screens-kiosks, tables, walls-for the sake of brevity, the examples will focus on applications for multi-touch mobile devices and tablets..."
http://www.touchytalk.com/?p=76

Why Your Form Buttons Should Never Say Submit
By Anthony.
"When you see a Submit button on a form, what comes to your mind? One could easily reason that clicking the button submits the user’s information into the system for processing. A Submit button describes what the system does well, but it doesn’t describe what the user does at all..."
http://uxmovement.com/forms/why-your-form-buttons-should-never-say-submit

Is Web Copy Ruining Your Design?
By Rick Sloboda.
To attain an effective website, design and copy need to reinforce each other. The web designer and web copywriter must support the same objectives, address the same audience, and project the same brand characteristics. When in tune with each other, designers and copywriters can create more robust websites that gain credibility and trust, and achieve desired objectives, goals and conversion rates."
http://sixrevisions.com/content-strategy/is-web-copy-ruining-your-design/

A Simpler Page
by Craig Mod.
"Want to design a book? There are mountains of beautifully designed examples to inspire you. But what about digital books? How do you create elegantly typeset, gloriously balanced reading experiences when tablets render type differently and support different fonts, text can extend in every direction, and type can change size? Craig Mod (Flipboard, Art Space Tokyo) addresses these questions and presents the initial release of Bibliotype, an HTML baseline typography library for tablet reading."
http://www.alistapart.com/articles/a-simpler-page/


++ SECTION TWO:

+10: What Can You Find at the Web Design Reference Site?

Accessibility Information.
http://www.d.umn.edu/itss/training/online/webdesign/accessibility.html

Association Information.
http://www.d.umn.edu/itss/training/online/webdesign/associations.html

Book Listings.
http://www.d.umn.edu/itss/training/online/webdesign/books.html

Cascading Style Sheets Information.
http://www.d.umn.edu/itss/training/online/webdesign/css.html

Color Information.
http://www.d.umn.edu/itss/training/online/webdesign/color.html

Dreamweaver Information.
http://www.d.umn.edu/itss/training/online/webdesign/dreamweaver.html

Evaluation & Testing Information.
http://www.d.umn.edu/itss/training/online/webdesign/testing.html

Event Information.
http://www.d.umn.edu/itss/training/online/webdesign/events.html

Flash Information.
http://www.d.umn.edu/itss/training/online/webdesign/flash.html

Information Architecture Information.
http://www.d.umn.edu/itss/training/online/webdesign/architecture.html

JavaScript Information.
http://www.d.umn.edu/itss/training/online/webdesign/javascript.html

Miscellaneous Web Information.
http://www.d.umn.edu/itss/training/online/webdesign/misc.html

Navigation Information.
http://www.d.umn.edu/itss/training/online/webdesign/navigation.html

PHP Information.
http://www.d.umn.edu/itss/training/online/webdesign/php.html

Sites & Blogs Listing.
http://www.d.umn.edu/itss/training/online/webdesign/sites.html

Standards, Guidelines & Pattern Information.
http://www.d.umn.edu/itss/training/online/webdesign/standards.html

Tool Information.
http://www.d.umn.edu/itss/training/online/webdesign/tools.html

Typography Information.
http://www.d.umn.edu/itss/training/online/webdesign/type.html

Usability Information.
http://www.d.umn.edu/itss/training/online/webdesign/usability.html

XML Information.
http://www.d.umn.edu/itss/training/online/webdesign/xml.html

[Section two ends.]


++END NOTES.


+ SUBSCRIPTION INFO.

WEB DESIGN UPDATE is available by subscription. For information on how to subscribe and unsubscribe please visit:
http://www.d.umn.edu/itss/training/online/webdesign/webdev_listserv.html
The Web Design Reference Site also has a RSS 2.0 feed for site updates.


+ TEXT EMAIL NEWSLETTER (TEN).

As a navigation aid for screen readers we do our best to conform to the accessible Text Email Newsletter (TEN) guidelines.  Please let me know if there is anything else we can do to make navigation easier. For TEN guideline information please visit:
http://www.headstar.com/ten


+ SIGN OFF.

Until next time,

Laura L. Carlson
Information Technology Systems and Services
University of Minnesota Duluth
Duluth, MN U.S.A. 55812-3009
mailto:lcarlson@d.umn.edu 


[Issue ends.]