Deprecated HTML Tags: What They Are and How to Replace Them

What are deprecated HTML tags?

These elements come from the Netscape Navigator and Internet Explorer era, before CSS existed. The font tag set color and size, center centered content, and marquee scrolled text. Stylesheets took over those jobs, and semantic HTML replaced presentational markup.

The history differs by tag. HTML 4.01 deprecated font and center. Marquee began as an Internet Explorer extension and never made it into the HTML 4 specifications at all. The HTML obsolete features list in the HTML Living Standard, which WHATWG maintains, now names all three as obsolete and non-conforming. Authors must not use them, and the Nu Html Checker reports an error.

Browsers keep drawing them, so a page can look perfect and still be full of them. Take <font color="red">Sale</font>: the modern version is <span class="sale-note">Sale</span> with the colour set in a stylesheet, which keeps content and presentation apart. The s and u tags are valid, because HTML5 gave them new meanings.

Deprecated, obsolete and non-conforming: are they different?

Deprecated is the older HTML 4 word, and the one MDN uses. Obsolete and non-conforming are the current standard's words. In daily practice, deprecated vs obsolete makes no difference: replace the tag.

How SEO Site Checker tests for deprecated HTML tags

Our report does not read your raw source file. It loads the page like a visitor and searches what comes out.

The exact rule: the check fails when the rendered page contains at least one font, center or marquee element, in any letter case, anywhere in the document. There is no warning level, only pass or fail.

What the check looks at

Headless Chromium opens your URL, waits for the load event and takes the rendered DOM. A parser then searches that DOM for the three tag names. A tag injected by JavaScript before the load event counts, and so does one inside a noscript or template block.

What passes and what fails

A fail shows a red icon, the tag names found and a How to Fix button. The failed message counts distinct tag names, so forty font tags report one deprecated tag.

What it does not test

Pages that only mention the tag in an HTML comment or a JavaScript string pass, because neither is a DOM element. It also skips big, strike, tt, acronym, basefont, dir and applet, and attributes such as align and bgcolor. A pass means no font, center or marquee, nothing more. Frames have their own Framesets check.

Run the free report on my page

Do deprecated HTML tags hurt SEO?

We found no Google Search Central documentation that treats these tags as a ranking factor, so doubt any page promising a jump from removing them. The real costs are indirect.

Scattered styling slows every redesign. Accessibility is the sharper problem. Marquee moves content unprompted, and criterion 2.2.2 in the WCAG pause stop hide rule from the W3C expects a way to pause, stop or hide moving content that lasts longer than five seconds. A few old tags usually mean a legacy theme or pasted HTML, and in our report they count as one failed item, so clearing them removes that failure.

List of deprecated HTML tags and what to use instead

Use this table when a tag turns up in your source. The last column shows what our report tests.

A few relics belong in the same pile. The applet tag gives way to the object element, the basefont tag becomes CSS on the body, the dir tag becomes a plain ul, and blink is no longer drawn by any current browser, so delete it. Rarer ones turn up in very old pages: isindex gives way to a form with an input, xmp and plaintext to pre with code, nobr to the CSS white-space property, and bgsound to the audio element. Presentational attributes follow the same logic, so align becomes text-align, bgcolor becomes background-color and valign becomes vertical-align. The MDN obsolete elements list covers anything unfamiliar,.

How to replace deprecated HTML tags

1. Find them. Start from the tag name in the report, then search your source files.
2. Replace them. Swap font, center and marquee for CSS, as shown below.
3. Fix the source. Edit the template, saved content or plugin that prints the tag.
4. Re-test. Clear caches and run the check again.

Find every instance first

This recursive, case-insensitive search finds every hit. The paths are placeholders.

grep -rniE "<(font|center|marquee)[[:space:]/>]" path/to/your-theme path/to/exported-content

The report names only three tags, so the other obsolete elements need a different net. Run the page through the W3C Nu Html Checker or the W3C Markup Validation Service, which report each obsolete element as an error, or widen the search above with the other tag names added.

Replace font, center and marquee

Font becomes a span with a class, and size 4 is about 18px, which is 1.125rem in the stylesheet below. For center, remove the element and put text-align: center on its parent or on a wrapping div. A fixed-width block needs margin: 0 auto instead. Marquee needs a wrapper, because the animation moves the inner span.

<!-- before -->
<font color="red" size="4">Sale ends Friday</font>
<center>Welcome</center>
<marquee>Free shipping this week</marquee>
<!-- after -->
<span class="sale-note">Sale ends Friday</span>
<div class="text-center">Welcome</div>
<div class="ticker"><span>Free shipping this week</span></div>

.sale-note { color: #c0392b; font-size: 1.125rem; }
.text-center { text-align: center; }
.ticker { overflow: hidden; white-space: nowrap; }
.ticker span { display: inline-block; padding-left: 100%; animation: ticker 15s linear infinite; }
@keyframes ticker { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) { .ticker span { animation: none; padding-left: 0; } }

The media query helps visitors who ask for less motion, but it is not a pause button. Any ticker that runs longer than five seconds needs a visible pause control to meet WCAG 2.2.2, and the simplest compliant option is static text.

Re-run the check

Clear your page, CDN and plugin caches, then run the free report on the same URL. A fresh failure usually means a script adds the tag.

Where deprecated tags hide in WordPress, Shopify and page builders

On WordPress the usual culprits are an old theme, plugin templates and classic editor posts. Open Appearance, then Theme File Editor (under Tools on block themes), search the template files and check Custom HTML blocks in older posts. A center tag in newer block editor content usually arrived by paste, a Custom HTML block or a plugin.

On Shopify, open Online Store, Themes, Edit code, and search the layout, section and snippet files, then check product descriptions in HTML view. Wix and Squarespace hits come from Code or Embed blocks and header injection.

Widgets, ad scripts and chat tools can add tags while the page loads, and our check sees those. A script that injects markup later, after the load event, can slip past the report, so use the browser developer tools to check for it. A tag that shows in view page source comes from your files, while one only in the developer tools comes from a script.

Mistakes to avoid when removing deprecated tags

• Swapping font for inline styles. That only moves the mess; use a class and a stylesheet, as the inline CSS guide explains.
• Deleting center with no replacement. The content ends up jammed against the left edge, so add the text-align rule in the same edit.
• Rewriting s and u. Both are valid HTML with their own meanings today, so leave them in place.
• Fixing only the template. Posts and pages already saved in your database keep their old tags until you edit each one.

Watch out: a pass here covers font, center and marquee only, so use the table above as a cleanup list for the rest.