+++ WEB DESIGN UPDATE. - Volume 9, Issue 33, February 11, 2011. An email newsletter to distribute news and information about web design and development. ++ISSUE 33 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: EVALUATION & TESTING. 04: FLASH. 05: JAVASCRIPT. 06: MISCELLANEOUS. 07: NAVIGATION. 08: PHP. 09: STANDARDS, GUIDELINES & PATTERNS. 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. How-To Guide for Creating Accessible Online Learning Content By Hadi Rangin. "...Thanks to a generous grant from the Alfred P. Sloan Foundation, this guide explores accessibility issues and provides straight forward advice and guidance about creating usable content whether you are a novice or advanced author of course content..." http://sloanconsortium.org/cannect/projectone/index.php Five Kinds of 'alt' Text By David Travis. "Virtually every web designer I speak with is familiar with the 'alt' attribute: the part of the html 'img' tag that you use to provide an equivalent alternative for people who are unable to see the image. This includes people who are using a screen reader or people who are browsing the web with images turned off. What's less commonly known is that there are five different classes of image used on web pages and each of those images requires a different approach to writing the 'alt' attribute..." http://www.userfocus.co.uk/articles/alt_text.html HTML5: Techniques for Providing Useful Text Alternatives By Steve Faulkner. Steve provides more use cases. http://dev.w3.org/html5/alt-techniques/ Accessible Web Design: Dyscalculia By Steven Clark. "As a web designer your job isn't to push (X)HTML elements around or to bling things up with CSSÉ it's not even the cool dark art of JavaScript. Your job, if anything at all, is to pursue an ongoing study of human nature to better understand the medium, the market and the environment that makes your client money..." http://stevenclark.com.au/2011/02/02/accessible-web-design-dyscalculia/ Accessible Web Design: More Thoughts on Dyscalculia By Steven Clark. "Having thought about this a little more, although I admit that it's time I locate and read research papers, there appear to be at least seven issues at play with dyscalculia..." http://stevenclark.com.au/2011/02/04/accessible-web-design-more-thoughts-on-dyscalculia/ Defining Disability - Or Trying To Anyway By Nicolas Steenhout. "'What is the definition of a person with a disability?'. This is such an interesting and difficult question to answer! At first glance, it's easy to answer - there are plenty of definitions of disability. But digging around the question a bit more, finding a useful definition that makes everyone happy isn't straightforward at all. University thesis have been written on the topic. I don't claim this post will cover everything, but it will give the reader a bit of an idea..." http://accessibility.net.nz/blog/defining-disability-or-trying-to-anyway/ Accessibility on the Yahoo Homepage By Ted Drake. "Nicholas Zakas, a principal developer of the Yahoo! homepage, and Victor Tsaran, Yahoo!'s senior accessibility manager, discuss the strategies and methods that made on of the most visited websites in the world fully accessible..." http://yaccessibilityblog.com/wp/accessibility-yahoo-homepage.html Accessibility Testing - Establishing a screen reader test plan By Henny Swan. "This article is not about testing with screen readers as such (I've written about this elsewhere) but rather what needs to be considered in order to establish a good screen reader testing plan within larger overall accessibility and general quality assurance plans. Its written in such a way that I hope organisations of any size or budget can adapt and use it..." http://www.spotlessinteractive.com/articles/accessibility/screen-reader-test-plan.php +02: CASCADING STYLE SHEETS. Understanding CSS Selectors By Emily Lewis. "I'll never forget how much of my (and, subsequently, my employer's) time was wasted trying to work with our 'enterprise' CSS. It really isn't all that funny when you have to deal with it. It's even more sobering when you consider the time, money and resources wasted due to inefficient CSS..." http://msdn.microsoft.com/en-us/scriptjunkie/gg619394.aspx Use Efficient CSS Selectors By Thierry Koblentz. "Using descendant selectors is inneficient, but when your key selector (the rightmost selector) is a ID selector, then things get worse..." http://www.css-101.org/descendant-selector/go_fetch_yourself.php CSS: Clearing Floats with Overflow By Nick La. "One of the common problems we face when coding with float based layouts is that the wrapper container doesn't expand to the height of the child floating elements. The typical solution to fix this is by adding an element with clear float after the floating elements or adding a clearfix to the wrapper. But did you know you can also use the overflow property to fix this problem? It's not a new CSS trick either. It's been documented before long long ago. Today I would like to revisit the topic along with a few tips..." http://www.webdesignerwall.com/tutorials/css-clearing-floats-with-overflow/ HTML5 Forms Styled With CSS3 By Hyde. "Let me start by saying that HTML5 and CSS3 are two different things. Secondly HTML5 is still just HTML and CSS3 is still just CSS. I've been noticing that people are confusing these two specifications with each other and making it more complicated then it is..." http://www.devlounge.net/code/html5-forms-styled-with-css3 New Working Draft: CSS Writing Modes Level 3 By Elika Etemad (fantasai). "Last week a new Working Draft of the CSS Writing Modes Module Level 3 was published. This module covers BIDI and vertical text..." http://www.w3.org/blog/CSS/2011/02/07/css3_writing_modes_wd2 +03: EVALUATION & TESTING. Bonus Research: Do the Recruiting Yourself By Dana Chisnell. "...I've learned many recruiting lessons the hard way. Recruiting can be challenging, but it can also be really interesting. I always find that I learn a lot in the recruiting process. Here are my pointers..." http://usabilitytestinghowto.blogspot.com/2011/02/bonus-research-do-recruiting-yourself.html Disneyland Paris User Experience Review By klmcdonnell. "There's no better way to chase away the Winter blues than by booking a holiday and having something fun to look forward to. If you can book one that is. This usability review of the Disneyland Paris website left me thinking 'How can a multi-billion dollar supposedly consumer-centric business get things so wrong on their website'?..." http://whatusersdoblog.com/2011/02/07/disneylandparis/ +04: FLASH. Creating Accessible Flash Course By U.S. Department of Veterans Affairs. "...The goal of this course is to enable developers and other personnel involved in Flash development projects to apply the principles of accessibility to creating Section 508-compliant Flash presentations..." http://www.ehealth.va.gov/508/flash/index.asp +05: JAVASCRIPT. Screw Screen Readers By Nicolas Steenhout. "Implementing JavaScript should be done carefully, thinking of the impact it may have not just on screen reader users, but people who use only the keyboard to interact with a site, people on some mobile devices, people stuck with older browsers, etc. Don't just think that if the site works without JavaScript it is accessible. Don't just think that unobtrusive JavaScript makes the site accessible." http://accessibility.net.nz/blog/screw-screen-readers/ Broken Links By Tim Bray. "...There is no piece of dynamic AJAXy magic that requires beating the Web to a bloody pulp with a sharp-edged hashbang. Please stop doing it." http://www.tbray.org/ongoing/When/201x/2011/02/09/Hash-Blecch Breaking the Web with hash-bangs By Mike Davies. "Lifehacker, along with every other Gawker property, experienced a lengthy site-outage on Monday over a misbehaving piece of JavaScript. Gawker sites were reduced to being an empty homepage layout with zero content, functionality, ads, or even legal disclaimer wording. Every visitor coming through via Google bounced right back out, because all the content was missing..." http://www.isolani.co.uk/blog/javascript/BreakingTheWebWithHashBangs Beyond Hash-Bangs: Reliance on JavaScript Is a Bad Idea By Adrian A. Roselli. "...Even at that most basic level you can see how poor of a decision JavaScript reliance is." http://blog.adrianroselli.com/2011/02/beyond-hash-bangs-reliance-on.html Videos of Screen Readers Using ARIA By Zoe Mickley Gillenwater. "...I was able to find a few videos of screen readers using ARIA, and I wanted to share the links here..." http://zomigi.com/blog/videos-of-screen-readers-using-aria/ Tips on Learning JavaScript By Andy Walpole. "...Fast forward to 2011 and animated GIFs and Java applets have been thrown into the dustbin of history; but, surprisingly, JavaScript has enjoyed a renaissance of epic proportions. So much so that you can't call yourself a web designer today without some knowledge of JavaScript under your belt..." http://thinkvitamin.com/code/tips-on-learning-javascript/ +06: MISCELLANEOUS. People of HTML5 - John Foliot By Chris Heilmann. "Today we are featuring John Foliot co-chair of the subcommittee on the accessibility of media elements in HTML5 and well-known accessibility warrior of the wild wild web..." http://hacks.mozilla.org/2011/02/people-of-html5-john-foliot/ Linux.conf.au 2011: The Latest and Coolest with HTML5 Video You Tube of Silvia Pfeiffer on HTML5 Video http://www.youtube.com/watch?v=_kazYydCmQw +07: NAVIGATION. Guide to Website Navigation Design Patterns By Cameron Chapman. "In web design, there are certain common design patterns that are used for interaction. Site navigation has a wide variety of common and familiar design patterns that can be used as a foundation for building effective information architecture for a website. This guide covers popular site navigation design patterns. For each site navigation design pattern, we will discuss its common characteristics, its drawbacks, and when best to use it." http://sixrevisions.com/user-interface/navigation-design-patterns/ +08: PHP. PHP Tutorial By cramerz. "In This tutorial we are going to learn one of the mostly used Server Side Scripting language called PHP. This tutorial is for PHP beginners, that's why we are going to start PHP from scratch. The main purpose of this tutorial is to introduce you to some of the building blocks of PHP so you can start making your own dynamic websites using PHP language..." http://www.cramerz.com/php +09: STANDARDS, GUIDELINES & PATTERNS. Please explain the role of the W3C in the continuing development of HTML Email from Steve Faulkner to the W3C's Chief Executive Officer, Jeffrey Jaffe; Head of W3C Communications, Ian Jacobs; Director, Tim Berners-Lee; and Interaction Domain Leader, Philippe Le Hegaret. "...What has been and is clearly missing from this public discourse is the clear articulation (by the W3C) of the role of the W3C in HTML development and the value proposition of the specification process used by the W3C for HTML5..." http://lists.w3.org/Archives/Public/www-archive/2011Feb/0011.html HTML as a Living Standard - For and Against By Bruce Lawson, and John Foliot. "People have already written a number of articles either for or against dropping the version number on HTML. Here are two contrasting views about this news presented by me, Bruce Lawson, and John Foliot..." http://html5doctor.com/html5-living-standard/ W3C Priorities and Milestones in 2011 By Jeff Jaffe. "Last year I published several posts about our efforts to establish a new vision for the W3C organization. I wanted to update you on how we have turned the results of the organizational vision task forces into specific plans and actions..." http://www.w3.org/2011/01/w3c2011 +10: TYPOGRAPHY. Revised Font Stack By Amrinder Sandhu. "Serious efforts are being made to get more typeface choices on the web to enhance web typography. Still, most of us prefer web-safe fonts like: Verdana, Georgia, Times New Roman and Arial. Though choices are limited, yet the number can be increased by exploring other pre-installed fonts..." http://www.awayback.com/revised-font-stack/ +11: USABILITY. Writing Useful Page Titles By Roger Johansson. "Writing good titles for web pages (or web applications, for that matter) is far from a new subject. A little reminder every now and then doesn't hurt though, so here are a few simple guidelines..." http://www.456bereastreet.com/archive/201102/writing_useful_page_titles/ Usability: User Expectations are Important By Tim Fidgeon. "Meeting user expectations throughout a site normally delivers good usability. Ways to make sure you meet expectations: user research, reviewing competitor sites and following usability guidelines..." http://www.spotlessinteractive.com/articles/usability-research/usability-user-behaviours/user-expectations-are-important.php Why Don't Usability Problems Get Fixed? By Jim Ross. "How many times has this happened to you? You've finished presenting the results of your usability testing, heuristic evaluation, or other user research activity, feeling great about the positive impact your recommendations will have on a product's user experience. The audience smiled and nodded along during your presentation. Most of them agree with your findings and seem genuinely impressed by the work you've done. But, later on, you face the reality that few of your recommendations have gotten implemented fully-and many, not at all." http://www.uxmatters.com/mt/archives/2011/02/why-dont-usability-problems-get-fixed.php Subject-Matter Experts - Putting Users at the Center of the Design Process By Demetrius Madrigal and Bryan McClain. "This month we'll discuss the process of putting users at the center of the design process and what that means in regard to both design and product strategy. We'll also discuss some different approaches to a user-centered design process that we've come across and outline their positives and negatives. Finally, we'll outline the steps necessary to make user-centered design a reality and how to get the most out of a user-centered design process when working on different types of products. The insights we gain from interacting directly with users are invaluable. They can assist us greatly throughout the product development process and ensure user adoption." http://www.uxmatters.com/mt/archives/2011/02/subject-matter-experts-putting-users-at-the-center-of-the-design-process.php The Nature of Choice Sets and Their Affect on Decision Making By Colleen Roller. "...In this column, I'll expand upon the concept of relativity and how the context in which people make decisions significantly influences decision outcomes. Specifically, we'll look at how the nature of a choice set affects people's ability to decide..." http://www.uxmatters.com/mt/archives/2011/02/the-nature-of-choice-sets-and-their-affect-on-decision-making.php Designing Web Registration Forms for Kids By Debra Levin Gelman. "Designing websites for kids is a fascinating, challenging, rewarding, and exasperating experience: you're trying to create a digital experience for people who lack the cognitive capacity to understand abstraction; to establish brand loyalty with people who are influenced almost exclusively by their peers; and to communicate subjective value propositions to people who can only see things in black-and-white. Fortunately, it's possible to create a successful registration process for these folks with an understanding of how their brains work. Debra Levin Gelman explores how to design effective registration forms for kids based on their context, technical skills, and cognitive capabilities..." http://www.alistapart.com/articles/designing-web-registration-forms-for-kids/ +12: XML. Cross Platform Scalable Vector Graphics With svgweb by Jim Ray. "Pity Scalable Vector Graphics. It's been an official standard since before IE6 was released yet has never found much of an audience on the web, certainly not the one it deserves. Just as SVG was starting to establish some browser support, along came the canvas tag, stealing the thunder of dynamically generated client-side images. Yet despite all the attention being paid to canvas, there's still a place for SVG, particularly for developers looking to replace plug-ins like Flash for data visualization. Unlike canvas or other script-only approaches, SVG can be easily divided into design and code elements, with just a little code to add interactivity. It even works on devices like the iPad and iPhone. And now, thanks to svgweb and a clever use of Flash, it works on older platforms no one could have ever imagined supporting SVG. Jim Ray shows how." http://www.alistapart.com/articles/cross-platform-scalable-vector-graphics-with-svgweb/ [Section one ends.] ++ SECTION TWO: +13: 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.]