Why is this an issue?

HTML5 is the fifth and current major version of HTML. HTML5 introduced many new elements, attributes, and behaviors. While HTML5 also aimed to be backward-compatible with common parsing of older versions of HTML, many old attributes were deprecated.

The main reason these attributes were deprecated in HTML5 is to separate the concerns of content structure (HTML) and presentation (CSS). This is a fundamental principle of modern web design known as the separation of concerns, which provides multiple advantages:

What is the potential impact?

Deprecated attributes are not guaranteed to be supported by all browsers, especially newer ones. This can lead to inconsistent behavior or appearance across different browsers.

How to fix it

To ensure the best user experience, deprecated attributes should not be used. This table lists the deprecated attributes this rule is checking for, and how to fix them.

Attribute Removed from Fix

accept

form

Use the accept attribute directly on the input elements instead

align

caption, col, div, embed, h1-h6, hr, iframe, img, input, legend, object, p, table, tbody, thead, tfoot, td, th, tr

Use CSS

alink

body

Use CSS

allowtransparency

iframe

Use CSS

archive

object

Use the data and type attributes to invoke plugins

axis

td, th

Use the scope attribute on the relevant th

background

body, table, thead, tbody, tfoot, tr, td, th

Use CSS

bgcolor

body, table, td, th, tr

Use CSS

border

img (border="0" allowed), object

Use CSS

bordercolor

table

Use CSS

cellpadding

table

Use CSS

cellspacing

table

Use CSS

char

col, tbody, thead, tfoot, td, th, tr

Use CSS

charoff

col, tbody, thead, tfoot, td, th, tr

Use CSS

charset

a, link

Use an HTTP `Content-Type` header on the linked resource instead

classid

object

Use the data and type attributes to invoke plugins

clear

br

Use CSS

code

object

Use the data and type attributes to invoke plugins

codebase

object

Use the data and type attributes to invoke plugins

codetype

object

Use the data and type attributes to invoke plugins

color

hr

Use CSS

compact

dl, ol, ul

Use CSS

coords

a

Use area instead of a for image maps

datafld

a, applet, button, div, fieldset, frame, iframe, img, input, label, legend, marquee, object, param, select, span, textarea

Use script and a mechanism such as XMLHttpRequest to populate the page dynamically

dataformatas

button, div, input, label, legend, marquee, object, option, select, span, table

Use script and a mechanism such as XMLHttpRequest to populate the page dynamically

datapagesize

table

Unnecessary. Omit it altogether

datasrc

a, applet, button, div, frame, iframe, img, input, label, legend, marquee, object, option, select, span, table, textarea

Use script and a mechanism such as XMLHttpRequest to populate the page dynamically

declare

object

Repeat the object element completely each time the resource is to be reused

event

script

Use DOM events mechanisms to register event listeners

for

script

Use DOM events mechanisms to register event listeners

frame

table

Use CSS

frameborder

iframe

Use CSS

height

td, th

Use CSS

hspace

embed, iframe, img, input, object

Use CSS

ismap

input

Unnecessary. Omit it altogether

language

script (language="javascript", case insensitive, allowed)

use the type attribute instead

link

body

Use CSS

lowsrc

img

Use a progressive JPEG image (given in the src attribute), instead of using two separate images

marginbottom

body

Use CSS

marginheight

body, iframe

Use CSS

marginleft

body

Use CSS

marginright

body

Use CSS

margintop

body

Use CSS

marginwidth

body, iframe

Use CSS

methods

a, link

Use the HTTP OPTIONS feature instead

name

a (name="[a's element id]" allowed), embed, img, option

Use the id attribute instead

nohref

area

Omitting the href attribute is sufficient; the nohref attribute is unnecessary. Omit it altogether

noshade

hr

Use CSS

nowrap

td, th

Use CSS

profile

head

Unnecessary. Omit it altogether

rules

table

Use CSS

scheme

meta

Use only one scheme per field, or make the scheme declaration part of the value

scope

td

Use th elements for heading cells

scrolling

iframe

Use CSS

shape

a

Use area instead of a for image maps

size

hr

Use CSS

standby

object

Optimize the linked resource so that it loads quickly or, at least, incrementally

summary

table
  • Use a p element before the table
  • In the table’s caption
  • Before the table, in a figcaption in the same figure as the table

target

link

Unnecessary. Omit it altogether

text

body

Use CSS

type

li, param, ul

param element is deprecated. Use the data attribute of the object element to set the URL of the external resource. Use CSS for li and ul elements

urn

a, link

Specify the preferred persistent identifier using the href attribute

usemap

input

Use the img element for image maps

valign

col, tbody, thead, tfoot, td, th, tr

Use CSS

valuetype

param

param element is deprecated. Use the data attribute of the object element to set the URL of the external resource

version

html

Unnecessary. Omit it altogether

vlink

body

Use CSS

vspace

embed, iframe, img, input, object

Use CSS

width

col, hr, pre, table, td, th

Use CSS

Code examples

Noncompliant code example

<table>
	<tr>
		<td width="50%">1st cell</td><!-- Noncompliant: 'width' attribute is deprecated -->
		<td width="50%">1st cell</td>
	</tr>
</table>

Compliant solution

<style>
	.equal-width td { width: 50%; }
</style>
<table class="equal-width">
	<tr>
		<td>1st cell</td>
		<td>2nd cell</td>
	</tr>
</table>

Resources

Documentation