Web Design Update: June 10, 2025

[Laura Carlson]

+++ WEB DESIGN UPDATE.
- Volume 25, Issue 50, June 10, 2025.

An email newsletter to distribute news and information about web design and development.

++ISSUE 50 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: COLOR.
04: EVALUATION & TESTING.
05: EVENTS.
06: HTML.
06: JAVASCRIPT.
07: NAVIGATION.
08: TOOLS.
09: TYPOGRAPHY.

SECTION TWO:
10: What Can You Find at the Web Design Reference Site?

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

A11y 101: 2.1.1 Keyboard
By Nat Tarnoff.
"Not everyone uses a mouse. Not everyone has access to the mouse. If it can be done with a normal keyboard, it will likely work with eye-tracking. It will also work with sip-n-puff, switch, and more alternative hardware. This opens up the opportunity to grow your audience…"
http://tarnoff.info/2025/06/09/a11y-101-2-1-1-keyboard/

Where to Put Focus When Opening a Modal Dialog
By Adrian Roselli.
"This post is meant to help you, an intelligent and thoughtful and empathetic reader, figure out where you should set focus. The scenarios are non-exhaustive…"
https://adrianroselli.com/2025/06/where-to-put-focus-when-opening-a-modal-dialog.html

Testing Methods: Live Audio-only
By Dennis Deacon.
WCAG 1.2.9 Audio-only (Live) is a Level AAA conformance level Success Criterion. It states that an alternative for time-based media that presents equivalent information for live audio-only content is provided.
https://www.dennisdeacon.com/web/accessibility/testing-methods-live-audio-only/

A Complete Guide for Adding Captions to YouTube Videos
By Whitney Lewis.
"YouTube captions are text of the narration. They sync with the video meaning they automatically progress with the video…"
https://blog.pope.tech/2024/05/24/a-complete-guide-for-adding-captions-to-youtube-videos/

How to Test Your PDFs for Accessibility (Without Being a Technical Expert)
By Josh Crawford.
"Testing PDF accessibility doesn't always require expensive software or technical expertise. Simple techniques like keyboard navigation, read-aloud testing, and grayscale viewing can reveal barriers before publication. This guide shows how to test PDFs using tools you already have, ensuring documents work for people using assistive technologies.…"
https://www.digitalaccesstraining.com/pages/articles?p=how-to-test-your-pdfs-for-accessibility-without-being-a-technical-expert

Translating Accessibility
By Doug Abrams.
"Writing accessible content like alt text and ARIA labels can be challenging. If your website supports multiple languages, then there's an added layer of complexity to consider-what information should and should not be translated?…"
https://www.tpgi.com/translating-accessibility/

Quick Tip: WCAG Doesn't Round
By Nat Tarnoff.
"In any of the success criteria where digits are used, they do not round those measurements. You may be trying to hit the minimum target area of 24 by 24 pixels. However, if you churn out 24 x 23.9 pixels (bear with me) you have failed the criteria…"
http://tarnoff.info/2025/06/05/quick-tip-wcag-doesnt-round/

Can Accessibility Be Whimsical?
By Sara Joy.
"It started out with me just trying to find a cute word to put with a11y, the numeronym for accessibility…"
https://goodinternetmagazine.com/can-accessibility-be-whimsical/

How to Make Accessibility "Stick"
By Sheri Byrne-Haber.
"…Accessibility teams need to move from 'no' to 'yes, but' - a constructive, conditional yes that acknowledges design intent while insisting on WCAG conformance and inclusive user experience. Here's how…"
https://buttondown.com/access-ability/archive/how-to-make-accessibility-stick/

More on What Makes a Good Accessibility Designer
By David A. Kennedy.
"…Working in accessibility means you're diving into one of the most complex, challenging spaces for a designer. Buckle up…"
https://davidakennedy.com/blog/more-on-what-makes-a-good-accessibility-designer/

Pride, Shame, and Accessibility
By Heydon Pickering.
"…I'm talking about professional shame: the shame accompanying doing a bad job. Developers, more than anyone else I know, identify with being capable. Pushing poor development work is not just embarrassing, it threatens their very sense of self…"
https://heydonworks.com/article/pride-shame-and-accessibility/

If You Answer It Twice, Make It an Article
By Ted Drake.
…every documented answer is one more thread in a stronger, smarter accessibility community…
https://www.last-child.com/if-you-answer-it-twice-make-it-an-article.html

Japan Celebrates Digital Accessibility All Year Long
By Makoto Ueki.
"The third Thursday in May is Global Accessibility Awareness Day (GAAD). This year, it was May 15. How did you celebrate GAAD? In Japan, we had our biggest celebration yet…"
https://www.lflegal.com/2025/06/japan-gaad-makoto-ueki/

