[webdev] Web Design Update: October 9, 2009

[Laura Carlson]

+++ WEB DESIGN UPDATE.
- Volume 8, Issue 15, October 9, 2009.

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

++ISSUE 15 CONTENTS.

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

01: ACCESSIBILITY.
02: CASCADING STYLE SHEETS.
03: EVALUATION & TESTING.
04: FLASH.
05: JAVASCRIPT.
06: MISCELLANEOUS.
07: PHP.
08: STANDARDS, GUIDELINES & PATTERNS.
09: TOOLS.
10: TYPOGRAPHY.
11: USABILITY.
12: XML.

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Multimedia Accessibility FAQ
By Shawn Lawton Henry, editor.
"Multimedia accessibility is easier than you might think. Don't be 
afraid. For most W3C audio and video, you just need to provide a simple 
text transcript. Transcripts are relatively cheap and easy..."
http://www.w3.org/2008/06/video-notes

A Checklist for Inclusive Teaching
By Sheryl Burgstahler.
"he universal design of instruction-where universal design (UD) 
principles are applied in selecting and developing curriculum, choosing 
and implementing teaching methods, and developing assessments-is 
gaining increased attention by educational researchers and 
practitioners at K-12 and postsecondary levels. UD means that, rather 
than designing your instruction for the average student, you design for 
potential students with a broad range in ability, disability, age, 
reading level, learning style, native language, race, ethnicity, and 
other characteristics. Universal design of instruction (UDI) can be 
discussed as a process, as a set of strategies applied to specific 
aspects of instruction, or as a goal..."
http://www.washington.edu/doit/Brochures/Academics/equal_access_udi.html

Use the optgroup Element to Group Select Options
By Roger Johansson.
"Sometimes it is useful to group the options of an HTML select element. 
Many developers use extra option elements and non-breaking spaces to 
create the visual appearance of hierarchical options, but there is 
another way: the often forgotten optgroup element..."
http://tinyurl.com/y8pos5l

Web Application Accessibility (video)
By Universtity of Wisconsin.
"Recognize the need for accessible web applications, and reach a 
broader audience."
http://www.doit.wisc.edu/accessibility/video/web_applications.asp

Introduction to World Caption (video)
By Universtity of Wisconsin.
"World Caption is a free Macintosh software program created at the 
University of Wisconsin-Madison that makes it easy to add captions to 
any QuickTime compatible video."
http://www.doit.wisc.edu/accessibility/video/WorldCaption/

Learning Without Limits: Students with Disabilities at UW-Madison 
(video)
By Universtity of Wisconsin.
"UW-Madison students with disabilities share their Wisconsin 
experiences.
http://www.mcburney.wisc.edu/videos/learningwithoutlimits/

The Importance of Placement of HTML Elements in a Document
By Marco Zehe.
...when you design dynamic content, write an accordion widget or the 
like, please please please always take the time to chose an appropriate 
div element in the vicinity of where the user is, and add or remove the 
dynamic content there instead of taking the maybe easier, but far less 
intuitive, route to simply dump to the end of the document node's 
children and then use some weird styling to craft it visually. You'll 
help all screen reader users visiting your site by offering them more 
efficiency in that they don't have to navigate between chunks of the 
content that are far apart."
http://tinyurl.com/y8fzmgx

Accessibility Review: PetsContained.com
By Joseph C. Dolson.
"Disabled consumers often face great challenges when browsing and 
making purchases online. Perhaps as many as ten percent of online 
shoppers have a disability, such as low-or-no vision or an inability to 
use a keyboard, that can make it difficult to understand content and 
navigate websites..."
http://tinyurl.com/yeruuyp


+02: CASCADING STYLE SHEETS.

Mastering CSS Coding: Getting Started
By Soh Tanaka.
"CSS has become the standard for building websites in today's industry. 
Whether you are a hardcore developer or designer, you should be 
familiar with it. CSS is the bridge between programming and design, and 
any Web professional must have some general knowledge of it. If you are 
getting your feet wet with CSS, this is the perfect time to fire up 
your favorite text editor and follow along in this tutorial as we cover 
the most common and practical uses of CSS..."
http://tinyurl.com/y9ph48g

