+++ WEB DESIGN UPDATE. - Volume 17, Issue 06, August 2, 2018. An email newsletter to distribute news and information about web design and development. ++ISSUE 06 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: EVALUATION & TESTING. 05: EVENTS. 06: HTML. 07: INFORMATION ARCHITECTURE. 08: JAVASCRIPT. 09: MISCELLANEOUS. 10: NAVIGATION. 11: STANDARDS, GUIDELINES & PATTERNS. 12: TOOLS. 13: USABILITY. 14: XML. SECTION TWO: 15: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Intopia Launches WCAG 2.1 Map By Ricky Onsman. "Intopia launched a brand new visual map of WCAG 2.1, including the new Success Criteria published just last month. It's downloadable in digital format as a PDF, which makes it ideal for printing to hard copy…" http://intopia.digital/articles/intopia-launches-wcag-2-1-map/ WebAIM's WCAG 2 Checklist By WebAIM. "The following is NOT the Web Content Accessibility Guidelines (WCAG) 2. It is a checklist that presents our recommendations for implementing accessibility principles and techniques for those seeking WCAG conformance. The language used here significantly simplifies and condenses the official WCAG 2.1 specification and supporting materials to make it easier to implement and verify for web pages…" https://webaim.org/standards/wcag/checklist Exploring WCAG 2.1 - 1.4.10 Reflow By Becky Gibson. "Our series on the new WCAG 2.1 Success Criteria continues with the new level AA criteria aimed at low vision…" https://knowbility.org/blog/2018/WCAG21-1410Reflow/ WCAG 2.1 Principles Explained: Robustness By Bureau of Internet Accessibility. "With only two success criteria, robustness is the shortest of the four WCAG 2.0 principles.WCAG 2.1 includes an additional third criterion…" https://www.boia.org/blog/wcag-2.1-principles-explained-robustness 4.1.3: Status Messages-New SC in the WCAG 2.1 By Suman Damera. "…The intent of this Success Criterion is to make users aware of important changes in content that are not given focus, and to do so in a way that doesn't unnecessarily interrupt their work…" http://www.sumandamera.com/4-1-3-status-messages-new-sc-in-the-wcag-2-1/ Understanding SC 1.4.3 - Contrast Minimum By Sathish Kumar. "This success criterion requires that the texts and image of texts that are regular in size meet the color contrast ratio of 4.5:1 against their background color…" https://www.digitala11y.com/understanding-sc-1-4-3-contrast-minimum/ 10 Ways to Improve Accessibility on Websites and Social Media By Deborah Edwards-Onoro. "When I chatted about accessibility with other attendees at WordCamp Denver 2018 this weekend, I shared some of my tips and blog posts on how they could improve accessibility on their websites…" https://www.lireo.com/10-ways-to-improve-accessibility-on-websites-and-social-media/ Get Started with Accessibility: A Primer Based on Experience By Susan Jean Robertson. "…If you do even a little bit of the following, you're doing more than most…" https://www.susanjeanrobertson.com/writing/get-started-with-accessibility/ Someclusion By Karl Groves. "New word: someclusion, for when so-called inclusion efforts leave out PWDs or even a subset of PWDs…" https://twitter.com/karlgroves/status/1022865966068391937 Asking about Compliance? You May be Asking the Wrong Question By Lainey Feingold. "…Someone asked Lainey whether video captions could be 65% accurate. A poorly captioned video does not provide equal access. It is not effective to communicate what people are saying to deaf people. It's better to ask different questions…" http://www.lflegal.com/2018/07/ada-28/ Dennis Haynes versus Dunkin' Donuts (PDF) By US Court of Appeals for 11th Circuit. "…Haynes sued Dunkin' Donuts, LLC, claiming that it violated Title III of the Americans with Disabilities Act…by not maintaining a website compatible with screen reading software…Haynes has alleged a plausible claim for relief under the ADA…" http://media.ca11.uscourts.gov/opinions/unpub/files/201810373.pdf +02: CASCADING STYLE SHEETS. How Do We Keep Up? What Happens if CSS Grid Changes? (Video) By Jen Simmons. "…Jen talks about the struggles to keep up and why it is, indeed, a safe time to invest effort into learning CSS Grid…" https://www.youtube.com/watch?v=nCDWzV9wzW4 The Peculiar Magic of Flexbox and Auto Margins By Robin Rendle. "…One topic like this (which is an area I've sort of always known about but never really understood) is how auto margins and flexbox interact with one another…" https://css-tricks.com/the-peculiar-magic-of-flexbox-and-auto-margins/ Solved with CSS! Logical Styling Based on the Number of Given Elements By Una Kravets. "This post is the third in a series about the power of CSS…" https://css-tricks.com/solved-with-css-logical-styling-based-on-the-number-of-given-elements/ +03: COLOR. Supporting Users Who Change Colours on GOV.UK By Nick Colley. "…I've picked out a few examples below to demonstrate some of the improvements that have been made…" https://accessibility.blog.gov.uk/2018/08/01/supporting-users-who-change-colours-on-gov-uk/ +04: EVALUATION & TESTING. When to Use Which UX Research Method (Video) By Kara Pernice. "Don't just do usability tests. Do what you need. Consider five criteria to help you determine the most effective UX research method to use for your situation, to meet research goals, and achieve desired outcomes/" https://www.nngroup.com/videos/when-use-which-ux-research-method/ +05: EVENTS. Document Accessibility Course Starts August 6, 2018. Online. https://webaim.org/training/docs/ Testing for Accessibility on the Web August 7, 2018. Chicago, Illinois, U.S.A. https://www.meetup.com/a11ychi/events/253076818/ Live Stream: https://www.youtube.com/watch?v=0tW_adH-d0I Live Captions: http://www.streamtext.net/player?event=CDA Applying Behavioral Economics Principles to UX Design August 9, 2018. Minneapolis, Minnesota, U.S.A. http://uxpamn.org/event-2927686 Web Accessibility Training September 11-12, 2018. Logan, Utah, U.S.A. https://webaim.org/training/ Wonder Women Tech's 3rd Annual Long Beach National Conference October 5-6, 2018. Long Beach, California, U.S.A. https://wonderwomentech.com/ JS Interactive October 10-12, 2018. Vancouver, Canada https://events.linuxfoundation.org/events/js-interactive-2018/ ASSETS October 22-24, 2018. Galway, Ireland http://assets18.sigaccess.org/ +06: HTML. HTML/Usage/Headings/h1only By Steve Faulkner. "Using only h1 elements in a HTML document results in a flat document outline as heading element semantics are conveyed to users as per the numeric in the heading element tag name…" https://www.w3.org/wiki/HTML/Usage/Headings/h1only HTML5 Draggable Attribute By Rakesh Paladugula. "The HTML5 draggable attribute specifies if the element can be picked for dragging. Links and images are draggable by default…" http://www.maxability.co.in/2018/07/html5-draggable-attribute/ Sometimes 'sizes' is Quite Important By Chris Coyier. "…The entire job of the sizes attribute is to tell the browser what size the image will be shown at, as per our CSS…" https://css-tricks.com/sometimes-sizes-is-quite-important/ Short Note on the Accessibility of Styled Form Controls By Scott O'Hara. "Sticking with a native form control will almost always give your users a more accessible experience than trying to recreate one from scratch. Though the issue with native form controls is that they have an infamous reputation for being problematic to style…" https://developer.paciellogroup.com/blog/2018/07/short-note-on-the-accessibility-of-styled-form-controls/ +07: INFORMATION ARCHITECTURE. Customer-Service Information on Websites: The Hub-and-Spoke Model By Kim Flaherty. "…we propose the following model for the delivery of customer-service information on ecommerce websites…" https://www.nngroup.com/articles/customer-service-model/ +08: JAVASCRIPT. WAI-ARIA Authoring Practices 1.1 Matt King. James Nurthen. Michiel Bijl, Michael Cooper, and Joseph Scheuhammer Editors. "This document provides readers with an understanding of how to use WAI-ARIA 1.1 [WAI-ARIA] to create accessible rich internet applications. …" https://www.w3.org/TR/wai-aria-practices-1.1/ ARIA Role Categories By Russ Weakley. "…The chart below shows all WAI ARIA roles including notes on when they changed category, or where newly introduced…" https://russmaxdesign.github.io/aria-roles/ Short Note on ARIA Support By Léonie Watson. "It is easy to get the idea that ARIA fixes everything for accessibility, but the reality is that ARIA serves a very specific purpose, for a very specific audience…" https://developer.paciellogroup.com/blog/2018/07/short-note-on-aria-support/ Accessibility By React. "React fully supports building accessible websites, often by using standard HTML techniques…" https://reactjs.org/docs/accessibility.html JavaScript: More Puppy Love, Less Fatigue By Christian Heilmann. "JavaScript is everywhere and it is the hottest thing to have on your CV. For now.…" https://christianheilmann.com/2018/07/30/javascript-more-puppy-love-less-fatigue/ +09: MISCELLANEOUS. abc to SVG By Chris Coyier. "Here's a little example that Jeremy Keith used to use in his talks. It's stuck with me as one of the coolest examples of progressive enhancement and Technology Being Cool around…" https://css-tricks.com/abc-to-svg/ +10: NAVIGATION. Shortish Note on JAWS Support for Regions By Steve Faulkner. "The JAWS screen reader has fairly recently changed the way it supports the announcement of ARIA landmark roles and HTML5 elements that map to landmark roles…" https://developer.paciellogroup.com/blog/2018/07/shortish-note-on-jaws-support-for-regions/ +11: STANDARDS, GUIDELINES & PATTERNS. Why are Web Standards So Slow? By Bruce Lawson. "…that's why web standards are so slow, and so powerful - they're made in the open, for everybody." https://www.brucelawson.co.uk/2018/why-are-web-standards-so-slow/ +12: TOOLS. 3 Simple Design Bookmarklets By Thomas Park. "…Grayscale to gauge contrast between light and dark, rather than by colors…Blurry to examine the composition of colors…Upside-down to get a fresh perspective on composition and balance…" Try using the Gray one to check for instances of color alone. https://thomaspark.co/project/designbookmarklets/ Bookmarklet for Highlighting Images that Lack alt Attributes By Ted Drake. "The following bookmarklet will highlight images lacking alt attributes by turning them grey…" http://www.last-child.com/bookmarklet-images-lack-alt/ +13: USABILITY. Toggle-Switch Guidelines By Alita Kendrick. "Toggle switches are digital on/off switches. They prompt users to choose between two mutually exclusive options and always have a default value. Toggles should provide immediate results, giving users the freedom to control their preferences as needed." https://www.nngroup.com/articles/toggle-switch-guidelines/ 15 Mobile UX Facts & Insights (2018) By Jeff Sauro. "…This is an updated article to the 2017, 2016, 2015, and 2013 articles based on published data and our own mobile UX research…" https://measuringu.com/mobile-2018/ +14: XML. The World Wide Success That is XML By Liam Quin. "…There's lots of opportunities to explore in making good, sensible use of XML technologies. XML is everywhere. Thank you to all who have contributed." https://www.w3.org/blog/2018/07/the-world-wide-success-that-is-xml/ [Section one ends.] ++ SECTION TWO: +15: 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.]