A Guide to Accessible Interactive Components using React Libraries

May 29, 2020 Content Warning: This blog post contains gifs. I’ve wanted to write this blog post ever since I wrote a11y and JS – A Seemingly Unconventional Romance. I love JavaScript, and my job is to code in React. I often observe folks (rightly) critique that React Apps are inaccessible. According to the WebAIM… Continue reading A Guide to Accessible Interactive Components using React Libraries

Creating an Accessible Range Slider with CSS

April 29, 2020 I’ve always loved exploring how to make semantic, accessible elements aesthetically pleasing. And yes, it is possible. Challenging myself to do this has improved my CSS skills. Today we are going to talk about input[type=”range”]. These inputs where you select a value from a slider that has a thumb on it. You… Continue reading Creating an Accessible Range Slider with CSS

Neumorphism – the accessible and inclusive way

Neu…what now? Neumorphism is a fancy word for a user interface design trend. It derives its name from skeumorphism – a way of integrating real-world objects into user interface design. The classic example is the trash can. Neumorphism is basically “New Skeumorphism”,  so skeumorphism with a modern twist. It’s got a bit of a “soft”… Continue reading Neumorphism – the accessible and inclusive way

Becoming a climate positive company

2019 was the year where 16 year old Greta Thunberg helped make the environment the number one issue on peoples mind. The media primarily focused on countries and their politicians. Conscious individuals tried to do their part in reducing emissions by flying less, eating less meat etc. Here in Sweden “flight shame” and “shop shame”… Continue reading Becoming a climate positive company

How Accessibility Taught me to be Better at JavaScript – Part Two

January 14, 2020 Content Warning: There are gifs in this post. Hey friends! Today’s writing is going to be a follow up to How Accessibility Taught Me to be Better At JavaScript. If you have read my content, one of my favorite topics is about JavaScript and Accessibility. I speak about how JavaScript is actually… Continue reading How Accessibility Taught me to be Better at JavaScript – Part Two

10 ways to help Accessibility at Conferences as a speaker

November 26, 2019 Hey friends! Wedding planning is starting to heat up with five months left to go. I was pretty ambitious about my writing schedule when I started my second year of blogging. I figured I had so much more free time on my hands versus what I had six months ago. But I… Continue reading 10 ways to help Accessibility at Conferences as a speaker

What is a screen reader?

Screen reader basics I use a screen reader on my mobile device every day, so it’s a technology I’m very familiar with. But I know it’s new and strange to most people. So let’s go through the basics! Screen readers are mainly used by people with no or limited vision to get information in a… Continue reading What is a screen reader?

Using Color Theory to Improve Website Accessibility

There are tons of articles and guides about color theory and its importance for every web designer. Colors are really essential in design and may even influence people’s behavior in many cases. Thus, web designers usually check their website colors are suitable for the overall website style and that they create a good impression for… Continue reading Using Color Theory to Improve Website Accessibility

Accessibility for Modern Responsive Website Layouts

The older methods of web design have fallen by the wayside to make room for HTML5/CSS3 design. Unfortunately when you’ve become ingrained with older design techniques it can be difficult to extricate yourself from the outdated workflow. But modern usability centers around responsive design and requires more attention to detail. The following design tips are… Continue reading Accessibility for Modern Responsive Website Layouts

Making SVG Accessible

1: Treat linked SVG images as you would bitmaps When linking to an SVG document as an image, the alt attribute is still required: <img src=”coca-cola-logo.svg” alt=”Coca-Cola”> … just like a regular bitmap. 2: If you’re using inline SVG, provide a title The <title> of an SVG element serves a similar purpose to the <title>… Continue reading Making SVG Accessible