Introducing the Flexible Box Layout Module
By Peter Gasston.
"One aspect of CSS3 that hasn't received a lot of attention so far is 
the Flexible Box Layout module. Already implemented in the Gecko and 
WebKit engines, in this alternative box model.."
http://www.css3.info/introducing-the-flexible-box-layout-module/

Fluid Search Box
By Marko Mrdjenovic.
"There's been a lot of fluid layouts recently. When you use a fluid 
layout it's hard to make everything fluid as you need to stretch 
certain elements and have other elements fixed..."
http://friedcellcollective.net/outbreak/2009/10/04/fluid-searchbox/

CSS Frameworks and Semantic Class Names
By Kevin Yank.
"One of the most common complaints about CSS frameworks like Blueprint, 
YUI Grids, and 960.gs is that they require designers to dirty their 
fingers by adding presentational class names to their HTML documents, 
like so..."
http://tinyurl.com/y9pumaf

CSS3 And Me
By Trent Walton.
"...The best part of all is designers save face:
Use CSS Three. Let sites degrade with grace."
http://trentwalton.com/2009/09/17/css3-and-me/


+03: EVALUATION & TESTING.

Usability Testing Demystified
By Dana Chisnell.
"The value in usability testing comes from the magic of observing and 
listening as people use a design. The things you see and the things you 
hear are often surprising, illuminating, and unpredictable. This 
unpredictability is tough to capture in any other way. Dana Chisnell 
shows you how."
http://www.alistapart.com/articles/usability-testing-demystified/


+04: FLASH.

SVG vs. Canvas on Trivial Drawing Application
By Samuli Kaipiainen and Matti Paksula.
"...Based on these findings, there really is no vs. situation. The 
right technique needs to be selected for the job, and we hope this 
paper gives a good starting point for that. When the right choices are 
made, SVG and Canvas can actually benefit from each other. Currently 
there are some things to look out for until the support is stable. Yes, 
there's a limit on each standard's capabilities. For pixel flare and 
other "demo effects", go with Canvas. For intrinsic shapes and user 
interaction, go with SVG. Graphical user interfaces on the web are an 
especially delicious application for SVG...."
http://tinyurl.com/ydd7w77

Flash vs HTML5 - and a few points for HTML5 advocates to consider
By Neil Webb.
"It's always been in my nature to question things, and for some reason 
I seem to find it easier than many to see various sides of an argument 
- playing devil's advocate with my own beliefs is a regular thing for 
me,  so while I'm a Flash-platform developer by trade I'm pretty sure 
that I don't suffer from an unjustified allegiance to any platform. For 
any developer worth their salt, it will ALWAYS be about using the right 
technology for the job..."
http://nwebb.co.uk/blog/?p=399

Adobe Fights Off HTML5 Threat With New Flash Player 10.1
By Scott Gilbertson.
"HTML5 has been touted as a 'Flash killer,' making the ubiquitous Flash 
Player plugin unnecessary with new tags to embed video and create 
animations directly within HTML. But the latest Flash update, announced 
at Adobe's ongoing MAX conference, shows that Flash isn't going away 
without a fight..."
http://tinyurl.com/yb2vhjv


+05: JAVASCRIPT.

ARIA Role Support: How the Windows Browsers Stack Up
By Steve Faulkner.
"Testing of the latest builds of the major Windows browsers indicates 
Google Chrome's ARIA role support improving, 18 of  47 roles are now 
correctly mapped to MSAA roles. There has been no change in Opera or IE 
support and only minimal improvement in Safari/Webkit support. there 
has been a minor regression in Firefox support in the latest Minefield 
build..."
http://www.paciellogroup.com/blog/?p=474

Discovering Magic
By Glenn Jones.
"Wouldn't it be a little magical if, when you signed up for a new site, 
it said something like, 'We notice you have a profile photo on Flickr 
and Twitter, would you like to use one of those or upload a new one?' 
Glenn Jones created a JavaScript library called Ident Engine that can 
help you do just that."
http://www.alistapart.com/articles/discovering-magic/

