Page 1
Page Structure
Char. Codes
Misc.
Tags & Attributes
Namespaces
<head> Tags
Metatags
Attributes
Media Types
.htaccess
<body> Tags

Transition to HTML 5

How To Code HTML, What's New and Obsolete HTML Tags and Attributes

A great quick reference for the transition from HTML 4 to HTML 5. Designed to help authors create polyglot HTML documents, this can also help in creating HTML 4 and XHTML documents, in addition to upgrading to HTML 5. Most HTML cheat sheets, usually based on the technical specifications for a specific version of HTML, show only the valid features in that version of the HTML specs. In contrast, this one helps developers transition from earlier versions of HTML by indicating new features in HTML 5 with a "New" flag and using a strike-through font to indicate the tags and attributes previously used in HTML 4, XHTML 1 and earlier versions that are now obsolete in HTML 5.

For a quick reference of HTML character entities, see the HTML character codes reference.

Required or recommended HTML attributes for the HTML tags are shown in bold.

Next: Page Structure
Back Up: Menu

HTML Page Structure

pagename.html Purpose Attributes <?xml version="1.0" encoding="UTF-8"?> xml declaration, recommended version, encoding <?xml-stylesheet type="text/xsl" href="/template.xsl"?> stylesheet processing instruction, optional type, href <!DOCTYPE html> document type declaration, recommended PUBLIC, SYSTEM <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <html> top element tag, required xmlnsmanifestversion common <head>
head section, required
profile common <title>...</title>
...other head section tags... title tag, required
HTML Head Section Tags common attributes </head> End of <head> section <body>

...body tags... <body> tag, required

HTML Body Tags alinkbackgroundbgcolorlinkonafterprintonbeforeprintonhashchangeonmessageonofflineononlineonpopstateonredoonstorageonundotextvlink common </body> End of body of HTML document </html> End of HTML document

Prev: Page 1
Back Up: Menu

HTML Character Entities

Character Named Entity Decimal Hexadecimal " - double quotes " " " & - ampersand & & & ' - apostrophe / single quote ' ' ' < - less than sign < < < > - greater than sign > > > non-breaking space       ¢ - cents sign ¢ ¢ ¢ © - copyright symbol © © © ® - registered trademark ® ® ® • - bullet • &bullet; • • ™ - trademark ™ ™ ™

Next: Misc.
Back Up: Menu

Miscellaneous

HTML Tag Purpose Usage  comments must not contain "--"

Next: Tags & Attributes
Prev: Char. Codes
Back Up: Menu

Tag and Attribute Coding

Definition: Polyglot HTML Documents:HTML documents that can be parsed as either text/html or as an XML type such as application/xhtml+xml.

Attributes

Quoted Attributes

Style Attributes

Boolean Attributes

Definitions of Acronyms and Abbreviations

Defined term, not definition, in title attribute

A <dfn title="short for weblog">blog</dfn> is an online journal.
A <dfn title="blog">blog or weblog</dfn> is an online journal.
A <dfn>blog</dfn>, short for <dfn>weblog</dfn>, is an online journal.

<dfn> gets default title from an <abbr> tag that is its only content

<dfn><abbr title="National Association for Stock Car Auto Racing">NASCAR</abbr></dfn> sanctions many different motor races

Override default title on <dfn> when expanding acronyms

<dfn title="TLA"><abbr title="Three Letter Acronym">TLA</abbr></dfn> stands for "Three Letter Acronym"

or, look up the acronym in the Acronym Finder at Acronyms .net and just copy-and-paste the code

Next: Namespaces
Prev: Misc.
Back Up: Menu

Namespaces

Namespace URI Declaration Purpose xmlns="http://www.w3.org/1999/xhtml" xmlns:html="http://www.w3.org/1999/xhtml" HTML xmlns:mathml="http://www.w3.org/1998/Math/MathML" MathML xmlns:svg="http://www.w3.org/2000/svg" SVG xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" XML schema instance document "http://www.w3.org/XML/1998/namespace" (implicit) XML

Next: <head> Tags
Prev: Tags & Attributes
Back Up: Menu

<head> Section Tags

HTML Tag Purpose Attributes <base/> base URL for other URLs in the document hreftarget <basefont> base font, deprecated <isindex> input field to submit keyword-based query, deprecated <link/> reference to external resource hrefrelcharsethreflangmediarevsizestargettitletype common <meta http-equiv="..."/> HTTP header equivalent http-equivcontentcharset <meta name="..."/> document metadata namecontentcharsetscheme common <script> dynamic HTML script asynccharsetdeferlanguagesrctype <style> style definitions mediatypescopedtitle <title> page title common

