Skip to main content

Sara Soueidan

Sara Soueidan is an independent inclusive design engineer, author, speaker, and trainer from Lebanon.

She works with companies around the world building Web user interfaces and digital products with focus on responsive design, accessibility, performance, and cutting-edge tech. And she teaches designers and developers how to create inclusive web user interfaces.

Sara is the creator of the “Practical Accessibility” course—a get-right-down-to-it online video course for Web designers and developers who want to start creating more accessible Web user interfaces and digital products today.

She is also the author of the Codrops CSS Reference and co-author of Smashing Book 5. She blogs about inclusive design engineering on her blog, and delivers talks and workshops at events worldwide, as well as in-house, sharing practical insights and tried-and-true practices for building scalable, resilient front-end foundations.

Sara Soueidan's Talk

Building Inclusive Experiences with CSS and SVG

Monday, 23th – 10:40

Just like their range of skills, the front-end developer’s responsibilities may vary across teams, but one things remains the same: a front-end developer can either make or break a user’s experience. We build the interface that users interact with, and how we do it has a direct impact on how the user feels when they do, and most importantly, whether or not they can use it properly. CSS is one of the most powerful UI tools in our arsenal. In this talk, Sara will show a wide range of possibilities that CSS offers to improve the overall user experience of your UI. She’ll talk about theming and optimizing your UI for foreign and uncontrollable environments. We’ll cover how we can use css variables in combination with the HSL color format to create performant live themes that are also maintainable and dev- and designer-friendly. We’ll talk about some very simple things you can (and should) do in your CSS, markup, and using SVG, to optimize your product for Windows High Contrast Mode (WHCM) and other foreign environments, and what we can learn from the latter about making our UIs generally more inclusive. We’ll be talking about a few fairly new CSS media queries as we go, and how we can make our interface respond to system user queries. You’ll learn how to take advantage of the full power of CSS Variables to offer your users a way to customize your product’s interface to their needs. All this within the context of accessibility and UX best practices.