[webdev] Web Design Update: June 5, 2009

[Laura Carlson]

+++ WEB DESIGN UPDATE.
- Volume 7, Issue 49, June 5, 2009.

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

++ISSUE 49 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: COLOR.
04: EVALUATION & TESTING.
05: FLASH.
06: INFORMATION ARCHITECTURE.
07: JAVASCRIPT.
08: NAVIGATION.
09: PHP.
10: STANDARDS, GUIDELINES & PATTERNS.
11: TOOLS.
12: TYPOGRAPHY.
13: USABILITY.
14: XML.

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Browse Assistive Technology
By Department of Defense Computer/Electronic Accommodations Program.
"Assistive technologies ensure that people with disabilities have equal 
access to information/electronic and telecommunication work 
environments. Although CAP does not sell any products, CAP provides 
objective information about assistive technology products and 
rehabilitation equipment for people with all types of disabilities, 
including both apparent physical disabilities as well as hidden 
cognitive disabilities: blindness/low vision; cognitive; communication; 
deafness/hard of hearing; and dexterity. Information available through 
CAP includes all assistive technologies whether acquired commercially, 
modified or customized..."
http://www.tricare.mil/CAP/acc_sol/browse_AssisTech.cfm

How Do People With Different Disabilities Use The Computer
By Tom Babinszki.
"Recently I have posted a series of blog items about how people with 
different kinds of disabilities use the computer..."
http://tinyurl.com/nrw92n

What is the Difference Between Being Visually Impaired and Legally 
Blind?
By Sylvie Leochko.
"Years ago, my school division sent me in Southern Ontario to follow a 
course that would prepare me to teach Braille to one of my future 
students. While studying over there, I did not only learn so much more 
than Braille but I also met two friends that were legally blind. One 
was using a white cane and large print while the other was blessed by 
the precious assistance of a guide-dog..."
http://tinyurl.com/mscc28

How Captcha Kills the Romance of the WWW (except spammer wins)
By Cathy P.S. Ma.
"The World wide web  is a romantic concept..."
http://tinyurl.com/nno4se

Using NVDA to Evaluate Web Accessibility
By Jared Smith.
"This article provides an overview for beginners on using NVDA to 
evaluate the accessibility of web content. NVDA is a free, open source 
screen reader for Windows."
http://webaim.org/articles/nvda/

Google Chrome 2.0 Accessibility Improvements?
By Steve Faulkner.
"...The current version of Google Chrome does not have  the basic 
support required for accessibility. Support is in development, but 
Google needs to dedicate more resources if they are going to provide a 
browser, any time soon, that rivals Firefox or Internet Explorer in 
terms of accessibility for users with disabilities..."
http://www.paciellogroup.com/blog/?p=104

Hear Me Stumble Around White House, Recovery, and Data GOV Web Sites
By slger.
"This post takes a tour by screen reader of the new U.S. government web 
sites..."
http://tinyurl.com/pvztod

Chasing Our Tails?
By Wendy Chisholm.
"...The cultural dialogue about basic human rights is ongoing...we're 
still debating if accessibility is even a human right! Until it is 
assumed that every web site, every web application, every web service 
must be accessible, this gap will exist..."
http://sp1ral.com/2009/06/chasing-our-tails/

Guideline 2.1 Don't Forget Users Without a Pointer
By Olga Revilla.
"Make all functionality available from a keyboard..."
http://tinyurl.com/pe47ag


+02: CASCADING STYLE SHEETS.

Analyzing Form Element and CSS Support in Web Browsers
By Christopher Schmitt.
"...To see which form elements and CSS properties did well, you can 
look into the presentation itself from my SlideShare account (see pages 
33 and 37) or you skip down this blog post to read the lists..."
http://tinyurl.com/m8pjgq

All CSS 2.1 Properties, Values and Browser Support
By Estelle Weyl.
"Below is every CSS 2.1 Property, all the possible values for that 
property, and the support for each property value from grade-A 
browsers..."
http://tinyurl.com/lr66ox

Improving Your Process: Thinking More About Your CSS
By Jonathan Christopher.
"...here's a quick breakdown of my tips, tricks, and suggestions..."
http://tinyurl.com/mtdvdw

