+++ WEB DESIGN UPDATE. - Volume 8, Issue 39, March 26, 2010. An email newsletter to distribute news and information about web design and development. ++ISSUE 39 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: DREAMWEAVER. 05: EVENTS. 06: FLASH. 07: INFORMATION ARCHITECTURE. 08: JAVASCRIPT. 09: NAVIGATION. 10: STANDARDS, GUIDELINES & PATTERNS. 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. Auto-Garbled Captioning By Sarah E. Bourne. YouTube recently introduced automatic captioning for its videos. "O frabjous day! Callooh! Callay!" said people* I work with who are faced with the time-consuming and tricky task of creating transcripts for videos. Having seen some very É odd É output from high-end, state-of-the-art, speech recognition software, I suggested they wait to see for themselves before getting too excited. http://sarahebourne.posterous.com/auto-garbled-captioning Crowd-Sourced Twitter Captioning of Videos By Brian Kelley. "Back in March 2009 Tony Hirst write a post on his Useful blog entitled Twitter Powered Subtitles for Conference Audio/Videos on Youtube in which he provided a proof-of-concept on how you could take time-stamped Twitter posts and synchronize them with a YouTube video to provide Twitter captions for videos..." http://tinyurl.com/yanym5t The Future Will Be Captioned: Improving Accessibility on YouTube By youtube. "Tens of millions of people in the U.S. experience some kind of hearing impairment and recent studies have predicted that over 700 million people worldwide will suffer from hearing impairment by 2015. To address a clear need, the broadcast industry began running captions on regular video programming in the early 1970s. Today, closed captions on video are more prevalent than ever. But generating captions today can be a time-consuming and complicated process..." http://tinyurl.com/yer3jgd WCAG 2.0 and Section 508 Refresh Side-by-Side By uiAccess. "This is an initial start for comparing the Section 508 refresh draft and WCAG 2.0. It is incomplete and may be incorrect. It does not represent the opinions of anyone, including myself or my employer." http://uiaccess.com/drafts/WCAG2n508.html PDF will be Legally Accessible with the New 508 WebAIM Discussion Thread. "Well the new 508 requires that visual accommodation only be required for individuals with legal blindness. People with print disabilities caused by low vision who are not blind must use those accommodations. Since everyone can use screen enlargement, everyone must..." http://webaim.org/discussion/mail_thread.php?thread=4150 12 Tips For a More Accessible Website By Tom Walker. "...In this article, we explore 12 ways in which you can make your site more accessible. Some methods are very cheap and quick to implement, others require a little more time and financial investment, but you should think of them as business opportunities. With the internet so central to all of our lives these days, it's unfair that some people are being left behind..." http://tinyurl.com/y87o45q Cognitive Web Accessibility Assessment: First Attempt, Part 2 of 3 By John Rochford. "This post is the second part of my first structured attempt to evaluate cognitive Web accessibility. I am using WebAIM's Cognitive Web Accessibility Checklist and its WAVE accessibility evaluation toolbar to assess the Web site of Down's Syndrome Scotland..." http://tinyurl.com/yesjsq7 What Accessibility Means in 25 Words By Glenda Watson Hyatt. "...I have finally compiled the responses into a free ebook 'What Accessibility Means in 25 Words'. Download the ebook and feel free to share widely..." http://tinyurl.com/y9ecmyw +02: CASCADING STYLE SHEETS. Understanding the CSS Float Property By Rob Glazebrook. "I want to take a moment today and talk about CSS floats. They're used everywhere in modern web design, from navigation bars to building CSS columns and dozens of techniques in between. However, despite their prevalence, not everyone understands exactly how they work, or what the repercussions might be from using them. So let's remedy that..." http://www.cssnewbie.com/css-float-property/ The Space Combinator/Nothing Important By Niels Matthijs. "Combinators are an overlooked part of css development..." http://www.onderhond.com/blog/work/the-space-combinator CSS Vendor Prefixes Considered Harmful By Peter-Paul Koch. "I recently came across a post about border-radius by the IE team, that said IE9 supports border-radius (cool!) without vendor prefix (even cooler!)..." http://www.quirksmode.org/blog/archives/2010/03/css_vendor_pref.html CSS Vendor Prefixes Redux By Peter-Paul Koch. "Well, reactions to my proposal to abolish vendor prefixes are mixed, and I might have overshot my target here..." http://www.quirksmode.org/blog/archives/2010/03/css_vendor_pref_1.html +03: COLOR. Colour Blindness and the Web By Richard Ingram. "...In the same way you'd test the usability of an interface or the quality of your content, testing for potential visual issues caused by a colour deficiency should also be added to your quality control list. There are some great tools out there that only take a second or two to use." http://www.richardingram.co.uk/2010/03/colour-blindness-and-the-web/ Color Blindness Tests By Daniel Fluck. "...This part of the Color Blind Essentials series focuses on the different possibilities to test color vision, how they work, what they can be used for and lists some of the well-known and used tests. There will be no conclusive enumeration as there are just to many tests around, with a lot of them not available anymore but still in use..." http://www.colblindor.com/2010/03/23/color-blindness-tests/ +04: DREAMWEAVER. Adobe Tools and HTML5/CSS3 By Ryan Stewart. "...I've always thought that once HTML5 got a bit more concrete, you'd see design tools from Adobe that took advantage of it. The benefit of Flash is that we control the run time and can tie features to the development cycle of our tools. Not the case with HTML5 and CSS3. But now that the standards have started to coalesce and have support in more browsers, we can make those features part of our design tools..." http://blog.digitalbackcountry.com/2010/03/adobe-tools-and-html5css3/ +05: EVENTS. The Aiming for Accessibility Conference June 8-9, 2010. Guelph, Ontario, Canada. http://www.accessconf.open.uoguelph.ca/ +06: FLASH. Flex 4 and Flash Builder 4 Released with Accessibility Improvements By Andrew Kirkpatrick. "...The open-source Flex SDK includes many accessibility improvements in the components to ensure that users of assistive technologies can access Flex applications more easily..." http://tinyurl.com/ybqge7g HTML Versus Flash: Animation Benchmarking By Cameron Adams. "I've written before about why you shouldn't let your current tool set dictate what it is you create and I still firmly hold to that mantra..." http://www.themaninblue.com/writing/perspective/2010/03/22/ +07: INFORMATION ARCHITECTURE. There Is No Such Thing As Jesse James Garrett By Dan Klyn. "The president of a firm that's synonymous with User Experience and who literally 'wrote the book' on the elements of User Experience making an impassioned call for everybody who's called information architect or interaction designer to change their business cards to omit mention of these competing paradigms, and then insisting that the way your firm does its work is different than every other kind of design approach that's come before it? It's a sell job, if not a sales pitch. I think he doth protest too much." http://danklyn.com/blog/?p=570 Lifecycle of a Wireframe By Nick Finck. Nick Finck presentation from MIX10. http://live.visitmix.com/MIX10/Sessions/DS04 Prototyping: Picking the Right Tool By Todd Zaki Warfel. "This article is a chapter from Todd's book Prototyping: A Practitioner's Guide." http://www.uie.com/articles/prototyping_tools/ +08: JAVASCRIPT. Accessible JavaScript Techniques By Patrick Fox and Becky Gibson. "Accessibility is all around us in the real world - curb cuts, access ramps, closed captioning. Accessibility is and should be ubiquitous. Accessibility benefits all of us - we watch closed captions when we're watching a basketball game in a bar, we use curb cuts for strollers and bikes..." http://sarahdavies.cc/2010/03/14/accessible-javascript-techniques/ +09: NAVIGATION. Heading Navigation in Web Browsers By Roger Johansson. "All screen readers that I know of have keyboard shortcuts that allow the user to navigate within a web page by jumping from heading to heading. This can really speed things up when you want to skip to a particular section of a page..." http://tinyurl.com/y8po8oy +10: STANDARDS, GUIDELINES & PATTERNS. Authoring Conformance Requirements By Sam Ruby. "The HTML5 validator will produce both errors and warnings. I personally believe that many of the so-called 'errors' are at best shoulds and at worst pose no real interoperability problems and are so frequently violated that the message produced only serve to obscure real problems..." http://tinyurl.com/yjzq4ta Browsers are Rails, Web Sites are Trains (Authoring Conformance Requirements) By Larry Masinter. "There's some ongoing debate about whether or how the HTML specification should or shouldn't contain "authoring requirements". I thought I'd write about the general need..." http://tinyurl.com/yfw9fel HTML5: <section> v. <article> By Estelle Weyl. "I have been asked several times 'when do you use <article> and when do you use <section> in HTML5?'..." http://www.standardista.com/html5-section-v-article The hgroup Element By Richard Clark. "One of the new elements defined in HTML5 is <hgroup>, used for grouping titles with their associated subtitles. But why do we need <hgroup> when we've already got the <header> element? In this article, we'll do our best to answer that question..." http://html5doctor.com/the-hgroup-element/ +11: USABILITY. Don't Put Hints Inside Text Boxes in Web Forms By Caroline Jarrett. "...The short version of my advice: Don't do it! Hint text is rarely effective as a way of helping users, but instead becomes a default input. Read on, and I'll explain..." http://tinyurl.com/yexhdvv Scrolling and Attention By Jakob Nielsen. "Web users spend 80% of their time looking at information above the page fold. Although users do scroll, they allocate only 20% of their attention below the fold." http://www.useit.com/alertbox/scrolling-attention.html Don't Just Edit Terrible Web Content-Rewrite It By Rachel McAlpine. "When editing web content, be bold. Speak the truth..." http://tinyurl.com/y8goxcu The Opposite of Fitts' Law By Jeff Atwood. "...what should we do with UI elements we don't want users to click on? Like, say, the 'delete all my work' button?...uncommon or dangerous UI items should be difficult to click on" http://www.codinghorror.com/blog/2010/03/the-opposite-of-fitts-law.html +12: XML. SVG Browser Chart By Jeff Schiller. "SVG 1.1 became a W3C recommendation on January 13, 2003. Seven years later, this page records my results of running various SVG implementations (web browsers and browser plugins) through the official SVG Test Suite." http://www.codedread.com/svg-support.php [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@d.umn.edu [Issue ends.]