Next: Metatags
Prev: Namespaces
Back Up: Menu

HTML Metatags

HTML Metatag Purpose Content http-equiv="Cache-Control" cache control http-equiv="Content-Disposition" embedded content or attachment http-equiv="Content-Language" equivalent to HTTPContent-Language header, deprecated http-equiv="Content-Type" content media type http-equiv="Default-Style" http-equiv="Expires" cache expiration date http-equiv="Refresh" refresh or redirect http-equiv="X-UA-Compatible" user agent compatibility name="author" author name="classification" name="copyright" copyright notice name="description" description name="formatter" name="generator" name="google" Google archive directive name="googlebot" Google robot directive name="HandheldFriendly" for pages designed for handheld devices content="true" name="keywords" keywords name="rating" rating name="robots" robots directive name="verify" name="viewport" viewport size for small-screen / handheld devices

Next: Attributes
Prev: <head> Tags
Back Up: Menu

Common Attributes

Attribute Purpose Example accesskey="..." single case-insensitive character to change focus, deprecated class="..." space-separated list of class names for CSS or dynamic selection class="todo high" matches .todo and .high selectors in CSS contenteditable="..." New contextmenu="..." New data-*="..." New author-defined attributes dir="..." draggable="..." New id="..." hidden="..." New lang="..." ISO 639-1 language code, ISO 3166-1 country code, variant lang="en"lang="en-US" spellcheck="..." New style="..." inline styles separated by semicolons tabindex="..." title="..." title xml:lang="..." same as lang use lang instead, without the "xml:" prefix

Event Attributes

Attribute Purpose Example onabort="..." abort event onbeforeonload="..." before onload event onbeforeunload="..." before unload event onblur="..." lost focus event onchange="..." content changed event onclick="..." mouse clicked event oncontextmenu="..." context menu event oncopy="..." copy event oncut="..." cut event ondblclick="..." mouse double-clicked event ondrag="..." drag event ondragend="..." drag ended event ondragenter="..." drag entered event ondragleave="..." drag exited event ondragover="..." drag over event ondragstart="..." drag start event ondrop="..." drop event onerror="..." error event onfocus="..." gained focus event ongesturechange="..." gesture change event ongestureend="..." end of gesture event ongesturestart="..." start of gesture event onkeydown="..." key pressed down event onkeypress="..." key pressed event onkeyup="..." key released event onload="..." document loaded event onmousedown="..." mouse button pressed down event onmousemove="..." mouse moved event onmouseout="..." mouse cursor exited event onmouseover="..." mouse cursor entered event onmouseup="..." mouse button released event onmousewheel="..." mouse wheel rotated event onmove="..." move event onorientationchange="..." device orientation changed event onpaste="..." paste event onreset="..." form reset event onresize="..." resize event onscroll="..." scroll event onselect="..." select event onsubmit="..." form submit event ontouchcancel="..." touch cancelled event ontouchend="..." touch ended event ontouchmove="..." touch move event onstouchstart="..." touch started event onunload="..." document unloaded event

Next: Media Types
Prev: Metatags
Back Up: Menu

HTML Media Types and Expressions

Media Type Description all for all device types, default aural for speech synthesizers braille for braille printers handheld for handheld devices such as cell phones, PDAs and other mobile Internet devices print for printers projection for projection displays screen for traditional computer-based web browsers tty for teletypes and other media with fixed-width-character output tv for televisions and similar devices with limited input capability screen,handheld comma-separated "or"-ed list handheld and (min-width:200px) expressions with media queries

Next: .htaccess
Prev: Attributes
Back Up: Menu

.htaccess

Directive Purpose DirectoryIndex /index.html default page ErrorDocument 404 /error.html error page AddType application/xhtml+xml;charset=utf-8 html HTML 5 media type

Prev: Media Types
Back Up: Menu

<body> Tags

