+++ WEB DESIGN UPDATE. - Volume 17, Issue 10, August 30, 2018. An email newsletter to distribute news and information about web design and development. ++ISSUE 10 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: HTML. 06: JAVASCRIPT. 07: MISCELLANEOUS. 08: NAVIGATION. 09: USABILITY. 10: XML. SECTION TWO: 11: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Exploring WCAG 2.1 - 4.1.3 Status Messages By Becky Gibson. "Our series on the new WCAG 2.1 Success Criteria continues with the last of the new low vision related success criteria, 4.1.3 Status Messages. It falls under guideline 4.1, Compatible…" https://knowbility.org/blog/2018/WCAG21-413StatusMessages/ What is the Best Way to Dismiss Content on Hover or Focus? By Detlev Fischer. "The new WCAG 2.1 Success Criterion 1.4.13 Content on hover or focus is a very recent addition to the standard. There is some uncertainty what authors should do to make content on hover or focus dismissible - especially if content is shown just by CSS, i.e. without intervention of script…" https://accessuse.eu/en/blog-post-en/what-is-the-best-way-to-dismiss-content-on-hover-or-focus.html WCAG 2.1 Accessibility Checklist By accessw3. "Dynamic Checklist with Success Criteria copied from WCAG 2.1 Standard…" http://accessw3.com/wcag21-accessibility-checklist.html Digging into Inclusive Design with Derek Featherstone (Video) By Chicago Digital Accessibility & Inclusive Design. "…In this session, join Derek Featherstone as we dig into inclusive design as a practice and how it helps you systematically reach your goal of making things accessible…" https://www.youtube.com/watch?v=DZ5Yh6vBNn8 Designing for Accessibility with POUR (Video) By National Center on Accessible Educational Materials. "An introduction to the four POUR principles (Perceivable, Operable, Understandable and Robust) that make for a more accessible experience in learning materials…" https://www.youtube.com/watch?v=dzzlJQXmJIw The Importance of Text Accessibility: How IBM's Content Clarifier Shows Us What We've Forgotten By Jonathan Hassell. "…Simpler means more credible, as well as more accessible. There's a prize to be won here, whatever the Guidelines say…" http://www.hassellinclusion.com/blog/importance-text-accessibility/ Experiencing Accessibility By Dan Oehmke and Jennie Delisi. "During a conference call some time ago, my stress and frustration levels quickly maxed out. We were reporting issues with accessibility for an enterprise application to one of our software vendors…" https://mn.gov/mnit/media/blog/?id=38-350614 Accessibility Terms Defined By Jaclyn Leduc. "…we define everything from 'keyboard accessibility' to accessibility-related organizations and laws. It's important to have a solid grasp on accessibility and how it may apply to you, and it starts by understanding the basics…" https://www.3playmedia.com/2018/08/23/accessibility-terms-defined/ Beyond the Marketing Minute: WCAG 2.1 Compliance Tips for Designers By Ashley Mugnolo. "WCAG 2.1 is finally here with new recommendations for designers and UX professionals so they can update and create websites and digital content in a host of industries to make them more accessible than ever to millions of users with a range of sensory disabilities…" https://www.oneupweb.com/blog/wcag-2-1/ Exploring WCAG 2.1 for Australian Government Services By The Digital Transformation Agency. "Since the Web Content Accessibility Guidelines (WCAG) 2.1 were released in June we've received questions about how to approach the development of government services to meet these updated accessibility guidelines…" https://www.dta.gov.au/blog/exploring-wcag-2-1-for-australian-government-services/ Policy Update: Accessibility of Information Technology By University of Minnesota. "The revised Policy on Accessibility of Information Technology: Establishes the latest World-Wide Web Consortium (W3C) Web Content Accessibility Guidelines (WCAG) 2.1 level AA to serve as the University standard…" https://itss.d.umn.edu/news/a11y-u-policy +02: CASCADING STYLE SHEETS. How to Create Printer-Friendly Pages with CSS By Craig Buckler. "In this article, we review the art of creating printer-friendly web pages with CSS.…" https://www.sitepoint.com/css-printer-friendly-pages/ +03: EVALUATION & TESTING. Are Two Pairs of Eyes Better Than One? A Comparison of Concurrent Think- Aloud and Co-Participation Methods in Usability Testing By Obead Alhadreti, Pam Mayhew. "This paper presents the results of a study that aimed to compare the traditional concurrent think-aloud protocol with the co-participation method to determine the benefit of adding an additional participant to the testing session…" http://uxpajournal.org/concurrent-think-aloud-co-participation-methods-usability/ What Goes into a Well-Done Critique By Jared M. Spool. "…Four Elements of a Well-Done Critique…1: Respect…2: Dispassionate …3: Lacking Authority…Justified Impressions and Concerns…" https://articles.uie.com/critique/ Benchmarking State Government Websites By Daniel Castro and Michael McLaughlin. "A detailed review of 400 state government websites finds that while some states have much better sites than others, every state has room to significantly improve so that it better serves the public with easy and secure access to e-government services and information.…59 percent of state websites passed the accessibility standard…" https://itif.org/publications/2018/08/27/benchmarking-state-government-websites How to Setup a Desktop Usability Test (Video) By Kim Flaherty. "There are a lot of elements involved in usability studies with a desktop computer. In this video, we'll walk you through an example test setup, including the necessary equipment, and discuss how to prepare for a test." https://www.nngroup.com/videos/how-setup-desktop-usability-test/ Case Study: Iterative Design and Prototype Testing of the NN/g Homepage By Kathryn Whitenton and Sarah Gibbons. "The NN/g homepage redesign relied on rapid iterative prototyping, and usability testing, to balance multiple design objectives." https://www.nngroup.com/articles/case-study-iterative-design-prototyping/ User Personas: Traps And How To Overcome Them By Anikó Kocsis. "…We still think personas have proven themselves a necessary technique, but where does the controversy come from and how can we create good ones?…" https://uxstudioteam.com/ux-blog/user-persona/ +04: EVENTS. Digital Accessibility in Theory and Practice September 12, 2018. Cleveland, Ohio, U.S.A. https://www.meetup.com/Cleveland-Accessibility-Meetup/events/253960204/ A11Y Talks - Love thy Keyboard September 25, 2018. Online https://groups.drupal.org/node/534258 MidwestUX Conference 2018 October 11-13, 2018. Chicago, Illinois, U.S.A. https://www.2018.midwestuxconference.com/ CONNECT.TECH 2018 October 17-19, 2018. Atlanta, Georgia, U.S.A. http://connect.tech/ Talk UX Boston October 17-19, 2018. Boston, Massachusetts, U.S.A. https://www.talk-ux.com/ ICT Accessibility Testing Symposium: Mobile Testing, 508 Revision, and Beyond November 7-8, 2018. Arlington, Virginia, U.S.A. https://www.ictaccessibilitytesting.org/ ffconf 2018 November 8-9, 2018. Brighton, England, United Kingdom https://2018.ffconf.org/ +05: HTML. UX And HTML5: Let's Help Users Fill In Your Mobile Form (Part 2) By Stéphanie i Walter. "…This is the second part in a series on enhancing mobile forms for users…" https://www.smashingmagazine.com/2018/08/ux-html5-mobile-form-part-2/ +06: JAVASCRIPT. JavaScript for Impatient Programmers By Axel Rauschmayer. "Goal of this book: make JavaScript less challenging to learn for newcomers, by offering a modern view that is as consistent as possible…" http://exploringjs.com/impatient-js/index.html +07: MISCELLANEOUS. Become a Standards and Accessibility Champion (Interview) By Net staff. "…Bruce Lawson has spent years diligently advocating on behalf of developers and championing inclusivity in user experience design for brands such as Opera and Wix. We catch up with him to discuss building at scale, developer advocacy and his Generate London talk…" https://www.creativebloq.com/advice/become-a-standards-and-accessibility-champion Microsoft's Hackathon Isn't Just About Fixing the World's Problems By Ian Sherr and Connie Guglielmo. "…'When we talk about our mission of empowering every person and every organization on the planet to achieve more, it can't be just a set of words. It has to in some sense capture the very essence of who we are in all of the decisions we make, in the products we create and how we show up with our customers, Nadella said in an interview'…" https://www.cnet.com/news/microsofts-hackathon-isnt-just-about-fixing-the-worlds-problems/ +08: NAVIGATION. Accessible Breadcrumb Navigation Pattern By Scott O'Hara. "Examples of a breadcrumb navigation using aria-label to provide an accessible name, and aria-current to indicate the currently active link…" https://scottaohara.github.io/a11y_breadcrumbs/ +09: USABILITY. How To Make A Dashboard That Doesn't Suck By Dylan Wilbanks. "…there's a problem when you prioritize curb appeal above all else: Your dashboard will likely be utterly useless. It will be a work of art to hang from a wall, but it won't be a dashboard…" http://www.uxbooth.com/articles/how-to-make-a-dashboard-that-doesnt-suck/ UX And HTML5: Let's Help Users Fill In Your Mobile Form (Part 1) By Stéphanie Walter. "Do you test your forms on real users and real devices? If not, you should. Let's take a look at some of the techniques that can help you take your forms to the next level and help users fill them in." https://www.smashingmagazine.com/2018/08/ux-html5-mobile-form-part-1/ Simple Rules for Designing Web & Mobile Forms By Thomas Drach. "…Forms should be designed well. Here are a couple notes and observations…" http://subtract.design/entry/forms/ Does Anyone Use Social Sharing Buttons on Mobile? by Moovweb. "Visit a lot of websites, and you'll see precious screen space dedicated to social sharing buttons on mobile websites, imploring users to share the content on Facebook, Twitter, Pinterest or other social networks…" https://www.moovweb.com/anyone-use-social-sharing-buttons-mobile/ The User Experience of U.S. Government Websites By Jeff Sauro. "…We collected SUPR-Q data, including NPS data, and investigated visitors' reasons for using the site, website attitudes, understanding of key features, and ability to complete tasks on each of the websites…" https://measuringu.com/usgov-ux/ +10: XML. Real World Use of CSS with SVG By Craig Buckler. "SVG is a lightweight vector image format that's used to display a variety of graphics on the Web and other environments with support for interactivity and animation. In this article, we'll explore the various ways to use CSS with SVG, and ways to include SVGs in a web page and manipulate them." https://www.sitepoint.com/real-world-use-of-css-with-svg/ [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 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.]