+++ WEB DESIGN UPDATE. - Volume 12, Issue 52, June 19, 2014. An email newsletter to distribute news and information about web design and development. ++ISSUE 52 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: DREAMWEAVER. 04: HTML5. 05: JAVASCRIPT. 06: MISCELLANEOUS. 07: NAVIGATION. 08: STANDARDS, GUIDELINES & PATTERNS. 09: TOOLS. 10: USABILITY. SECTION TWO: 11: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Does that WCAG 2 Success Criteria Really Apply? By Jonathan Avila. "...It is important for testers, developers, and those creating accessibility requirements understand what is covered by WCAG 2 success criteria. This is not only important in reporting the correct results of an accessibility audit but also to ensure that requirements and implementation efforts correctly meet the WCAG SC. Testers should use a platform such as AMP to ensure that correct SC are automatically flagged and accurate WCAG support and conformance documents can be created..." https://www.ssbbartgroup.com/blog/2014/06/11/does-that-wcag-2-success-criteria-really-apply/ Giz Explains - How Blind People See the Internet By John Herrman. "...whether you're an app developer, web designer or just a dude who likes to update his blog every once in a while, remember that someone, somewhere, might be listening to what you've written. And that alt texts in images aren't just for jokes..." http://gizmodo.com/5620079/giz-explains-how-blind-people-see-the-internet 3% of Users Browse with IE9 and 14% of Users have a Disability. Why do We Only Cater for the Former? By Fiona Taylor Gorringe. "I'd like to start this post with a disclaimer: I don't know much about creating accessible websites. That's what has brought me to writing this blog post today - it concerns me that as a senior developer I've made it this far without gaining much meaningful knowledge on the subject..." http://www.fionatg.com/BlogPost/1005/3-of-users-browse-with-ie9-and-14-of-users Did You Know? 80 Percent of People Who Use Closed Captions Are Not Hard of Hearing By Lily Bond. "...Ofcom found that of the 7.5 million people using closed captions in their study, only 1.5 million had a hearing impairment. That means that 80% of people using closed captions had no hearing impairment at all. That's an amazing statistic, given that many people think closed captions only provide benefit to those with hearing impairments...." http://www.captionsforyoutube.com/blog/posts/13-did-you-know?-80-percent-of-people-who-use-closed-captions-have-no-hearing-impairment Open Letter on Future of Web Accessibility By Rich Schwerdtfeger. "We are at a critical juncture in the in the accessibility field today. More pressure than at any previous time has been placed on businesses world-wide to deliver accessible Information and communications technology (ICT)..." http://blog.knowbility.org/content/open-letter-to-all-who-want-accessible-web/ Mix Audio so Foreground Speech is Louder than Background Sounds By Denis Boudreau. "Make sure foreground speech is always four times louder than background sounds..." http://dboudreau.tumblr.com/post/89056260322/mix-audio-so-foreground-speech-is-louder-than +02: CASCADING STYLE SHEETS. Center and Crop Thumbnails with CSS By Jonathan Nicol. "Here is a handy CSS centering technique I first noticed in the WordPress media library, where it is used to centre and crop irregularly sized thumbnails within a square container..." http://jonathannicol.com/blog/2014/06/16/centre-crop-thumbnails-with-css/ +03: DREAMWEAVER. Form New Habits for Working with CSS in Dreamweaver CC By Virginia DeBolt. "The way the CSS Designer in Dreamweaver CC creates selectors is different from the way you may be in the habit of working with previous version of Dreamweaver..." http://www.webteacher.ws/2014/06/17/form-new-habits-working-css-dreamweaver-cc/ +04: HTML5. The Picture Element W3C Working Draft, 16 June 2014 "This specification defines the HTML picture element and extends the img and source elements to allow authors to declaratively control or give hints to the user agent about which image resource to use, based on the screen pixel density, viewport size, image format, and other factors. " http://picture.responsiveimages.org/ Implementation Status for HTML5 Element/Attribute Accessibility Mappings By Steve Faulkner. "...Using the Model CR Exit Criteria (Public Permissive version 3) the following is asserted..." http://stevefaulkner.github.io/html-mapping-tests/ HTML5 Accessibility Implementation Support in Browsers By Steve Faulkner. "I have been testing and tracking browser accessibility implementation support for a range of new HTML features since 2010. Data can be found on HTML5accessibility.com. Over the last week I also undertook a more formal, targeted testing of the normative implementation requirements in the WAI-ARIA section of the HTML5.0 specification which is currently on its way to becoming a W3C Recommendation..." http://blog.paciellogroup.com/2014/06/html5-accessibility-implementation-support-browsers/ Adding Captions and Subtitles to HTML5 Video By Ian-Devlin and Chris David Mills. "In other articles we looked at how to build a cross browser video player using the HTMLMediaElement and Window.fullScreen APIs, and also at how to style the player. This article will take the same player and show how to add captions and subtitles to it, using Web_Video_Text_Tracks_Format and the element..." https://developer.mozilla.org/en-US/Apps/Build/Manipulating_media/Adding_captions_and_subtitles_to_HTML5_video By Matthew Tylee Atkinson. "Custom heading element intended to replace

