Accessible modals aren’t hard to make, and you can make your modal dialogs accessible if you keep four simple requirements. Implementing them can be done easily by using the code examples in this blog post, where I use the HTML5
<dialog>
polyfill to do so. Read this article, and you can do the same with any modal dialog library/framework that you use today. This post includes a working demo and a video outlining how it works using both mobile and desktop screen readers.
Creating Accessible HTML5 Modal Dialogs For Desktop and Mobile
Tags: accessibility · dialog · HTML5 · modal role · Uncategorized
Flex Layout Fail: Fixing Firefox’s Keyboard Accessibility Bug With The CSS order
Property
Firefox, unlike every other browser on the planet, changes the way that keyboard navigation works in designs that use the CSS
order
property. Since a lot of developers use flexbox, this can create a lot of cross-browser accessibility issues. This article shows a fix for this problem using a small amount of Javascript.
Tags: accessibility · CSS · flex-layout · order · Uncategorized