Skip to content
tezvyn:

Accessible Writing: Structure is Meaning

Source: w3.orgMediumHow cards are made

Accessible Writing: Structure is Meaning

Accessible writing structures content for both humans and assistive tech. It applies to page titles, headings, and link text. The footgun is faking structure with visual styles instead of using semantic HTML, which leaves screen reader users lost.

Why it exists

People with disabilities often use assistive technologies like screen readers to navigate the web. If content lacks clear, semantic structure, it's like trying to read a book with no chapter titles or page numbers—confusing and inefficient. Accessible writing embeds meaning directly into the content's structure, making it navigable for everyone.

The mental model

Think of your content as having two audiences: a human reader who sees visual layout, and a machine reader (like a screen reader) that only understands semantic structure. Accessible writing serves both. For the machine, an <h1> tag isn't just big text; it's the main topic. A link isn't just blue text; its description tells the user where they're going. Your job is to make the semantic structure match the visual one.

How it works

You implement accessible writing by using standard HTML elements for their intended purpose. First, give every page a unique, descriptive <title> that puts the most important info first (e.g., "Article Name • Site Name"). Second, structure your document with a single <h1> and a logical hierarchy of <h2>, <h3>, etc., to create a navigable outline. Third, make link text meaningful on its own, avoiding generic phrases like "click here." Fourth, write descriptive alt text for images so users who can't see them understand their purpose. Finally, provide transcripts for audio and captions for video.

When to use it

Always. Accessible writing is a core part of modern web development and content strategy, not an optional add-on. It is essential for any public-facing website, internal documentation, or application interface to comply with legal standards like the Web Content Accessibility Guidelines (WCAG) and to reach the widest possible audience. It also improves SEO and usability for everyone.

When not to use it

There is no situation where inaccessible writing is preferable. While the level of effort might scale with the complexity of the content, the fundamental principles should always be applied. Deliberately ignoring accessibility creates a poor user experience, excludes a significant portion of the population, and carries legal risk.

One canonical example

A common failure is marking up a section header with bold text instead of a proper heading tag. A sighted user sees a line like Our Services and understands it as a heading. But a screen reader user just hears "Our Services" as part of a continuous block of text, with no indication it's a new section. The correct implementation, <h2>Our Services</h2>, allows the screen reader to announce "Heading level 2, Our Services" and lets the user jump directly to that section, navigating the page by its outline.

Interview question

A developer styles a paragraph of text to look like a heading using CSS. What is the primary accessibility issue with this approach?

  • a.Sighted users may find the visual styling inconsistent across browsers.
  • b.Screen readers will not identify it as a heading, hindering structural navigation.Correct
  • c.The text will not automatically adjust its size on different screen resolutions.
  • d.Search engines will not recognize it as a heading, negatively impacting SEO.
Why?

The card emphasizes that faking structure with visual styles (like bold text) instead of semantic HTML (like an h2 tag) leaves screen reader users lost because assistive technologies cannot interpret the intended meaning. While SEO can be affected, the core problem highlighted is the inability for screen readers to recognize and allow navigation by headings.

Just read this? Test yourself on what you have been reading.

Read the original → w3.org

You just looked this up. Could you explain it out loud?

That is the part interviews actually test. Tezvyn takes questions like this one and gives you what the interviewer is really checking, the answer that lands, and the mistake that ends the conversation, in the four minutes before your next meeting.

The iPhone app is on the way

We are building it. Until it lands, nothing here is held back from you: every interview card, your saved cards, streaks and the job board all work in Safari, plus hundreds of free practice quizzes of thirty questions each. Sign in and it all carries over to the app the day it arrives.

Want it as an icon? Tap Share at the bottom of Safari, then Add to Home Screen. It opens full screen and the cards you have read stay available offline.

Get it on Google PlayiPhone app coming soon

We are hiring for this. Open roles that interview on accessibility — each one lists the topics its interview covers.

See open roles