Progressive Enhancement Techniques 3: the JavaScript
By Craig Buckler.
"This is the final article in a three-part series that illustrates how 
to build a simple tabbed box using progressive enhancement 
techniques..."
http://tinyurl.com/y95e5sz


+06: MISCELLANEOUS.

Results of the Quick Technologies Survey
By Eric A. Meyer.
"It was only a couple of weeks ago that we opened the doors on our 
Quick Technologies Survey, asking you which web design and development 
technologies you're either using now or expect to be using within the 
next two years. 1,226 of you responded over the following week, and now 
we have the results..."
http://tinyurl.com/y95cq65

How to Keep Your Mouth Shut
By Scott Berkun.
"...Forcing an issue can be the only way to get it the attention it 
deserves. But pick your battles..."
http://www.scottberkun.com/blog/2009/how-to-keep-your-mouth-shut/

5 x 5 on the Edge with Ruth Ellison
By Gary Barber.
"...Ruth is a user experience practitioner originally from Perth, who 
has been lured over to the not so bright lights of Canberra, she has a 
wealth of experience in Information Architecture with a passion for 
accessibility and usability. Ruth also has this thing for Robots..."
http://manwithnoblog.com/2009/10/03/ruth-ellison/

Interview with Victor Tsaran Senior Accessibility Program Manager at 
Yahoo
By Webpro Minute.
"Today's podcast is a continuation of WOW's media coverage of the Web 
Accessibility Conference that took place at the University of Illinois 
at Urbana/Champaign campus last week. For today's podcast, I'm on the 
phone with Victor Tsaran Senior Accessibility Program Manager at 
Yahoo..."
http://tinyurl.com/ye2f2zs

It's never too late to learn, A lesson from the web teacher (Virginia 
DeBolt)
By Michael G. Williams.
"Virginia DeBolt was well into her career as a schoolteacher when she 
started working with computers in the early 1980s. Even though her 
training was in English and writing, she served as the school's go-to 
person for all things high-tech at a time when the term referred to a 
computer with no mouse and a keyboard attached to the monitor..."
http://ericksontribune.com/2009/09/2636/


+07: PHP.

PHP Security: Are You Paying Attention?
By Rafael Dohms.
In a recent post to his blog Rafael Dohms reminds readers to not forget 
about the security of their applications because it can be "a huge 
mistake which can take a turn for the worse."
http://tinyurl.com/ycklmw4


+08: STANDARDS, GUIDELINES & PATTERNS.

A Proper Web Standards Education: Part 1
By Chris Mills.
"In this article I will aim to point you in the right direction, and 
give you a basic framework of good key concepts to take on board and 
develop your knowledge of..."
http://scrunchup.com/issue-1/a-proper-web-standards-education/

The Footer Element Update
By Jack Osborne.
"When I wrote the previous version of this article a few months ago, I 
knew, as I'm sure many of you also knew, that this element in 
particular would be subject to change as the HTML 5 spec neared it's 
completion. The problem was simple, the footer element just didn't feel 
'complete', it just didn't offer the same flexibility as other 
elements. Now that's changed..."
http://html5doctor.com/the-footer-element-update/

Usability Testing HTML5
By Ian Hickson.
"Over the past few weeks, Google has been preparing and then running a 
usability study to test the microdata feature of HTML5..."
http://blog.whatwg.org/usability-testing-html5

New Proposal for Captions and Other Timed Text for HTML5
By Silvia Pfeiffer.
"The first specification for how to include captions, subtitles, 
lyrics, and similar time-aligned text with HTML5 media elements has 
received a lot of feedback - probably because there are several demos 
available..."
http://tinyurl.com/y9vpmh7

Measure Up With the meter Tag
By Tom Leadbetter.
"HTML5 offers several useful new elements, to add further meaning to 
the markup of a page. These new elements include time, mark and here is 
another one, meter. It is an inline element so it can be used inside 
most elements, including a header or a paragraph..."
http://html5doctor.com/measure-up-with-the-meter-tag/


