[webdev] Web Design Update: April 2, 2011

Sat Apr 2 04:27:46 CDT 2011

+++ WEB DESIGN UPDATE.
- Volume 9, Issue 40, April 2, 2011.

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

++ISSUE 40 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: JAVASCRIPT.
06: NAVIGATION.
07: PHP.
08: STANDARDS, GUIDELINES & PATTERNS.
09: TOOLS.
10: TYPOGRAPHY.
11: USABILITY.

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

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Accessibility For Web Writers, Part 4
By Dey Alexander.
"...Don't assume all users have all sensory perceptions..."
http://www.4syllables.com.au/2011/03/accessibility-for-web-writers-part-4/

Yes I'm Recommending WCAG2 Now
By Gian Wild.
"had a client ring me yesterday, wanting to know if they should be
trying to comply with WCAG1 or WCAG2..."
http://www.gianwild.com/2011/04/01/yes-im-recommending-wcag2-now/

PDF Techniques for WCAG 2.0
By W3C.
"This Web page lists PDF Techniques from Techniques for WCAG 2.0:
Techniques and Failures for Web Content Accessibility Guidelines 2.0.
For information about the techniques, see Introduction to Techniques
for WCAG 2.0..."
http://www.w3.org/WAI/GL/WCAG20-TECHS/pdf.html

Fix the Web Project Makes Early Impact
By Access Bulletin.
A three-month-old project using 'crowdsourcing' to improve the
accessibility of websites for disabled people has already helped to
solve problems with 26 sites, including those of the BBC and a large
UK building society, E-Access Bulletin has learned."
http://www.headstar.com/eablive/?p=549

Amp Up Accessibility of Your Videos: Add Transcripts
By Glenda Watson Hyatt.
"Providing a transcript - a textual version of the video - further
increases accessibility of the content. People who are deaf-blind can
access the content by using a refreshable (dynamic) Braille display,
which converts text into Braille. Like captions, providing transcripts
also has auxiliary benefits..."
http://blogaccessibility.com/amp-up-accessibility-of-your-videos-add-transcripts/

Redesigning University Website for People with Learning Disabilities: Feedback
By John Rochford.
"I am working on a project to make the website, of a university
program for people with learning disabilities, more usable by
prospective students. Small groups of faculty and students were shown
the first mockup last week. Listed below is their feedback and brief
descriptions of a few possible remediation efforts..."
http://clearhelper.wordpress.com/2011/03/28/redesigning-university-website-for-people-with-learning-disabilities-feedback/

Configuring Internet Explorer to Handle Longdesc
By Sean Hayes.
"Users with visual impairments are often not able to access images on
web sites, now this is probably not news to anyone reading this blog;
and you are also probably aware of the technique of using an alt
attribute in the html markup on images to provide a pithy summary of
the content of the image. However it is often the case that an image
is too complicated to be described completely in a single short
sentence, but adding any more than that to the alt attribute results
in a far too verbose experience for users that rely on screen readers
or other assistive technologies..."
http://blogs.msdn.com/b/accessibility/archive/2011/03/25/configuring-internet-explorer-to-handle-longdesc.aspx

Longdesc Misuse: How Prevalent?
By Karl Groves.
"...As my data show, the vast majority of longdesc values are conforming..."
http://www.karlgroves.com/2011/03/27/longdesc-misuse-how-prevalent/

Accessibility Testing, Research and Development
By Suzanne Taylor.
"This an informal test area used by the Accessibility Initiative at
Pearson. Recommendations here are designed for environments where
schedules and resources don't allow for quick changes to products.
This is open access in case our investigations can help others in
making sites accessible. These pages make use of materials that others
have made available including the WAI-ARIA Spec from the W3C and Jim
Thatcher's testing tools."
http://wps.pearsoned.com/WAI_ARIA_Testing/139/35621/9119211.cw/index.html

Keyboard Accessibility for Web Applications
By Jonathan Snook.
"One of the things I really enjoyed working on (and continue to enjoy
working on) is keyboard access in the new Yahoo! Mail. As a fan of
using the keyboard, I wanted to make sure that using Mail felt natural
and was easy to move around the application. This is much harder than
it looks because we have to establish a balance between a web page
model and an application model."
http://snook.ca/archives/accessibility_and_usability/keyboard-accessibility-for-web-apps

+02: CASCADING STYLE SHEETS.

Targeting HTML5's Semantic Elements with CSS
By Louis Lazaris.
"It would seem that with the introduction of HTML5's semantic
elements, styling those new elements should be an easier task. But as
I've started to use HTML5 more, I've realized that it takes quite a
bit of forethought to create maintainable CSS that targets the new
semantic elements in a future-proof way. In some cases, it could be
fairly straightforward, but in others it's a little disheartening
because targeting the new elements actually creates more verbose
markup."
http://www.impressivewebs.com/targeting-html5-css/

