Chris DeMars is a front end developer first, UX architect always, from Detroit, Michigan. For his community contributions, he holds awards as a Microsoft MVP in developer technologies and Google Developer Expert in web technologies. He is also an international speaker and organizer for Vuetroit and co-organizer for the Ann Arbor Accessibility Group. Chris loves coming up with solutions for enterprise applications, which include modular CSS architectures, performance, and advocating for web accessibility. When he is not working on making the web great and inclusive you can find him writing blog posts, recording episodes of his podcast, Tales From The Script, watching horror movies, or in the woods of northern Michigan.
When we think of CSS and Accessibility, what comes to mind? Is it adding alt attributes to image tags? How about color contrast? Is :focus given that much thought since browser’s style these by default? Often, focus outlines are turned off in CSS to meet non-inclusive design standards, but this causes problems for keyboard users. How can we make the web a more inclusive place while maintaining design intent?
As we build more and more things on the web, we must do our part in building awesome, accessible user experiences. Except native default browser styling of the :focus pseudo class is rather blah, don’t you think? There has to be a better way to add some pizzazz to elements when users navigate without a mouse. In this talk, I will demo numerous ways to provide custom focus styles despite known limitations in the web platform. For users with disabilities, it’s imperative that visual design finds a way to meet in the middle.