+++ WEB DESIGN UPDATE. - Volume 22, Issue 06, August 2, 2023. 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? https://www.d.umn.edu/itss/training/online/webdesign/ New links in these categories: 01: ACCESSIBILITY. 02: BOOKS. 03: CASCADING STYLE SHEETS. 04: DRUPAL. 05: EVALUATION & TESTING. 06: EVENTS. 07: JAVASCRIPT. 08: MISCELLANEOUS. 09: NAVIGATION. 10: TOOLS. 11: USABILITY. 12: WEBWASTE & SUSTAINABILITY. SECTION TWO: 13: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. WCAG 2.1 - Improving Digital Accessibility of Web Applications: 1.4.13 and 4.1.3 By Minnesota IT Services. "…we talked with John Watne, the accessibility coordinator for Minnesota IT Services partnering with the Minnesota Department of Revenue. We asked John about beginning the work to meet WCAG 2.1. This article shares specifically about his experiences with the success criterion for: 1.4.13 Content on Hover or Focus (AA) … and 4.1.3 Status Messages (AA)…" https://mn.gov/mnit/media/blog/?id=38-584530 Updated WCAG 2 Checklist By WebAIM. "In anticipation of the imminent release of WCAG 2.2, WebAIM has made significant updates to the WCAG 2 Checklist." https://webaim.org/standards/wcag/checklist New Success Criteria in WCAG 2.2 By James Edwards. "…This article has been updated to include changes in the latest Proposed Recommendation, dated 20 July 2023…" https://www.tpgi.com/new-success-criteria-in-wcag22/ Guidance on Applying WCAG 2.2 to Non-Web Information and Communications Technologies (WCAG2ICT) Mary Jo Mueller, Chris Loiselle, and Phil Day, editors. W3C Editor's Draft 31 July 2023: "…This document, 'Guidance on Applying WCAG 2.2 to Non-Web Information and Communications Technologies (WCAG2ICT)' describes how the Web Content Accessibility Guidelines (WCAG) 2.2 [WCAG22] and its principles, guidelines, and success criteria can be applied to non-web Information and Communications Technologies (ICT), specifically to non-web documents and software. It provides informative guidance (guidance that is not normative and does not set requirements)…" https://wcag2ict.netlify.app/ Do We Need WCAG 3 (Now)? By Eric Eggert. "…WCAG 3 currently feels like a big distraction, the candy you are not allowed to have for a long time. And then you need to develop tools, and teach the standard to people, and lobby for adoption. All while WCAG 2 is there and could be improved." https://yatil.net/blog/do-we-need-wcag-3-now How to Make Your Captions and Audio Descriptions WCAG-Compliant By Jena Wallace. "With digital accessibility lawsuits on the rise, compliance with Web Content Accessibility Guidelines (WCAG) 2.1 is crucial for any organization with a web presence…" https://www.3playmedia.com/blog/wcag-2-0-requirements-for-video-captioning-and-audio-description/ The Curious Case of 'iff' and Overriding Screenreader Pronunciations By Ben Myers. "…Before reaching for a pronunciation hack, consider if it's really necessary or worth the complexity you're adding to your site, or if there are ways to rework the content or design to add clarity and avoid needing the hack in the first place. Additionally, validate assumptions…" https://benmyers.dev/blog/overriding-screenreader-pronunciations/ Should You Embed Alt Text Inside Image Metadata? By Terence Eden. "…Short answer: No. Long answer: Nooooooooooooo! What an image represents is highly context dependent…" https://shkspr.mobi/blog/2023/07/should-you-embed-alt-text-inside-image-metadata/ Toggles Suck! By Joel Holmberg. You've all seen them, tiny switches that let you toggle a setting. And maybe, just like me, you sometimes pause, thinking '…Is it on or off?' That's because toggles suck! https://axesslab.com/toggles-suck/ Accessibility Tip of the Week By CivicActions. "Remind your teams that #Section508 & #WCAG criteria are the floor from which to build inclusive experiences on, rather than the ceiling to achieve. These guidelines are minimum requirements." https://twitter.com/civicactions/status/1684549657198821376 Accessibility in Action: Indigenous Communities - Meggan Van Harten (Video) By A11y Talks. "Join Meggan from Design de Plume and discover how Indigenous accessibility diverges from general compliance principles. She'll delve into cultural considerations and Indigenous perspectives that foster inclusive solutions and help you gain valuable insight from her agency experience…" https://www.youtube.com/watch?v=gkmR6Yjx_VM The Journey Begins - Why Accessible Content Is Everyone's Responsibility (Video) By Jeff Adams and Michele Lucchini. "Conversations around digital accessibility are typically centered on organizations making their websites and apps accessible. While that is very important, it is only a part of the overall digital accessibility landscape…" https://www.youtube.com/watch?v=uDxilyM0638 I Made a Site Leveraging AI: How Accessible Was It? By Mark Steadman. "It seems like everywhere you look now AI has taken over the conversation as the top buzzword in tech…" https://dev.to/steady5063/i-made-a-site-leveraging-ai-how-accessible-was-it-4dam Oh Snap! Startling Discoveries When You Reflow Your PDF By Jessica Cavazos. "…We reported the issues we discovered with reflowing PDFs to Adobe. Adobe is currently reviewing our test documents. Our findings show that software and apps reflow PDFs in different ways. We have not yet found consistent ways to reflow all elements in a PDF. For now, we recommend including a contact phone number and email address on your PDF so readers can request alternative forms…" https://mn.gov/mnit/media/blog/?id=38-584554 ADORE: Accessibility in Digital Communication Higher Education Curricula By Funka. "How can we educate university staff on accessible digital content? How can we promote a more inclusive teaching experience for all? The ADORE project will bring accessibility to the forefront of higher education curricula related to communication…" https://www.funka.com/en/projekt/adore/ Accessibility Represents Maturity By Martin Underhill. "…I'd say that accessibility is a great measure of mature, disciplined software production. Accessibility, unfortunately, isn't even an after-thought in self-proclaimed 'move fast and break things' organisations…" https://www.tempertemper.net/blog/accessibility-represents-maturity What is the Difference between ADA and Section 508? By Kris Rivenburgh. "Although The Americans with Disabilities Act (ADA) and Section 508 of the Rehabilitation Act both protect against discrimination on the basis of disability, they are distinct laws that are completely different in scope…" https://www.digitala11y.com/what-is-the-difference-between-ada-and-section-508/ Office of Government-wide Policy Spring 2023 Section 508, Program Maturity Report (PDF) By General Services Administration. "…Large-scale automation-only testing fails to fully test webpages for all standards…" https://assets.section508.gov/files/reports/2023%20Spring%20Section%20508%20Program%20Maturity%20Report%20-%20Executive%20Summary.pdf Associate Attorney General Vanita Gupta Delivers Remarks on the Web Accessibility Notice of Proposed Rulemaking By Attorney General Vanita Gupta. "…This proposed rule would propose a specific technical standard that state and local governments would have to follow to meet their existing obligations under Title II of the ADA for web and mobile app accessibility…" https://www.justice.gov/opa/speech/associate-attorney-general-vanita-gupta-delivers-remarks-web-accessibility-notice AudioEye versus Adrian Roselli: The SLAPP Heard Around the World By Colleen Gratzer. "The web accessibility community is in an uproar about the AudioEye lawsuit against 30-year accessibility champion Adrian Roselli for his criticism of their overlay product…" https://creative-boost.com/audioeye-vs-adrian-roselli/ Accessibility Legislation & Regulation Roundup - A LOT Happened in Just July By Matthew Luken. "Here are some of the things my colleagues and I are monitoring for you right now and our take on what they mean to you or your business…" https://www.deque.com/blog/accessibility-legislation-regulation-roundup-july-2023/ +02: BOOKS. * Meiert, Jens Oliver. "The Web Development Glossary", Frontend Dogma, 2023. https://meiert.com/en/blog/the-web-development-glossary-3k/ +03: CASCADING STYLE SHEETS. CSS And Accessibility: Inclusion Through User Choice By Carie Fisher. "It is challenging to accurately understand the preferences of over 7.8 billion people at any given time. Supporting the needs of individuals with disabilities and assistive technology adds a layer of complexity to an already complex situation. One promising solution is user-focused CSS media features that allow us to customize the user experience and cater to individual preferences. In this article, Carie Fisher outlines which CSS media features are available for detecting user preferences and how they are used to design and build more inclusive user experiences…" https://www.smashingmagazine.com/2023/08/css-accessibility-inclusion-user-choice/ How to Use CSS aspect-ratio By Ralph Mason. "There are times when we really need to maintain a specific ratio between the width and height of responsive elements on a web page. This has been possible for a long time via various CSS tricks. The CSS aspect-ratio property is a game changer, meaning we can now specify the aspect ratio of an element in a single line of code. Let's look at how to use aspect-ratio…" https://www.sitepoint.com/css-aspect-ratio/ How To Define An Array Of Colors With CSS By Temani Afif. "Join Temani Afif on experiment with modern CSS features to create an array of colors. The goal is to define a comma-separated list of colors and iterate through them using an index." https://www.smashingmagazine.com/2023/07/define-array-colors-css/ The New @font-face Syntax By Ollie Williams. "The new @font-face syntax has also been supported since Safari 17, Firefox 106 and Chrome 108…" https://fullystacked.net/posts/new-font-face-syntax/ +04: COLOR. Applying APCA and Huetone for Color Accessibility of User Interfaces By Kirill Ulitin. "…This paper provides information about practical application of the APCA and Huetone color tools…" https://link.springer.com/chapter/10.1007/978-3-031-35992-7_53 +05: EVALUATION & TESTING. Usability Testing with Users' Personal Information (Video) By Megan Chan. "Usability Testing benefits from using participants' personal information, but asking for this requires preparation and consideration." https://www.nngroup.com/videos/users-real-data/ Sample Sizes for Comparing Rating Scales to a Benchmark By Jeff Sauro and Jim Lewis. "…In this article, we use the analysis of those historical standard deviations to guide sample size estimation for comparisons with benchmark values when the primary outcome measure is the mean of an individual rating scale (e.g., five- or seven-point item) or a multi-item questionnaire…" https://measuringu.com/sample-sizes-for-rating-scale-benchmark-comparisons/ +06: EVENTS. Benchmark Your Accessibility and Usability Testing with the Accessibility Usability Scale (AUS) August 17, 2023. Online https://a11ytalks.com/posts/2023-AUG/ Advance Your Return on Accessibility (ROA) with Testing August 29, 2023. Online https://www.tpgi.com/webinar-august-29-at-12pm-et-advance-your-return-on-accessibility-roa-with-testing/ ffconf November 10, 2023. Brighton, England, United Kingdom https://2023.ffconf.org/ +07: JAVASCRIPT. The Virtual Keyboard API By Ahmad Shadeed. "Have you come across an issue where there is a fixed element on mobile, and when the keyboard is activated, that element will be hidden underneath the keyboard? This has been a default behavior on the web for years. In this article, we'll explore the problem, why it happens, and how we can solve it today with the virtual keyboard API…" https://ishadeed.com/article/virtual-keyboard-api/ WTF Is the Lean Web, Anyways? By Chris Ferdinandi. "…The Lean Web is an approach to web development that focuses on fast, resilient experiences that work for everyone. It's not a tech stack…" https://gomakethings.com/wtf-is-the-lean-web-anyways/ +08: MISCELLANEOUS. Deafblind Lawyer Haben Girma: It's Important to Think about Accessibility All Year By Angelica Arnold. "Haben Girma, the first Deafblind person to graduate from Harvard Law School, advocates for people to celebrate her community and take action for accessibility for more than a month…" https://uk.sports.yahoo.com/news/deafblind-lawyer-haben-girma-its-important-to-think-about-accessibility-all-year-150633494.html When the Wizards of the Web Met By Jay Hoffmann. "On July 28, 1993, a group of web pioneers met in a small room for a few days. For many, it was the first time they had ever met…" https://thehistoryoftheweb.com/postscript/when-the-wizards-of-the-web-met/ +09: NAVIGATION. Accessible Components: The Breadcrumb Navigation By Rocío Alvarado. "…the visual pattern called the 'breadcrumb' or 'breadcrumb trail' allows users to keep track of their present location in relation to the website's architecture and navigate through the parent pages. In other words, it displays the page's hierarchy and helps users find their way home…" https://www.linkedin.com/pulse/accessible-components-breadcrumb-navigation-roc%25C3%25ADo-alvarado/ +10: TOOLS. Contrast Checker Bookmarklet By WebAIM. "This bookmarklet will display a miniature version of WebAIM's popular Contrast Checker in any web page. By using the eyedropper tool in the color picker tools, you can readily check the contrast of any page content." https://webaim.org/resources/contrastchecker/bookmarklet +11: USABILITY. Clutter-Free Charts (Video) By Kate Moran. "Clear out chartjunk (unnecessary visual elements) for a more minimalist and understandable data visualization." https://www.nngroup.com/videos/chartjunk/ Accordions on Desktop: When and How to Use By Huei-Hsin Wang. "Accordions simplify long pages, but reduce visibility and increase interaction cost. Use them on content-heavy pages where users don't need to combine information across sections." https://www.nngroup.com/articles/accordions-on-desktop/ 'AI' Content and User Centered Design By Hidde de Vries. "…when organisations force LLM-output on users instead of paying people to create their content, they don't center users…" https://hidde.blog/llms-user-centered/ We Deleted More Than 5,000 Pages From Our College Website. Here's Why. By Mordecai I. Brownlee. "…As educators, how can we possibly expect to increase our enrollments, promote the mission of our institutions, effectively communicate our academic offerings, and engage prospective (and current) college students inclusively with college websites that function more like online file cabinets…" https://www.edsurge.com/news/2023-07-20-we-deleted-more-than-5-000-pages-from-our-college-website-here-s-why What is Lean UX? By Rachel Krause. "Lean UX is a collaborative, crossfunctional design approach that establishes the true nature of a product in a fast, user-centered way." https://www.nngroup.com/videos/lean-ux/ Accessibility of the Button: Should We Fix It or the Root Cause Problem? By Matthew Luken. "…let's agree that accessibility is rooted in usability… I suggested an alternate approach-establishing a common understanding of the real problem to be solved… I suggested using the fishbone diagram technique… " https://www.deque.com/blog/accessibility-of-the-button-should-we-fix-it-or-the-root-cause-problem/ +12: WEBWASTE & SUSTAINABILITY. Technology Will Not Solve the Climate Crisis By Gerry McGovern. "…We must massively reduce our consumption of energy and materials…" https://mastodon.social/@gerrymcgovern@mastodon.green/110790275486067835 Bright Green Lies, with Max Wilbert | How The Environmental Movement Lost Its Way (Video) By Hart Hagan. "…My guest is Max Wilbert who, along with co-authors Lierre Keith and Derrick Jensen, wrote the book 'Bright Green Lies, How the Environmental Movement Lost Its Way and What We Can Do About It'…" https://www.youtube.com/watch?v=KLh2Fe9SP94 [Section one ends.] ++ SECTION TWO: +13: 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 WebWaste & Sustainability Information. https://www.d.umn.edu/itss/training/online/webdesign/webwaste.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.]