Tag: Accessibility

1. Using Browser DevTools for Accessibility

   Feb 20, 2026

   Building accessible interfaces does not require expensive extra tooling. Chrome and Firefox already ship with an Accessibility panel, a computed name inspector and color vision deficiency simulation, everything needed to check roles, names and contrast right in the browser. This article shows how to use these built in tools effectively and where the Lighthouse Accessibility Audit reaches its limits.

   Read more

2. Using SVG Icons Accessibly

   Feb 9, 2026

   SVG icons are increasingly replacing icon fonts, but without deliberate labeling they carry no text for screen readers at all. Anyone who fails to give a meaningful icon like a wishlist heart button a clear name, and fails to hide decorative icons with aria-hidden, ends up with invisible or confusing controls. This article shows the correct technique for both cases, with a complete practical example.

   Read more

3. Conducting Manual Accessibility Audits Systematically

   Feb 6, 2026

   Automated scanners like axe-core catch only a fraction of the real barriers in an application. This guide shows how a structured manual audit with keyboard pass, screen reader pass, zoom and contrast pass, and reduced motion pass runs systematically, how findings are prioritized by real user impact instead of raw violation count, and how automated and manual results can be combined into one report that developers can actually act on.

   Read more

4. Avoiding Common ARIA Mistakes (The First Rule of ARIA)

   Feb 5, 2026

   ARIA applied incorrectly often makes web pages less accessible rather than more. This article walks through the most common ARIA mistakes in real frontends, from redundant roles to misused aria-hidden and missing required states, and delivers a practical before-and-after audit for Magento and Hyvä projects.

   Read more

5. WCAG Conformance Levels A, AA, AAA Compared

   Jan 21, 2026

   The WCAG splits its success criteria into three conformance levels: A, AA and AAA. Understanding what each level technically requires lets you set realistic goals instead of vaguely hoping for full completeness. This article explains the differences between the levels, why AA is the right legal and practical target for most commercial websites, and which individual AAA criteria are still worth adopting selectively.

   Read more

6. Using Heading Structure Correctly (h1-h6)

   Jan 1, 2026

   A correct heading structure from h1 to h6 turns a web page into a navigable table of contents for screen reader users, who jump from heading to heading with a keyboard shortcut. Skipping levels just for font size quietly breaks that navigation. This article covers the practical one h1 convention, correct hierarchies and fast audit methods for Magento and Hyva stores.

   Read more

7. Implementing Accessible Product Filters

   Dec 29, 2025

   Product filters that only work with a mouse, or that drop focus after every selection, effectively lock out keyboard and screen reader users. This article shows how to mark up checkboxes, radio buttons, and price sliders correctly in a layered navigation, make them keyboard operable, and combine them with live regions for updated result counts, all without losing focus when the product grid reloads.

   Read more

8. Correctly Calculating and Meeting Color Contrast

   Nov 27, 2025

   Color contrast determines whether text and controls are readable and recognizable at all for people with low vision, color blindness, or difficult lighting conditions. This article explains the WCAG contrast formula built on relative luminance, the thresholds for normal text, large text and UI components, shows practical checking tools for design and development, and describes how to anchor contrast rules permanently in your design system and development process.

   Read more

9. Making CAPTCHAs Accessible or Replacing Them Sensibly

   Nov 9, 2025

   Distorted text CAPTCHAs do not just stop bots, they reliably lock out blind, low vision, cognitively impaired, and motor impaired users from forms. This article shows why invisible risk scoring, honeypot fields, and proof of work challenges are more effective and more accessible than classic visual puzzles.

   Read more

10. Semantic HTML as the Foundation of Accessibility

    Oct 21, 2025

    Building interactive controls out of a generic div or span throws away keyboard support, focus order, and screen reader announcements, forcing you to rebuild all of it laboriously with ARIA. Native HTML elements like button, a, ul, and h2 deliver these properties for free. This article shows how to spot semantic mistakes in Magento and Hyvä templates and replace them with the right elements.

    Read more