Obsolete Presentational Markup: <center>, <font>, and the align Attribute
HTML4 blurred the line between structure and presentation: tags like <center> and <font>, and attributes like align, existed purely to control how something looked, baked directly into the markup rather than left to CSS. HTML5 dropped or deprecated most of them — not as a stylistic preference, but because mixing presentation into structural markup makes content harder for assistive technology (and search engines, and future redesigns) to interpret reliably.
This falls under WCAG Success Criterion 1.3.1 (Info and Relationships), Level A — the same criterion that covers headings, lists, and tables being marked up according to what they actually are.
The obsolete elements, and what replaces them
| Obsolete | Replace with |
|---|---|
<center> | CSS text-align: center (for text) or margin: 0 auto (for block elements) |
<font> | CSS font-family, font-size, and color properties |
<big> | A CSS font-size value |
<strike> | <s> or <del> if the meaning is genuinely semantic (a struck-through price, a tracked deletion), or CSS text-decoration: line-through if it's purely visual |
<tt> | <code> or <kbd> if the content is code or user input, or CSS font-family: monospace if it's purely visual |
align attribute (on any element) | CSS text-align, margin, flexbox, or grid, depending on what layout it was trying to achieve |
<!-- Before -->
<center><font color="red" size="5">Sale ends today</font></center>
<td align="center">Confirmed</td>
<!-- After -->
<p style="text-align: center; color: red; font-size: 1.5rem;">Sale ends today</p>
<td style="text-align: center;">Confirmed</td>
Why this keeps showing up on old or third-party embedded content
Almost nobody writes <center> tags in a modern hand-built codebase. This violation shows up most often in embedded third-party widgets, legacy CMS content that was never migrated, or HTML generated by an old export tool (some email templates and PDF-to-HTML converters still emit this markup by default) — this exact pattern is common enough on Google's own search results page, for instance, that it's one of the first things an automated scan of almost any site with legacy or embedded content will surface.
The practical fix strategy
If the markup is coming from your own templates, replace it directly using the table above. If it's coming from an embedded widget or third-party script you don't control, the realistic options are: ask the vendor for an updated embed, replace the widget with a modern alternative, or — if neither is possible — accept it as a known, documented limitation rather than silently ignoring it. WCAG conformance reports are meant to disclose what wasn't fixed and why, not just what was.
Official references
Common questions
- Why are tags like center and font a problem?
- They mix how content looks into the markup instead of leaving it to CSS. That obsolete presentational markup can confuse assistive technology and is no longer valid HTML5.
- What should replace obsolete presentational tags?
- Use CSS: `text-align` instead of `<center>` or the `align` attribute, and `font-family`, `font-size`, and `color` instead of `<font>`. Keep HTML for structure and meaning only.
- Is using center or font an automatic WCAG failure?
- It is invalid HTML5 and works against SC 1.3.1 by muddying structure. The reliable fix is to move all presentation to CSS and reserve HTML for semantics.
Related articles
Want to see how your own site scores?
Run a free accessibility scan