Fancy Form Design Using CSS Article
By Cameron Adams.
"Positioning labels at the top of their form elements is probably the
easiest layout to achieve, as we only need to tell the label to take
up the entire width of its parent element."
http://blogs.sitepoint.com/fancy-form-design-css-3/

Inconsistent Transitions
By Eric A. Meyer.
"Here's an interesting little test case for transitions. Obviously
you'll need to visit it in a browser that supports CSS transitions,
and additionally also CSS 2D transforms..."
http://meyerweb.com/eric/thoughts/2011/03/24/inconsistent-transitions/

How To Use CSS3 Pseudo-Classes
By Richard Shepherd.
"CSS3 is a wonderful thing, but it's easy to be bamboozled by the
transforms and animations (many of which are vendor-specific) and
forget about the nuts-and-bolts selectors that have also been added to
the specification. A number of powerful new pseudo-selectors (16 are
listed in the latest W3C spec) enable us to select elements based on a
range of new criteria..."
http://www.smashingmagazine.com/2011/03/30/how-to-use-css3-pseudo-classes/

Media Queries
Curated by Eivind Uggedal.
A collection of responsive designs.
http://mediaqueri.es/

Absolutely Positioned Textareas
By Jonathan Snook.
"One method that I've been using quite a bit for positioning elements
is setting them absolute and using left, right, top and bottom values
to lock inner elements relative to an outer container. I like using
this technique because padding will not cause any positioning issues
like using width can-especially when widths need to be
percentage-based..."
http://snook.ca/archives/html_and_css/absolute-position-textarea

+03: COLOR.

Color Theory 101
By Jason Beaird.
"Continuing on from the previous article in this series on color, The
Psychology of Color, let's take a closer look at color temperature,
chromatic values, saturation, and the basic theory behind how colors
are produced, both in print and on the web..."
http://designfestival.com/color-theory-101/

+04: EVALUATION & TESTING.

Usability Testing. Oh, The Things You Can Learn.
By Jared M. Spool.
"I can't say exactly when it happened. Somewhere along the way, the
simple technique of usability testing became a validation process.
Users were put in front of the screen, asked to perform tasks, and
measured, like rats locating cheese in a maze. The results of such
studies were statistics, such as 5 out of 13 subjects completed 75% of
the tasks successfully and the average task time was 4 minutes, 22
seconds.,,"
http://www.uie.com/articles/usability_tests_learn/

Usability Testing: When To Use Remote Usability Testing
By Tim Fidgeon.
"Remote usability testing offers greater audience diversity and higher
fidelity to real-world user motivations than in-person methods (but
should not entirely replace them). We recommend using 'Moderated'
testing for understanding an issue and "Unmoderated" to get large
volumes of data..."
http://www.spotlessinteractive.com/articles/usability-research/usability-testing/remote-usability-testing-when-to-use.php

+05: JAVASCRIPT.

Why We Should Support Users with No Javascript
By Emma Sax.
"...Relying on Javascript is dangerous. Errors can be introduced in a
couple of unexpected ways. The first is the failure of external advert
code, over which you have no control and secondly is friendly-fire in
the form of console.log() left in by your developers (this causes
scripts to fail if Firebug, or similar, is not enabled in the
browser)."
http://www.punkchip.com/2011/03/why-support-javascript-disabled/

+06: NAVIGATION.

Accessibility - Handling Repeated Adjacent Links
By Henny Swan.
"At it's heart accessibility is about people. Technology, code,
guidelines and even access technology are the supporting cast so when
making pages accessible to multiple users with diverse needs ask
yourself not just if content is accessible but if it's usable. Always
aim to reduce duplication of links but keeping in mind those users who
benefit from larger click-able areas. Emerging techniques such as
HTML5 and WAI ARIA aim to help by plugging the gaps in HTML4."
http://www.spotlessinteractive.com/articles/accessibility/handling-repeated-adjacent-links.php

+07: PHP.

Quick PHP Tip: Uploading Multiple Files in HTML5
By Tiffany B. Brown.
"One of the neat things about HTML5 is that it allows for multiple
file uploads in one file upload field. Of course, you have to use a
browser that supports such a feature. Currently Opera 11.10 does. So
do Firefox 4, the latest version of Chrome, and Safari 5.0.4.
(Internet Explorer 9 does not.)..."
http://tiffanybbrown.com/2011/03/29/quick-php-tip-uploading-multiple-files-in-html5/

+08: STANDARDS, GUIDELINES & PATTERNS.

HTML5 Canvas Accessibility
WebAIM Thread.
"I am researching about html5 canvas accessibility ,I want to know more
information about it. Any body knows what's the status of canvas accessibility?"
http://webaim.org/discussion/mail_thread?thread=4624

WebVTT Explained
By Silvia Pfeiffer.
"On Wednesday, I gave a talk at Google about WebVTT, the Web Video
Text Track file format that is under development at the WHATWG for
solving time-aligned text challenges for video..."
http://blog.gingertech.net/2011/03/29/webvtt-explained/