HTML Tag Purpose Attributes <a href="..." ...> hypertext link href accesskeycharsetcoordshreflangmediapingrelrevshapetargettype <a id="..."/> ../definitions/placemark link (anchor) id name <abbr> acronym or abbreviation clear common <acronym> acronyms, deprecated <address> contact information for ancestor <article> or <body> common <applet> Java applets, deprecated <area/> area inside image maps accesskeyaltcoordshrefhreflangmedianohrefpingrelshapetargettype common <article> New sectioning tag for main article pubdate common <aside> New sectioning tag for sidebar common <audio> New embedded audio content autobufferautoplaycontrolsloopsrc common <b> bold keywords or other text with no extra importance common <bb> New type common <bdo> bi-directional text override dir common <bgsound> background sound, deprecated <big> larger text, deprecated <blockquote> block of quoted text cite common <br/> line break common <button> standalone pushbutton accesskeyautofocusdisabledformformactionformenctypeformmethodformnovalidateformtargetnametypevalue common <canvas> New heightwidth common <caption> table caption align common <center> centered blocks, deprecated <cite> citation common <code> program code common <col/> table column aligncharcharoffspanvalignwidth common <colgroup> group of table columns aligncharcharoffspanvalignwidth common <command/> New accesskeycheckeddefaultdisabledhiddeniconlabelradiogrouptype common <datagrid> New disabled common <datalist> New common <dd> definition description common <del> deleted text citedatetime common <details> New open common <dialog> New common <dir> directory listing, deprecated <div> division align common <dfn> inline defined term title="defined term"title="definition" common <dl> definition list compact common <dt> term defined in list common <em> emphasized text common <embed/> New heightsrctypewidth common <fieldset> disabledformname common <figure> New common <fn> footnotes, deprecated <font> font, deprecated <footer> New footer section common <form> form acceptaccept-charsetactiondataenctypemethodreplacetarget common <frame> frames, deprecated <frameset> top level element for a web page with frames, deprecated <h1> <h2> <h3> <h4> <h5> <h6> heading levels 1-6 align common <header> New header section <hgroup> New group of headings for section common <hr/> horizontal rule for a thematic break alignnoshadesizewidth common <i> italics for technical terms, phrases in other languages, etc. common <iframe> inline frame alignframeborderheightlongdescmarginheightmarginwidthnamesandboxseamlessscrollingsrcwidth common <img/> image alignaltborderheighthspaceismaplongdescnamesrcusemapvspacewidth common <input/> input field or control acceptaccesskeyalignaltautocompleteautofocuscheckeddisabledformformactionformenctypeformmethodformnovalidateformtargetheightlistmaxmaxlengthminmultiplenamepatternplaceholderreadonlyrequiredsizesrcsteptypevaluewidth common <ins> inserted text citedatetime common <kbd> keyboard input common <label> label for form control for common <legend> accesskeyalign common <li> list item typevalue (<ol> only) common <mark> New mark selected text common <map> image map name common <menu> menu list compactlabeltype common <meter> New meter or gauge highlowmaxminoptimumvalue common <nav> New navigation section common <noembed> Alternate content to be displayed when the <embed/> tag is not supported, deprecated No replacement needed since the embed tag has been standardized in HTML 5 <noframes> Alternate content to be displayed when frames are not supported, deprecated No replacement needed since frames have been removed from the HTML 5 standard <noscript> fallback content when scripting is disabled common <object> embedded object alignarchiveborderclassidcodebasecodetypedatadeclareheighthspaceobjectstandbytypeusemapvspacewidth common <ol> ordered list compactreversedstarttype common <optgroup> option group disabledlabel common <option> option in selection list disabledlabelselectedvalue common <output> New form common <p> paragraph align common <param/> parameter for object nametypevaluevaluetype common <pre> preformatted text width common <progress> New progress bar maxvalue common <q> quotation cite common <rp> New parenthesized ruby text common <rt> New ruby text common <ruby> New ruby annotation common <s> strike-through text, deprecated <samp> sample program code common <section> New section cite common <select> selection list autofocusdatadisabledformmultiplename common <small> smaller text for comments and legalese common <source/> New external media source mediasrctype common <span> inline group common <strike> strike-through text, deprecated <strong> text with greater importance common <sub> subscript common <sup> superscript common <table> table layout alignbgcolorbordercellpaddingcellspacingframerulessummarywidth common <tbody> table body aligncharcharoffvalign common <td> table cell abbralignaxisbgcolorcharcharoffcolspanheadersheightnowraprowspanscopevalignwidth common <textarea> text input area accesskeyautofocuscolsdisabledformmaxlengthnameplaceholderreadonlyrequiredrowswrap common <tfoot> table footer aligncharcharoffvalign common <th> table column heading abbralignaxisbgcolorcharcharoffheightnowrapvalignwidth common <thead> table heading aligncharcharoffvalign common <time> New time and/or date datetime common <tr> table row alignbgcolorcharcharoffvalign common <tt> teletype text, deprecated <u> underlined text, deprecated <ul> unordered list compacttype common <var> variable common <video> New embedded video autobufferautoplaycontrolsheightlooppostersrcwidth common <xmp> example code using preformatted text, deprecated

Back Up: Menu