+09: TOOLS.

Unicorn
By W3C.
"The Web's Universal Conformance Checker"
http://qa-dev.w3.org/unicorn/
Unicorn Project Documentation:
http://www.w3.org/QA/Tools/Unicorn/


+10: TYPOGRAPHY.

Know Your Typefaces! Semantic Differential Presentation of 40 Onscreen 
Typefaces
By A.D. Shaikh.
"This article presents results from a study investigating the 
personality of typefaces. Participants were asked to rate 40 typefaces 
(from serif, sans serif, display, and handwriting classes) using 
semantic differential scales. Responses are shown by typeface class and 
individual typeface using scaled scores. These results are helpful to 
practitioners when deciding which typeface to use for online text..."
http://www.surl.org/usabilitynews/112/typeface.asp

@font-face in Depth
By Zoltan 'Du Lac' Hawryluk.
"When I told one of my co-workers how excited I was that almost all the 
major browser vendors now supported font-embedding in their products, I 
got the same reaction from her that Bert from Sesame Street got when he 
told Ernie how exciting he thought bottle cap collecting was (yes, 
gratuitous ridicule was involved).  Now, while I can somewhat 
understand her disinterest (she is not a front-end web developer, but a 
Java programmer), I defend my enthusiasm by stating here that fonts are 
a really important part of web design, and the fact that we can now 
theoretically choose any font to embed inside our web pages and 
applications is something to celebrate..."
http://www.useragentman.com/blog/2009/09/20/font-face-in-depth/

Starting with @font-face
By Dave Shea.
"I've been using Cufon off and on since writing about font embedding 
back in May. It's a great hack, but browser progress since that time 
has been making me feel that the native CSS @font-face rule is becoming 
increasingly viable. Or, at least enough so that it seems like it's 
time to start dabbling..."
http://mezzoblue.com/archives/2009/10/05/starting_wit/

Becoming a Font Embedding Master
By Jonathan Snook.
"I've spent a couple days worth now trying to figure out the best and 
most complete approach to font embedding using @font-face. It really is 
a dark art that must be mastered. It is by no means a straightforward 
process..."
http://snook.ca/archives/html_and_css/becoming-a-font-embedding-master


+11: USABILITY.

Surviving Information-Seeking Sickness
By Gerry McGovern.
"The key to web success is to stop thinking about organizational 
information and start thinking of customer tasks."
http://tinyurl.com/ykvqlnm

Users Don't Want Rich
By Neil Middleton.
"For many years now, software developers around the world have been 
releasing quicker and more capable software on an almost constant 
basis. Each year, we tend so see new releases of existing products that 
make the products better in every apparent way, shape and form, and we, 
the computing public, lap it up..."
http://neilmiddleton.com/2009/09/30/users-dont-want-rich/

Minimizing Complexity In User Interfaces
By Tyler Tate.
"Clean. Easy to use. User-friendly. Intuitive. This mantra is 
proclaimed by many but often gets lost in translation. The culprit: 
complexity. How one deals with complexity can make or break an 
application. A complex interface can disorient the user in a mild case 
and completely alienate them in an extreme case. But if you take 
measures first to reduce actual complexity and then to minimize 
perceived complexity, the user will be rewarded with a gratifying 
experience..."
http://tinyurl.com/ya7wgnn

Using Repertory Grid Interviews to Capture First Impressions of 
Homepages
By V. Hinkle.
"...RGIs can be used to gather users' perceptions of website homepages 
and use these perceptions to determine important features that affect 
first impressions of homepages. The results from this pilot study 
demonstrate the importance of aesthetic appeal and usability of 
homepages in terms of layout and the quality of the information. High 
scores in these features could lead to further exploration of the web 
site and therefore a new customer. Low scores in these features may 
indicate low generation of appeal and therefore fail to incite further 
exploration of the website. RGI results can help determine important 
elements for specific domains based on the users' reactions to the 
websites. Although there are other ways to capture first impressions of 
websites, RGIs provide in-depth qualitative and quantitative data that 
show the important features for potential users of the site. This 
in-depth information about important features allows researchers to 
create benchmarking goals for the first impressions of a homepage."
http://www.surl.org/usabilitynews/112/repertory.asp

