Jump to content

Help:Lint errors/obsolete-tag

From mediawiki.org

The obsolete-tag error is the result of deprecated HTML elements.[1]

Since it is unclear to us at this time how far we want to push this goal of HTML5 compliance, this category is marked low priority. Some wikis might choose to not address this right away. Other wikis might want to get ahead and want to be HTML5 compliant. It is possible that some wikis might write bots to address this. So, please use your judgement and wiki-specific policies to guide you in how much effort you want to spend on this. If, in the future, there is greater clarity about pursuing this more aggressively, we will reflect that by updating the severity of this linter issue appropriately.

Deprecated elements

Currently, the deprecated elements with their alternatives are:

Deprecated elements
Deprecated tag Replacement Example Example display
‎<center> <div style="text-align: center;">

For use with English Wikipedia templates, see w:Wikipedia:HTML 5#Templates.
For use with parser tags, see w:Wikipedia:HTML 5#Parser tags.
For use with tables and table cells, see w:Wikipedia:HTML 5#Tables.

<div style="text-align: center;">Centered</div>
Centered
The div-tag method above does not always center the enclosed content, and sometimes it applies undesired centering to text within the content. This row lists tag-specific and template-specific centering (some of these templates do not exist on some MediaWiki sites; examples are for the English Wikipedia):
  • To center an hr tag:
