+++ WEB DESIGN UPDATE. - Volume 22, Issue 49, May 29, 2024. An email newsletter to distribute news and information about web design and development. ++ISSUE 49 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: NAVIGATION. 10: TOOLS. 11: TYPOGRAPHY. 12: USABILITY. 13: WEBWASTE & SUSTAINABILITY. SECTION TWO: 14: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Not So Short Note On aria-label Usage - Big Table Edition By Steve Faulkner. "aria-label is one of a number of secondary methods to label native HTML UI elements. It works particularly well on interactive elements, it also works well on most block level elements old skool term that have explicitly or implicitly defined structural roles. It works less well or not at all on text level semantics. It is prohibited as are any form of accessible name on a whole slew of roles…" https://html5accessibility.com/stuff/2024/05/22/not-so-short-note-on-aria-label-usage-big-table-edition/ A Complete Guide for Adding Captions to YouTube Videos By Whitney Lewis. "In this article, we'll review how to add captions to YouTube videos plus other helpful caption information including…" https://blog.pope.tech/2024/05/24/a-complete-guide-for-adding-captions-to-youtube-videos/ Introduction to Manual Website Accessibility Testing (Video) By Luke Kudryashov and Khaled Musa. "…We will provide an overview of common manual testing methodologies and demonstrate simple keyboard and screen reader checks you can use to get started…" https://mediaspace.umn.edu/media/t/1_rre8y1cx Perfect Timing for New WCAG 3 Guideline Considerations By Bogdan Cerovac. "W3C Accessibility Guidelines just got a major update. Still a draft, but I love the brainstorming potentials of the newly added guidelines and outcomes. Was the release date an coincidence?…" https://cerovac.com/a11y/2024/05/perfect-timing-for-new-wcag-3-guideline-considerations/ 6 Tips for a Technical - and Cultural - Shift to Accessibility By The Paciello Group Interactive. "…In this article, we focus on both low-hanging fruit that can provide readily achievable accessibility improvements and long-term goals for ingraining accessibility in your organization's culture…" https://www.tpgi.com/6-tips-for-a-technical-and-cultural-shift-to-accessibility/ Alt Left By Steve Faulkner. "AI can help by providing mostly accurate descriptions of images on web pages…A problem is that although visible on the page such images are not identified or discoverable for screen reader users…" https://html5accessibility.com/stuff/2024/05/27/alt-left/ Survey on the Experiences and Perspectives of Image Describers By Tilburg University. "This study is part of a larger project that aims to develop, evaluate, and publish guidelines for making images more accessible for people with visual impairments…" https://tilburghumanities.eu.qualtrics.com/jfe/form/SV_bkj5EYpDYD8RdrM What AI Can Do For (and To) Web Accessibility (Video) By Hans Hillen and Ricky Onsman. "…This presentation explores the dual role that Artificial Intelligence / Machine Learning (AI/ML) plays when it comes to web accessibility. On the one hand, it can be a powerful aid for people with disabilities, enabling dynamic content adaptation, offering voice navigation, and providing automated descriptions for inaccessible images and videos. On the other hand, removing the human aspect from accessible web-design tasks can easily lead to harder-to-discover accessibility obstacles…" https://www.youtube.com/watch?v=M7OGNiszfX0 PowerPoint Slide Deck: https://7192965.fs1.hubspotusercontent-na1.net/hubfs/7192965/files%20for%20email/What_AI_Can_Do_For_And_To_A11y.pptx Model to Explore Emerging Accessibility Needs By Michael Cooper. "…As the environment evolves and new technology is created, new accessibility intersections emerge, and the field needs to learn about new types of accessibility needs and accommodations. A model like this can help to predict these intersections in time to address them…" https://aihal.net/weblog/2024/model-explore-emerging-accessibility-needs Two Important AI Developments Affecting Accessibility By Ken Nakata. "…this blog post is about two new legal developments concerning artificial intelligence (or AI)…" https://convergeaccessibility.com/2024/05/23/two_important_ai_developments_affecting_accessibility/ Accessibility Difference in Education-Related Websites From Developing and Developed Countries By Utkarsha Singh, Jeevithashree Divya Venkatesh, Pradipta Biswas. "…This study focuses on identifying accessibility differences in education-related websites of developing (BRICS) and developed (G7) group of countries using six accessibility evaluation tools…" https://www.itu.int/pub/S-JNL-VOL4.ISSUE4-2023-A46 Accessibility of Web Content and Mobile Apps Provided by State and Local Government Entities: A Small Entity Compliance Guide By U.S. Department of Justice. "This Small Entity Compliance Guide ('guide') is meant for people who work for or with small state and local governments. The guide will help you understand the rule's requirements for making sure your government's web content and mobile apps are accessible…" https://www.ada.gov/resources/small-entity-compliance-guide/ +02: BOOKS. * Matuzovic, Manuel. "Web Accessibility Cookbook: Creating Inclusive Experiences" O'Reilly, 2024. +03: CASCADING STYLE SHEETS. Modern CSS Layouts: You Might Not Need A Framework For That By Brecht De Ruyte. "It's easy to get lost in a sea of CSS frameworks and libraries, each promising easier styling and smoother layouts. But amidst this abundance, the modern CSS features we have today offer simpler and more flexible approaches without the added dependencies or abstractions. Brecht De Ruyte demonstrates four CSS utility classes (plus a bonus) using techniques that allow them to be used practically anywhere you need a particular layout - be it Grid or Flexbox - with configurable options.…" https://www.smashingmagazine.com/2024/05/modern-css-layouts-no-framework-needed/ No More Pixel Rounding Issues! By Temani Afif. "…It will make sure the width of your element is always an integer! No more decimal and rounding issues!…" https://css-tip.com/pixel-rounding/ Masonry and Reading Order By Rachel Andrew. "There's a proposal however that aims to deal with this, that would let developers indicate to the browser that they want to follow the 'visual' flow of items rather than source order. This is currently named reading-order-items…" https://rachelandrew.co.uk/archives/2024/05/26/masonry-and-reading-order/ +04: EVALUATION & TESTING. Changes to Rating Scale Formats Can Matter, But Usually Not That Much By Jeff Sauro and Jim Lewis. "Few things seem to elicit more opinions, exaggerations, and accusations than rating scale response options…" https://measuringu.com/changes-to-rating-scale-formats-can-matter-but-usually-not-that-much/ +05: EVENTS. Accessibility Testing with NVDA Online November 11-25, 2024. https://events.humanitix.com/accessibility-testing-with-nvda-november-2024 Web Summit November 11-14, 2024. Lisbon, Portugal https://websummit.com/ Accessing Higher Ground November 11-15, 2024. Online and Denver, Colorado, U.S.A. https://accessinghigherground.org/ +06: HTML. We Need to Talk More About Conformance, If We Want to Stop Fantasy HTML By Jens Oliver Meiert. "Conformant and valid HTML is the exception when it comes to HTML used on websites and in apps…" https://meiert.com/en/blog/talk-about-html-conformance/ Switching It Up With HTML's Latest Control By Daniel Yuschick. "After years of relying on checkbox hacks to create a 'switch' control for forms that toggle between two states, HTML may be gaining a native way to go about it by adding a switch attribute to checkbox inputs…" https://www.smashingmagazine.com/2024/05/switching-it-up-html-latest-control/ Why You Need to Go Back to Basics if You Want to Learn HTML or CSS By Baldur Bjarnason. "…You should always go back to basics when trying to learn HTML or CSS, especially if you're an experienced JS dev unfamiliar with the two languages. Don't try to learn them within your chosen component system…" https://www.baldurbjarnason.com/2024/css-and-back-to-basics/ +07: JAVASCRIPT. Futuristic Progressive Enhancement By Jim Nielsen. "…We're all tired of: write some code, come back to it in six months, try to make it do more, and find the whole project is broken until you upgrade everything. Progressive enhancement allows you to do the opposite: write some code, come back to it in six months, and it's doing more than the day you wrote it…" https://blog.jim-nielsen.com/2024/futuristic-progressive-enhanement/ +08: MISCELLANEOUS. Trust By Jeremy Keith. "In their rush to cram in 'AI' 'features', it seems to me that many companies don't actually understand why people use their products…" https://adactio.com/journal/21160 +09: NAVIGATION. When Online Content Disappears By Athena Chapekis, Samuel Bestvater, Emma Remy, and Gonzalo Rivero. "38% of webpages that existed in 2013 are no longer accessible a decade later…" https://www.pewresearch.org/data-labs/2024/05/17/when-online-content-disappears/ +10: TOOLS. Show Decorative Bookmarklet By Steve Faulkner. "This bookmarklet modifies the attributes of elements and elements with role="img" on a webpage to ensure they are accessible and labeled as decorative images. It performs the following actions…" https://cdpn.io/pen/debug/BaeQzex Turn Off AI Overview in Google Set "Web" as Default By Tonya Ugnich. "On May 15th Google released a new "Web" filter that removes "AI Overview" and other clutter, leaving only traditional web results. Here is how you can set "Google Web" as your default search engine…" https://tenbluelinks.org/ +11: TYPOGRAPHY. The Basics of Legibility By Niko Kitsakis. "…A short guide to legibility for non-typographers and UX designers…" https://www.nubero.ch/blog/011/ Rethinking Text Resizing on Web By Steven Bassett. "Airbnb has made significant strides in improving web accessibility for Hosts and guests who require larger text sizes. This post takes an in-depth look at…" https://scribe.rip/airbnb-engineering/rethinking-text-resizing-on-web-1047b12d2881 Learn the Logic of Great Typography By Learn UI Design. "An interactive type tutorial…" https://www.learnui.design/tools/typography-tutorial.html +12: USABILITY. Mobile UX Trends: The Current State of Mobile UX (15 Common Pitfalls & Best Practices) By Iva Olah. "Our 2024 Mobile UX benchmark includes ratings of 25,000+ UX elements across 138 leading e-commerce sites…" https://baymard.com/blog/mobile-ux-ecommerce Design Systems vs. Style Guides By Kelley Gordon. "Design systems are a set of standards (like Google's Material Design or IBM's Carbon Design System) needed to manage design at scale. Style guides (like content or visual style guides) are just one piece in a design system…" https://www.nngroup.com/articles/design-systems-vs-style-guides/ HCD, UX, & CX - What Does it All Mean and How Does it Intersect with A11y? By Minnesota IT Services. "Discover the importance of these abbreviations and how they come together to make a better digital experience for all…" https://mn.gov/mnit/media/blog/?id=38-624261 Delightful UX Is Like a 3-Legged Stool (Video) By Therese Fessenden. "Delight can be experienced viscerally, behaviorally, and reflectively. A delightful design must consider all three of these pillars." https://www.nngroup.com/videos/delightful-ux/ +13: WEBWASTE & SUSTAINABILITY. Ensuring an Inclusive and Accessible Green Transition (Video) By GreenSCENT. "To achieve sustainability, it is essential that environmental initiatives are accessible to everyone, especially those who are often marginalised. Our webinar tackled significant environmental challenges and emphasised the need to consider gender, disabilities, age, cultures, and other intersectional factors in order to ensure a truly inclusive green transition…" https://www.youtube.com/watch?v=A8XKtMrY1i8 The Efficiency Scam From AI and Big Tech By Gerry McGovern. "…In this finite world of limited resources, of a super-stressed environment, AI and Big Tech 'efficiency' is literally efficiently killing us, efficiently killing our environment. It's an efficiency scam of monumental, dystopian proportions." https://gerrymcgovern.com/the-efficiency-scam-from-ai-and-big-tech/ [Section one ends.] ++ SECTION TWO: +14: 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.]