Visual Appeal vs. Usability: Which One Influences User Perceptions of a 
Website More?
By C. Phillips and B. Chaparro.
"...Conclusion: An attractive homepage entices users to view more of 
the site and creates feelings of interest and initial satisfaction. If 
the homepage is unattractive, users do not appear to be interested, nor 
do they desire more interaction with the site. Designers must develop a 
homepage that not only attracts user' attention but also engages them. 
This research suggests that an attractive site is more likely to pull 
in users than an unattractive site regardless of how well it is 
designed from a usability standpoint. An unattractive site, despite 
high usability, does not attract user interest and maintains low 
satisfaction."
http://www.surl.org/usabilitynews/112/aesthetic.asp

Restraint
By Dmitry Fadeyev.
"There is one attribute of good design that I often see overlooked: 
restraint. Restraint in design is the quality of holding yourself back 
and implementing something which solves the problem in the simplest way 
possible. Oftentimes designers want to show off, imprint their own 
identity on a piece of work or simply get carried away, producing work 
that is good but losing simplicity and elegance in the process..."
http://www.usabilitypost.com/2009/10/02/restraint/

Creating a Usable Contact Form
By Matthew Kammerer.
"There are some simple steps you can take to create the best bridge 
possible between you and your clients. The most obvious way to receive 
that feedback is through a contact form. It is an essential component 
for owners of websites. It creates a channel to hear feedback, 
suggestions, and even sell services..."
http://www.uxbooth.com/blog/creating-usable-contact-forms/

The Myth of the Page Fold: Evidence From User Testing
By Joe Leech.
"In this article we are going to break down the page fold myth and give 
some tips to ensure content below the fold gets seen."
http://tinyurl.com/y969zzj

Do You Really Need a Redesign?
By Ben Hunt.
"Most web site redesigns are a colossal waste of money. Ben Hunt 
dissects the reasons for redesigning or not, and explains an effective 
process for doing it right."
http://tinyurl.com/y8jna4f


+12: XML.

XML on the Web
By Bruce Lawson.
"I was asked by John Foliot (lovely bloke; I owe him some sightseeing 
and good single malt whisky) and Shelley Powers (never met her but am 
enjoying her book Painting The Web) to defend my statement that the 
rules of XML make no sense on the Web..."
http://www.brucelawson.co.uk/2009/xml-on-the-web/


[Section one ends.]


++ SECTION TWO:

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

Accessibility Information.
http://www.d.umn.edu/goto/accessibility

Association Information.
http://www.d.umn.edu/goto/associations

Book Listings.
http://www.d.umn.edu/goto/books

Cascading Style Sheets Information.
http://www.d.umn.edu/goto/css

Color Information.
http://www.d.umn.edu/goto/color

Dreamweaver Information.
http://www.d.umn.edu/goto/dreamweaver

Evaluation & Testing Information.
http://www.d.umn.edu/goto/testing

Event Information.
http://www.d.umn.edu/goto/events

Flash Information.
http://www.d.umn.edu/goto/flash

Information Architecture Information.
http://www.d.umn.edu/goto/architecture

JavaScript Information.
http://www.d.umn.edu/goto/javascript

Miscellaneous Web Information.
http://www.d.umn.edu/goto/misc

Navigation Information.
http://www.d.umn.edu/goto/navigation

PHP Information.
http://www.d.umn.edu/goto/php

Sites & Blogs Listing.
http://www.d.umn.edu/goto/sites

Standards, Guidelines & Pattern Information.
http://www.d.umn.edu/goto/standards

Tool Information.
http://www.d.umn.edu/goto/tools

Typography Information.
http://www.d.umn.edu/goto/type

Usability Information.
http://www.d.umn.edu/goto/usability

XML Information.
http://www.d.umn.edu/goto/xml

[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/goto/webdevlist
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.]