Shaping Tomorrow, Inclusively Today - A Blog About Accessibility

5 Essential Advanced Tailwind Tips

5 Essential Advanced Tailwind Tips

Henri Remonen

Tailwind has gained a lot of popularity. Because of its utility-first approach, it is easy and intuitive to get started with. I feel like the main benefit is not having to juggle between separate CSS files speeding up the development process. This is not a tutorial on how to set up Tailwind. Nor will I cover how to center a div. I’ll showcase five Tailwind techniques which helped me on my dev journey and I’ve found out to be the most helpful.
ARIA: What Every Developer Needs to Know

ARIA: What Every Developer Needs to Know

Henri Remonen

We've referred to WAI-ARIA or ARIA in our posts before. Perhaps it has been treated like some kind of fairy dust that just magically solves all the problems regarding accessibility. Well, kind of that's what it's about, but if used excessively just to boast in your tech meet-ups, you probably do not know ARIA. Stop being the that person who talks about something they do not fully understand and learn when ARIA really is useful.
Start Fostering the Accessibility Tree

Start Fostering the Accessibility Tree

Henri Remonen

When talking about trees you probably think of a forest or something like that, not so much a accessibility tree in your browser. However, if you do not foster your accessibility tree accordingly, it will start rotting and we do not like rot in our trees.
What is color contrast accessibility

What is Color Contrast Accessibility – Getting Accessibility Just Right

Henri Remonen

Have you ever visited a website with a color scheme that seemed really washed out and difficult to read? It's not just a matter of orange text on a green background - sometimes the colors are so pale that even people with perfect eyesight have to squint to read the text. I'm not sure if these websites are trying to be modern or what, but it's definitely not user-friendly. Developers and designers need to take these things into consideration to ensure that users can easily read and navigate their sites.
A shocked person viewing a web page with non-descriptive links. A list of links window is open on the side.

Crushing Descriptive Links – Getting Accessibility Just Right

Henri Remonen

Have you noticed that some links on the web are not very descriptive and don't give you a good idea of where they will take you? This can make it harder for users to navigate the web since they rely on the information scent provided by the links to decide where to go next. To make the user experience more accessible and enjoyable, it's important to use descriptive links that clearly explain where the user will end up if they click on them. If you're interested in learning more about how to create effective link texts, check out this post!
Accessible Navbar In Next.js. React, Next.js - Frontend.

Start Creating Accessible Navbars in Next.js 14

Henri Remonen

Creating navbars is kinda easy right? Well yes, but have you considered the accessibility aspects of the navbar. This post is more of a guide on how to implement an accessible navbar in React. However, the underlying HTML can be integrated into your workflow regardless of the framework.
Blind person navigating a website with a white cane. Once hit an image, an alternative text is read.

Effortless Alternative Texts for Accessibility – Getting Accessibility Just Right

Henri Remonen

Ah, the good old alt texts. When I first started my journey as a dev I was like what alt texts? Then a little later on my journey, I was like "Picture of..." until I had come to the conclusion: I don't know sh*t about alt texts. In this post, I will highlight the why, how, and when of alt texts. Do not be like the earlier version of me, learn how to take the most out of the alt text attribute right now.
Person in wheelchair in front of a computer questioning keyboard accessibility.

Painless Keyboard Accessibility – Getting Accessibility Just Right

Henri Remonen

Have you ever tried to navigate the web using just your keyboard? You perhaps found out that it is not always an easy job to do. Depending on the webpage it may seem like the navigation has been really thought out, but sometimes not so much. Reading this post will equip you with the essential knowledge about this fine craft.
Non-semantic HTML layout with a red cross and arrow pointing to a semantic HTML layout with green check mark.

Essential Semantic HTML – Getting Accessibility Just Right

Henri Remonen

Semantic HTML is a crucial part of the markup language to get the most default functionality out of HTML. Writing semantic HTML not only makes it more readable, requires less custom logic but also comes with pre-defined accessibility features. There is not a single good reason not to write semantic HTML over non-semantic HTML.
A Quick Guide to Digital Accessibility - Navigating the Digital Landscape

A Quick Guide to Digital Accessibility – Navigating the Digital Landscape

Henri Remonen

Have you ever wondered what digital accessibility really means? When I first heard the term, I was somewhat unsure of what it entailed. However, as I delved deeper into the subject, I realized that accessibility is all about creating an inclusive experience for everyone, regardless of their abilities. It goes beyond just catering to those with disabilities, ensuring that all users have equal access to the same information and functionality. So why not take a closer look and learn more about how we can make the digital world more accessible for everyone?