+++ WEB DESIGN UPDATE. - Volume 18, Issue 30, January 22, 2020. An email newsletter to distribute news and information about web design and development. ++ISSUE 30 CONTENTS. SECTION ONE: New references. What's new at the Web Design Reference site? https://www.d.umn.edu/itss/training/online/webdesign/ New links in these categories: 01: ACCESSIBILITY. 02: BOOKS. 03: CASCADING STYLE SHEETS. 04: EVALUATION & TESTING. 05: EVENTS. 06: HTML. 07: JAVASCRIPT. 08: MISCELLANEOUS. 09: USABILITY. SECTION TWO: 10: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Overlays are Not the Solution to Your Accessibility Problem By Sheri Byrne-Haber. "In the long run they will hurt, not help your approach to people with disabilities…" https://medium.com/@sheribyrnehaber/overlays-are-not-the-solution-to-your-accessibility-problem-c5ffe44bd61f Defining 'Toast' Messages By Adrian Roselli. "In current user interface terms a toast is a message that appears on the screen; it is often short, often appears only briefly, and often animates up from the bottom (like a piece of ghostly yet precisely-crafted toast), though other directions and a fade-in/-out is common…" https://adrianroselli.com/2020/01/defining-toast-messages.html Bad Accessibility Equals Bad Quality By Manuel Matuzovic. "When I talk about web accessibility at meet-ups and conferences, it's safe to assume that at least one person will ask me something like 'Yeah, accessibility sounds nice, but how many people are actually disabled? How many of my users are blind? And why would a blind person visit my website?'…" https://www.matuzo.at/blog/bad-accessibility-equals-bad-quality/ How to Force Closed Captions to Appear on Your YouTube Videos By Samantha Sauld. "Have you ever wished that you could make people watch your video with captions? Well, we're going to show you just how to do that…" https://www.3playmedia.com/2020/01/13/force-closed-captions-appear-youtube-videos/ Web Accessibility Basics for Web Developers By Master Owl. "You have probably seen this thing 'A11y' on the internet. It's not a typo, but an actual word presented as an abbreviation. Number 11 refers to the number of omitted letters. The full word is 'Accessibility'. People just got sick of typing it every time and decided to shorten it a bit…" https://owlypixel.com/web-accessibility-basics/ Blackboard Accessibility Beyond Ally (Video) By Matt Deeprose. "Recorded live during the Mobile and Collaborate Hybrid meeting at the Twentieth Annual Durham Blackboard Users Conference. In this presentation I explain aspects of The Public Sector Bodies (Websites and Mobile Applications) (No. 2) Accessibility Regulations 2018 and Directive (EU) 2016/2102 on the Accessibility of the websites and mobile applications of public sector bodies…" https://www.youtube.com/watch?v=jZcuHYopOa8 Accessible Technology Procurement Toolkit By Disability:IN. "…The purpose of the Toolkit is to provide technology purchasers with information, best practices, and resources to ensure that workplace technology is accessible to all applicants and employees without unnecessary delay or unwarranted costs…" https://private.disabilityin.org/procurementtoolkit/ Vendor Responsibilities for Accessibility By Jay Wyant. "…So what are the vendor's responsibilities with respect to accessibility? Here is a brief checklist…" https://www.accessibilityassociation.org/content.asp?admin=Y&contentid=652 +02: BOOKS. Lewis, James R. "Using the PSSUQ and CSUQ in User Experience Research and Practice", MeasuringU Press, 2019. +03: CASCADING STYLE SHEETS. Understanding CSS Grid: Grid Lines By Rachel Andrew. "In a new series, Rachel Andrew breaks down the CSS Grid Layout specification. This time, we take a look at how to use the grid lines to place items…" https://www.smashingmagazine.com/2020/01/understanding-css-grid-lines/ The Best Color Functions in CSS? By Chris Coyier. "I've said before that HSL is the best color format we have…" https://css-tricks.com/the-best-color-functions-in-css/ A Print Inspired Layout Design Using CSS Grid for Every Week of the Year By Dan Davies. "This is just a fun side project. The aim over the coming weeks is to explore some great print design and using CSS look to replicate and hopefully over time introduce new ideas and mix and match designs rather than simply just copying…" https://printtocss.dan-davies.co.uk/ CSS Pro Tip for Mac Users: Always Show Scroll Bars in macOS. By Manuel Matuzovic. "I built a quite complicated component in HTML and CSS last week and I was happy with the result. After testing in different browsers and operating systems, I realised that I had to rewrite the whole thing because I didn't consider that by default scroll bars don't take up space on macOS, but on Windows they do…" https://www.matuzo.at/blog/css-pro-tip-for-mac-users-always-show-scroll-bars-in-macos/ +04: EVALUATION & TESTING. Don't Listen to the Customers (Video) By Jakob Nielsen. "The first rule of user experience design is: don't base the product on what customers say they want. You must watch what people actually do when using your design." https://www.nngroup.com/videos/dont-listen-to-customers/ Vanity Metrics in Analytics (Video) By Aurora Harley. "Analytics for websites or other UX design projects should drive the project forward to better business success. Metrics that make you feel good may not achieve this goal." https://www.nngroup.com/videos/vanity-metrics-analytics/ Training People to do Accessibility Reviews By Beverley Newing. "…James Buller from the Accessibility and Inclusion team at Home Office helped me turn my test service into a training package that can be accessed by anyone. The service now has accompanying materials, including a worksheet and answers, so it can be used by teams as part of their own learning plans…" https://accessibility.blog.gov.uk/2020/01/14/training-people-to-do-accessibility-reviews/ Record a Goose Sighting By Beverley Newing. "…The task is to find as many of the accessibility issues in this site as you can in ~20 minutes…" https://github.com/ministryofjustice/record-a-goose-sighting +05: EVENTS. Authoring Text Alternatives for Images, Part 1: An Introduction to Theory and Methods February 4, 2020. Online https://www.accessibilityassociation.org/content.asp?admin=Y&contentid=625 Introduction to Accessibility and Universal Design February 5, 2020. Northridge, California, U.S.A. https://www.csun.edu/universal-design-center/events/introduction-accessibility-and-universal-design-4 Authoring Text Alternatives for Images, Part 2: Advanced Practice-Graphs, Diagrams, Maps, and Charts February 18, 2020. Online https://www.accessibilityassociation.org/content.asp?admin=Y&contentid=626 AIGA Design Conference March 30-April 1, 2020. Pittsburgh, Pennsylvania, U.S.A. https://designconference.aiga.org/ Advancing Research 2020 March 30-April 1, 2020. New York, New York, U.S.A. https://rosenfeldmedia.com/advancing-research-2020/ Funka Accessibility Days April 1-2, 2020. Stokholm, Sweeden https://www.funka.com/en/we-offer/funka-accessibility-days/ Web Con 2020 April 8-10, 2020. Champaign, Illinois, U.S.A. http://webcon.illinois.edu/ Technical Communication Summit May 15-18, 2020. Bellevue, Washington, U.S.A. https://summit.stc.org/ +06: HTML. How Does HTML Microdata Help With Accessibility? By Scott Vinkle. "And what are those item-something attributes for, anyway…?: https://scottvinkle.me/blogs/blog/how-html-microdata-helps-with-accessibility On HTML Belts and ARIA Braces (The Default Implicit ARIA semantics they didn't want you to know about) By Steve Faulkner. "Updated: 16th January 2020. The question of whether HTML elements need the addition of ARIA role attributes to expose their semantics, is one that surfaces on a regular basis. The answer is maybe for a subset of elements, but increasingly no…" https://html5doctor.com/on-html-belts-and-aria-braces/ 13 Link or Label By Odepax. "…It's bad practice to nest elements with activation behavior (e.g. click). Users don't expect a new page to open when they click a label. The ability to click a label provides usability and accessibility benefits (larger hit area). Place links outside the label element…" https://www.htmhell.dev/13-link-or-label/ The Deal with the Section Element By Chris Coyier. "Two articles published the exact same day…" https://css-tricks.com/the-deal-with-the-section-element/ HTML Attributes to Improve Your Users' Two Factor Authentication Experience By Phil Nash. "…In this post we have seen that with just a sprinkling of HTML attributes we can improve the login experience for our users, particularly on mobile devices…" https://dev.to/twilio/html-attributes-to-improve-your-users-two-factor-authentication-experience-h8a +07: JAVASCRIPT. How Accessibility Taught me to be Better at JavaScript - Part Two By Lindsey Kopacz. "…Today we are going over how I took some cringy 'accordion' markup and made it accessible…" https://www.a11ywithlindsey.com/blog/how-accessibility-taught-better-javascript-part-two Roles and Relationships By Sarah Higley. "…Talk to your kids about ARIA before it's too late…" https://sarahmhigley.com/writing/roles-and-relationships/ +08: MISCELLANEOUS. Firefox Now Blocks Device Fingerprinting By Default By Wendy Davis. "…Watchdogs have long raised concerns about digital fingerprinting. The standards group World Wide Web Consortium, directed by Web guru Tim Berners-Lee, warned in 2015 that digital fingerprinting -- along with other forms of tracking that are difficult for users to control -- was 'a blatant violation of the human right to privacy.'…" https://www.mediapost.com/publications/article/345440/firefox-now-blocks-device-fingerprinting-by-defaul.html Rapid Evolution of AI By Gerry McGovern. "…Driven by computing power, the pace of everything has speeded up enormously. We are using the earth's resources at unsustainable levels. We must slow down or else we will crash the earth." https://gerrymcgovern.com/rapid-evolution-of-ai/ Slow Design for an Anxious World (Video) By Jeffrey Zeldman. "…in this 60-minute video recorded live at An Event Apart DC 2019, Zeldman shows us how to create designs that deliberately slow down our visitors, helping them understand more of what our organization is communicating, and make better decisions as a result…" https://aneventapart.com/news/post/slow-design-for-an-anxious-world A Tribute to Jim Thatcher (Podcast) By Nancy and Peter Torpey. "Hosts Nancy and Peter Torpey honor the life and work of Jim Thatcher who passed away last month by reprising episode 1420 in which we interviewed Jim about his pioneering work in the development of the first screen readers and years later of the first standards for web accessibility. Thanks to Jim for his continued contributions to the field of accessibility…" http://podcast.eyesonsuccess.net/eos_2001-a-tribute-to-jim-thatcher-jan-1-2020_podcast.mp3 +09: USABILITY. Videos as Instructional Content: User Behaviors and UX Guidelines By Aurora Harley. "Instructional video content is helpful as supplementary information, though not all users will watch it. Videos should be easily discoverable, consistent in style across the site, and with thumbnails that accurately represent the type of content they provide." https://www.nngroup.com/articles/instructional-video-guidelines/ The Risks of Imitating Designs (Even from Successful Companies) By Kathryn Whitenton. "Even great companies make mistakes. Don't risk your UX by assuming it's safe to follow a design pattern just because it's used by a successful company." https://www.nngroup.com/articles/risks-imitating-designs/ [Section one ends.] ++ SECTION TWO: +10: What Can You Find at the Web Design Reference Site? Accessibility Information. https://www.d.umn.edu/itss/training/online/webdesign/accessibility.html Association Information. https://www.d.umn.edu/itss/training/online/webdesign/associations.html Book Listings. https://www.d.umn.edu/itss/training/online/webdesign/books.html Cascading Style Sheets Information. https://www.d.umn.edu/itss/training/online/webdesign/css.html Color Information. https://www.d.umn.edu/itss/training/online/webdesign/color.html Drupal Information. https://www.d.umn.edu/itss/training/online/webdesign/drupal.html Evaluation & Testing Information. https://www.d.umn.edu/itss/training/online/webdesign/testing.html Event Information. https://www.d.umn.edu/itss/training/online/webdesign/events.html HTML Information. https://www.d.umn.edu/itss/training/online/webdesign/html.html Information Architecture Information. https://www.d.umn.edu/itss/training/online/webdesign/architecture.html JavaScript Information. https://www.d.umn.edu/itss/training/online/webdesign/javascript.html Miscellaneous Web Information. https://www.d.umn.edu/itss/training/online/webdesign/misc.html Navigation Information. https://www.d.umn.edu/itss/training/online/webdesign/navigation.html PHP Information. https://www.d.umn.edu/itss/training/online/webdesign/php.html Sites & Blogs Listing. https://www.d.umn.edu/itss/training/online/webdesign/sites.html Standards, Guidelines & Pattern Information. https://www.d.umn.edu/itss/training/online/webdesign/standards.html Tool Information. https://www.d.umn.edu/itss/training/online/webdesign/tools.html Typography Information. https://www.d.umn.edu/itss/training/online/webdesign/type.html Usability Information. https://www.d.umn.edu/itss/training/online/webdesign/usability.html XML Information. https://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: https://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.]