+++ WEB DESIGN UPDATE. - Volume 18, Issue 48, May 28, 2020. An email newsletter to distribute news and information about web design and development. ++ISSUE 48 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: CASCADING STYLE SHEETS. 03: COLOR. 04: EVENTS. 05: HTML. 06: INFORMATION ARCHITECTURE. 07: JAVASCRIPT. 08: MISCELLANEOUS. 09: NAVIGATION. 10: TOOLS. 11: USABILITY. SECTION TWO: 12: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Disclosure Widgets By Adrian Roselli. "…A disclosure widget is a simple control whose sole purpose is to hide or show stuff. Using the native control should be limited to simple content. The ARIA pattern can be extended to behave as richer controls. No matter what, always test." https://adrianroselli.com/2020/05/disclosure-widgets.html Embedded YouTube and Google Maps - Are They Accessible? By Matthew Putland. "…we'll be ignoring content-based issues such as captioning and audio description, and instead inspecting the accessibility of the YouTube player and Google Map itself. We've tested both against the WCAG 2.1 level 'AA' guideline to see where both of these commonly embedded tools stand…" https://www.visionaustralia.org/services/digital-access/blog/embedded-youtube-and-google-maps Online Conferences and Automatic Transcripts By Kim Patch. "…A transcript with a few wrong words is good enough to be trouble… we need to rethink spellcheck for speech recognition. I think there's a simple way to make correcting automatic transcriptions more practical and efficient. Get the computer to mark words that are commonly misrecognized by automatic speech transcription. Can/can't and does/doesn't would be on that list. Write a note at the top of the file saying 'This document has been automatically transcribed by computer. The computer has also marked words that are easily misrecognized by a computer.'…" http://patchontech.com/2020/05/22/online-conferences-and-automatic-transcripts/ Create Live Subtitles/Captions Using PowerPoint By Amy Wolfe. "Use the program PowerPoint to create live subtitles and translations for your lectures…" https://guides.cuny.edu/accessibility/trainingtutorials#s-lg-box-wrapper-28165869 Understanding SC 2.1.4 Character Key Shortcuts By Raghavendra Satish Peri. "…The intent of this success criterion is to provide the user with full control on how these character key shortcuts [single key events] can be managed. The SC has provided 3 specific guidelines to pass this success criterion…" https://www.digitala11y.com/?p=5296 Setting Priorities for Accessibility Issues By Luis Garcia. "…I'll share that strategy, making setting priorities easier and more consistent for you and your team…" https://blogs.intuit.com/blog/2020/05/19/setting-priorities-for-accessibility-issues/ This is an Accessibility Emergency! By Lucy Greco. "…In the past few months, we have all had to take a closer look at the way we interact with others. What we are finding is that people with disabilities have been disproportionately impacted by these changes…" http://accessaces.com/2020/05/21/this-is-an-accessibility-emergency/ Accessibility Is Delicious: Food Analogies For Digital Inclusion By Lainey Feingold. "For many years, I (and many others) have said that organizations need to 'bake' accessibility into their culture and DNA…" https://www.lflegal.com/2020/05/accessibility-is-delicious/ Striving to Improve Digitally By Rebecca Oestreich. "The Journey to a More Accessible Website…" http://mn.gov/mnit/media/blog/index.jsp?id=38-432786 The State of Digital Accessibility 2020 By Level Access. "The State of Digital Accessibility Report 2020 by Level Access, G3ict, and IAAP, draws on the data gathered in the State of Digital Accessibility Survey to provide insights into overall trends in the industry and the digital accessibility programs of organizations large and small…" https://g3ict.org/publication/the-state-of-digital-accessibility-2020 2020 State of Accessibility Report (Video) By Joe Devon, Jennison Asuncion, Matt King, Jared Smith, and Sharron Rush. "Each year Diamond issues the State of Accessibility Report. Written with the digital community in mind, the SOAR report identifies specific accessibility deficiencies of top websites and includes a list of actionable steps developers can take to address accessibility issues now. Join GAAD Co-Founders along with other accessibility experts as they celebrate GAAD and discuss this year's findings…" https://www.youtube.com/watch?v=z0-jG8ckxyc 2020 State of Accessibility Report InfoGraphic (PDF): https://pages.diamond.la/hubfs/SOAR_Poster_Final%20FINAL-ua.pdf Mobile Assistive Technology Overview (Video) By Shannon George. Speakers: Jonathan Avila and Meaghan Roper. "In recognition of Global Accessibility Awareness Day (GAAD), Level Access hosted this session to help raise awareness and understanding of how people with disabilities use and interact with technology…" https://www.levelaccess.com/mobile-assistive-technology-overview/ Accessibility Fundamentals By Microsoft Accessibility. "We are pleased to share that you can now earn your Accessibility in Action badge by completing the Accessibility Fundamentals Learning Path…" https://docs.microsoft.com/en-us/learn/paths/accessibility-fundamentals/ Adobe's Inclusive Design Training Program By Matt May and Rakesh Paladugula, Adobe Inclusive Design. "We're releasing our full set of training materials in June. It includes slides, readings, and a teacher's guide with practical exercises to help demonstrate the benefits of a more inclusive design process. Sign up for updates and to be notified when it's available…" https://adobe.design/inclusive/ Announcing the First Annual Thatcher Prize By Knowbility. "…Nominations are now open for the 2021 award…" https://knowbility.org/jim-thatcher/prize/ +02: CASCADING STYLE SHEETS. Here's What I Didn't Know About 'Content' By Manuel Matuzović. "This is part 3 of my series Here's what I didn't know about… in which I try to learn new things about CSS. This time I'm trying to find out what I didn't know about the content property…" https://www.matuzo.at/blog/heres-what-i-didnt-know-about-content/ Flexbox30 By Samantha Ming. "Learn Flexbox with 30 Code Tidbits…" https://www.samanthaming.com/flexbox30/ +03: COLOR. Figure It Out By Stephen Anderson and Karl Fast. "How much do you really know about color? In this excerpt from Figure It Out, Stephen Anderson and Karl Fast dive deep into the science around color, cultural aspects of how color is perceived, and how our thoughts on color have evolved over time." https://alistapart.com/article/figure-it-out/ Supporting Windows High Contrast Mode By Sarah Higley. "Windows High Contrast Mode behavior can be a bit of a surprise if you haven't already spent time studying its ways…" https://sarahmhigley.com/writing/whcm-quick-tips/ +04: EVENTS. The 2020 Digital Accessibility Legal Summit June 2, 4, 9, and 11, 2020. Online https://www.accessibility.legal/Program.html Quick Start to Captioning June 4, 2020. Online https://go.3playmedia.com/wbn-qsc Professional Testers with Disabilities June 9, 2020. Online https://www.meetup.com/a11ychi/events/270711946/ Online Together June 15, 2020. Online https://aneventapart.com/event/online-0620 The Saga of Accessible Colors June 16, 2020. Online https://www.maxability.co.in/2020/05/12/maxability-webinar-the-saga-of-accessible-colors/ Quick Start to Interactive Transcripts June 18, 2020. Online https://go.3playmedia.com/wbnr-06-18-2020-interactive-transcript A Stay-At-Home Conference June 22-26, 2020. Online https://2020.sofaconf.com/ +05: HTMLMaps. Close Buttons By Manuel Matuzović. "This first HTMHell special inspects one of the most complicated and most controversial patterns in front-end development: the close button…" https://www.htmhell.dev/20-close-buttons/ A Guide to the Responsive Images Syntax in HTML By Chris Coyier. "This guide is about the HTML syntax for responsive images (and a little bit of CSS for good measure). We'll go over srcset and , plus a whole bunch of things to consider to help you get the best performance and design control from your images…" https://css-tricks.com/a-guide-to-the-responsive-images-syntax-in-html/ +06: INFORMATION ARCHITECTURE. Finalizing a Classification for COVID-19 By Gerry McGovern. "Here's the classification we tested in round two…" https://gerrymcgovern.com/finalizing-a-classification-for-covid-19/ +07: JAVASCRIPT. Today's Javascript, From an Outsider's Perspective By Lea Verou. "Today I tried to help a friend who is a great computer scientist, but not a JS person use a JS module he found on Github…John is a computer scientist that knows a fair bit about the Web: He had Node & npm installed, he knew what MIME types are, he could start a localhost when needed. What hope do actual novices have?…John gives up. Concludes never to touch Node, npm, or ES6 modules with a barge pole…" http://lea.verou.me/2020/05/todays-javascript-from-an-outsiders-perspective/ +08: MISCELLANEOUS. Responsive Web Design Turns Ten By Ethan Marcotte. "Hey, here's a thing that's fun to say. Happy tenth birthday, responsive web design…" https://ethanmarcotte.com/wrote/responsive-design-at-10/ +09: NAVIGATION. Block Links: The Search for a Perfect Solution By Vikas Parashar. "I was reading this article by Chris where he talks about block links — you know, like wrapping an entire card element inside an anchor — being a bad idea. It's bad accessibility because of how it affects screen readers. And it's bad UX because it prevents simple user tasks, like selecting text. But maybe there's something else at play.…" https://css-tricks.com/block-links-the-search-for-a-perfect-solution/ +10: TOOLS. Sa11y Accessibility Quality Assurance Assistant By Adam Chaboryk et al, Ryerson University. "Sa11y is an accessibility quality assurance tool that visually highlights common accessibility and usability issues. Geared towards content authors, Sa11y indicates errors or warnings at the source with a simple tooltip on how to fix…" https://ryersondmp.github.io/sa11y/ +11: USABILITY. How to Improve Your Content with Writing Apps By Deborah Edwards-Onoro. "…My workflow has changed over time. Read on to discover what I used to do, what I've overlooked, and what I found to help me improve my writing…" https://www.lireo.com/how-to-improve-your-content-with-writing-apps/ Creating a Usable Kiosk Experience for Customers with Disabilities By Rachael Bradley Montgomery. "…This post focuses on kiosk usability, pulling from the available guidelines and best practices for kiosks…" https://developer.paciellogroup.com/blog/2020/05/creating-a-usable-kiosk-experience-for-customers-with-disabilities/ Dark Patterns and Design Policy By Caroline Sinders. "UX designers cannot translate tech regulation on their own…In 2019, ProPublica reported that Turbo Tax suppressed its free version, tricking people into paying to file their taxes. That same year, Princeton University launched a project that discovered over a thousand different instances of similar 'tricks' that were implemented across e-commerce websites. These are what Designer Harry Brignull calls 'dark patterns'…" https://points.datasociety.net/dark-patterns-and-design-policy-75d1a71fbda5 User-Centered Design And Design Thinking: Different Origins, Similar Practices By Jim Lewis and Jeff Sauro. "…User-Centered Design and Design Thinking are methods used to produce initial designs, after which they typically use iteration to improve the design. Here's more on these two methodologies, which have different origins but share similar practices…" https://measuringu.com/ucd-and-design-thinking/ Design Principles 101 (Video) By Maria Rosala. "Design principles are value statements that guide designers in making the right tradeoff-type decisions in UX design contexts." https://www.nngroup.com/videos/design-principles-101/ Different Information-Seeking Tasks: Behavior Patterns and User Expectations By Feifei Liu. "Simple fact-finding tasks were less memorable, with basic user expectations like plain language. Complex research tasks required more effort; users asked for advanced features including comparison tables and chunked content for these tasks. https://www.nngroup.com/articles/information-seeking-expectations/ Firm Rules and Goals for UX vs. Balancing Goals (Video) By Jakob Nielsen. "To what extent do we have unwavering goals and definitive answers for user experience work? When can (or should) we compromise the design?" https://www.nngroup.com/videos/firm-rules-ux-vs-balancing-goals/ Biggest Wins and Fails in 25 Years of UX Columns By Jakob Nielsen. "From 1995 to 2001 Jakob Nielsen wrote 250 articles with early usability insights that are still true but also contained predictions for aspirational changes that didn't happen." https://www.nngroup.com/articles/25-years-ux-wins-fails/ [Section one ends.] ++ SECTION TWO: +12: 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.]