+++ WEB DESIGN UPDATE. - Volume 12, Issue 39, March 20, 2014. 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/itss/training/online/webdesign/ New links in these categories: 01: ACCESSIBILITY. 02: BOOKS. 03: CASCADING STYLE SHEETS. 04: DRUPAL. 05: EVALUATION & TESTING. 06: EVENTS. 07: HTML5. 08: JAVASCRIPT. 09: NAVIGATION. 10: TOOLS. 11: USABILITY. SECTION TWO: 12: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Accessibility of Information Technology Policy Frequently Asked Questions By University of Minnesota. "...The most important thing to understand in terms of making a site accessible is that people use the Web in very different ways. A site should therefore present information in a way that people can access it, regardless of what kind of equipment they are using or the method they use to navigate a site. Web designers cannot assume that everyone uses the same kinds of devices the same way." http://accessibility.umn.edu/ait_faq.html The Case for Web Accessibility By Tim Lohman. "...Taken in isolation, the social inclusion, employment and education, business, and legal and policy dimensions make for a strong case in favour of acting on web accessibility. However, together, they should leave little doubt that advancing web accessibility is the right thing, the smart thing, and the required thing to do." http://www.accessiq.org/news/news/2014/03/the-case-for-web-accessibility 10 Easy Web Accessibility Wins By Tim Lohman. "...with a nod to the Commission, here's Access iQ's 10 easy web accessibility wins..." http://www.accessiq.org/news/news/2014/03/10-easy-web-accessibility-wins Trends in Mobile Device Use by People with Disabilities By Jonathan Avila. "...In summary, organisations must implement mobile accessibility design and requirements into their processes. Testing for mobile content can be broken down by web content and native content but ultimately requires accessibility supported methods on the platforms where the content will be consumed. Mobile specific techniques and failures should be documented as well as expected properties for user interface controls. Assistive technology will likely be a larger factor in testing due to the dearth of testing tools for native apps. Finally, users with disabilities should be involved in testing to ensure functional use." http://www.accessiq.org/news/features/2014/03/trends-in-mobile-device-use-by-people-with-disabilities Use Scope Attributes to Associate Cells in Complex Data Tables By Denis Boudreau. "Make sure data cells in complex tables are explicitly associated using the scope attribute..." http://dboudreau.tumblr.com/post/78979333515/use-scope-attributes-to-associate-cells-in-complex-data Describe Groups of Form Controls Using the Legend Element By Denis Boudreau. "Make sure groupings of related form controls are described using a common LEGEND element..." http://dboudreau.tumblr.com/post/79299755705/describe-groups-of-form-controls-using-the-legend Associate Groups of Form Controls Using the fieldset Element By Denis Boudreau. "Make sure groups of related form controls are structured using a fieldset element..." http://dboudreau.tumblr.com/post/79427805987/associate-groups-of-form-controls-using-the-fieldset Use a Button with Select Elements to Perform an Action By Denis Boudreau. "Make sure drop down menus options are not triggered until a button is activated" http://dboudreau.tumblr.com/post/79720465772/use-a-button-with-select-elements-to-perform-an-action Indicate Required Form Controls in Text Using the Label Element By Denis Boudreau. "Make sure indications of required form controls are conveyed through label elements" http://dboudreau.tumblr.com/post/79791057588/indicate-required-form-controls-in-text-using-the-label +02: BOOKS. Rauschmayer, Axel. Speaking JavaScript, An In-Depth Guide for Programmers, O'Reilly Media, 2014. +03: CASCADING STYLE SHEETS. Leveling Up With Flexbox presentation at Smashing Conference By Zoe M. Gillenwater. "Download the slides and view the demos for my presentation on practical flexbox progressive enhancement, 'Leveling Up With Flexbox' for Smashing Conference in Oxford, as well as get links to related articles, tutorials, and tools on Flexible Box Layout..." http://zomigi.com/blog/leveling-up-with-flexbox/ Drop Caps and Paragraph Text Effects Using CSS3 By Jake Rocheleau. "In this tutorial I'd like to share a few CSS tips for building creative paragraph or text designs. Legibility and font choices are often directly related to the design itself. But incorporating text effects like drop caps, highlights, and recognizable hyperlinks will distinguish from other content on the page. Take a peek at my live sample demo to see what we're trying to build..." http://designshack.net/articles/css/drop-caps-and-other-paragraph-text-effects-using-css3/ +04: COLOR. Effective Color Contrast By Aries Arditi. "This page contains three basic guidelines for making effective color choices that work for nearly everyone. Following the guidelines are explanations of the three perceptual attributes of color -- hue, lightness and saturation -- as they are used by vision scientists..." http://www.lighthouse.org/accessibility/design/accessible-print-design/effective-color-contrast Web Accessibility 101 - Effective Color Contrast (Video) By Thomas Logan. "Thomas Logan, Senior Accessibility Consultant for SSB BART Group discusses the use of color in websites and applications and how it effects the accessibility of the content..." http://www.youtube.com/watch?v=L-99RfyMCVU Audio Description: https://www.ssbbartgroup.com/clients/ Color Systems - Part 1 By Steven Bradley. "What is color? How do you define it? How do you describe it? How can we ensure that when you tell me to make something red, I make it the exact same red you intended? For centuries people have been developing systems to describe color to answer these questions." http://www.vanseodesign.com/web-design/color-systems-1/ +05: EVALUATION & TESTING. Everything You Know About Accessibility Testing is Wrong (Part 4) By Karl Groves. Proper management of accessibility necessitates getting ahead of accessibility problems as soon as possible. Effectively there is no place before the code is committed. As a pre-commit hook or, at least, as a Grunt task before committing, accessibility problems are caught before they're created. Automated testing is not the end, but the beginning of a robust accessibility testing methodology. http://www.karlgroves.com/2014/03/13/everything-you-know-about-accessibility-testing-is-wrong-part-4/ Recap - Involving People with Disabilities in User Experience Research By Deborah Edwards-Onoro. "...What I enjoyed from the webinar: the tips on recruiting people with disabilities and the reinforcement for layout and coding practices (not placing focus on an input field) I've been using. Here are my notes from the webinar..." http://www.lireo.com/recap-involving-people-disabilities-user-research/ +05: DRUPAL. Using Drupal to Support Web Accessibility in Higher Education By Chris Hartigan. "...The first point to take away from this discussion is that many schools recognize that Drupal is part of the solution when it comes to web accessibility..." https://www.acquia.com/blog/using-drupal-support-web-accessibility-higher-education +06: EVENTS. National Association of Government Web Professionals (NAGW) Conference September 9-12, 2014. Saint Paul, Minnesota, U.S.A. http://beta.nagw.org/conference/2014 WebVisions Chicago September 25-26, 2014. Chicago, Illinois, U.S.A. http://www.webvisionsevent.com/chicago/ HighEdWeb October 19-22, 2014. Portland, Oregon, U.S.A. http://2014.highedweb.org/ +07: HTML5. A Q&A on the Picture Element By Yoav Weiss, Mat Marquis, Marcos Caceres. "The revival of the picture element-the responsive images proposal that has seen the most support from the developer community-is exciting news, but there are still some outstanding questions about how the element will really work. Marcos Caceres and Yoav Weiss have put countless hours into the Responsive Images Community Group's efforts, and are now working toward picture implementations in Firefox and Chrome, respectively. Mat Marquis asked them some questions." http://alistapart.com/blog/post/picture-element-qa +08: JAVASCRIPT. JavaScript Taking Both the High and Low Roads (Video) By Brendan Eich. Brendan Eich's keynote at O'Reilly Fluent conference. http://www.youtube.com/watch?v=aZqhRICne_M Lesser-Known JavaScript Debugging Techniques By Amjad Masad. "...in this post I'm going to shed light on the lesser-known features and techniques of JavaScript debugging..." http://amasad.me/2014/03/09/lesser-known-javascript-debugging-techniques/ Screen Reader Support for ARIA Live Regions By Leonie Watson. "An ARIA live region is a simple mechanism for notifying screen readers when content is updated on the page. Despite the obvious Accessible User Experience (AUX) benefits that live regions bring, screen reader support is disappointingly inconsistent." http://blog.paciellogroup.com/2014/03/screen-reader-support-aria-live-regions/ ARIA-checked (state) By Rakesh Paladugula "ARIA checked state is used when the current state of elements such as checkboxes, radio buttons needs to be intimated to the user. On standard browsers, operating systems and screen reader combinations this state can be intimated with the HTML semantics. In any of the cases if this information cannot be received by the screen reader ARIA-checked can be used in the mark-up. The standard HTML checkbox exposes only two possible values 'checked' (true) and 'unchecked' (false but aria-checked have three possible values." http://www.maxability.co.in/2014/03/aria-checked-state/ +09: NAVIGATION. I Don't Care What Google Did, Just Keep Underlining Links By Adrian Roselli. "...Unless you plan to run the necessary color contrast tests, just keep the underlines on your hyperlinks. " http://blog.adrianroselli.com/2014/03/i-dont-care-what-google-did-just-keep.html Finding the Things We Don't Search For By Gerry McGovern. "Search behaviour is one window into the customer's mind. But there are many others." http://www.gerrymcgovern.com/new-thinking/finding-things-we-don%E2%80%99t-search Avoid Nesting or Overusing ARIA Landmarks By Denis Boudreau. "Make sure aria landmarks are not overused and remain useful" http://dboudreau.tumblr.com/post/79614278659/avoid-nesting-or-overusing-aria-landmarks Assign a Form Landmark Role to the Page's Form Sections By Denis Boudreau. "Make sure the form sections are identified using the form landmark role..." http://dboudreau.tumblr.com/post/79230195175/assign-a-form-landmark-role-to-the-pages-form-sections Filters vs. Facets - Definitions By Kathryn Whitenton. "The terms 'filters' and 'faceted navigation' are often used interchangeably; while related, these concepts have important differences. Both are tools to help users narrow down large sets of content, but faceted navigation - while more flexible and powerfu - is more difficult to create and maintain." http://www.nngroup.com/articles/filters-vs-facets/ +10: TOOLS. Drowning in Tools in the Web Development Industry By Louis Lazaris. "Every once in a while in this industry we need a reminder that our trade as front-end developers - and I say this in the most positive way possible - can be a frustrating thing..." http://www.sitepoint.com/drowning-in-tools-web-development-industry/ +11: USABILITY. Availability in the Cross-Channel User Experience By Janelle Estes. "Don't limit common activities to a few channels. Identify and support users top tasks on all channels and strive to make secondary tasks available." http://www.nngroup.com/articles/available-cross-channel/ First Principles of Interaction Design (Revised and Expanded) By Bruce Tognazzini. Basic principles are fundamental to the design and implementation of effective interfaces, whether for traditional GUI environments, the web, mobile devices, wearables, or Internet-connected smart devices. http://asktog.com/atc/principles-of-interaction-design/ [Section one ends.] ++ SECTION TWO: +12: 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.]