New Attempt to Rollback Accessibility Requirements - Comments Needed
By Lainey Feingold.
"U.S. Department of Energy proposes drastic changes to decades-old regulations…"
https://www.lflegal.com/2025/06/energy-department-rollback/

So, You Screwed Up Your EAA Compliance. What Now?
Eric Eggert.
"The deadline of the European Accessibility Act (EAA) is near (June 28 is just 20 days away as I write this), and you just realized that your website or apps will not meet the requirements by then…"
https://yatil.net/blog/so-you-screwed-up-your-eaa-compliance-what-now

"Accessibility at the Edge" W3C CG Is an Overlay Smoke Screen (Update)
By Adrian Roselli.
…My fear is that overlay companies have found a new angle to legitimize their business model using the W3C's name…"
https://adrianroselli.com/2022/09/accessibility-at-the-edge-w3c-cg-is-an-overlay-smoke-screen.html#Update06


+02: CASCADING STYLE SHEETS.

Printing the Web: Making Webpages Look Good on Paper
By Declan Chidlow.
"…People print websites - they'll print your website - and making a website printable comes with beneficial byproducts which improve the experience on screen…"
https://piccalil.li/blog/printing-the-web-making-webpages-look-good-on-paper/

State of CSS 2025 Survey
By Sacha Greif.
"This is an open survey for anybody who writes CSS, whether regularly or occasionally, as part of their job, as a student, or just for fun…"
https://survey.devographics.com/en-US/survey/state-of-css/2025


+03: COLOR.

Make the Web a More a Colorful Place!
By OddBird.
"OddBird's color tool not only checks contrast ratios, but supports the new CSS color formats and spaces…"
https://www.oddbird.net/2025/06/06/oddcontrast-guide/


+04: EVALUATION & TESTING.

Using the Inverse Square Relationship for Sample Sizes
By Jeff Sauro and Jim Lewis.
"…the relationship between sample sizes and precision follows a pattern we can observe in the physical world…"
https://measuringu.com/inverse-square-relationship/


+05: EVENTS.

Making Video Accessible: Best Practices and Innovations in Video Accessibility
June 16, 2025.
Online
https://z.umn.edu/VideoAccessibilityWebinar

Making Content Accessible for People with Limited English Proficiency
August 5, 2025.
Online and New York, New York, U.S.A.
https://www.meetup.com/a11ynyc/events/307304227/

W3C Technical Plenary (TPAC) 2025
November 10-14, 2025.
Online and Kobe, Japan
https://www.w3.org/events/tpac/2025/tpac-2025/

TechSharePro 2025
November 12-13, 2025.
London, England, United Kingdom
https://abilitynet.org.uk/techsharepro

World Usability Day
November 13, 2025.
Global
https://www.worldusabilityday.org/


+06: JAVASCRIPT.

ARIA/HTML Relationship Severance
By Steve Faulkner.
"…What I found back then was that aria relationship attributes didn't work when an element being referenced was outside the shadow DOM and the element referencing it was inside the shadow DOM, ditto for the opposite. It was same story for native HTML relationships as well. Fast forward to 11 years later, as in now! 2025, and the situation remains the same…"
https://html5accessibility.com/stuff/2025/06/07/aria-html-relationship-severence/


+07: NAVIGATION.

Hamburger Menu Icon Update
By Kate Kaplan.
"Hamburger menus are now widely recognized-but still come with usability tradeoffs. Use them only when needed, and stick to tested best practices."
https://www.nngroup.com/videos/hamburger-menu-icon-update/


+08: TOOLS.

wave-node
By Karl Groves.
"Node.js client for the WAVE (WebAIM) accessibility testing API. Written in TypeScript with full type definitions included…"
https://www.npmjs.com/package/@afixt/wave-node

3 Free Tools to Caption Videos
By Whitney Lewis.
"In my experience, these three tools have fewer errors and do a better job of punctuating than YouTube's automated captions, resulting in less time spent editing the captions…TurboScribe… Slack… Transcribe…"
https://blog.pope.tech/2025/06/03/3-free-tools-to-caption-videos/


+09: TYPOGRAPHY.

Typography System Guide for iOS and Android
"Comprehensive guide for implementing accessible typography in mobile…"
https://alansdead.github.io/typography-system-guide/


[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:lcar...@d.umn.edu


[Issue ends.]

Laura L. Carlson
Information Technology Systems and Services
University of Minnesota Duluth
Duluth, MN U.S.A. 55812-3009
http://www.d.umn.edu/itss/training/online/webdesign/

W3C Invited Expert
Accessibility Guidelines Working Group
https://www.w3.org/groups/wg/ag/participants

Pronouns: she/her/hers