Max Design articles Browser internals, accessibility, ARIA, HTML and CSS articles https://www.maxdesign.com.au/articles/ en-au Sunday, 16 August 2026 17:35:00 +1000 Sunday, 16 August 2026 17:35:00 +1000 https://www.maxdesign.com.au/apple-touch-icon-precomposed.png Max Design articles https://www.maxdesign.com.au/articles/ Understanding aria-pressed https://www.maxdesign.com.au/articles/aria-pressed-explained.html https://www.maxdesign.com.au/articles/aria-pressed-explained.html Sun, 16 Aug 2026 09:00:30 +1000 Russ Weakley HTML Accessibility A quick explanation of aria-pressed - including an example, when it can be used, and when it should not be used. A quick explanation of aria-pressed - including an example, when it can be used, and when it should not be used.

Read the full article

]]> Understanding aria-valuemin and aria-valuemax https://www.maxdesign.com.au/articles/aria-valuemin-valuemax-explained.html https://www.maxdesign.com.au/articles/aria-valuemin-valuemax-explained.html Sun, 16 Aug 2026 09:00:30 +1000 Russ Weakley HTML Accessibility This article explains aria-valuemin and aria-valuemax in plain language. It shows how assistive technology can understand the boundaries of a range control. This article explains aria-valuemin and aria-valuemax in plain language. It shows how assistive technology can understand the boundaries of a range control.

Read the full article

]]> Understanding aria-valuetext https://www.maxdesign.com.au/articles/aria-valuetext-explained.html https://www.maxdesign.com.au/articles/aria-valuetext-explained.html Sat, 15 Aug 2026 09:00:30 +1000 Russ Weakley HTML Accessibility This article explains aria-valuetext in plain language, building on aria-valuenow to show how a numeric value can be given a more useful text description for assistive technology. This article explains aria-valuetext in plain language, building on aria-valuenow to show how a numeric value can be given a more useful text description for assistive technology.

Read the full article

]]> Understanding aria-valuenow https://www.maxdesign.com.au/articles/aria-valuenow-explained.html https://www.maxdesign.com.au/articles/aria-valuenow-explained.html Fri, 14 Aug 2026 09:00:30 +1000 Russ Weakley HTML Accessibility This article explains aria-valuenow in plain language, starting with a familiar native range input and then showing what changes when developers build their own custom slider. This article explains aria-valuenow in plain language, starting with a familiar native range input and then showing what changes when developers build their own custom slider.

Read the full article

]]> Understanding aria-details https://www.maxdesign.com.au/articles/aria-details-explained.html https://www.maxdesign.com.au/articles/aria-details-explained.html Thu, 13 Aug 2026 09:00:30 +1000 Russ Weakley HTML Accessibility This article explains aria-details in plain language, showing how it connects elements on a page to additional content, how that content is exposed to screen reader users, and how it differs from aria-describedby. This article explains aria-details in plain language, showing how it connects elements on a page to additional content, how that content is exposed to screen reader users, and how it differs from aria-describedby.

Read the full article

]]> Understanding aria-roledescription https://www.maxdesign.com.au/articles/aria-roledescription-explained.html https://www.maxdesign.com.au/articles/aria-roledescription-explained.html Wed, 12 Aug 2026 09:00:30 +1000 Russ Weakley HTML Accessibility This article explains aria-roledescription in plain language, starting with how native and ARIA roles work, then showing how it can override how a role is announced, without creating a new role. This article explains aria-roledescription in plain language, starting with how native and ARIA roles work, then showing how it can override how a role is announced, without creating a new role.

Read the full article

]]> Understanding aria-activedescendant https://www.maxdesign.com.au/articles/aria-activedescendant-explained.html https://www.maxdesign.com.au/articles/aria-activedescendant-explained.html Tue, 11 Aug 2026 09:00:30 +1000 Russ Weakley HTML Accessibility This article explains aria-activedescendant in plain language, starting with a familiar native select and then showing what changes when developers build their own custom version. This article explains aria-activedescendant in plain language, starting with a familiar native select and then showing what changes when developers build their own custom version.

Read the full article

]]> A bookmarklet highlighting mismatches between the visible label and accessible name https://www.maxdesign.com.au/articles/mismatch-bookmarklet.html https://www.maxdesign.com.au/articles/mismatch-bookmarklet.html Mon, 08 Jun 2026 09:00:30 +1000 Russ Weakley HTML Accessibility A bookmarklet that highlights accessible names for links that match, partially match or mismatch. A bookmarklet that highlights accessible names for links that match, partially match or mismatch.

]]> A bookmarklet highlighting roles that must never have author-provided names https://www.maxdesign.com.au/articles/name-bookmarklet.html https://www.maxdesign.com.au/articles/name-bookmarklet.html Sun, 07 Jun 2026 13:10:30 +1000 Russ Weakley HTML Accessibility This bookmarklet highlights elements with name-prohibited roles. A bookmarklet that highlights ARIA roles where author-provided accessible names are forbidden. A practical way to find naming errors and better understand ARIA naming rules.

]]> Using the browser console for accessibility testing - Part 2 https://www.maxdesign.com.au/articles/console2.html https://www.maxdesign.com.au/articles/console2.html Sunday, 07 June 2026 10:20:30 +1000 Russ Weakley HTML Accessibility Learn how to use browser console scripts to test aria-invalid, aria-hidden, aria-expanded, tabindex, accessible names, required fields and name-prohibited roles. Build on browser-based accessibility testing techniques using the console. This article explores additional JavaScript snippets that help inspect accessible names, descriptions, roles, states and properties directly in the browser.

]]>