10 Questions to Ask Before Calling Your Design Complete

Posted
Tags
Accessibility UI/UX
Share
On the left there is a 5 items on a checklist that have x mark and an accessibility symbol with a sad face. On the right there is a 5 items on a checklist that have check mark and an accessibility symbol with a happy face.

Are you a designer, developer, or content creator working on websites or applications?

These 10 questions cover the fundamental accessibility considerations every design needs to address. If you can answer “yes” to all of them, you’ve got the basics covered.

While there are many more questions to ask in creating accessible design (which I’ll cover in future articles), these essentials will set a strong foundation. Let’s walk through them together!

10 Essential Accessibility Questions

1. Does your design have enough colour contrast (4.5:1)?

If you are not sure how to test colour contrast, check out this article.

This is not only about text elements but also the text on images as well.
I make a colour list with a contrast check with light and dark brand colours.

There is a list of 2 colours with their use and colour contrast check with the light and dark colour.

2. Does your content follow a logical heading structure?

Your headlines need to make visual sense for sighted users AND maintain a logical structure for screen readers.

Sometimes a heading might need to look smaller visually (like an h3) but actually be an h2 in the HTML structure. Make sure to communicate this with your development team. The visual style can differ from the semantic structure, as long as both serve their purpose well. If you are not sure what I mean here, check out this article about “Separate heading style from heading level.”

3. Is your content ordered logically in the structure?

Consider how different users experience your content. While sighted users can quickly scan a page and find information, screen reader users navigate content sequentially—from top to bottom, left to right.

When designing, ask yourself: What information is most critical? What do users need to know first? This helps create a structure that works well for everyone, regardless of how they access your content.

4. Is all content accessible across all devices?

While I start with rough sketches to explore ideas freely, I always consider responsive design when creating lo-fi wireframes in Figma. This early consideration is critical because no information should disappear just because someone is using a phone or tablet. Every user deserves access to the same content, regardless of their device choice.

5. Are your clickable elements easy to tap and click?

Make interactive elements at least 24x24 pixels—buttons, links, icons, anything you can click or tap. While this size requirement doesn’t apply to links within text, make sure your text has enough line height so links are still easy to tap on mobile devices. Make sure to test on your phone to confirm comfortable interaction.

6. Is your text content easily readable?

Keep lines to 80 characters maximum—this helps readers track text without losing their place. Choose readable fonts and provide enough line height to make reading comfortable, especially for longer content.

7. Are all form fields clearly labelled?

Always use visible labels for form fields—not just placeholders that disappear when users start typing. This helps everyone remember what information goes where.

On the left, there is an x mark and an input field that says email as a placeholder and a submit button. On the right, there is a check mark and an input field that says name@example.com with a label that says email and a submit button.

8. Is the meaning clear without colour?

Don’t rely solely on colour to communicate information. Add patterns, icons, or text to make your content understandable for everyone.

9. Can users control auto-playing content?

Auto-playing content that lasts more than 3 seconds must have pause and play controls. As someone who gets motion sickness easily, I know how important this control is. Give users the power to stop and start moving content—whether it’s a video, carousel, or animation.

10. Are animations and motion considerate of user preferences?

This goes beyond the pause controls we discussed earlier. For more complex animations, remember that users can set reduced motion preferences on their devices. When designing elaborate animations, either keep movements subtle or provide a reduced motion version that still communicates the same content effectively.

Conclusion

While it might feel challenging to start these discussions, especially when accessibility isn’t a priority for everyone involved, each conversation has the potential to create positive change.

It just feels great to know that making accessible design can brighten someone’s day because they felt that someone cared and made it accessible to them.

If you are a developer, check out this excellent article about accessibility improvements that take minimal effort to implement: Accessibility No-Brainers

Have I missed any critical checklist items, or do you have accessibility-focused design templates to share? Let’s connect on Mastodon!

Related articles

A web browser window displaying HTML code with headings. The code includes an H1 for the title, H2 for section titles, and H3 for card titles.

Is your website easy to navigate? How to properly structure your website 🛠️

What are headings? Aren’t they just big bold titles? That’s what I used to think too. But headings are much more than that. Headings are hierarchical elements that indicate the importance and relationship between different sections of content. They are essential for both sighted and visually impaired users. Why having a proper heading structure matters 🤔 Sighted users understand website structure …

A graphic with a teal background displaying the words 'ALT TEXT' in large letters. The text is partially obscured by a dark circular gradient, and a white label-shaped tag with the text 'ALT TEXT' overlaps the centre of the graphic.

How Alt Text Makes Your Website Better for Everyone

“Alt text is just the text that shows up when an image doesn’t load, right?” That’s what I thought when I was a software engineer. Sometimes I’d throw in a file name as alt text and other times I’d skip it entirely. What I didn’t realise back then was that alt text is not optional, it’s essential. By the end of this article, you’ll know why alt text is so important, how to write it …

There are 2 words and both say readability, one is white and the other is navy with 8 different blue background colours

Make Your Website Easy to Read for Everyone (Why Colour Contrast Matters)

Have you ever used white text on a pastel background because it looked cute? You’re not alone—I’ve done it too 🥹 By the end of this blog, you’ll understand why that is a bad idea and how to maintain a beautiful, on-brand design without compromising accessibility. Why Low Contrast is a Problem For people with low vision or colour blindness, low-contrast text can be nearly impossible to read. The …