+++ WEB DESIGN UPDATE. - Volume 17, Issue 05, July 19, 2018. An email newsletter to distribute news and information about web design and development. ++ISSUE 05 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: DRUPAL. 04: EVALUATION & TESTING. 05: EVENTS. 06: HTML. 07: JAVASCRIPT. 08: MISCELLANEOUS. 09: NAVIGATION. 10: STANDARDS, GUIDELINES & PATTERNS. 11: USABILITY. SECTION TWO: 12: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. How to Implement Inclusive Design in Your Organization By Matt May. "It's extremely important when talking about inclusive design to talk about implementation…" https://theblog.adobe.com/how-to-implement-inclusive-design-in-your-organization/ Exploring WCAG 2.1 - 2.1.4 Character Key Shortcuts By Becky Gibson. "Our series on the new WCAG 2.1 Success Criteria continues with the final new level A success criterion, 2.1.4 Character key shortcuts. It falls under the existing 2.1 guideline, Keyboard accessible…" https://knowbility.org/blog/2018/WCAG21-214CharacterKeyShortcuts/ WCAG 2.1 - Why It's Time By CommonLook. "Think about what your life was like in 2008…" https://commonlook.com/pdf-accessibility/wcag-2-1-why-its-time/ WCAG 2.0 AA a Global Accessibility Measure? By WeCo. "Let's start first by clarifying that WCAG 2.0 is a standard developed by the World Wide Web Consortium (or W3C)…" https://theweco.com/wcag-and-global-compliance-client-question/ Testing for Accessibility By GOV.UK. "You must test and audit your service to make sure it can be used by all your users…" https://www.gov.uk/service-manual/technology/testing-for-accessibility How Twitter Led to a YouTube Series Getting Captioned and Translated into 16+ Languages By Deborah Edwards-Onoro. "It all started when I read the tweet from Troy Hunt…" https://www.lireo.com/how-twitter-led-youtube-series-captions-translations-16-languages/ Turn on & Manage Community Contributions By Google. "Your community of viewers can help you reach a larger audience by adding title, description, subtitles, and closed captions to your videos…" https://support.google.com/youtube/answer/6052538 Department of Education Finds GW Websites Inaccessible for the Visually Impaired By Leah Potter. "During an investigation into the accessibility of George Washington University's websites, the Department of Education found that several web pages lacked accommodations for individuals with disabilities, primarily those with vision impairments…" https://www.gwhatchet.com/2018/07/13/department-of-education-finds-gw-websites-inaccessible-for-the-visually-impaired/ +02: CASCADING STYLE SHEETS. User Stylesheets are Assistive Technology By Wayne Dick. "There are lots of people who claim to be accessibility experts who disregard the value of user stylesheets as a significant technology to mitigate problems of visual interface. Actually they work quite well…" https://lists.w3.org/Archives/Public/w3c-wai-ig/2018JulSep/0033.html CSS: A New Kind Of JavaScript By Heydon Pickering. "…CSS solves JavaScript's styling problems, and elegantly. The question is: are you willing to embrace the change, or are you married to an inferior methodology?" http://www.heydonworks.com/article/css-a-new-kind-of-javascript CSS Grid in Internet Explorer 11 By Jeremy Keith. "…when it comes to IE11, I'll continue to categorise it as a browser that doesn't support CSS grid. That doesn't mean I'm abandoning users of IE11-far from it. It means I'm giving them the layout that's appropriate for the browser they're using…" https://adactio.com/journal/14131 9 Biggest Mistakes with CSS Grid (Video) By Jen Simmons. "It's easy to make lots of mistakes with a new technology, especially something that's as big of a change from the past as CSS Grid. Jen lists the 9 Biggest Mistakes she sees people making when using CSS Grid, with advice and tips for avoiding these pitfalls and old habits…" https://www.youtube.com/watch?v=0Gr1XSyxZy0 How to Build Complicated Grids Using CSS Grid By Dan Webb. "…In this article I'm going to detail how I achieved the designed layout using CSS grid without any silly workarounds or javascript magic necessary…" https://danwebb.co/journal/how-to-build-complicated-grids-using-css-grid +03: DRUPAL. Automate Your Drupal Accessibility Testing with aXe and NightwatchJS By Rikki Bochow. "Automated accessibility tools are only one part of ensuring a website is accessible, but it is a very simple part that can catch a lot of really easy to fix issues…" https://www.previousnext.com.au/blog/automate-your-drupal-accessibility-testing-axe-and-nightwatchjs +04: EVALUATION & TESTING. Better Usability Testing on Landing Pages and Lead Forms By Jess Vice. "…Once the basics of landing page psychology and best practices have been ironed out, usability testing is the best approach to improving the landing page experience as well as the results…" http://www.uxbooth.com/articles/better-usability-testing-on-landing-pages-and-lead-forms/ How Much Does a Usability Test Cost? By Jeff Sauro. "Usability testing is expensive. At least that has been the perception…" https://measuringu.com/usability-cost/ How to Conduct User Interviews By David Davies. "User interviews can be a great way to extract information from users for user experience understanding, usability understanding and ideation…" https://www.interaction-design.org/literature/article/how-to-conduct-user-interviews +05: EVENTS. Integrating Accessibility from Design to Development July 25, 2018. Online https://www.paciellogroup.com/events/2018/07/webinar-july-25-integrating-accessibility-from-design-to-development/ Collaboration Tools: From the negotiating table to the design studio August 23, 2018. Madison, Wisconsin, U.S.A. https://betterbydesignconference.com/events/collaboration-tools-from-the-negotiating-table-to-the-design-studio/ WavePHP September 19-21, 2018. San Diego, California, U.S.A. http://wavephp.com/ Generate London September 19-21, 2018. London, England, United Kingdom https://www.generateconf.com/ Northeast PHP September 19-21, 2018. Boston, Massachusetts, U.S.A. http://2018.northeastphp.org/ Web Unleashed October 1-2, 2018. Toronto, Canada http://fitc.ca/event/webu18/ A11y Camp October 17-19, 2018. Melbourne, Australia http://a11ycamp.org.au/ +06: HTML. Why GOV.UK Content Should be Published in HTML and not PDF By Neil Williams. "…Problems with PDFs: They do not change size to fit the browser… They're not designed for reading on screens… It's harder to track their use… They cause difficulties for navigation and orientation… They can be hard for some users to access… They're less likely to be kept up to date… They're hard to reuse…" https://gds.blog.gov.uk/2018/07/16/why-gov-uk-content-should-be-published-in-html-and-not-pdf/ Use of div in dl By Steve Faulkner. "It is conforming in HTML to use a div element to group dt/dd elements. This can cause issues for screen readers as the pattern changes the way the semantics are represented in some browsers. The following are some test cases and below those are the rough results…" https://s.codepen.io/stevef/debug/GxwaoP +07: JAVASCRIPT. Do Screen readers announce aria-label on ul/li elements? By Steve Faulkner. https://s.codepen.io/stevef/debug/BPzMML +08: MISCELLANEOUS. Speaking in Code: How to Program by Voice By Anna Nowogrodzki. "Some computer scientists turn to voice-command tools to avoid the pain of typing…" https://www.nature.com/articles/d41586-018-05588-x +09: NAVIGATION. User Journey Vs User Flow - Differences and Similarities By Mockplus. "…Yes, they do have something in common, but they also differ from each other in many ways. In this article, I will make a comparison of User Journey Vs User Flow… https://medium.com/mockplus/user-journey-vs-user-flow-differences-similarities-48d5efa88fd7 +10: STANDARDS, GUIDELINES & PATTERNS. The Friction of Web Standards (Video) By Eric A. Meyer. "In March 2017, four major browsers shipped stable, consistent CSS Grid implementations in the span of just three weeks. That's amazing-- but wait, why aren't ALL new feature debuts like that? And why does it take so darned long to ship new features after implementation is begun, like the literal years it took to ship Grid? In this talk, Eric will focus on one of the biggest and least appreciated reasons: the growing friction of specification interaction. He'll not only explore some of the challenges specification authors and implementors face, but also how we all can help overcome that friction and keep the web interoperable…" https://vimeo.com/279258468 +11: USABILITY. Storyboards Help Visualize UX Ideas By Rachel Krause. "Visual representations of UX stories capture attention, provide clarity, and inspire us to take action." https://www.nngroup.com/articles/storyboards-visualize-ideas/ Defining Helpful Filter Categories and Values for Better UX By Kate Moran. "For a useful faceted search, develop filter categories and filter values that are appropriate, predictable, free of jargon, and prioritized." https://www.nngroup.com/articles/filter-categories-values/ Why Interaction Cost Matters to UX (Video) By Raluca Budiu. "Interaction cost is a direct measure of usability. It's an indicator of how difficult the interface is going to be for the user." https://www.nngroup.com/articles/storyboards-visualize-ideas/ Pitfalls of Conversion-Rate-Only Concern (Video) By Anna Kaley. "Numbers don't paint the full UX picture, so in the quest for conversion rate optimization, don't lose sight of the fact that we're designing for humans." https://www.nngroup.com/videos/pitfalls-conversion-rate-focus/ Cult of Volume Destroys Customer Experience By Gerry McGovern. "…As people become better educated and more connected to their peers, they become less dependent on organizations, less open to manipulation, less gullible to branding…" http://gerrymcgovern.com/cult-of-volume-destroys-customer-experience/ [Section one ends.] ++ SECTION TWO: +17: 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.]