The CSS Box Model
By Chris Coyier.
"At the risk of over-repeating myself: every element in web design is a 
rectangular box. This was my ah-ha moment that helped me really start 
to understand CSS-based web design and accomplish the layouts I wanted 
to accomplish. We've talked about the positioning of these boxes a bit, 
and about their behavior..."
http://css-tricks.com/the-css-box-model/

22 CSS Button Styling Tutorials and Techniques
By speckyboy.
"CSS button styling can be tricky and sometimes tedious. If you are 
looking for a simple and effective way of creating dynamic CSS buttons 
with cross browser compatibility, these tutorials are for you.
Below, you will find 22 CSS Button Styling Tutorials and Techniques..."
http://tinyurl.com/q3y2gk


+03: COLOR.

Color Contrast (Font Sizing)
By WebAIM Thread.
"I have a question about the WCAG 2.0 requirements. It mentions the 
font sizes 18 point and 14 point. If I were to write this requirement 
in pixels, should I use 24 pixels and 19 pixels, respectively? Point 
size seems to depend on screen resolution. For 72 ppi, 14 point and 14 
pixels are the same size. But at 96 ppi, 14 point is closer to 19 
pixels. Does the WCAG 2.0 checkpoint mean to depend on the screen 
resolution in this way? I'm working with our brand department on a 
color palette and I need to let them know which text/background color 
combinations provide enough contrast, but first they need to know what 
18 point and 14 point mean."
http://tinyurl.com/pabewg


+04: EVALUATION & TESTING.

Eye Tracking Study Reveals 12 Website Tactics
By directcreative.
"While this is just one eye tracking study focused on a particular type 
of site, I think there are instructive nuggets here for any 
informational website."
http://www.directcreative.com/blog/eye-tracking-websites

Don't Trust Your Gut Instinct
By Gerry McGovern.
In an age when computers can crunch numbers and do analysis on a vast 
scale, the deep flaws in our intuition and gut instinct are becoming 
more and more apparent.
http://www.gerrymcgovern.com/nt/2009/nt-2009-06-01-gut-instinct.htm

Real or Imaginary - The Effectiveness of Using Personas in Product 
Design
By Frank Long.
"The use of personas as a method for communicating user requirements in 
collaborative design environments is well established. However, very 
little research has been conducted to quantify the benefits of using 
this technique. The aim of this study was to investigate the 
effectiveness of using personas. An experiment was conducted over a 
period of 5 weeks using students from NCAD. The results showed that, 
through using personas, designs with superior usability characteristics 
were produced. They also indicate that using personas provides a 
significant advantage during the research and conceptualization stages 
of the design process (supporting previously unfounded claims). The 
study also investigated the effects of using different presentation 
methods to present personas and concluded that photographs worked 
better than illustrations, and that visual storyboards were more 
effective in presenting task scenarios than text only versions."
http://tinyurl.com/pe9qfv


+05: FLASH.

HTML5 Versus Flash Versions
By Ryan Stewart.
"...I ran down some of the new APIs and changes between HTML5 and HTML4 
according to Wikipedia and compared them to what we have in Flash and 
when we added it..."
http://blog.digitalbackcountry.com/2009/05/html5-versus-flash-versions/


+06: INFORMATION ARCHITECTURE.

The Life Cycle of a Wireframe
By Nick Finck.
"For those who are looking for my slides from the Puget Sound SIGCHI 
lecture and for those who missed it but are curious, here is my 
presentation. It focuses specifically on my personal process for 
creating wireframes. There are 4 parts to my process, each has a series 
of deliverables that feed into it and principals I try to keep in mind, 
the outcome is either a single or a series of IA deliverables. My 
overall strategy for IA is three step process; understanding the 
problem (note: not merely identifying the problem but really 
understanding it), find a solution (there may be more than one 
solution, but there is often only one right solution), and present the 
solution (a large part of your job as a IA is presenting your work so 
the client can understand the results). Hope you enjoy the slides, 
these are admittedly pretty rough. I plan to refine and show better 
pairing between the principals and the specific outcome of applying 
them to the wireframes in the future."
http://www.nickfinck.com/blog/entry/the_life_cycle_of_a_wireframe/


+07: JAVASCRIPT.

