+++ WEB DESIGN UPDATE. - Volume 13, Issue 39, March 19, 2015. 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: CASCADING STYLE SHEETS. 03: EVALUATION & TESTING. 04: EVENTS. 05: HTML5. 06: JAVASCRIPT. 07: MISCELLANEOUS. 08: TYPOGRAPHY. 09: USABILITY. SECTION TWO: 10: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Adding Haptic Feedback to HTML By Diagram Center. "Adding haptics to an HTML page requires knowledge of javascript, HTML, and an Android tablet that contains a web browser supporting the W3C Vibration API. We have provided sample code below as well as on GitHub..." http://diagramcenter.org/adding-haptic-feedback-to-html.html Accessibility Tip: Making Maps Accessible By Allayne Woodford. "Maps. We're lost without them. Here's how to make sure people with vision impairments can continue to find their way with accessible maps." http://www.accessiq.org/news/news/2015/03/accessibility-tip-making-maps-accessible Cognitive Accessibility 101 - Part 2: How it Effects Me & the Tools I Use By Jamie Knight. "This article is based on the content of my 2015 CSUN session of the same title..." http://jkg3.com/Journal/cognitive-accessibility-101-part-2-how-it-effects-me-the-tools-i-use Digital Accessibility Legal Update (CSUN 2015) By Lainey Feingold. "This post is a version of the presentation Lainey Feingold gave in March 2015 at CSUN - the International Technology and People with Disabilities conference held annually in San Diego, California. " http://lflegal.com/2015/03/legal-update-csun15/ University Works to Improve Website Accessibility for Students with Disabilities By Russell Hausfeld. "Following a report released in December from the U.S. Office of Civil Rights that determined the University of Cincinnati's website violated federal law - noting that accessibility for disabled students was lacking - the university is working to make its web content more accessible, particularly for the visually impaired..." http://www.newsrecord.org/news/university-works-to-improve-website-accessibility-for-students-with-disabilities/article_939f74de-bc7c-11e4-a605-772c56dac595.html CSUN15 Review and Interviews in Podcast 101 By Dennis Lembree. "Another CSUN conference has come and gone. This year was the 30th Annual International Technology and Persons with Disabilities Conference (Twitter hash tag #CSUN15) held in downtown San Diego, California from March 2 to March 7, 2015 at the Manchester Grand Hyatt Hotel..." http://www.webaxe.org/csun15-review-interviews-podcast-101/ Accessibility APIs - A Key To Web Accessibility By Leonie Watson and Chaals McCathie Nevile. "Web accessibility is about people. Successful web accessibility is about anticipating the different needs of all sorts of people, understanding your fellow web users and the different ways they consume information, empathizing with them and their sense of what is convenient and what frustratingly unnecessary barriers you could help them to avoid..." http://www.smashingmagazine.com/2015/03/16/web-accessibility-with-accessibility-api/ Why Do We Treat Accessibility as a Footnote? By Luke McGrath. "Someone asked me a brilliant and all-to-common question today: why do so many projects run through all their requirements and then tag on at the end 'and it needs to be accessible'? That's like asking someone to plan a round-the-world holiday and then, just as you're about to buy the ticket, asking if you can get everywhere by boat. You've just changed a core feature of your trip, now you need to start again and plan which countries have a coastline..." https://www.wuhcag.com/footnote/ Access Board ICT Refresh Update By Rakesh Paladugula. "In the years following initial promulgation of the 508 Standards and 255 Guidelines, technology continued to evolve at a rapid pace..." http://www.maxability.co.in/2015/03/access-board-ict-refresh-update/ What I Blew My Accessibility Budget On By Deborah Edwards-Onoro. "It all started with a tweet by Heydon Pickering last month, encouraging people on Twitter to join the conversation about web project accessibility budgets..." http://www.lireo.com/what-i-blew-my-accessibility-budget-on/ New Episode from The Viking and The Lumberjack: Rebranding Accessibility By Billy Gregory. "Some people say accessibility isn't cool but don't worry, The Viking and The Lumberjack have an idea how to change that. Join Karl 'The Viking' Groves and Billy 'The Lumberjack' Gregory as they discuss how to 'Rebrand Accessibility' as only they could do!"..." http://www.paciellogroup.com/blog/2015/03/new-episode-from-the-viking-and-the-lumberjack-rebranding-accessibility/ +02: CASCADING STYLE SHEETS. All Your Base, Are Belong to Us - Or what Base Size Do Em-Based Media Queries Use? By Stephanie Rewis. "Yesterday, we had a discussion at work about rems, ems and percentages. I've used ems for media queries for years. I've used rems for font sizing for a couple of years. I felt like I had a pretty good handle on how it all works. Most of you probably understand the difference, but let's do a quick recap to refresh..." http://blog.w3conversions.com/2015/03/all-your-base-are-belong-to-us-%E2%80%94-or-what-base-size-do-em-based-media-queries-use/ Enhancing Responsiveness with Flexbox Presentation at RWD Summit By Zoe M. Gillenwater. "Download the slides and view the demos for my presentation on practical flexbox progressive enhancement for RWD, 'Enhancing Responsiveness with Flexbox' for the RWD Summit, as well as get links to related articles, tutorials, and tools on Flexible Box Layout..." http://zomigi.com/blog/rwd-flexbox/ Understanding CSS Grid Systems From the Ground Up By Ryan Morr. "Over the past few years CSS grid systems have grown a lot in popularity, quickly becoming considered best practice for rapid layout scaffolding. As a result, there has been no shortage of frameworks popping up offering their own grid systems trying to garner favor..." http://www.sitepoint.com/understanding-css-grid-systems/ Probably Use initial-scale=1 By Chris Coyier. "If you're doing responsive design, you're using viewport tags. These tell the browser what width it should render the viewport at. If you don't use this tag, it will render at the device's default, which almost certainly isn't what you want. But even if you are using viewport , there are subtle differences in the value you put in it. I just wanna focus on one little difference here" https://css-tricks.com/probably-use-initial-scale1/ +03: EVALUATION & TESTING. SUPR-Q - A Comprehensive Measure of the Quality of the Website User Experience By Jeff Sauro. "A three part study conducted over five years involving 4,000 user responses to experiences with over 100 websites was analyzed to generate an eight-item questionnaire of website quality-the Standardized User Experience Percentile Rank Questionnaire (SUPR-Q). The SUPR-Q contains four factors: usability, trust, appearance, and loyalty. The factor structure was replicated across three studies with data collected both during usability tests and retrospectively in surveys. There was evidence of convergent validity with existing questionnaires, including the System Usability Scale (SUS). The overall average score was shown to have high internal consistency reliability (α = .86). An initial distribution of scores across the websites generated a database used to produce percentile ranks and make scores more meaningful to researchers and practitioners. The questionnaire can be used to generate reliable scores in benchmarking websites, and the normed scores can be used to understand how well a website scores relative to others in the database." http://uxpajournal.org/supr-q-a-comprehensive-measure-of-the-quality-of-the-website-user-experience/ +04: EVENTS. CSS Dev Conf October 26-28, 2015. The Queen Mary, Long Beach, California, U.S.A. http://2015.cssdevconf.com/ 18th Annual Accessing Higher Ground November 16-20, 2015. Westminster, Colorado, U.S.A. http://accessinghigherground.org/ +05: HTML5. HTML5 Tests - Inputs (Desktop Browsers) By Peter-Paul Koch. "This page tests the new input values of HTML5..." http://quirksmode.org/html5/inputs/ HTML5 Tests - Inputs (Mobile Browsers) By Peter-Paul Koch. "This page tests the new input values of HTML5 in mobile browsers..." http://quirksmode.org/html5/inputs/mobile.html Polymer and Web Component Accessibility: Best Practices By Dylan Barrell. "Polymer and Web Components promise great flexibility for custom UI widget authors to be able to implement custom elements that are on a par with native DOM elements. However the Polymer components are some of the worst offenders from an accessibility perspective. To see whether there was anything inherent in the framework that is causing this, I implemented an accessible ARIA menu (simplified) in 100% native web components and then ported that implementation to Polymer, resulting in an accessible Polymer ARIA menu. The two implementations share almost all of their code (certainly the JavaScript code is almost 100% the same). The only differences are in the basic bootstrapping and some small changes to take into account the fact that Polymer emulates the shadow DOM in browsers that do not yet support it natively. The bottom line is that it is possible to create accessible components. The code for both implementation can be found on the Axponents GitHub repository. Here are a some of the lessons I learned..." http://unobfuscated.blogspot.com/2015/03/polymer-and-web-component-accessibility.html +06: JAVASCRIPT. The Destructuring Algorithm in ECMAScript 6 By Axel Rauschmayer. "This blog post looks at destructuring from a different angle: as a recursive matching algorithm. At the end, I'll use this new knowledge to explain one especially tricky case of destructuring..." http://www.2ality.com/2015/03/destructuring-algorithm.html Why Developers Should Embrace Progressive Enhancement By Paula Borowska. "...Progressive enhancement is a philosophy that makes sure that people have an easy access to your information, no matter their device; because it focuses on how you build your website...." http://www.developerdrive.com/2015/03/why-developers-should-embrace-progressive-enhancement/ js;dr = JavaScript Required; Didn't Read By Tantek Celik. "Pages that are empty without JS: dead to history (archive-org), unreliable for search results (despite any search engine claims of JS support, check it yourself), and thus ignorable. No need to waste time reading or responding..." http://tantek.com/2015/069/t1/js-dr-javascript-required-dead +07: MISCELLANEOUS. Future Friendly Fruition By Brad Frost. "It's been three and a half years since the the Future Friendly manifesto was drafted, and yesterday's Apple Watch announcement got me thinking about how the manifesto and its principles are coming to fruition. After all, here's an emerging device class that has people simultaneously excited and skeptical about its utility and potential..." http://bradfrost.com/blog/post/future-friendly-fruition/ +08: TYPOGRAPHY. Typefaces for Dyslexia By Adrian Roselli. "I've been writing this post in fits, so it may be a bit disjointed. I started it on my flight home from CSUN, and continued to work on it on subsequent flights. Apologies if it's a bit chaotic..." http://blog.adrianroselli.com/2015/03/typefaces-for-dyslexia.html +09: USABILITY. Pop-ups and Adaptive Help Get a Refresh By Katie Sherwin. "Presenting adaptive help in a small overlay can make it faster to find answers to simple questions, but the tradeoffs of obscuring the page and failing to predict user needs may not be worthwhile." http://www.nngroup.com/articles/pop-up-adaptive-help/ Black Hat UX and How to Fight It By Peter W Szabo. "Conversion rates can be improved by designing experiences that are intentionally difficult to use or that trick users. This needs to stop..." http://blog.whatusersdo.com/2015/03/13/black-hat-ux-and-how-to-fight-it/ The Never-Dying Number of Clicks Argument By Steve Grobschmidt. "Every so often, I still hear the 'above the fold' line - that tired, ancient lament by people who forget about conventions like scrolling..." http://www.theaccessibility.com/2015/03/the-never-dying-number-of-clicks-argument/ [Section one ends.] ++ SECTION TWO: +10: 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 Drupal Information. http://www.d.umn.edu/itss/training/online/webdesign/drupal.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 HTML Information. http://www.d.umn.edu/itss/training/online/webdesign/html.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.]