HTML5, ARIA Roles, and Screen Readers in March 2011
By Jason Kiss.
"Last year, in HTML5, ARIA Roles, and Screen Readers in March 2010, I
took a look at how then current screen readers behaved with some of
the HTML5 section elements and related WAI-ARIA document and landmark
roles. Now that the major screen readers have all seen some
significant updates, and both Firefox 4 and Internet Explorer 9 have
officially been released, I figure it's time to perform the review
again and see what, if anything, has changed..."
http://www.accessibleculture.org/research/html5-aria-2011/

longdesc in HTML5
By Bruce Lawson.
"Generally, I'm not in favour of hidden metadata that is meant only
for one sector of the audience. Hidden metadata, because it's hidden,
easily falls out of step with the rest of the information. On the
other hand, I'm not generally in favour of chopping things out of the
language because it makes it harder for people to migrate from HTML4
to HTML5 and because I've seen the light after the <cite> debacle.
And, although it's hardly used anywhere, people claim to love it; I'm
against removing something that makes their lives easier, particularly
when there are enough impediments out there to their full and equal
access to the Web...."
http://www.brucelawson.co.uk/2011/longdesc-in-html5/

HTML5 Hurdles - What is Missing and Web Browser Update Rate Problems
By Robert Nyman.
"...To summarize, a lot of exciting things are, and have been,
happening with HTML5, and for the future I think one of the most
interesting things is to see how the Device API will turn out and
truly empower developers building open web-based things for mobile
devices. Internet Explorer 9 is a great leap forward for Microsoft
compared to previous versions, but it still lacks some of the things
available in the other major web browsers. Some worry was also
expressed about IE release cycle time and that if it's behind now,
imagine how long time until we will get the next version..."
http://robertnyman.com/2011/03/31/html5-hurdles-what-is-missing-and-web-browser-update-rate-problems/

+09: TOOLS.

CSSPrefixer
"Prefixer is a Python-based CSS processor that takes single CSS 3
declarations and adds all the necessary browser prefixes to your
stylesheet. You just write the actual CSS 3 rule and CSSPrefixer does
the rest. As an added bonus CSSPrefixer can also compress your
stylesheets to save on bandwidth."
http://cssprefixer.appspot.com/
http://www.webmonkey.com/2011/03/simplify-your-stylesheets-with-cssprefixer/

+10: TYPOGRAPHY.

Size Matters When It Comes To Fonts
By Susan Weinschenk.
"When it comes to fonts, size matters a lot. The font size needs to be
big enough so that people can read it without strain..."
http://www.whatmakesthemclick.net/2011/03/26/100-things-you-should-know-about-people-91-size-matters-when-it-comes-to-fonts/

+11: USABILITY.

The Format is Not the Task
By Gerry McGovern.
"Nobody is interested in documentation, tools, videos, blogs or
Twitter for their own sake. Their interest in these things is only in
the context of the task they need to complete."
http://www.gerrymcgovern.com/nt/2011/nt-2011-03-28-Format-task.htm

Optimizing a Screen for Mobile Use
By Jakob Nielsen.
"A single mobile screen with almost no features still required 10
design changes to meet usability guidelines for mobile websites."
http://www.useit.com/alertbox/mobile-redesign.html

Enriching and Not-So-Enriching Complexity
By Gerd Waloszek.
"...All in all, the complexity that surrounds us is not always
perceived as enriching. Poor or, at least, suboptimal design choices
are made for a number of reasons, and, last but not least, it is we
who increase the complexity in our lives by making poor buying
decisions and by preferring and economically supporting mediocre or
even inferior solutions. Thus, if Norman concludes that design [comes]
to the rescue, I would like to add that this is an incomplete view of
the whole story: Human preferences and weaknesses, technical and
lifestyle trends, and economic considerations are further players in
the "complexity" game. Hopefully, we can muddle our way through
successfully and achieve an optimal "medium" level of complexity in
our lives..."
http://www.sapdesignguild.org/community/blinks/ui_blinks_gw_02.asp#complex1

Context
By Jeremy Keith.
"...web design is filled with quite a few known unknowns. Here are
three of them: Viewport...Bandwidth...Context..."
http://adactio.com/journal/4443/

Web Forms That Don't Make People Angry
By Emily Smith.
"There's no better place to take care of your site visitors than an
online form. This is the one place where they're voluntarily sending
you information, and maybe even payment. Decrease form abandonment and
make somebody's day by considering these three execution
guidelines..."
http://designfestival.com/web-forms-that-dont-make-people-angry/

Six Controversial Topics in Usability
By Jeff Sauro.
"Every field has its set of hot-button issues and usability is no
exception. Here are six topics that tend to generate some passionate
discussions. "
http://www.measuringusability.com/blog/usability-controversy.php

[Section one ends.]

++ SECTION TWO:

+12: 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 at d.umn.edu

[Issue ends.]