+++ WEB DESIGN UPDATE. - Volume 22, Issue 45, May 1, 2024. An email newsletter to distribute news and information about web design and development. ++ISSUE 45 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: INFORMATION ARCHITECTURE. 07: JAVASCRIPT. 09: MISCELLANEOUS. 08: NAVIGATION. 09: 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. Web Accessibility in the 2024 Presidential Campaigns By John Northup. "WebAIM's John Northup ran the US presidential campaign websites through the AIM (Accessibility IMpact) testing process to determine which scores the best…" https://webaim.org/blog/2024-campaign-site-accessibility/ Website Accessibility Testing By Minnesota IT Services. "Helpful tools & the decision-making process for accessibility failures…" https://mn.gov/mnit/media/blog/?id=38-621624 No Mouse Challenge By Minnesota IT Services. "If your computer mouse suddenly stopped functioning, would you be able to continue working?…" https://mn.gov/mnit/about-mnit/accessibility/no-mouse-challenge.jsp State of Captioning 2024 (PDF) By 3Play Media. 3Play's surveyed 450+ people for this report. It has info on trends, user preferences, and the utilization of various services and tools across industries. https://go.3playmedia.com/hubfs/WP%20PDFs/2024%20State%20of%20Captioning%20Report%20by%203Play%20Media_Remediated.pdf How to Check and Fix PDF Accessibility Issues By Whitney Lewis. "…In this article, we'll review the tools and steps you can take with Adobe Acrobat Pro to check and fix PDF accessibility issues…" https://blog.pope.tech/2024/04/25/how-to-check-and-fix-pdf-accessibility-issues/ Neurodiversity and UX: Essential Resources for Cognitive Accessibility By Stéphanie Walter. "Guidelines to understand and design for Dyslexia, Dyscalculia, Autism and ADHD…" https://stephaniewalter.design/blog/neurodiversity-and-ux-essential-resources-for-cognitive-accessibility/ Nondiscrimination on the Basis of Disability; Accessibility of Web Information and Services of State and Local Government Entities (Federal Register) By U.S. Department of Justice. https://www.federalregister.gov/documents/2024/04/24/2024-07758/nondiscrimination-on-the-basis-of-disability-accessibility-of-web-information-and-services-of-state Nondiscrimination on the Basis of Disability; Accessibility of Web Information and Services of State and Local Government Entities (PDF) By U.S. Department of Justice. Final rule in the Federal Register: 31320, Vol. 89, No. 80 / Wednesday, April 24, 2024. https://www.govinfo.gov/content/pkg/FR-2024-04-24/pdf/2024-07758.pdf 301,549 ways to Improve Accessibility: EN 301 549 By Wilco Fiers. "…Over the last 9 years, EN 301 549 steadily gained importance. It is often dismissed as 'WCAG with a different number slapped on it,' but it is far more than that…" https://www.deque.com/blog/301549-improve-accessibility/ +02: CASCADING STYLE SHEETS. CSS Inheritance By Andy Bell. "Inheritance truly is a superpower and it's what makes developing on the web a joy if you embrace it. In this quick post, I'm going to convert you into a super fan…" https://piccalil.li/blog/css-inheritance/ Write Better CSS with Modern CSS By Temani Afif. "A lot of new CSS features can help you optimize your code and reduce redundancy…" https://css-tip.com/better-modern-css/ Help Us Invent CSS Grid Level 3, Aka 'Masonry' Layout By Jen Simmons. "…We want to hear from you…" https://www.webkit.org/blog/15269/help-us-invent-masonry-layouts-for-css-grid-level-3/ Use CSS to Boost the Font Size of Emoji With No Extra Markup By Terence Eden. "…Is there a way to use CSS to increase the font size of specific characters without having to wrap them in an extra or similar? Yes! Although it is a bit of a hack…" https://shkspr.mobi/blog/2024/04/use-css-to-boost-the-font-size-of-emoji-with-no-extra-markup/ +03: EVALUATION & TESTING. Conducting Accessibility Research In An Inaccessible Ecosystem By Michele Williams. "It's undeniable that conducting UX research that includes participants with a variety of disabilities is vital to building inclusive technology…" https://www.smashingmagazine.com/2024/04/conducting-accessibility-research-inaccessible-ecosystem/ How Long Are Typical Unmoderated UX Tasks? By Jeff Sauro and Jim Lewis. "A common logistical consideration when planning a task-based usability study is how much time you should plan for a task…" https://measuringu.com/how-long-are-typical-unmoderated-ux-tasks/ How to Present UX Research Results Responsibly (Video) By Caleb Sponheim. "Presenting study data to stakeholders is a crucial step of most projects. Make sure to present your data truthfully and responsibly to avoid costly negative outcomes and reputation loss. Indicate who your data represents and communicate the limitations of your findings." https://www.nngroup.com/videos/present-research-responsively/ Use Both Ratings Average and Number of Ratings When Sorting by User Ratings By Sonia Weaver. "Users frequently sort by user ratings to find and compare items within product lists…" https://baymard.com/blog/sort-by-customer-ratings The 3 Competencies of Journey Management (Video) By Kim Salazar. "Managing journeys requires a continuous practice of 3 interdependent competencies: collecting insights, analyzing them to drive design strategy, and orchestrating journey experiences for users." https://www.nngroup.com/videos/journey-management-competencies/ +04: EVENTS. Final Rule on Web Accessibility for State and Local Governments May 6, 2024. Online https://www.naco.org/event/overview-us-department-justice-final-rule-web-accessibility-state-and-local-governments ATHEN State of Accessibility Virtual Event May 14, 2024. Online https://www.athenpro.org/registration-now-open-athens-2024-gaad-virtual-event-on-may-14/ Ensuring an Inclusive and Accessible Green Transition May 15, 2024. Online https://www.eventbrite.com/e/ensuring-an-inclusive-accessible-green-transition-tickets-880707478777 May 16: Attend a UC Global Accessibility Awareness Day Event May 16, 2024. Online https://ucnet.universityofcalifornia.edu/employee-news/may-16-attend-a-uc-global-accessibility-awareness-day-event/ AI, Accessibility and Users with Disabilities (GAAD) May 16, 2024. Online https://www.eventbrite.com/e/ai-accessibility-and-users-with-disabilities-gaad-tickets-859077031527 How to Produce a Livestreaming Event (that is Accessible, Green, and Open Source) May 21, 2024. Online https://www.accessibilityassociation.org/s/webinar-details?id=a0A4z00001CRXijEAH 5 Recommendations on Supporting Neurodiverse Students in Teaching & Learning May 23, 2024. Online https://onlinelearningconsortium.org/webinar/supporting-neurodiversity/ Strengthening Digital Accessibility and the Management of Section 508 of the Rehabilitation Act May 28, 2024. Online https://www.section508.gov/event/best-practices-webinar-may2024/ +05: HTML. HTML Attributes vs DOM Properties By Jake Archibald. "Attributes and properties are fundamentally different things. You can have an attribute and property of the same name set to different values. For example…" https://jakearchibald.com/2024/attributes-vs-properties/ My Approach to HTML Web Components By Jeremy Keith. "I've been deep-diving into HTML web components over the past few weeks. I decided to refactor the JavaScript on The Session to use custom elements wherever it made sense…" https://adactio.com/journal/21078 Popover API Lands in Baseline By Una Kravets. "This web feature is now available in all three major browser engines…" https://web.dev/blog/popover-api +06: INFORMATION ARCHITECTURE. Affinity Diagramming for Collaboratively Sorting UX Findings and Design Ideas By Rachel Krause and Kara Pernice. "Use affinity diagramming to cluster and organize research findings or to sort design ideas in ideation workshops. …" https://www.nngroup.com/articles/affinity-diagram/ +07: JAVASCRIPT. WAI-ARIA: Role=Emphasis By Raghavendra Satish Peri. "…The purpose of the emphasis role is to stress or emphasize content. It is not for communicating changes in typographical presentation that do not impact the meaning of the content. Authors SHOULD use the emphasis role only if its absence would change the meaning of the content…" https://www.digitala11y.com/wai-aria-roleemphasis/ WAI-ARIA: Role=Blockquote By Raghavendra Satish Peri. "A section of content that is quoted from another source.…" https://www.digitala11y.com/wai-aria-roleblockquote/ Finally Understanding How Array.sort(comparator) Works By James Kerr. "After 13 years of JavaScript, I finally have a way to remember how the comparator function in Array.sort() works.…" https://www.jameskerr.blog/posts/javascript-sort-comparators/ +08: NAVIGATION. Rising Tide Rents and Robber Baron Rents By Tim O'Reilly. "The Replacement of Organic Search with Advertising by Google and Amazon and What That Might Mean for the Future of AI…" https://www.oreilly.com/radar/rising-tide-rents-and-robber-baron-rents/ +09: TOOLS. How to Get Speech Output as Text From Screen Readers By Francis Storr. "Sometimes you need text, rather than voice, output from screen readers. Why? It's really useful for bug reports ('this disclosure icon is announced as 'black dash triangle dash filled dash x2 underscore final dot png' and needs alt text'). Luckily, getting this text is easy to do…" https://gist.github.com/fstorr/330026cca27a7e5119d9c4fc0c5a11c5 +10: USABILITY. F-Shape Pattern And How Users Read By Vitaly Friedman. "Scrolling, scanning, skipping: How do users consume content online? Here's what you need to know about reading behavior and design strategies to prevent harmful scanning patterns. An upcoming part of Smart Interface Design Patterns…" https://www.smashingmagazine.com/2024/04/f-shape-pattern-how-users-read/ The Picture-Superiority Effect: Harness the Power of Visuals By Sara Ramaswamy. "People often remember visuals better than words. Designers can leverage the picture-superiority effect to make their products memorable and learnable." https://www.nngroup.com/articles/picture-superiority-effect/ +11: WEBWASTE & SUSTAINABILITY. The Wabi Sabi Web By Tom Greenwood. "…We know that our lives are becoming increasingly digital and we know how much we need and love the rich beauty of the physical world, so good digital design must surely now include exploration of the Wabi Sabi Web." https://branch.climateaction.tech/issues/issue-8/the-wabi-sabi-web/ Solarpunk Meets Better Business: Reimagining a Sustainable Digital Future By Simon Blackler. "…what if we could reimagine our relationship with technology and the environment? What if we could create a world where business, technology, and nature are in harmony?…" https://branch.climateaction.tech/issues/issue-8/solarpunk-meets-better-business/ AI Computing Is on Pace to Consume More Energy Than India, Arm Says By Ian King. "…Haas joins a growing number of people raising alarms about the toll AI could take on the world's infrastructure…" https://finance.yahoo.com/news/ai-computing-pace-consume-more-150000328.html [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 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.]