DEV Community

Cover image for Memory Bank: Labels In HTML
Uzair Shamim
Uzair Shamim

Posted on

Memory Bank: Labels In HTML

What is the right way to label something in HTML?

This came up in something I was working on recently. I always forget the best practices for labeling so I wanted to write this blog post to help me remember... and as a quick reference when I inevitably forget 😉.

Default Accessible Names

Some elements provide a default accessible name that can be used by screen readers to provide a label for a given element. For example in a button the value between the open and close tags is the default accessible name.

<button>this is a close button</button>
Enter fullscreen mode Exit fullscreen mode

Sometimes the default accessible name is inaccurate and a separate label needs to be provided to give users accurate context. In these situations labels can help.

Imagine if the in the code above needed to have X as its text. This is not very informative to screen reader users and we need a better way to indicate what this button does. There are also many elements that do not have default accessible names, so we may need to provide labels for them as well.

Full post here: https://pureooze.com/blog/posts/2025-10-07-memory-bank-labels-in-html/

Top comments (0)