+++ WEB DESIGN UPDATE. - Volume 12, Issue 44, April 24, 2014. An email newsletter to distribute news and information about web design and development. ++ISSUE 44 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: DRUPAL. 05: EVALUATION & TESTING. 06: HTML5. 07: JAVASCRIPT. 08: MISCELLANEOUS. 09: NAVIGATION. 10: USABILITY. SECTION TWO: 11: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Those WCAG Forgot - Designing for the Cognitively Disabled By Allie Richardson. "The World Wide Web Consortium promises that the WCAG 2.0 guidelines 'will make content accessible to a wider range of people' and 'work together to provide guidance on how to create more accessible content (Caldwell et al.)' and in some ways this is true. WCAG 2.0 does make the web accessible to a wider range of people. It also provides guidance on how to make the web more accessible for people with cognitive disabilities; but it is just that, merely Priority AAA guidance. But the required success criteria are primarily designated for individuals with sight, hearing, and motor impairments, while those for cognitive impairment typically remain priority AAA criteria that may or may not be implemented..." http://orange.eserver.org/issues/7-2/richardson.html Before and After Demonstration By Web Accessibility Initiative. "Improving a Web site using Web Content Accessibility Guidelines (WCAG) 2.0..." http://www.w3.org/WAI/demos/bad/Overview.html Benefits of Transcripts and Captions for Your Videos and Podcasts By Deborah Edwards-Onoro. "...If you want to reach more people and have your videos and podcasts be found online, read on and learn how captions and transcripts can make that happen..." http://www.lireo.com/benefits-transcripts-captions-videos-podcasts/ Mandatory Fields and Accessibility By Rakesh Paladugula. "...Below are few ways how a mandatory field can be identified and how it impacts accessibility..." http://www.maxability.co.in/2014/04/mandatory-fields-and-accessibility/ Use CSS Rather than Table Markup for Page Layout By Denis Boudreau. "Make sure page layout is handled through CSS and not HTML table markup..." http://dboudreau.tumblr.com/post/83428415975/use-css-rather-than-table-markup-for-page-layout Patents versus Accessibility By Adrian Roselli. ...If you think accessibility features will be somehow immune to the patent process, consider Apple's patent for a graphical user interface for the visually impaired...We've already got a patent system that's out of control, with even the most basic ideas receiving patents. It seems the same patent process is also building barriers to accessibility using the very ideals that should be using to tear barriers down. Ideally with enough people raising a stink we can slow or even stop the process." http://blog.adrianroselli.com/2014/04/patents-versus-accessibility.html Invisible Visualization By Doug Schepers. "Last year, I put together a talk called 'Invisible Visualization' on making accessible data visualizations. Several people have asked me about it, so I thought I'd write a post about it..." http://schepers.cc/invisible-visualization The Pain of Accessible PDFs from MS Word on Mac - Test Results By Greg Kraus. "I get asked this question every so often, so I did some tests to see what the current landscape is in terms of creating accessible PDFs from MS Word on Mac. I was primarily looking at the workflow for adding headings and alternative text into Word and having those features show up in a PDF generated from Word. There are other accessibility issues to contend with as well, but for this evaluation I was looking at these two very important aspects of PDF accessibility which have a high occurrence." http://accessibility.oit.ncsu.edu/blog/2014/04/18/the-pain-of-accessible-pdfs-from-ms-word-on-mac-test-results/ +02: CASCADING STYLE SHEETS. 12 Little-Known CSS Facts By Louis Lazaris. "In my research, I come across new little tidbits all the time, so I thought I'd share some of them in this post. Admittedly, not everything in this post will have a ton of immediate practical value, but maybe you can mentally file some of these away for later use..." http://www.sitepoint.com/12-little-known-css-facts/ Alphabetical List of CSS Properties By David Storey. Listing has been updated. http://ref.openweb.io/CSS/ Handling z-index By Chris Coyier. "Managing z-index across large sites can be a pain in the butt. CSS is hard to test, so it's notoriously easy to make a change that ends up, for instance, hiding some important UI under who-knows-where..." http://css-tricks.com/handling-z-index/ +03: COLOR. 147 CSS3 Color Module Color Keywords By Martin Wolf. http://codepen.io/martinwolf/full/GrcIi +04: DRUPAL. The Case Against Drupal Base Themes By John Hannah. "...This discussion is really part of a larger debate that front-end developers are having about CSS and grid frameworks in general (see here and here), but it seems particularly relevant when discussing Drupal base themes because all of the issues are magnified due to added complexity..." http://friendlymachine.net/posts/case-against-drupal-base-themes +05: EVALUATION & TESTING. Remote Usability Testing: Thinking Outside the Lab By Rebecca Baker. "In the world of user experience, usability testing may be one of the hardest things to sell, while simultaneously being one of the most critical elements of ensuring an application's usability..." http://www.uxmatters.com/mt/archives/2014/04/remote-usability-testing-thinking-outside-the-lab.php Define Stronger A/B Test Variations Through UX Research By Jennifer Cardello. "Complement A/B split tests with user research to identify true causes and develop well informed design variations." http://www.nngroup.com/articles/ab-testing-and-ux-research/ +06: HTML5. Sections and Outlines of an HTML5 Document By Mozilla. "The HTML5 outline algorithm as described below is not implemented in user agents, as a consequence, users who make use of heading semantics are exposed to the HTML 4 document structure. The description of problems solved by HTML5 is theoretical only..." https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document Warning! Steve Faulkner. "Warning! Do not rely on the outline algorithm to convey doc structure..." https://twitter.com/stevefaulkner/status/456739486404075521 HTML 5.1 Nightly, 4.3.10.1 Creating an Outline By Steve Faulkner, editor. "There are currently no known implementations of the outline algorithm in graphical browsers or assistive technology user agents, although the algorithm is implemented in other software such as conformance checkers. Therefore the outline algorithm cannot be relied upon to convey document structure to users. Authors are advised to use heading rank (h1-h6) to convey document structure." http://www.w3.org/html/wg/drafts/html/master/sections.html#outlines Canvas Ready to Return to Last Call By Mark Sadecki. "The Canvas Accessibility Sub-Group has concluded its work on Canvas L1 and has published an Editor's Draft [1] that is ready to return to Last Call. The group's work has focused on Hit Regions [2] and the drawFocusIfNeeded() method [3]. As agreed on 03 APR 2014 [4], The HTML Accessibility Task Force as given the Canvas Accessibility Sub-Group to authorize this transition on its behalf..." http://lists.w3.org/Archives/Public/public-html-a11y/2014Apr/0059.html Web Components and You - Dangers to Avoid By Chris Heilmann. "What are the chances to mess up?...I see the following dangers: One browser solutions, Dependency on filler libraries, Creating inaccessible solutions, Hiding complex and inadequate solutions behind an element, Repeating the 'just another plugin doing $x' mistakes..." http://christianheilmann.com/2014/04/18/web-components-and-you-dangers-to-avoid/ A 'Disclosure' Web Component Using Polymer and WAI-ARIA By Heydon Pickering. "A simple web component for showing and hiding content. You just supply some content inside the element and a "summary" as a value of its summary attribute. The shadow DOM takes care of the markup, encapsulated styling and WAI-ARIA state changes..." http://www.heydonworks.com/accessible-web-component-with-aria/ Picturefill 2.0: Use the Element Today By Scott Jehl. "We started the Picturefill project over 2 years ago to provide an easy, responsible, and immediately-usable approach to delivering appropriate images to every browser and device..." http://filamentgroup.com/lab/picturefill_2_a/ Picturefill By Scott Jehl. "The picture element and associated features are W3C standard HTML features allow web developers to deliver an appropriate image to every user depending on a variety of conditions like screen size, viewport size, screen resolution, and more. Picturefill is a JavaScript file (or a polyfill to be more specific) that enables support for the picture element and associated features in browsers that do not yet support them, so you can start using them today..." http://scottjehl.github.io/picturefill/ +07: JAVASCRIPT. Learning to focus() By Heydon Pickering. "Thanks to good fortune, I have a functional pair of eyes. When it comes to traversing web pages, this is something of a boon since shifting my focus from one part of the page to another requires nothing more than semi-consciously contracting my extra-ocular muscles and rotating my eyeballs a fraction of their circumference..." http://www.sitepoint.com/learning-to-focus/ Use Redundant Keyboard and Mouse Event Handlers By Denis Boudreau. "Make sure specific mouse event handlers are duplicated to account for the keyboard" http://dboudreau.tumblr.com/post/83594040199/use-redundant-keyboard-and-mouse-event-handlers Seven JavaScript Quirks I Wish I'd Known About By Jim Cowart. "This isn't an exhaustive list - just a sampling - but hopefully it will shed some light on the language as well as show how powerful it can be once you get past these kinds of hurdles..." http://developer.telerik.com/featured/seven-javascript-quirks-i-wish-id-known-about/ +08: MISCELLANEOUS. Structured Negotiations with Lainey Feingold By Whitney Quesenbery. "If you work in user experience or accessibility, you probably spend part of your time on advocacy-making the case for a new design idea or a new way of working. Lawsuits are the ultimate way to get two sides to come to an agreement, but it's also an extremely confrontational style of advocacy. A more collaborative process might be a better way to reach your goal with an agreement that is a win for everyone" http://rosenfeldmedia.com/blogs/a-web-for-everyone/structured-negotiations-with-lainey-feingold/ +09: NAVIGATION. Make Sure Links Identified by Color Alone Can Be Easily Distinguished in Another Way By Denis Boudreau. "Make sure links identified by color alone can be easily distinguished in another way..." http://dboudreau.tumblr.com/post/83615759992/make-links-easier-to-distinguish-when-color-alone Title Tags and SEO - 3 Golden Rules By Eric Enge. "It used to be conventional wisdom that title tags should be between 65 and 70 characters in length. Early this year Google began experimenting with a new search layout design that reduces the number of characters shown to lengths between 48 and 62 characters. The title tag remains an important part of SEO for one basic reason – it is the overall label for the content of a page, and because the number of characters is limited,there isn’t much room to do that much with it. Here are three golden rules of title tags." http://searchenginewatch.com/article/2340747/Title-Tags-SEO-3-Golden-Rules +10: USABILITY. The Power of Microcopy in Web Design By Paula Borowska. "'Copy' has turned into a buzzword. Have you noticed it? People are putting more and more importance onto the words you use on your website. They are trying to put value in copy and it's a wonderful idea! Words are a prominent way of communicating online. And it's the small things that matter, especially when it comes to user experience..." http://designmodo.com/microcopy/ 3 Crucial Steps to Achieve Intuitive Usability By Jessica Miller. "If you want to increase your usability, you need to give customers what they want...Improvements in usability are crucial to a positive user experience, even though the ROI is not immediately obvious. If you are still having trouble choosing what to keep, understand that information beats creativity every time..." http://usabilitylab.walkme.com/3-crucial-steps-achieve-intuitive-usability/ Why Users Fill Out Less if You Mark Required Fields By Anthony. "Are most of your users skipping the optional fields on your form?..." http://uxmovement.com/forms/why-users-fill-out-less-if-you-mark-required-fields/ [Section one ends.] ++ SECTION TWO: +11: 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.]