View source for Wikipedia:HTML5

{{Information page}}
The development of [[HTML5]] is now so far advanced that it was incorporated into the MediaWiki software and has been the default on Wikimedia wikis since September 2012.

This project serves to help editors organize the adaptation of articles and other Wikipedia pages to HTML5.  The fifty or so prepared searches reveal the obsolete tags. The edits range from  simple to complex, and the numbers from a few fixes anyone can enjoy updating manually, up to many thousands for a run with a [[Wikipedia:AutoWikiBrowser]] bot script.

==  Scope ==
Implementation of the new HTML5 attributes accepted by MediaWiki software. These include:
* The <code>data-sort-value</code> attributes in table cells for [[Help:Sorting|sorting]]. This is associated to the replacement of templates like [[Template:Sort|Sort]], [[Template:Sortname|Sortname]], [[Template:Number table sorting|Number table sorting]], and [[Template:Dts|Dts]].
* Other data attributes.

{| class="wikitable hintergrundfarbe2"
|+ Attributes for text formatting<ref>[[HTML element#Presentation]]</ref>
! obsolete in HTML5<ref name="whatwg obsolete non-com" /><ref>http://www.w3.org/TR/html5-diff/#obsolete-elements</ref>
! Replacements
|- style="vertical-align:top;"
| <syntaxhighlight lang="wikitext">
{| align="center"
|- align="center"
| align="center" | …</syntaxhighlight>
| <syntaxhighlight lang="wikitext">
{| class="center"           <!-- corresponds to text-align: center, and also margin: auto on inner elements -->
{| class="centered"               <!-- corresponds to margin: auto -->
{| style="margin:auto;"
|- style="text-align:center;"
| class="center" </syntaxhighlight>
Attention, none of the data is equivalent. The obsolete code centered much more things, however the CSS values apply either to inline or block elements only. In some cases, substantial changes may be necessary to replicate with CSS the appearance which was obtained with the old code.
|- style="vertical-align:top;"
| <code>align="right"</code>
| <code><nowiki>{| class="float-right"</nowiki></code>
<code>style="text-align:right;"</code>

Positioning can be made using <code>position:</code> or <code>float:</code>, <code>display: inline-block;</code>, and alignments using <code>text-align:</code> as a replacement.
|- style="vertical-align:top;"
| <code>valign="top"</code>
| <code><nowiki>style="vertical-align:top;"</nowiki></code>

<code>valign</code> can be replaced by CSS <code>vertical-align:</code> on a cell or row. Note that it cannot be applied to a whole table.
|- style="vertical-align:top;"
| {{tag|tt}}
| {{tag|code}}

{{tag|kbd}}

{{tag|samp}}

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

Depending on the desired semantic, {{tag|code|o}} is for fragments of computer code, {{tag|kbd|o}} for user input and {{tag|samp|o}} for outputs, and even {{tag|var|o}} for variables.<ref name="txta">SELFHTML – [http://wiki.selfhtml.org/wiki/HTML/Textstrukturierung/Auszeichnung_auf_Textebene List of items for markup]</ref>

'''Note:''' <code>font-family:monospace,monospace</code> is correct, and prevents an unexpectedly small font in Gecko- and WebKit-based browsers, see [[WP:MONO]].
|- style="vertical-align:top;"
| <code><nowiki>{| bgcolor="gray"</nowiki></code>

<code><nowiki>| bgcolor="gray"</nowiki></code>
| <code><nowiki>{| style="background-color:gray;"</nowiki></code>

<code><nowiki>| style="background-color:gray;"</nowiki></code>
|-
! Obsolete since HTML4<ref name="whatwg obsolete non-com">{{cite web |work=HTML Living Standard |title=15.2 Non-conforming features|url=http://www.whatwg.org/specs/web-apps/current-work/multipage/obsolete.html#non-conforming-features}}</ref><ref name="selfhtml/dep">SELFHTML – [//wiki.selfhtml.org/wiki/HTML/deprecated HTML/deprecated]</ref>
! Replacements
|- style="vertical-align:top;"
| {{tag|center}}
| {{tag|div|params=class="center"}}             <!-- corresponds to text-align: center, and also margin:auto on inner elements -->

{{tag|div|params=style="text-align:center;"}}

{{tag|div|params=class="centered"}}               <!-- corresponds to margin: auto -->

{{tag|div|params=style="margin:auto;"}}

Attention, none of the data is equivalent. The obsolete code centered much more things, however the CSS values apply either to inline or block elements only. In some cases, substantial changes may be necessary to replicate with CSS the appearance which was obtained with the old code.
|- style="vertical-align:top;"
| {{tag|strike}}
| {{tag|s}}

{{tag|del}}

{{tag|span|params=style="text-decoration:line-through;"|wrap=yes}}
|- style="vertical-align:top;"
| {{tag|font|params=size="3"}}
| {{tag|span|params=style="font-size:125%;"}}

{{tlx|small}}

Here a percentage makes sense. A simple conversion is not possible as the result depends on the surrounding code and partly also on the browser used. One should simply decide which value is appropriate, often rounded to 10% percentage for the particular application. Note that {{tag|small}} is for [[fine print]], not for stylistic issues.
|- style="vertical-align:top;"
| {{tag|font|params=color="red"}}
| {{tag|span|params=style="color:red;"}}

{{tag|span|params=class="error"}}
|- style="vertical-align:top;"
| {{tag|font|params=face="Courier"}}
| {{tag|span|params=style="font-family:Courier, monospace;"|wrap=yes}}

{{tag|span|params=style="font:125% Courier, monospace;"|wrap=yes}}  <!-- combined with size -->

The specification should definitely end with a generic font, usually <code>serif</code>, <code>sans-serif</code>, or<code>monospace</code>, and rarely <code>cursive</code> or <code>fantasy</code>. In general, these inflexible specifications of a font should be removed entirely or replaced by semantic elements, such as {{tag|code|o}} (see below).
|}
* The following attributes relevant for Wikipedia tables are also considered obsolete in HTML5: <code>bgcolor</code>, <code>border</code>, <code>bordercolor</code>, <code>cellpadding</code>, <code>cellspacing</code>.
* The following elements were formerly obsolete in HTML4 and "rehabilitated" in HTML5: <code>u</code> and <code>s</code><ref name="selfhtml/dep"/>

==Obsolete elements and attributes==
These elements and attributes should no longer be used on Wikipedia pages. See each element or attribute's details for its recommended replacement. 

===center===

====Text====
For most text, {{tag|center}} can be replaced with {{tl|center}}.

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
| {{tag|center|content=Content}}
| {{tlx|center|Content}}
| {{ubl|{{search link|insource:center insource:/\<center/|(search articles)|ns0}}|{{search link|insource:center insource:/\<center/|(search templates)|ns10}}|{{search link|insource:center insource:/\<center/|(search all)|ns=all}}}}
|}

==== Templates ====
To center templates, check the template documentation as most have a parameter for general styling or specifically for alignment. If the template does not have an alignment parameter, consider adding one.

Searches for templates do not find redirects, but you can alter the query to complete the search for that template's obsolete usage:
for each template list its redirects with the "What Links Here" tool, 
and replace the two occurrences of its template name.  
Do this for each of its redirects in turn.

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
| {{tag|center|o}}{{tlx|ahnentafel}}{{tag|center|c}}
| {{tlx|ahnentafel|2=align=center}}
| {{ubl|{{search link|hastemplate: ahnentafel insource:"center ahnentafel" insource:/\<center\>.?\{\{[Aa]hnentafel/|(search articles)|ns0}}|{{search link|hastemplate: ahnentafel insource:"center ahnentafel" insource:/\<center\>.?\{\{[Aa]hnentafel/|(search all)|ns=all}}}}
|-
| {{tag|center|o}}{{tlx|chart/start}}{{tag|center|c}}
| {{tlx|chart/start|2=align=center}}
| {{ubl|{{search link|hastemplate: chart/start insource:"center chart" insource:/\<center\>.?\{\{[Cc]hart\/start/|(search articles)|ns0}}|{{search link|hastemplate: chart/start insource:"center chart start" insource:/\<center\>.?\{\{chart\/start/|(search all)|ns=all}}}}
|-
| {{tag|center|o}}{{tlx|CSS&nbsp;image&nbsp;crop}}{{tag|center|c}}
| {{tlx|CSS&nbsp;image&nbsp;crop|2=Location=center}}
| {{ubl|{{search link|hastemplate: "CSS image crop" insource:"center CSS image crop" insource:/\<center\>.?\{\{CSS image crop/i|(search articles)|ns0}}|{{search link|hastemplate: "CSS image crop" insource:"center CSS image crop" insource:/\<center\>.?\{\{CSS image crop/i|(search all)|ns=all}}}}
|-
| {{tag|center|o}}{{tlx|family&nbsp;tree/start}}{{tag|center|c}}
| {{tlx|family&nbsp;tree/start|2=align=center}}
| {{ubl|{{search link|hastemplate: "family tree" insource:"center family tree" insource:/\<center\>.?\{\{[Ff]amily tree/|(search articles)|ns0}}|{{search link|hastemplate: "family tree" insource:"center family tree" insource:/\<center\>.?\{\{[Ff]amily tree/|(search all)|ns=all}}}}
|-
| {{tag|center|o}}{{tlx|gallery}}{{tag|center|c}}
| {{tlx|gallery|2=align=center}}
| {{ubl|{{search link|hastemplate: gallery insource:"center gallery" insource:/\<center\>.?\{\{[Gg]allery/|(search articles)|ns0}}|{{search link|hastemplate: gallery insource:"center gallery" insource:/\<center\>.{0,5}\{\{[Gg]allery/|(search all)|ns=all}}}}
|-
| {{tag|center|o}}{{tlx|listen}}{{tag|center|c}}
| {{tlx|listen|2=pos=center}}
| {{ubl|{{search link|hastemplate: listen insource:"center listen" insource:/\<center\>.?\{\{[Ll]isten/|(search articles)|ns0}}|{{search link|hastemplate: listen insource:"center listen" insource:/\<center\>.?\{\{[Ll]isten/|(search all)|ns=all}}}}
|-
| {{tag|center|o}}{{tlx|location&nbsp;map}}{{tag|center|c}}
| {{tlx|location&nbsp;map|2=float=center}}
| {{ubl|{{search link|hastemplate: "location map" insource:"center location map" insource:/\<center\>.?\{\{[Ll]ocation map/|(search articles)|ns0}}|{{search link|hastemplate: "location map" insource:"center location map" insource:/\<center\>.?\{\{[Ll]ocation map/|(search all)|ns=all}}}}
|-
| {{tag|center|o}}{{tlx|wide&nbsp;image}}{{tag|center|c}}
| {{tlx|wide&nbsp;image}} (centered by default)
| {{ubl|{{search link|hastemplate: "wide image" insource:"center wide image" insource:/\<center\>.?\{\{[Ww]ide image/|(search articles)|ns0}}|{{search link|hastemplate: "center wide image" insource:/\<center\>.?\{\{[wW]ide image/|(search all)|ns=all}}}}
|-
| {{tlx|wide&nbsp;image|image|{{tag|center|content=caption}}}}
| {{tlx|wide&nbsp;image|image|align-cap{{=}}center|caption}}
| {{ubl|{{sl|hastemplate: "wide image" insource:/\{\{ *[Ww]ide image *\{{!}} *[^}]*\<center\>/|(search articles)}}|{{sl|all: hastemplate: "wide image" insource:/\{\{ *[Ww]ide image *\{{!}} *[^}]*\<center\>/|(search articles)}}}}
|-
|}

====Parser tags====
Some parser tags can use CSS styles:

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
| {{tag|center|content={{tag|gallery|wrap=yes}}|wrap=yes}} 
| {{tag|gallery|params=class="center"|wrap=yes}} 
| {{ubl|{{search link|insource:"center gallery" insource:/\<center\>.?\<gallery/|(search articles)|ns0}}|{{search link|insource:"center gallery" insource:/\<center\>.?\<gallery/|(search all)|ns=all}}}}
|}

{| class="wikitable" style="vertical-align: text-top;"
|-
| rowspan="6"| These parser tags will accept <code>class="center"</code>
| {{xtag|categorytree}}
| {{search link|insource:"center categorytree" insource:/\<center\>\<categorytree/|(search articles)|ns0}} {{search link|insource:"center categorytree" insource:/\<center\>\<categorytree/|(search all)|ns=all}}
|-
| {{xtag|gallery}}
| {{search link|insource:"center gallery" insource:/\<center\>\<gallery/|(search articles)|ns0}} {{search link|insource:"center gallery" insource:/\<center\>\<gallery/|(search all)|ns=all}}
|-
| {{xtag|poem}} (centers all lines)
| {{search link|insource:"center poem" insource:/\<center\>\<poem/|(search articles)|ns0}} {{search link|insource:"center poem" insource:/\<center\>\<poem/|(search all)|ns=all}}
|-
| {{xtag|pre}}
| {{search link|insource:"center pre" insource:/\<center\>\<pre/|(search articles)|ns0}} {{search link|insource:"center pre" insource:/\<center\>\<pre/|(search all)|ns=all}}
|-
| {{xtag|syntaxhighlight}}
| {{search link|insource:"center syntaxhighlight" insource:/\<center\>\<syntaxhighlight/|(search articles)|ns0}} {{search link|insource:"center syntaxhighlight" insource:/\<center\>\<syntaxhighlight/|(search all)|ns=all}}
|-
| {{xtag|source}}
| {{search link|insource:"center source" insource:/\<center\>\<source/|(search articles)|ns0}} {{search link|insource:"center source" insource:/\<center\>\<source/|(search all)|ns=all}}
|-
| rowspan="5"| These parser tags do not handle CSS; use {{tl|center}}
| {{xtag|hiero}}
| {{search link|insource:"center hiero" insource:/\<center\>[^<]*\<hiero/|(search articles)|ns0}} {{search link|insource:"center hiero" insource:/\<center\>[^<]*\<hiero/|(search all)|ns=all}}
|-
| {{xtag|math}}
| {{search link|insource:"center math" insource:/\<center\>[^<]*\<math/|(search articles)|ns0}} {{search link|insource:"center math" insource:/\<center\>[^<]*\<math/|(search all)|ns=all}}
|-
| {{xtag|score}}
| {{search link|insource:"center score" insource:/\<center\>[^<]*\<score/|(search articles)|ns0}} {{search link|insource:"center score" insource:/\<center\>[^<]*\<score/|(search all)|ns=all}}
|-
| {{xtag|timeline}}
| {{search link|insource:"center timeline" insource:/\<center\>[^<]*\<timeline/|(search articles)|ns0}} {{search link|insource:"center timeline" insource:/\<center\>[^<]*\<timeline/|(search all)|ns=all}}
|-
| {{xtag|ref}}
| {{search link|insource:"center ref" insource:/\< *center *\> *\<ref/|(search articles)|ns0}} {{search link|insource:"center ref" insource:/\< *center *\> *\<ref/|(search all)|ns=all}}
|-
| These parser tags use other means
| {{xtag|imagemap}} uses a <code>center</code> parameter; see the documentation
| {{search link|insource:"center imagemap" insource:/\<center\>\<imagemap/|(search articles)|ns0}} {{search link|insource:"center imagemap" insource:/\<center\>\<imagemap/|(search all)|ns=all}}
|-
| These parser tags default to center alignment
| {{xtag|inputbox}}
| {{search link|insource:"center inputbox" insource:/\<center\>\<inputbox/|(search articles)|ns0}} {{search link|insource:"center inputbox" insource:/\<center\>\<inputbox/|(search all)|ns=all}}
|-
| These parser tags do not handle CSS and do not need alignment
|
* {{xtag|charinsert}}
* {{xtag|indicator}}
* {{xtag|nowiki}}
* {{xtag|references}}
* {{xtag|section}}
* {{xtag|templatedata}}
|
|}

====Tables====
To [[help:table#Centering tables|center a table]], use CSS styling:

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
||{{tag|center|content=<br />{{(}}{{!}}<br />⋮<br />{{!}}}<br />}}
<br />
{{tag|div|params=align="center"|content=<br />{{(}}{{!}}<br />⋮<br />{{!}}}<br />}}
| <code><nowiki>{| style="margin: 1em auto;"</nowiki></code>
| {{sl|insource:center insource:/\<center\>.\{{(}}\{{!}}.*\{{!}}\{{)}}.?\<\/center\>/ prefix::|(search articles)}}
<br />
{{sl|query=insource:div insource:"align center" insource:/align=\"?center\"?\>.?\{{(}}\{{!}}.*\{{!}}\{{)}}.?\<\/div/  prefix::|label=(search articles)}}
|}

And likewise to center a cell:

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
| <code><nowiki>| <center>Content</center></nowiki></code>
| <code><nowiki>|style="text-align: center;" | Content</nowiki></code>
|{{sl|insource:center insource:/[^{]\{{!}} *"<center>"[^{{!}}]*\<\/center\>/ -insource:/"[["[Ff]ile:[^\]]*\<center\>/|(search articles)}}
|}

Header cells are centered by default.

==== Files ====
{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
||{{tag|center|content=<nowiki>[[File:Image.jpg]]</nowiki>}}
| <code><nowiki>[[File:Image.jpg|center]]</nowiki></code>
| {{search link|insource: center insource:/\< *center *\> *\[\[ *(file{{!}}image)\:/i|(search articles)|ns0}} {{search link|insource: center insource:/\< *center *\> *\[\[ *(file{{!}}image)\:/i|(search all)|ns=all}}
|}

===font===
The {{tag|font|o}} element has three attributes with equivalent CSS properties:

{| class="wikitable"
|-
! Font attribute !! CSS
|-
| <code>color</code> || <code>color</code>
|-
| <code>face</code> || <code>font-family</code>
|-
| <code>size</code> || <code>font-size</code>
|}

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
| {{tag|font|params=color="red"|content=Content|wrap=yes}}
| {{tag|span|params=style="color:red;"|content=Content|wrap=yes}} '''OR''' {{tlx|font&nbsp;color|red|Content}}
| {{search link|query=insource: "font color" insource:/\<font color\=.*\<\/font\>/|label=(search articles)}}{{search link|query=all: insource: "font color" insource:/\<font color\=.*\<\/font\>/|label=(search all)}}
|}

Note that for color names, only the W3C specified [[Web colors#Basic colors|basic]] and [[Web colors#Extended colors|extended colors]] are valid with CSS. {{tag|font|o}} accepts arbitrary strings for color names; CSS does not support these. When converting to CSS, these strings can be replaced either with a sufficiently similar hexadecimal color code or a valid color name that is nearest to their shade. For example:

{| class="wikitable"
|-
!style="width:50%;"| Obsolete
!style="width:50%;"| Replacement
|-
|{{tag|font|params=color="harlequin"|content=Content|wrap=yes}}
| {{tag|span|params=style="color:#3FFF00;"|content=Content|wrap=no}} '''OR''' {{tag|span|params=style="color:chartreuse;"|content=Content|wrap=no}} '''OR''' {{tlx|font&nbsp;color|#3FFF00|Content}}
|-
|}

Hexadecimal color codes without the <code>#</code> prefix are valid with {{tag|font|o}}, but <code>#</code> is mandatory with CSS. Only 3 and 6 digit hex codes are valid in CSS. When 4 and 5 digit codes have to be converted to CSS, they need to be appended with 00 and 0 respectively. For 8 digit hex codes, the last two digits have to be discarded.

{| class="wikitable"
|-
!style="width:50%;"| Obsolete
!style="width:50%;"| Replacement
|-
| {{tag|font|params=color="#FC045E;"|content=Content|wrap=yes}}
| {{tag|span|params=style="color:#FC045E;"|content=Content|wrap=yes}} '''OR''' {{tlx|font&nbsp;color|#FC045E|Content}}
|-
| {{tag|font|params=color="FC045E;"|content=Content|wrap=yes}}
| {{tag|span|params=style="color:#FC045E;"|content=Content|wrap=yes}} '''OR''' {{tlx|font&nbsp;color|#FC045E|Content}}
|-
| {{tag|font|params=color="#FC04;"|content=Content|wrap=yes}}
| {{tag|span|params=style="color:#FC0400;"|content=Content|wrap=yes}} '''OR''' {{tlx|font&nbsp;color|#FC0400|Content}}
|-
| {{tag|font|params=color="#FC045;"|content=Content|wrap=yes}}
| {{tag|span|params=style="color:#FC0450;"|content=Content|wrap=yes}} '''OR''' {{tlx|font&nbsp;color|#FC0450|Content}}
|-
| {{tag|font|params=color="#FC045E33;"|content=Content|wrap=yes}}
| {{tag|span|params=style="color:#FC045E;"|content=Content|wrap=yes}} '''OR''' {{tlx|font&nbsp;color|#FC045E|Content}}
|-
|}

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
| {{tag|font|params=face="Times, serif"|content=Content|wrap=yes}}
|| {{tag|span|params=style="font-family:Times, serif;"|content=Content|wrap=yes}} '''OR''' <code>{<nowiki />{font{{zwsp}}|text=Content{{zwsp}}|font=Times, serif}}</code>
| {{search link|query=insource: "font face" insource:/\<font face\=.*\<\/font\>/|label=(search articles)}}{{search link|query=all: insource: "font face" insource:/\<font face\=.*\<\/font\>/|label=(search all)}}
|}

Note that in HTML the value for the <code>size</code> attribute does not correspond to any CSS value; it only accepts values 1 through 7.<ref>{{Cite web|url=https://www.w3.org/TR/css-fonts-3/#length-percentage-size-value|title=CSS Fonts Module Level 3|accessdate=2018-06-23|date=2018-03-10|author= W3C|authorlink= W3C}}</ref>

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
| {{tag|font|params=size="1"|content=Content|wrap=yes}} || {{tag|span|params=style="font-size:x-small;"|content=Content|wrap=yes}} '''OR''' {{tlx|1=font|2=text=Content|3=size=x-small}}
| rowspan="6" | {{search link|query=insource: "font size" insource:/\<font size\=.*\<\/font\>/|label=(search articles)}}{{search link|query=all: insource: "font size" insource:/\<font size\=.*\<\/font\>/|label=(search all)}}
|-
| {{tag|font|params=size="2"|content=Content|wrap=yes}} || {{tag|span|params=style="font-size:small;"|content=Content|wrap=yes}} '''OR''' {{tlx|1=font|2=text=Content|3=size=small}}
|-
| {{tag|font|params=size="3"|content=Content|wrap=yes}} || {{tag|span|params=style="font-size:medium;"|content=Content|wrap=yes}} '''OR''' {{tlx|1=font|2=text=Content|3=size=medium}}
|-
| {{tag|font|params=size="4"|content=Content|wrap=yes}} || {{tag|span|params=style="font-size:large;"|content=Content|wrap=yes}} '''OR''' {{tlx|1=font|2=text=Content|3=size=large}}
|-
| {{tag|font|params=size="5"|content=Content|wrap=yes}} || {{tag|span|params=style="font-size:x-large;"|content=Content|wrap=yes}} '''OR''' {{tlx|1=font|2=text=Content|3=size=x-large}}
|-
| {{tag|font|params=size="6"|content=Content|wrap=yes}} || {{tag|span|params=style="font-size:xx-large;"|content=Content|wrap=yes}} '''OR''' {{tlx|1=font|2=text=Content|3=size=xx-large}}
|}

The above searches will find all permutations of the three color attributes. For example:
{| class="wikitable"
|-
! Obsolete !! Replacement
|-
| {{tag|font|params=size="3" color="red" face="times, serif"|content=Content|wrap=yes}}
|| {{tag|span|params=style="font-size:medium; color:red; font-family:Times, serif;"|content=Content|wrap=yes}} '''OR''' <code>{<nowiki />{font|text=Content{{zwsp}}|size=medium{{zwsp}}|font=Times, serif{{zwsp}}|color=red}}</code>
|}

===strike===

{{tag|strike}} formats strike-through characters. {{search link|insource:strike insource:/\<strike/|(search articles)|ns0}} {{search link|insource:strike insource:/\<strike/|(search all)|ns=all}}
* Use {{tag|s}} for text that is no longer correct, accurate, or relevant.
* Use {{tag|del}} for text that has been deleted or marked for deletion.

===tt===

{{tag|tt}} formats text in a fixed-width font. {{search link|insource:tt insource:/\<tt/|(search articles)|ns0}} {{search link|insource:tt insource:/\<tt/|(search all)|ns=all}}
* Use {{tlx|code}} or {{tag|code|o}} for source code.
* Use {{tlx|kbd}} or {{tag|kbd|o}} for computer input (it need not represent actual keystrokes)
* Use {{tlx|samp}} or {{tag|samp|o}} for sample output from a program or system (can include directory listings and other matter)
* Use {{tlx|var}} or {{tag|var|o}} for variable names (in code, mathematics, or even syntactic variables in regular writing).
* Use {{tlx|mono}} for monospace-styled text without the semantics of any of the above.

===Table attributes===
Obsolete table attributes.<ref>{{cite web |title=Table |website=W3C |url=http://www.w3.org/TR/html-markup/table.html}}</ref><ref>[https://www.w3.org/TR/2021/SPSD-html52-20210128/obsolete.html HTML 5.2 - Obsolete features].</ref>

{| class=wikitable
! Obsolete attribute !! CSS style on cell<br>style="CODE BELOW"!! CSS style on table<br>style="CODE BELOW" !! Search
|-
| {{ubl|<code><nowiki>align=left</nowiki></code>|<code><nowiki>align=right</nowiki></code>|<code><nowiki>align=center</nowiki></code>}}
| {{ubl|<code>text-align: left;</code>|<code>text-align: right;</code>|<code>text-align: center;</code>}}
| {{ubl|<code>margin-right: auto;</code>|<code>margin-left: auto;</code>|<code>margin: 1em auto;</code>}}
| {{ubl|{{search link|query=insource:align insource:/align=/|label=(search articles)|ns=ns0}}|{{search link|query=insource:align insource:/align=/|label=(search all)|ns=all}}}}
|-
| <code>bgcolor=#ddd</code>
| <code>background-color: #ddd;</code>
| <code>background-color: #ddd;</code>
| {{ubl|{{search link|query = insource:bgcolor insource:/bgcolor=/|2=(search articles)|ns=ns0}}|{{search link|query = insource:bgcolor insource:/bgcolor=/|2=(search all)|ns=all}}}}
|-
| <code>border=2</code>
| <code>border-width: 2px;</code>
| <code>border-width: 2px;</code>
| {{ubl|{{search link|query = insource:border insource:/border=/|2=(search articles)|ns=ns0}}|{{search link|query = insource:border insource:/border=/|2=(search all)|ns=all}}}}
|-
| <code>cellpadding=2</code>
| <code>padding: 2px;</code>
|
| {{ubl|{{search link|query = insource:cellpadding insource:/cellpadding=/|2=(search articles)|ns=ns0}}|{{search link|query = insource:cellpadding insource:/cellpadding=/|2=(search all)|ns=all}}}}
|-
| <code>cellspacing=2</code>
|
| <code>border-spacing: 2px;</code>
| {{ubl|{{search link|query = insource:cellspacing insource:/cellspacing=/|2=(search articles)|ns=ns0}}|{{search link|query = insource:cellspacing insource:/cellspacing=/|2=(search all)|ns=all}}}}
|-
| <code>cellpadding=0 cellspacing=0</code>
| <code>padding: 0;</code>
| <code>border-collapse: collapse;</code>
|
|-
| {{ubl|<code><nowiki>valign=top</nowiki></code>|<code><nowiki>valign=middle</nowiki></code>|<code><nowiki>valign=bottom</nowiki></code>}}
| {{ubl|<code>vertical-align: top;</code>|<code>vertical-align: middle;</code>|<code>vertical-align: bottom;</code>}}
|
| {{ubl|{{search link|query = insource:valign insource:/valign=/|2=(search articles)|ns=ns0}}|{{search link|query = insource:valign insource:/valign=/|2=(search all)|ns=all}}}}
|-
| {{ubl|<code><nowiki>width=25%</nowiki></code>|<code><nowiki>width=200</nowiki></code>}}
| {{ubl|<code>width: 25%;</code>|<code>width: 200px;</code>}}
| {{ubl|<code>width: 25%;</code>|<code>width: 200px;</code>}}
| {{ubl|{{search link|query = insource:width insource:/width=/|2=(search articles)|ns=ns0}}|{{search link|query = insource:width insource:/width=/|2=(search all)|ns=all}}}}
|-
| {{ubl|<code><nowiki>{| summary=foo</nowiki></code>|{{tag|table|params=summary=foo}}}}
|
| See {{phab|T43917}}
| {{ubl|{{search link|query = insource:summary insource:/\{\{{!}} summary=/|2=(search articles)|ns=ns0}}|{{search link|query = insource:summary insource:/\{\{{!}} summary=/|2=(search all)|ns=all}}}}
|}

Allowed, obsolete but rarely used table attributes:
* <code>frame</code>: Use CSS for borders. {{search link|query = insource:frame insource:/frame=/|2=(search articles)|ns=ns0}} {{search link|query = insource:frame insource:/frame=/|2=(search all)|ns=all}}
* <code>rules</code>: Use CSS for borders. {{search link|query = insource:rules insource:/rules=/|2=(search articles)|ns=ns0}} {{search link|query = insource:rules insource:/rules=/|2=(search all)|ns=all}}
* <code>axis</code>: Use <code>scope</code>on the table header. {{search link|query = insource:axis insource:/axis=/|2=(search articles)|ns=ns0}} {{search link|query = insource:axis insource:/axis=/|2=(search all)|ns=all}}
* <code>align</code> on {{tag|caption|o}}. {{search link|insource:"caption align" insource:/\<caption align/|(search articles)|ns0}} {{search link|insource:"caption align" insource:/<caption align/|(search all)|ns=all}}
* <code>height</code>: Use <code>height</code> or <code>line-height</code>. {{search link|query = insource:height insource:/height=/|2=(search articles)|ns=ns0}} {{search link|query = insource:height insource:/height=/|2=(search all)|ns=all}}

Additionally, these attributes are obsolete on table cells.<ref>{{cite web |title=Table cell |website=W3C |url=http://www.w3.org/TR/html-markup/td.html}}</ref><ref>{{cite web |title=Table header cell|website=W3C |url=http://www.w3.org/TR/html-markup/th.html}}</ref>
* <code>abbr</code>: Elaborate content of the cell
* <code>scope</code> on table cell: <code>scope</code>is valid only on table header

There are instances where a table is used to align a template. In many cases the template has an alignment parameter; if not, one should be added.

{{markup|ttext=Invalid|t2=Valid
|<nowiki>{|align=right
|{{navbar|Foo}}
|}</nowiki>
|<nowiki>{{navbar|Foo|style=float:right}}</nowiki>
}}

===Other obsolete attributes===

* <code>clear</code> on {{tag|br|s}}

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
| {{tag|br|params=clear=all|s}}
| {{tag|div|content=|params=style="clear: both;"}} '''OR''' {{tlx|clear}}
| rowspan=3 | {{ubl|{{search link|insource:"br clear" insource:/\<br clear/|(search articles)|ns0}}|{{search link|insource:"br clear" insource:/\<br clear/|(search all)|ns=all}}}}
|-
| {{tag|br|params=clear=left|s}}
|{{tag|div|content=|params=style="clear: left;"}} '''OR''' {{tlx|clear|left}}
|-
| {{tag|br|params=clear=right|s}}
| {{tag|div|content=|params=style="clear: right;"}} '''OR''' {{tlx|clear|right}}
|}

* <code>align</code> on {{tag|div|o}}

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
| {{tag|div|params=align=center}}
| {{tag|div|params=style="text-align:{{zwsp}}center"|wrap=yes}}
| rowspan=4 | {{ubl|{{search link|insource:"div align" insource:/\<div align/|(search articles)|ns0}}|{{search link|insource:"div align" insource:/\<div align/|(search all)|ns=all}}}}
|-
|{{tag|div|params=align=left}}
|{{tag|div|params=style="text-align:{{zwsp}}left"|wrap=yes}}
|-
|{{tag|div|params=align=right}}
|{{tag|div|params=style="text-align:{{zwsp}}right"|wrap=yes}}
|-
|{{tag|div|params=align=justify}}
|{{tag|div|params=style="text-align:{{zwsp}}justify"|wrap=yes}}
|}

Obsolete, allowed but rarely used attributes:
* <code>width</code> on {{tag|hr}} {{search link|insource:"hr width" insource:/\<hr width/|(search articles)|ns0}} {{search link|insource:"hr width" insource:/\<hr width/|(search all)|ns=all}}
* <code>align</code> on {{tag|h1}} through {{tag|h6}}
* <code>type</code> on {{tag|li}} {{search link|insource:"li type" insource:/\<li type/|(search articles)|ns0}} {{search link|insource:"li type" insource:/\<li type/|(search all)|ns=all}}
* <code>align</code> on {{tag|p}} {{search link|insource:"p align" insource:/\<p align/|(search articles)|ns0}} {{search link|insource:"p align" insource:/\<p align/|(search all)|ns=all}}
* <code>width</code> on {{tag|pre}} {{plain link|url=//en.wikipedia.org/w/index.php?title=Special:Search&search=insource%3A%2F\%3Cpre+width%2Fi&fulltext=Search|name=(search articles)}} {{plain link|url=//en.wikipedia.org/w/index.php?title=Special:Search&search=insource%3A%2F\%3Cpre%20width%2Fi&fulltext=Search&profile=all|name=(search all)}}
* <code>type</code> on {{tag|ul}} {{search link|insource:"ul type" insource:/\<ul type/|(search articles)|ns0}} {{search link|insource:"ul type" insource:/\<ul type/|(search all)|ns=all}}

== Misused elements ==

=== cite ===
Under the previous HTML 4.01 and XHTML 1.1 usage {{tag|cite}} defined an entire citation. With HTML5, a long-running dispute has erupted:
* The W3C specs preserve the broad usage, though now require that the material contain at least one of: the title of the cited work, its author, a URL to the work, or an abbreviated reference (short citation, as used in Harvard referencing). This is the spec followed by most Web developers.
* The [[WHATWG]] specs have limited the element to the title of the work {{em|only}}.  This is the spec followed by most browser developers. The only practical implications of WHATWG's break from W3C on this element is that the default browser treatment of the element (to italicize its content) would be applied to more material than the title. However, Wikipedia's site-wide CSS turns off this stylization anyway (per [[MOS:TITLES]], only titles of particular kinds of works should be italicized).

W3C briefly switched to WHATWG's definition in the draft stages of HTML5, but switched back to their own definition in 2012 after protest from the Web developer community. This difference subsequently disappeared when the W3C's version was subsumed into the WHATWG's version in the late 2010s and now the WHATWG's version is the only version in relation to the cite element.<!-- the WHATWG version even doubles down on the point after the merge not to use the cite element to mark up a 'citation' rather than a title -->

Following common practice (e.g. the use of {{tag|cite|o}} around links to author IDs in blog and forum software, and many other well-deployed uses for the element for more than work titles), Wikipedia is following the W3C HTML5.2 Recommendation, which has superseded HTML 4.01, XHTML 1.1, and all other previous W3C [X]HTML specs. {{strong|Our [[Help:Citation style 1|citation template system]] wraps the entire citation in the {{tag|cite}} element.}}

Note that uses of {{tag|cite|o}} exist without the closing {{tag|cite|c}}, or incorrectly closed by {{tag|span|c}}; these need to be repaired.

Where used with a {{cs1}} or {{cs2}} template, a manually-added {{tag|cite|o}} should be removed as redundant markup:

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
|
 <mark>&lt;cite></mark><nowiki>{{cite book |last=Sappol |first=Michael |title=A traffic of dead bodies: anatomy and embodied social identity in nineteenth-century America |publisher=Princeton University Press |location=Princeton, New Jersey |date=2002 |isbn=0-691-05925-X |url=http://books.google.com/books/princeton?id=-9cKRzEx6ywC&printsec=frontcover&dq=A+Traffic+of+Dead+Bodies}}</nowiki><mark>&lt;/cite></mark>
|
 <nowiki>{{cite book |last=Sappol |first=Michael |title=A traffic of dead bodies: anatomy and embodied social identity in nineteenth-century America |publisher=Princeton University Press |location=Princeton, New Jersey |date=2002 |isbn=0-691-05925-X |url=http://books.google.com/books/princeton?id=-9cKRzEx6ywC&printsec=frontcover&dq=A+Traffic+of+Dead+Bodies}}</nowiki>
| {{ubl|{{search link|insource:"cite" insource:/\<cite\> *\{\{cite/|(search articles)|ns0}}|{{search link|insource:"cite" insource:/\<cite\> *\{\{cite/|(search all)|ns=all}}}}
|}

Where an anchor id is manually used with a citation template, the id should be moved to the {{para|ref}} parameter. Additionally when removing cite tags with <code>id=CITEREF</code> please understand that this was a manual reference, and {{em|[[Template:Harvard citation#Citation template_anchor|must be updated]]}} by removal, then making sure that the all the numbered {{para|last}} parameters such as {{para|last1}} are available, which in turn may require changing any (deprecated) numbered {{para|author{{var|x}}}} parameter used into a {{para|last{{var|x}}}} parameter and a matching {{para|first{{var|x}}}} one.  See the example with and without the <code>id=CITEREF...</code> and {{para|author3}}, below.

{| class="wikitable"
|-
! Obsolete !! Replacement !! Search
|-
|
 <mark>&lt;cite id=Alberti></mark><nowiki>{{cite book |last=Arnold |first=David L. G. ||editor-first=John |editor-last=Alberti |date=2003 |title=[[Leaving Springfield|Leaving Springfield: The Simpsons and the Possibility of Oppositional Culture]] |location=Detroit |publisher=[[Wayne State University Press]] |chapter=Use a Pen, Sideshow Bob: The Simpsons and the Threat of High Culture |isbn=0-8143-2849-0}}</nowiki><mark>&lt;/cite></mark>
|
 <nowiki> {{cite book |last=Arnold |first=David L. G. |editor-first=John |editor-last=Alberti |date=2003 |title=[[Leaving Springfield|Leaving Springfield: The Simpsons and the Possibility of Oppositional Culture]] |location=Detroit |publisher=[[Wayne State University Press]] |chapter=Use a Pen, Sideshow Bob: The Simpsons and the Threat of High Culture |isbn=0-8143-2849-0 </nowiki><mark><nowiki>|</nowiki>ref=Alberti</mark>}<nowiki/>}
|{{ubl|{{search link|query=insource:"cite id" insource:/\<cite +id *= *.*\{\{ *cite.*\}\} *\<\/cite\>/|label=(search articles)|ns0}}|{{search link|query=insource:"cite id" insource:/\<cite +id *= *.*\{\{ *cite.*\}\} *\<\/cite\>/|label=(search all)|ns=all}}}}
|-
||
 <mark>&lt;cite id="CITEREFAsphaugRyanZuber2003"></mark>{<nowiki />{cite journal |last=Asphaug |first=Erik |last2=Ryan |first2=Eileen V. |<mark>author3</mark>=Zuber<mark>,</mark> Maria T. |title=Asteroid Interiors |journal=Asteroids III |pages=463–484 |publisher=University of Arizona |location=Tucson |date=2003 |url= http<nowiki />://www-geodyn.mit.edu/asphaug.interiors.pdf |access-date=2009-01-04 |bibcode=2002aste.conf..463A}}<mark>&lt;/cite></mark>
||
 {<nowiki />{cite journal |last=Asphaug |first=Erik |last2=Ryan |first2=Eileen V. |<mark>last3</mark>=Zuber <mark>|first3=</mark>Maria T. |title=Asteroid Interiors |journal=Asteroids III |pages=463–484 |publisher=University of Arizona |location=Tucson |date=2003 |url= http<nowiki />://www-geodyn.mit.edu/asphaug.interiors.pdf |access-date=2009-01-04 |bibcode=2002aste.conf..463A}}
||{{ubl|{{search link|query=insource:"cite id" insource:/\<cite +id *\= *\"CITEREF/ |label=(search articles)|ns0}}|{{search link|query=insource:"cite id" insource:/\<cite +id *\= *\"CITEREF/ |label=(search all)|ns=all}}}}
|}

== Tools ==
<!-- The following will sectionally transclude a resources list from the wikiproject so that it need not be manually duplicated here: -->
{{Excerpt|Wikipedia:WikiProject Check Wikipedia|Tools|subsections=yes}}

=== Collection of further ideas ===
* A bot to insert data attributes based on the syntax of the SortKey. [[:de:User:Antonsusi| '''Å'''ñŧóñŜûŝî]]&nbsp;[[:de:User talk:Antonsusi|'''(Ð)''']]
* Warn the user using [[Special:AbuseFilter]].
* Adapt [[:de:MediaWiki:Gadget-Extra-Editbuttons.js]] ([[:de:Wikipedia:Technik/Archiv/2012#MediaWiki:Gadget-Extra-Editbuttons.js und HTML5|discussion]])
* Adapt [[:de:Benutzer:PerfektesChaos/js/WikiSyntaxTextMod]]

== Participants ==
{{Hatnote|This partcipants list is rather moribund; it's probably more practical to add yourself to '''[[Wikipedia:WikiProject Check Wikipedia/Participants]]''', since that's a full-scale wikiproject devoted to this and other forms of Wikipedia technical cleanup.}}

* All&nbsp;the&nbsp;best: ''[[User:Rich Farmbrough|Rich]]&nbsp;[[User talk:Rich Farmbrough|Farmbrough]]'',<small> 20:04, 15 October 2015 (UTC).</small><br />
* Good to go. &mdash; [[User:Cpiral|<span style="color:#00C000;">Cp</span><span style="color:#80C000;">i</span><span style="color:#C08000;">r</span><span style="color:#C00000;">al</span>]][[User talk:Cpiral|<span style="color:#2820F0;">Cpiral</span>]] <small>07:25, 23 December 2015 (UTC).</small><br />
*I'm ready! [[User:TurboSonic]], <small> 2:30 12 March 2019 (UTC). </small> <br />
* Been at this for years already. <span style="white-space:nowrap;font-family:'Trebuchet MS'"> — [[User:SMcCandlish|'''SMcCandlish''']] [[User talk:SMcCandlish|☏]] [[Special:Contributions/SMcCandlish|¢]] 😼 </span> 06:41, 3 May 2019 (UTC)

== See also ==
* [[Help:HTML in wikitext]]
* {{section link|mw:Parsing/Replacing Tidy/FAQ#What will editors need to do?}} – simplified instructions for fixing pages for the modern MediaWiki parser
* [[Wikipedia:WikiProject Check Wikipedia]] – finds some obsolete HTML tags, among other forms of cleanup work
* [[Wikipedia:Linter]] – MediaWiki extension to identify broken and problematic markup which cannot be fixed automatically by the server
* [[Wikipedia:Manual of Style/Accessibility]]
** [[Wikipedia:WikiProject Accessibility]]

==References==
{{reflist}}

[[Category:Wikipedia maintenance]]