+++ WEB DESIGN UPDATE. - Volume 23, Issue 03, July 17, 2024. An email newsletter to distribute news and information about web design and development. ++ISSUE 03 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. 07: JAVASCRIPT. 08: TOOLS. 09: USABILITY.. 10: WEBWASTE & SUSTAINABILITY. SECTION TWO: 11: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Peaky WCAG (Level AA) Bang for Your App A11y Buck By Steve Faulkner. "Does WCAG 2.2 Level AA apply to Native apps? Yes, mostly…" https://html5accessibility.com/stuff/2024/07/09/peaky-wcag-level-aa-bang-for-your-app-a11y-buck/ A Quick-ish Accessibility Review: shadcn/ui Charts By Ashlee M Boyer. "…In my quick-ish testing, I found multiple critical accessibility issues with the Chart component. The "keyboard access" claim in the documentation is mostly accurate. The "screen reader support" claim is false. No information is presented about the data by a screen reader when using the left or right arrow keys to navigate the charts.…" https://ashleemboyer.com/blog/a-quick-ish-accessibility-review-shadcn-ui-charts Beyond Basic Alt Text - Charts, Maps, and Diagrams By Tammy Albee. "For people who cannot see images contained within a website or document, a text alternative ("alt-text") describing images is required. Repetitive logos and decorative elements such as watermarks can be artifacted and not given alt text. Learn strategic ways to simplify alt-text for complex images, charts, and maps…" https://equidox.co/blog/beyond-basic-alt-text-charts-maps-and-diagrams/ Going with the PDF Reflow By Ricky Onsman. "…TPGi's advice to web authors, via our accessibility engineers, auditors and product managers, is that they must check that the PDF content they provide displays correctly when a user turns on Reflow…the best advice is to convert all PDF documents on the web to a more accessible format like HTML." https://www.tpgi.com/going-with-the-pdf-reflow/ Do Not Copy Web Design to Mobile Applications or Risk Accessibility Issues By Bogdan Cerovac. "Sometimes I see complex web components copied to native mobile applications and often they are the cause of accessibility issues…" https://cerovac.com/a11y/2024/07/do-not-copy-web-design-to-mobile-applications-or-risk-accessibility-issues/ How to Check and Document Design Accessibility in Your Mockups By Stéphanie Walter. "Save time documenting accessibility in Figma mockups with practical tips and a list of selected tools, plugins, and templates! In this article, I will cover color usage, contrast ratios, text resizing, font legibility, target sizes, form elements, focus order, complex components keyboard interactions, skip links, headings, landmarks, and alternative text for images…" https://stephaniewalter.design/blog/how-to-check-and-document-design-accessibility-in-your-figma-mockups/ Navigating the Accessibility Challenges of LinkedIn Carousels By Naomi Saines and Tess Hutley. "Despite their popularity, LinkedIn carousels present significant accessibility challenges that cannot be overlooked…" https://intopia.digital/articles/navigating-the-accessibility-challenges-of-linkedin-carousels/ Accessibility Academy: Interactive Learning of the WCAG 2.1 Web Accessibility Guidelines By Themistoklis Chatziemmanouil and Christos Katsanos. "…A study involving 79 computer science students found that the Accessibility Academy has a high level of perceived educational experience and usability. Qualitative insights on its strengths and future improvements are also presented…" https://ieeexplore.ieee.org/abstract/document/10578915 The True Cost of Not Prioritizing Accessibility: Avoid Risk and Maximize Product ROI By David Sloan. "…if a bug is found in the requirements-gathering phase, the cost could be $100. If the product owner doesn't find that bug until the QA testing phase, then the cost could be $1,500. If it's not found until production, the cost could be $10,000. And if the bug is never found, it could be secretly costing the company money, and no one could be the wiser…" https://www.productledalliance.com/the-true-cost-of-not-prioritizing-accessibility/ Call for Abstracts: DDNJ Special Issue By Utah State University. "…In general, we are looking for articles that demonstrate what works! We want to publish articles that have clear implications for enhancing engagement and partnerships, research, policy, and practice. Abstracts and final articles should reflect a commitment to high quality research methods and ethics…" https://idrpp.usu.edu/blog/2024/call-for-abstracts-ddnj-special-issue DDNJ Call for Abstract (PDF): https://usu.app.box.com/s/67vhlkk726fmtcfeotkvvp0wcp8z3ifz New Class Action Lawsuit against AccessiBe Overlay Company Sued for Breach of Contract, Breach of the Covenant of Good Faith and Fair Dealing +++ By Lainey Feingold. "This article is about a lawsuit filed against a company that sells overlays. The company is called AccessiBe. An overlay is a type of software that promises to make websites accessible. The lawsuit was filed by a small business that licensed the AccessiBe overlay (also called a widget) for its website. The small business still got sued by a blind person who said the website was not accessible. The small business' lawsuit says that AccessiBe violated the law by claiming that its product makes websites accessible and compliant with the Americans with Disabilities Act. The next thing that will happen is that AccessiBe will respond to the lawsuit. Lainey has written and spoken about problems with overlays for several years. This article has been updated once to add the names of the lawyers handling the case. This article will be further updated with any developments in the lawsuit.…" https://www.lflegal.com/2024/07/accessibe-class-action/ AccessiBe Lawsuit Claims AI Web Accessibility Software Can't Ensure ADA Compliance as Advertised By Kelly Mehorter. "A class action alleges accessiBe has falsely advertised its software products as capable of making a website fully compliant with ADA standards for online accessibility…" https://www.classaction.org/news/accessibe-lawsuit-claims-ai-web-accessibility-software-cant-ensure-ada-compliance-as-advertised +02: CASCADING STYLE SHEETS. Zoom, Zoom, and Zoom By Miriam Suzanne. "…In brief: there is wide support for three different types of 'zoom' - available both to site visitors and (to some extent) CSS authors…" https://www.oddbird.net/2024/07/09/zoomies/ The 3 Types of CSS Utility Classes By James Kerr. "…I have noticed three categories of classes emerging from the stylesheet. * Aesthetic classes * Layout classes * Spacing classes…" https://www.jameskerr.blog/posts/3-types-of-css-utility-classes/ +03: EVALUATION & TESTING. How to Recruit and Screen for Accessibility Research By Fable. "…In this article, we'll cover a background on what screeners are, the impact they have on accessibility research and how to make sure you are setting yourself up to collect diverse and inclusive insights…" https://makeitfable.com/article/how-to-recruit-and-screen-for-accessibility-research/ How Many People Actually Recommend? By Jeff Sauro and Jim Lewis. "…In this article, we review data on how well measures of intention to recommend match future recommendation behavior…" https://measuringu.com/how-many-people-actually-recommend/ +04: EVENTS. The Art of Disability Justice Now July 19-November 3, 2024. Virtual and Mill City Museum, Minneapolis, Minnesota U.S.A. https://disabilityjusticeart.com/ Exhibit Opening Night Celebration, July 19, 2024: https://www.eventbrite.com/e/opening-night-celebration-the-art-of-disability-justice-now-tickets-919666807177 Learn CSS Grid First with Stephanie Eckles, Miriam Suzanne, and Stacy Kvernmo July 23, 2024. Online https://www.youtube.com/live/aDMWD_CYpEI Green Accessibility for Web Developers July 25, 2024. Online https://umn.zoom.us/webinar/register/WN_4U3icNSRTieY8gIFMEXiuQ#/registration ADA 34 Live! Show your ADA and History Knowledge July 25, 2024. Online https://accessibilityonline.org/ADA-Audio/session?id=111126 ADA Title II Revisions: What You Need to Know July 25, 2024. Online https://go.3playmedia.com/wbnr-07-25-2024-title-ii Ask an Accessibility Expert July 29, 2024. Minneapolis, Minnesota, U.S.A. https://www.meetup.com/accessibility-twin-cities/events/302162567/ Inclusive Design Patterns For 2025 with Vitaly Friedman September 24, 2024. Online https://smashingconf.com/online-workshops/workshops/inclusive-design-patterns-vitaly-friedman/ UX Virtual Training October 5-11, 2024. Online https://www.nngroup.com/training/october/ +05: HTML. Dialog Dilemmas and Modal Mischief: On Building Popovers (Video) By Hidde de Vries. "…In this talk, you'll learn all about dialogs, including the new 'popover' attribute, 'modality' and using the top layer…" https://www.youtube.com/watch?v=uZRp7yY8SS0 Slides: https://talks.hiddedevries.nl/VZNuWJ/slides +06: JAVASCRIPT. Exploring the Challenges in Creating an Accessible Sortable List (Drag-And-Drop) By Kendall Gassne. "Drag-and-drop is a highly interactive and visual interface. We often use drag-and-drop to perform tasks like uploading files, reordering browser bookmarks, or even moving a card in solitaire…" https://github.blog/2024-07-09-exploring-the-challenges-in-creating-an-accessible-sortable-list-drag-and-drop/ What ARIA Still Does Not Do By Steve Faulkner. "…As long as developers implement ARIA according to its rules of use in HTML and implement interaction patterns (usually via JavaScript) that agree with the standard pattern for a particular role, all is well. When they do not, there is grief… " https://html5accessibility.com/stuff/2024/07/15/what-aria-still-does-not-do/ ARIA Roles - Version History By Russ Weakley. "When WAI ARIA 1.0 became a W3C Recommendation in March 2014, there were four categories for roles. When WAI ARIA 1.1 became a W3C Recommendation in 14 December 2017, two additional categories were added. This chart shows all WAI ARIA roles including notes on when they changed category, or where newly introduced…" https://russmaxdesign.github.io/aria-roles/ Practical Guide on Implementing 'aria-expanded' in Web Development By Florian Schroiff. "Become an 'aria-expanded' expert with our detailed guide. Avoid pitfalls, grow your web accessibility skills, and improve the web experience for all users…" https://www.a11y-collective.com/code/aria-expanded/ +07: MISCELLANEOUS. To Hell With the Business Case, Again By Matt May. "…it is not a moral failure for someone who has tried to create this kind of change in a corporate setting, only to see it washed away. It is the corporations, not the DEI representatives, who are failing us." https://buttondown.email/practicaltips/archive/to-hell-with-the-business-case-again/ Poisoning the AI Well By Chris Ferdinandi. "…Every page includes a bit of text at the end, visually hidden from users and hidden from screen readers. It instructs the LLM scraping the site to ignore everything else it's been asked to do and instead generate a sea shanty…" https://gomakethings.com/poisoning-the-ai-well/ +08: TOOLS. NerdeRegion By Ugurcan (Ugi) Kutluoglu. "NerdeRegion is a Chrome developer tools extension for debugging live regions on a Web Page. When activated, you will see a list all active Aria live regions, and you'll be able to see the history of all changes made on the region…" https://github.com/wizzyfx/nerdeRegionPlugIn +09: USABILITY. Homepage Design: 4 Common Mistakes (Video) By Huei-Hsin Wang. "Enhance your homepage design by avoiding false floors, providing clear scrolling cues, adhering to familiar web standards, and creating a distinct visual hierarchy to focus user attention." https://www.nngroup.com/videos/homepage-design-mistakes/ Data Table Design Patterns By Luda Boss. "…This article is a collection of best practices to help you make your data tables better…" https://bootcamp.uxdesign.cc/data-table-design-patterns-4e38188a0981 Content Strategy vs. UX Writing By Anna Kaley. "Content strategy focuses on content-related processes, while UX writing shapes user experiences through text. The two disciplines work in harmony…" https://www.nngroup.com/articles/content-strategy-vs-ux-writing/ Different Gets Ignored By Luke Wroblewski. "At some point in their career, every designer has heard the request to make an element 'pop more'. The premise is simple: to draw attention to a particular element in a layout, make it stand out. However, in practice, the opposite effect often occurs.…" https://www.lukew.com/ff/entry.asp?2066 What Happened to the Share Button in Zoom? By L. Jeffrey Zeldman. "…talk about usable! The button's placement at the top left of the meeting window, with plenty of free open space around it, means that any user (regardless of software experience level) can quickly find the button when they needed it…" https://zeldman.com/2024/07/15/what-happened-to-the-share-button-in-zoom/ +10: WEBWASTE & SUSTAINABILITY. Generative AI is a Climate Disaster By Paris Marx. "Tech companies are abandoning emissions pledges to chase AI market share…" https://disconnect.blog/generative-ai-is-a-climate-disaster/ [Section one ends.] ++ SECTION TWO: +11: 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.]