Page 15 - Barrierefreiheit

Icons are omnipresent in every UI, and yet they are frequently used incorrectly. Too large, wrong color, not accessible, shipped as PNG instead of SVG. This guide shows how to use Heroicons, Phosphor Icons and inline SVG with Tailwind CSS v4 correctly and performantly.

Selecting a payment method is its own accessibility topic, separate from the rest of the checkout form: radio buttons are often visually dressed up as cards for marketing reasons, payment providers like PayPal and Stripe embed their own iframes whose internal focus behavior sits outside your control, and a 3-D Secure modal pulls the user onto a foreign domain right in the middle of the payment flow. Getting these three building blocks right prevents screen reader users from failing at the very last step before checkout completes.

A one-time accessibility audit closes a list of tickets, but not the gap that reopens with every new feature. This article shows how automated CI checks, recurring manual audits, and a real feedback channel work together so accessibility stays a lasting process, and accessibility debt is tracked openly instead of being marked as done and forgotten.

Product galleries with multiple images, a zoom feature, and carousel navigation are among the most complex building blocks of a product page. Adding alt text alone while forgetting keyboard operation, focus management, and screen reader announcements results in a gallery that stays unusable for many groups of users. This article shows a complete, field tested pattern for accessible product galleries in Magento and Hyva.

The CSS Popover API solves a problem that has plagued the web for years: dropdowns, tooltips, and modal overlays always had to be implemented with JavaScript. With the native popover attribute, ::backdrop, and the :popover-open pseudo-class, the browser now provides a complete solution that is accessible, performant, and free of external dependencies.

Storybook and Tailwind CSS are a natural combination: Tailwind provides the design system foundation through utility classes, Storybook makes it visible, testable and documented for the whole team. The result is a living component catalog that stays in sync with the code.