<hr style="margin: auto;" />
  • To center a table on the page:
{| style="margin: auto;"
<table style="margin: auto;">
  • To center a table cell's contents:
|style="text-align: center;" | Content

or:

<td style="text-align:center">
  • To center text in Template:Tmbox or Template:Editnotice:
|textstyle = text-align: center;
  • To center Template:Tree chart:
{{tree chart/start|align=center}}
  • To center a Gallery tag or template (Doesn't always work; for example, with perrow="5", the gallery will be aligned to the left. Workaround: wrap in wikitable markup instead.):
<gallery class="center">...</gallery>

or:

{{Gallery|style=margin:auto
  • To center the content of a Template:Userbox, if the content is in |info =
 | info-op = text-align: center
  • To center a Template:Location map:
{{location map|float=center}}
  • If all else fails, you can replace the center tags with a table wrapping the entire block (don't use class="wikitable"):
{| style="margin: auto;"
|
(existing content)
|}
<font color="x" size="y" face="z"> <span style="color: x; font-size: y; font-family: z;"> <span style="color: red;">Red Alert!</span> Red Alert!
<span style="font-family: Times New Roman;">This is Times New Roman</span> This is Times New Roman
‎<strike> ‎<del> (for marking an edit) <del>Yes</del> No Yes No
‎<s> (for anything else) Photon Torpedoes <s>$44.99</s> '''now just $24.99!''' each Photon Torpedoes $44.99 now just $24.99! each
‎<tt> ‎<code> (preferred for source code) use <code>&nbsp;</code> for nonbreaking space use &nbsp; for nonbreaking space
‎<kbd> (preferred for user input) <kbd>mypasswd</kbd> mypasswd
‎<var> (preferred for variables) <var>age</var>=65 age=65
‎<samp> (preferred for computer output) <samp>Invalid password. Please try again.</samp> Invalid password. Please try again.
Use the template {{mono}} for all other monospaced text on Wikipedia in English and many other languages. If the template is not available, use:

<span style="font-family: monospace, monospace;">

"monospace, monospace" is a workaround for a bug in some browsers; see en:Wikipedia:Typography#The monospace "bug" for details.
<span style="font-family: monospace, monospace;">Typed text</span> Typed text
Table cell horizontal alignment: align=X
where X is "left", "center" or "right" (sometimes without quotes)
Note: As of November 2020, Linter doesn't detect this obsolete HTML.
style="text-align: X;" style="text-align: right;" | right-justified text right-justified text
Table cell vertical alignment: valign=X
where X is "top", "middle" or "bottom" (sometimes without quotes)
Note: As of November 2020, Linter doesn't detect this obsolete HTML.
style="vertical-align: X;" style="vertical-align: top;" | top aligned text top aligned text
Table cell background color: bgcolor=X
Note: As of November 2020, Linter doesn't detect this obsolete HTML.
style="background-color: X;" style="background-color: pink" | pink background pink background


Font sizes

  • "font size=0" is not valid HTML, and it is equivalent to "font size=1".
  • "font size=2.5" or other decimal value between 1 and 7 generates intermediate font size, which can be achieved with percent or em markup.
  • Values above 7 are equivalent to 7. Sizes with percent or em are approximate matches and may depend slightly on browser and other factors.
  • Font sizes prefixed by plus or hyphen, e.g. <font size=+2> or <font size=-1>, are equivalent to 3 plus or minus that number.
<font size=...> <span style="font-size: ...;"> <span style="font-size: ...;">
when base font size is 14px
font-size:xx-small
font-size:9px
font-size: 64%
font-size: 0.64em
font size=0,
font size=1
font-size:x-small
font-size:10px
font-size: 71%
font-size: 0.71em
font size=2 font-size:small
font-size:13px
font-size: 93%
font-size: 0.93em
font size=3 font-size:medium
font-size:16px
font-size: 114%
font-size: 1.14em
font size=4 font-size:large
font-size:18px
font-size: 129%
font-size: 1.29em
font size=5 font-size:x-large
font-size:24px
font-size: 171%
font-size: 1.71em
font size=6 font-size:xx-large
font-size:36px
font-size: 229%
font-size: 2.29em
font size=7,
font size>=7
font-size:xxx-large
font-size:48px
font-size: 343%
font-size: 3.43em

Multi-big

‎<big>...‎</big> <span style="font-size:...">...</span>
1 big font-size:120%
2 big font-size:150%
3 big font-size:175%
4 big font-size:200%
5 big font-size:250%
6 big font-size:300%

Rationale

MediaWiki currently whitelists these elements, and they tend to be output the same way as input. This means that when browser vendors decide to remove these they will simply display as regular undecorated text. Examples of some "popular" html tags that had visual effects and have been removed from major browsers include ‎<blink>[2] and ‎<basefont>[3]. A further problem is that different browser vendors may remove them independently so editors or readers may have inconsistent views of the same page, leading to confusion.

It is likely that browser vendors will give us significant notice before making any breaking changes given how prevalent these deprecated elements are used across the internet.

Helpful hints

<font color="x"> accepts numeric font colors without the standard hash prefix. However, with <span style="color: x;">, the hash before numeric font colors is mandatory:

Markup Display
<font color="#FF0000">Red</font> Red
<font color="FF0000">Red</font> Red
<span style="color: #FF0000;">Red</span> Red
<span style="color: FF0000;">Red</span> Red

<font color="x"> accepts some nonstandard font color names such as burntorange and vermillion, which are not on the list of 16 HTML colors or the list of 124 X11 colors. The replacement <span style="color: ..."> markup recognizes only color names on these lists.

<font color="x"> accepts 4-digit and 5-digit hexadecimal codes, which need 00 and 0, respectively, appended in <span style="color: ..."> markup. Hexadecimal codes with more than 6 digits need to be trimmed to the first 6 digits.

font markup font display span markup span display
<font color="#FF88">Hello</font> Hello <span style="color: #FF8800;">Hello</span> Hello
<font color="#D0208">Hello</font> Hello <span style="color: #D02080;">Hello</span> Hello
<font color="#D020808">Hello</font> Hello <span style="color: #D02080;">Hello</span> Hello
<font color="#D020808F">Hello</font> Hello <span style="color: #D02080;">Hello</span> Hello
<font color="#D020808F0">Hello</font> Hello <span style="color: #D02080;">Hello</span> Hello


Tools

The following tools can help fix obsolete HTML tags:

References