Global Accessibility Awareness Day comes around every year, and every year the same question follows: Okay, but what do I actually do?

It’s a fair question. Accessibility can feel like a mountain, and a lot of the advice out there is either too vague (“be more inclusive!”) or too technical to act on without a full dev sprint. Neither is helpful when you have a website to run and 47 other things on your to-do list.

So here’s the version that skips all that. Eight things – real things – you can do today. Some take five minutes, some take even less. A few you can literally copy and paste. None of them require a platform overhaul or a six-month roadmap.

Happy GAAD! Let’s go.

This is the fastest fix on this list. One line of CSS. Do it right now.

a {

  text-decoration: underline;

}

Why it matters: Color alone isn’t enough to distinguish a link from regular text. For people with color blindness, a blue (or green, or purple) link that isn’t underlined can be invisible as a link. Underlining is the clearest, most universal signal that something is clickable.

Worth noting: this rule is about in-content links. Navigation menus are understood by context. But anything in your body copy that links somewhere? Underline it.

Here’s a scope that makes this feel doable today: Open your homepage. Look at every button and CTA.

If any of them say “learn more,” “click here,” “read more,” or “find out more” – those are your first targets. Screen reader users often navigate by jumping between links on a page, which means they hear those links without any surrounding context. “Learn more” tells them nothing. “Read our guide to web accessibility” tells them exactly where they’re going.

The fix is to make your link text describe the destination:

Instead of: “To find out more, [click here].”
Try: “[Read our guide to web accessibility].”

Don’t try to fix your whole site today. Fix your homepage CTAs. Then your main navigation labels. Work outward from there.

3. Sort your heading hierarchy

Headings aren’t just for making text look bigger. They’re how screen readers understand the structure of your page – essentially a table of contents that people can navigate by. If that table of contents is scrambled, the page stops making sense.

The rules of thumb:

  • One H1 per page (usually your page or post title)
  • H2s for major sections
  • H3s for subsections within those
  • Don’t skip levels (no jumping from H2 to H4)
  • Don’t use heading levels for visual styling – if you want bigger text, use CSS

Start with your homepage. Open your browser inspector (right-click → Inspect → Elements) and look at your heading structure. You can also use the free Silktide Toolbar to visualize it without touching any code.

4. Add alt text to your homepage images

Alt text as a project can feel enormous. Alt text as “let me look at the images on my homepage right now” is something you can do before lunch.

Here’s what good alt text is:

  • Meaningful images get alt text that conveys what the image contributes, not just what it shows. A photo of a team in an office might warrant “The Silktide team at our Birmingham office” – or it might be decorative, in which case…
  • Decorative images get an empty alt attribute: alt=””. This tells screen readers to skip them entirely. Don’t write “decorative image” – just leave it empty.
  • Functional images – a search icon, a download arrow, a play button, an image that is a link – get alt text that describes what the image does. “Search” not “magnifying glass.” “Download PDF” not “arrow pointing down.”

Again, today just start with your homepage. Then your most-visited pages. This is a marathon, not a sprint – but you can start the marathon today.

5. Make focus visible

If someone can’t use a mouse, they navigate your site by pressing Tab. Every time they do, the focus moves to the next interactive element – a link, a button, a form field. The question is: can they see where they are?

This is a fix that takes about thirty seconds to add and makes a real difference for keyboard users. 

:focus-visible {

  outline: 3px solid #000;

  outline-offset: 3px;

  box-shadow: 0 0 0 6px #fff, 0 0 0 9px #000;

}

Black outline, white gap, black outer ring.  The Oreo Cookie focus style by Erik Kroes.  It just works.

A skip link lets keyboard users jump straight to the main content instead of tabbing through your entire navigation on every single page. It’s invisible until it’s needed, and it’s one of the most meaningful things you can do for non-mouse users.

Here’s the thing: this fix has three parts, and all three are required. We’ve seen too many sites with skip links that do absolutely nothing because step 2 got missed. The link exists, the keyboard user presses it, and nothing happens. That’s arguably worse than no skip link at all – it’s a broken promise.

Step 1: Add the link at the very top of the page

<a href="#main" class="skip-link">Skip to main content</a>

Step 2: Give your main content a matching ID

<main id="main">

This is the step that gets skipped. Without it, href=”#main” points to nothing.  Usually you want to put it right above your H1.

Step 3: Hide the link visually until it’s focused

.skip-link {

  position: absolute;

  left: -9999px;

}

.skip-link:focus {

  position: static;

  left: auto;

  background: #000;

  color: #fff;

  padding: 1rem;

}

Now when a keyboard user presses Tab, the skip link appears – right at the top of the page, right when they need it.  Make sure you check it out yourself to ensure it works.

7. Remove autoplay and fix form fields

These don’t need much explanation – both are common, both are fixable fast.

Stop autoplaying media. If anything on your site moves, plays, or makes noise without the user asking it to, that’s a barrier – for people with vestibular disorders, cognitive impairments, and anyone who opened your site in a quiet room and got jumpscared. Remove autoplay from your video and audio elements, or at minimum add muted and give users a clear way to stop it.

Label your form fields properly. Placeholder text isn’t a label. When someone clicks into a field, the placeholder disappears – and if they can’t remember what the field was for, they’re stuck. Use real <label> elements, associated with their inputs:

<label for="email">Email address</label>

<input type="email" id="email" name="email">

The for attribute on the label matches the id on the input. That’s the whole thing.

Not perfect? Still progress.

You don’t have to fix everything today. You probably can’t. But you can fix something today, and that matters.

Start here. One fix, one page, one team conversation at a time.

If you want to see what else might need attention on your site, the Silktide Toolbar is a free browser extension that shows you color contrast, focus order, alt text in context, heading structure, and a lot more.

Give us an hour, and you’ll never look at your phone the same way. Use our Field Guide for an easy-to-follow experience of barriers on the web using the screen reader on your phone.

Happy Global Accessibility Awareness Day! Now go fix something.