Getters and Setters with JavaScript - Code Samples and Demos
By Robert Nyman.
"Not many people know it, but you can use 'real' getters and setters in 
JavaScript if you want to..."
http://tinyurl.com/m5h7hg

Screen Reader Support for AJAX Live Regions
By Leonie Watson.
"Rich Internet Application (RIA) websites encourage people to generate 
content, collaborate online and make choices about the information they 
receive. Unsurprisingly, RIA websites can represent a considerable 
challenge for screen reader users. The WAI's Accessible Rich Internet 
Applications (ARIA)is an emerging standard that aims to bridge the gap 
between RIA websites and screen reading technology."
http://tink.co.uk/2009/06/screen-reader-support-for-ajax-live-regions

Debugging JavaScript: Beyond Alerts
By Rob Gravelle.
"Today, JavaScript can be written, debugged, and even tested using 
frameworks' built-in functionality or by specialized software. In 
today's article, we'll begin examining some of the latest ways of 
debugging your JavaScript code..."
http://www.webreference.com/programming/javascript/rg34/index.html


+08: NAVIGATION.

Drop Down Menus
WebAIM Thread.
"I'm just trying to find some definitive answers to the accessibility of
drop down menus. Can anyone point me in the right direction? Are they
compliant with WCAG priority 2 guidelines?..."
http://webaim.org/discussion/mail_thread.php?thread=3883

30 Examples of Attractive Nav
By Joel Reyes.
"...To help you generate new ideas and inspiration for user navigation, 
here are 30 great examples of attractive and usable navigation..."
http://www.webdesignerwall.com/trends/30-examples-of-attractive-nav/


+09: PHP.

The Isset and Unset Magic Functions in PHP 5
By Alejandro Gervasio.
"Welcome to the second part of a seven-part series on the magic 
functions in PHP 5. In the previous article, we looked at property 
overloading with the get and set functions. In this one, we'll take a 
look at the same task using the isset and unset magic functions..."
http://tinyurl.com/qbquql

Advanced PHP Form Input Validation to Check User Inputs
By Codex-M.
"PHP form input validation is what separates amateur and professional 
PHP developers. A professional PHP developer validates data for both 
security and correctness of the data entered. Keep reading to learn how 
to validate user input to your forms."
http://tinyurl.com/qextx7

The ABC's of PHP - Part 10 - The Final Installment
By Peter Shaw.
"In this last installment in our series Peter Shaw ties it all 
together..."
http://www.phpbuilder.com/columns/peter_shaw06012009.php3

PHP Charts
By Jim Rutherford.
"Digital Media Minute did a post years back (did I mention we are 
coming up on our sixth birthday?) on generating Flash/PHP charts . 
Here's a list of some of the better places on the net that will help 
you build PHP charts..."
http://www.digitalmediaminute.com/article/3503/php-charts


+10: STANDARDS, GUIDELINES & PATTERNS.

HTML5 Isn't a Standard Yet
By Philippe Le Hegaret.
"...while it is great to see support for and implementation of HTML 5, 
the community has not yet reached agreement enough to call it a 
standard, and it has not been implemented consistently across multiple 
browsers. Building a test suite will help a lot and we don't have one 
yet. This is an area that we intend to explore and to seek community 
support."
http://www.w3.org/QA/2009/05/_watching_the_google_io.html

Cufon and Screen Readers
By Roger Johansson.
Cufon has been talked about a lot recently, and it looks like a 
potential alternative to static images or sIFR in situations when you 
absolutely must use a typeface that is not 'web-safe'..."
http://tinyurl.com/m7bnwl

Video on the Web
By Anne van Kesteren.
"I am pretty excited about all the recent video announcements. 
Dailymotion announced they are converting a bunch of their videos to 
Theora so you can view them natively in the upcoming Firefox. YouTube 
created an HTML5 Demo page which works only with Safari at this point 
due to the videos being encoded using H.264. Not quite there yet in 
terms of browser interoperability, but it is just starting. Already the 
YouTube demo shows a cool new thing when you hover over the video 
thumbnails..."
http://annevankesteren.nl/2009/05/web-video

Video for Everybody - HTML 5 Video Fallback
By Chris Double.
"Kroc Camen has made available Video for Everybody, an HTML snippet 
that uses HTML 5 video if it's available in the browser, otherwise 
falling back to different video playback options..."
http://tinyurl.com/okbmuy

