+++ WEB DESIGN UPDATE. - Volume 22, Issue 22, November 21, 2023. An email newsletter to distribute news and information about web design and development. ++ISSUE 22 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: EVALUATION & TESTING. 04: EVENTS. 05: HTML. 06: MISCELLANEOUS. 07: TOOLS. 08: USABILITY. 09: WEBWASTE & SUSTAINABILITY. SECTION TWO: 10: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Why Doesn't AI Work for Producing Accessible Code? By Alastair Campbell. @alastc@toot.cafe "The short answer to the title is: Accessibility is not an average. For a longer answer, read on…" https://alastairc.uk/2023/11/why-doesnt-ai-work-for-producing-accessible-code/ Exclusive Accordions Exclude By Eric Eggert. @yatil@yatil.social "You might not have noticed it, mainly because it was so quick, but a new HTML functionality is due to arrive in Chromium and WebKit browsers: Exclusive Accordions…" https://yatil.net/blog/exclusive-accordions Demystifying Accessible Design - How to Apply WCAG 2.2 (Video) By Jason Taylor and Luca Boskin. "What are the newest WCAG guidelines? Join us as we discuss what the new WCAG 2.2 Success Criteria mean and provide real-world examples of the criteria in action…" https://www.youtube.com/watch?v=u__sHV6xHZ4 WCAG 2.2 At A Glance - 2.4.13 Focus Appearance (Level AAA) (Video) By Intopia. @intopia@mastodon.social "As a part of our WCAG 2.2 At A Glance series, we delve into success criteria 2.4.13 Focus Appearance…" https://www.youtube.com/watch?v=zdhpcyvAMvA A11y Diaries: Evolution of Visible Focus (Video) By Fahad Lambate. "Imagine you're all set out to buy groceries online and can browse through the product catalog, and read the payment, shipping, and return policies on offer but can't figure out where is your cursor on the site. Isn't it frustrating? The question comes to mind: How on earth am I supposed to choose the required products and make the payment?…" https://www.youtube.com/watch?v=m5Zt8DMKdQE&t=101 Testing for Web & Mobile Accessibility Using a Screen Magnifier (Video) By Priti Rohra. "Screen magnifiers are used by people with low vision and the challenges they face on the web and mobile are often overlooked. When we talk about digital accessibility, the focus is largely on screen reader compatibility for people with visual impairments. Not all visually impaired users are screen reader users…" https://www.youtube.com/watch?v=yPGeiYzk6bg&t=95s Using Chrome's Accessibility Tree for Manual Testing of HTML and ARIA (Video) By Russ Weakley. "This presentation will begin by demonstrating how the accessibility tree can be used to review the name, role, state and value of any HTML element. We will then dive into the accessibility tree's battle for accessible names and descriptions. We will also explore how ARIA can affect the tree, for good or evil…" https://www.youtube.com/watch?v=3zzOBb1Gd5Y&t=95s Name/Role/Value - Whose Role Is It Anyway? By Matthew Luken. @dequesystems@mstdn.social "…Today, I'm sharing a client story with the hope that y'all will focus on thinking about WHY you should do things differently so that your program can rapidly mature and scale quickly…" https://www.deque.com/blog/name-role-value-design/ Understanding SC 2.5.7 Dragging Movements By Raghavendra Satish Peri. "The intent of this success criterion is to ensure that functionalities such as drag and drop are made accessible to users with motor disabilities…" https://www.digitala11y.com/understanding-sc-2-5-7-dragging-movements/ Formstack, Autocomplete and Accessibility By Bruce Lawson. @brucelawson@vivaldi.net "If you find filling in forms boring, you won't believe how boring coding them can be. And then you have to do something with the submissions, decide on how to archive them, their GDPR liabilities etc. No wonder so many organisations go looking for third party solutions.…" https://brucelawson.co.uk/2023/formstack-autocomplete-and-accessibility/ The True Cost of Not Prioritizing Accessibility: Avoid Risk and Maximize Product ROI By David Sloan. "…Understanding the ROI - or loss potential - of digital accessibility practices comes down to two separate conversations. The first: embracing accessibility in the first place to mitigate lawsuits, reach a vast and often untapped market, and increase brand loyalty and perception. The second: the cost savings of shifting left or moving accessibility into the early stages of your SDLC…" https://www.tpgi.com/the-true-cost-of-not-prioritizing-accessibility/ Chatbot Accessibility Playbook By Mitre. "The Developer, Designer and the Product Owner are responsible for creating the interface which allows users to perceive and communicate with the chatbot. …" https://mitre.github.io/chatbot-accessibility-playbook/docs/4_3.html Justice Department Finds Oklahoma Mobile App Inaccessible to People with Vision Disabilities By Justice Department. "The Justice Department announced today its findings that Service Oklahoma violated Title II of the Americans with Disabilities Act (ADA) by maintaining a mobile application that is inaccessible to individuals with vision disabilities…" https://www.justice.gov/opa/pr/justice-department-finds-oklahoma-mobile-app-inaccessible-people-vision-disabilities +02: CASCADING STYLE SHEETS. Getting Started with CSS Container Queries By Michelle Barker. @michelle@front-end.social "As of this year, container queries are supported in all major browsers. But what are they, and how can we use them to build more robust, flexible layouts? Do we still need media queries? Let's find out…" https://developer.mozilla.org/en-US/blog/getting-started-with-css-container-queries/ CSS Nesting By Ahmad Shadeed. @shadeed9@front-end.social "…In this article, I will document what I learned so far about CSS nesting and share my findings with you, along with use cases and examples…" https://ishadeed.com/article/css-nesting/ HUG CSS, How I Approach CSS Architecture By Chris Ferdinandi. @cferdinandi@mastodon.social "…Today, I wanted to talk about how I approach CSS architecture in my own projects…" https://gomakethings.com/hug-css-how-i-approach-css-architecture/ Cascade Layers, CSS Functions, and More (Podcast) By Miriam Suzanne. @oddbird@front-end.social "I drop by the show to talk about CSS updates and news on container queries, rolling out cascade layers, !important things to remember, custom properties, exit animations, CSS functions, state queries, and more.…" https://www.oddbird.net/2023/11/14/shop-talk23/ +03: EVALUATION & TESTING. Always Do a Pilot Test (Video) By Kim Salazar. "Running a pilot test for a user research study enables you to assess the study's effectiveness and avoid common problems in the main study." https://www.nngroup.com/videos/pilot-test/ Dot Voting: 3 Common Problems (Video) By Kate Kaplan. "Dot-voting activities are prone to 3 common pitfalls: choice overload, choice imbalance, and social bias. Smart planning can help you avoid them…" https://www.nngroup.com/videos/dot-voting-problems/ Some Thoughts About Surveys - Talk for Students at Olin College of Engineering By Caroline Jarrett. @Cjforms@mastodon.social "It was such a pleasure to spend time with students at Olin College, and their tutor Sarah Bloomer, talking about surveys…" https://www.effortmark.co.uk/some-thoughts-about-better-surveys/ Sample Sizes for Comparing Rating Scale Means By Jeff Sauro and Jim Lewis. "…In this article, we'll use the same standard deviations from our large dataset of 100,000 individual rating scale responses and numerous standardized UX questionnaires to compute the sample size when comparing individual rating scales (e.g., five- or seven-point items) or multi-item questionnaires: comparison of two means collected from the same people (within-subjects) and comparison of two means collected from different groups of people (between-subjects)…" https://measuringu.com/sample-sizes-for-rating-scale-comparisons/ +04: EVENTS. Championing Inclusivity with the GAAD Foundation November 28, 2023. Online https://go.3playmedia.com/wbnr-11-28-2023-gaad-foundation The State of Digital Accessibility: 2023 Insights and Action Items for 2024 December 6, 2023. Online https://www.levelaccess.com/earesources/webinar-the-fifth-annual-state-of-digital-accessibility-report-key-takeaways-for-2024/ 2023 Digital Accessibility Legal Update with Lainey Feingold @LFLegal@mastodon.social November 30 and December 7, 2023. Online https://go.3playmedia.com/wbnr-11-30-2023-legal-update OZeWAI Ask the Professional December 4, 2023. Online https://events.humanitix.com/ozewai-online-event-ask-the-professionals-4-december-2023 San Diego Accessibility and Inclusive Design December Meetup December 12, 2023. San Diego, California U.S.A. https://www.meetup.com/a11ysd/events/297414144/ Inclusive India: Digital First December 14, 2023. New Delhi, India https://newzhook.com/inclusive/ +05: HTML. HTML Web Components: An Example By Jim Nielsen. @jimniels@mastodon.social "…There are different ways to use web components. One way of using them requires JavaScript in order for them to 'run' and display anything in the browser. An alternate way of using them allows you to display information/content in the browser before any JavaScript executes, and then you use web component structured JavaScript[1] to enhance what's already on display. In an attempt to explain this more, let's use an simplified example…" https://blog.jim-nielsen.com/2023/html-web-components-an-example/ HTML Web Components are Just JavaScript? By Miriam Suzanne. @OddBird@front-end.social "I'm still getting used to this…" https://www.oddbird.net/2023/11/17/components/ +06: MISCELLANEOUS. Two Gaps and Three Pillars By Matt May. mattmay@mstdn.social "A lot of companies are doing DEI work wrong. And a lot of people are being left behind as a result…" https://buttondown.email/practicaltips/archive/two-gaps-and-three-pillars/ Digital Accessibility Podcasts By Ricky Onsman. @onsman@aus.social "You've subscribed to the newsletters and RSS feeds, you've expanded your library, but what about digital accessibility podcasts?…" https://www.tpgi.com/digital-accessibility-podcasts/ An Autoethnographic Case Study of Generative Artificial Intelligence's Utility for Accessibility By Kate S Glazko, Momona Yamagami, Aashaka Desai, Kelly Avery Mack, Venkatesh Potluri, Xuhai Xu, Jennifer Mankoff. "…Our work demonstrates the potential for GAI today to be used by people with disabilities to provide on-demand support for their accessibility needs, in low-stakes, easily verifiable contexts. Unsurprisingly, some of the limitations we encountered reflect GAI's current ability to parrot [5] information without truly integrating it. This can explain why it struggled, for example, to translate accessibility guidelines into documents consistently… our work also uncovered problems that require directed ongoing attention to fix, such as ableist errors; accessible and complementary approaches to verification; and better training data. The subtleties of some of these errors raise questions about how and whether it is possible to address, or even detect them automatically…" https://dl.acm.org/doi/fullHtml/10.1145/3597638.3614548 +07: TOOLS. [Work In Progress]: Vosh - A Third-Party Screen-Reader for the Macintosh By João Santos. "After getting fed up with the general neglect of MacOS accessibility from Apple, and having wanted to work on something meaningful for quite some time, I decided to attempt something that for some reason nobody seems to have tried to do before: write a completely new screen-reader for that platform…" https://www.applevis.com/forum/app-development-programming/work-progress-vosh-third-party-screen-reader-macintosh +08: USABILITY. 5 Formatting Techniques for Long-Form Content By Huei-Hsin Wang and Megan Chan. "Techniques like summaries, bullet points, callouts, bolding, and helpful visuals improve comprehension and engagement with content exceeding 1,000 words." https://www.nngroup.com/articles/formatting-long-form-content/ +09: WEBWASTE & SUSTAINABILITY. Lessons from Lille: Sustainability and DrupalCon By Mike Gifford. @mgifford@mastodon.social "…There is a growing awareness in the Drupal community that we have a pivotal role to play with environmental responsibility. With Drupal delivering 2% of the web, we have a measurable impact on the climate…" https://medium.com/civicactions/lessons-from-lille-sustainability-and-drupalcon-a2f86ed8e053 Why Digital Isn't Always Greener or Fairer By Ayala Gordon. "Over the past few years, and especially since the global pandemic where many physical activities have moved online, it has become more important than ever to ask ourselves how to make our web services more energy efficient and reduce their carbon footprint…" https://www.southampton.ac.uk/blog/digitalteam/2021/03/03/why-digital-isnt-always-greener-or-fairer/ [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 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.]