to

with a single heading element (yup just like XHTML promised land) and the promise of the HTML5 outline..." https://github.com/ThePacielloGroup/w3c-h#w3c-h +05: JAVASCRIPT. Multiple Return Values in ECMAScript 6 By Axel Rauschmayer. "If you combine the features 'property value shorthand' and 'destructuring', ECMAScript 6 gives you an elegant way to handle multiple return values. This blog post explains why that is useful and how it works..." http://www.2ality.com/2014/06/es6-multiple-return-values.html +06: MISCELLANEOUS. Doing Responsive Right (video) By Derek Featherstone. Derek's Mobilism 2013 presentation: "Your mobile computing devices use technology that was originally designed for accessibility purposes. There has always been a significant overlap in terms of mobile and accessibility best practices. Rooted in simplifying and optimizing interfaces, Responsive Web Design gives us tools that help us provide a better user experience. And while there is a cross-over between mobile and accessibility and similar philosophies between accessibility and RWD, using Responsive Web Design techniques doesn't automatically make something accessible. Making a Responsive design accessible actually requires a deep look at design patterns, layout, interaction and more. In this session, Derek looks at accessibility issues that creep into Responsive designs, what you can do about them, and provides guiding principles for ensuring that you're creating an experience that is optimized for everyone, including people with disabilities." http://vimeo.com/68965033 +07: NAVIGATION. Help Users Orient Themselves in a Set of Pages Using a Breadcrumb Trail By Denis Boudreau. "Make sure users can rely on a breadcrumb trail to easily locate where they are..." http://dboudreau.tumblr.com/post/88770020962/help-users-orient-themselves-in-a-set-of-pages-using-a Provide Links That are Meaningful from Link Text Labels Only By Denis Boudreau. "Make sure the purpose of links can be completely determined solely from the link's text label" http://dboudreau.tumblr.com/post/88857881642/provide-links-that-are-meaningful-from-link-text-labels +08: STANDARDS, GUIDELINES & PATTERNS. HTML5: On Our Way to Recommendation By Philippe le Hegaret. "In 2012, the HTML Working Group Chairs came up with a plan to progress HTML, aka ÒPlan 2014Ò. The plan has several objectives..." http://www.w3.org/blog/2014/06/html5-on-our-way-to-recommendation/ +09: TOOLS. SEE (Chrome Extension) By Q42. "SEE lets you view the web as a user with a visual impairment might What is it like to be visually impaired? As a well-sighted person you'll likely never fully get to understand that. But SEE helps you imagine what it's like." https://chrome.google.com/webstore/detail/see/dkihcccbkkakkbpikjmpnbamkgbjfdcn?hl=en +10: USABILITY. Make Me Think, Or Else By Steven Bradley. "'m sure you've heard the advice 'don't make me think' in regards to website usability. It's the idea that visitors of a site can use the site with as little cognitive strain as possible. Is it good advice? WellÉyes, but there are times when making people think a little more might be the better option..." http://www.vanseodesign.com/web-design/make-me-think/ Simplicity is Key to Self-Service Success By Gerry McGovern. "...The reason why so much 'print' content is migrated to the Web is because it's cheap and easy to do. Organizations are making life easy for themselves and miserable for their customers. However, they will pay the price in reduced customer loyalty." http://gerrymcgovern.com/new-thinking/simplicity-key-self-service-success [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.]