Web Design Education Sucks
By Lucian Tucker.
"Lucian Tucker shares his thoughts on how web design is currently 
taught."
http://boagworld.com/design/web-design-education-sucks


+11: TOOLS.

Subtitle Horse 2.0: Online Subtitle/Captions Editor
By subtitle-horse.
"Subtitle Horse is a online subtitle editor to translate flash videos 
(FLV) and get the subtitle-code in different formats, like TimedText or 
SRT. A timedText file (which is supported by the JW FLV Player and 
Adobe FLV playback component) can be generated online..."
http://www.subtitle-horse.org/

A Web Based DFXP Captioning Tool
By Roberto Ellero.
"I would like to point out a Web based captioning Tool: Subtitle Horse.
It allows you to easily subtitle movies on the fly..."
http://lists.w3.org/Archives/Public/w3c-wai-gl/2009AprJun/0044.html


+12: TYPOGRAPHY.

Quick and Easy Ways To Spice Up Your Web Site's Font Styling
By Neal Grosskopf.
"One of the key elements of a good website design is the styling of the 
site's font. I think this is an area where many of the more 
'mathematically inclined' web developers struggle. To help those out 
that are willing to take it, I'll show you how to take the default 
Times New Roman 16px font and make your design shine..."
http://www.nealgrosskopf.com/tech/thread.asp?pid=50


+13: USABILITY.

Twitter-verslag Steve Krug's Don't Make Me Think-Workshop
By Aartjan van Erkel.
Fifty tips from a workshop by Steve Krug.
http://tinyurl.com/nkxcp4

User Experience Over Usability
By Alistair Gray.
"A good experience is essential for a customer to return and good site 
usability has several advantages. This article looks at the big picture 
and the difference in focus between usability and user experience."
http://tinyurl.com/kwh8uy

Nice Research on Persona Effectiveness
IxDA Thread.
"The paper compares three groups; one group that is briefed with photos 
of personas, one which uses illustrations of the personas and the last 
group is briefed to with no personas, and uses aesthetic design." - 
(IxDA Discussion) Intensely debated topic (again)..."
http://www.ixda.org/discuss.php?post=42315

Fixed vs. Fluid vs. Elastic Layout: What's The Right One For You?
By Kayla Knight.
"This article discusses the pros and cons of each type of layout. 
Either one can be used to make a successful website layout, as long as 
you keep usability in mind."
http://tinyurl.com/q54tnl

Dear American Airlines
By Dustin Curtis.
"I'm a user interface designer. I travel sometimes. Recently, I had the 
horrific displeasure of booking a flight on your website, aa.com. The 
experience was so bad that I vowed never to fly your airline again. But 
before we part ways, I have a couple questions and three suggestions 
for you..."
http://dustincurtis.com/dear_american_airlines.html

Is UX an Art or a Science?
By Patrick Kennedy.
"As many of them do, this post by Seth Godin struck a chord with me, 
and made a lot of sense..."
http://www.gurtle.com/ppov/2009/06/03/is-ux-an-art-or-a-science


+14: XML.

W3C's Steven Pemberton on XHTML2
By Molly E. Holzschlag.
"With all the fuss about HTML5 at Google I/O last week, the question of 
'what about XHTML2?' keeps coming up in conversation. In an effort to 
better understand the answer to that question, I asked Steven 
Pemberton, W3c Chair of HTML and Forms Working Groups, who graciously 
took the time to chat with me about it and who then provided this 
overview to answer the question for the Web designer and developer 
public..."
http://www.molly.com/2009/06/02/why-xhtml2/

The Real 'Why XHTML' Discussion
By Molly E. Holzschlag.
"Molly Holzschlag asked me if I'd try and clearly and simply explain 
why XML parsing is advantageous and why XHTML still is relevant. This 
was my answer...."
http://www.molly.com/2009/06/02/the-real-why-xhtml-discussion/

An SVG Primer for Today's Browsers
By David Dailey.
"...While this book is not intended for the beginning computer user, I 
would hope it is approachable by any of these sorts of people..."
http://www.w3.org/Graphics/SVG/IG/resources/svgprimer.html


[Section one ends.]


++ SECTION TWO:

+15: 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.]