[ About | Licence | Contacts ]
Written by Oleksandr Gavenko (AKA gavenkoa), compiled on 2017-01-30 from rev ccaa2f364422+.

HTML.

HTML spec

https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes
HTML attribute reference (single page).

HTML version declaration

HTML5 version is declared via:

<!doctype html>

HTML4.01:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

Page encoding

Place in HEAD tag (CHARSET is one among of defined by http://www.iana.org/assignments/character-sets):

<meta http-equiv="Content-Type" content="text/html; charset=CHARSET">

or in HTML 5:

<meta charset="utf-8">

See:

http://www.w3.org/TR/REC-html40/charset.html#h-5.2.2

Page or text language

Client may suggest preferred language to server via Accept-Language HTTP tag:

Accept-Language: da, en-gb;q=0.8, en;q=0.7

W3C best practice suggest to surround corresponding text pieces in tag with lang attribute. Attribute values are from BCP 47.

It is good to set language in html tag:

<html lang="en">
https://www.w3.org/International/tutorials/tutorial-char-enc/
Handling character encodings in HTML and CSS (tutorial).
http://www.iana.org/assignments/language-subtag-registry/language-subtag-registry
IANA registered language and country codes. Coherent with ISO codes but frequently updates.
http://www.ietf.org/rfc/bcp/bcp47.txt
Tags for Identifying Languages (Best Current Practice).
https://www.w3.org/International/articles/language-tags/
Language tags in HTML and XML.
https://www.w3.org/International/questions/qa-html-language-declarations
Declaring language in HTML.
https://www.w3.org/International/questions/qa-lang-why
Why use the language attribute?

Including CSS and JS fragments and files

HTML 4.01 require type attribute in CSS and JS linking tags:

<link rel="stylesheet" type="text/css" href="path-to.css">
<style type="text/css">...</style>

<script type="text/javascript" src="abc.js"></script>
<script type="text/javascript">...</script>

HTML 5 makes type attribute unnecessary when declaring or linking to external CSS / JS:

<link rel="stylesheet" href="path-to.css">
<style>...</style>

<script src="abc.js"></script>
<script>...</script>

Quoting in HTML

In HTML 5 attribute values only need to be quoted if they contain spaces or some non-alphanumeric characters.

HTML 5 support

http://html5please.com/
Look up HTML5, CSS3, etc features, know if they are ready for use, and if so find out how you should use them – with polyfills, fallbacks or as they are.
https://modernizr.com/
Modernizr tells you what HTML, CSS and JavaScript features the user’s browser has to offer.
http://caniuse.com/
Browser compatibility database of HTML 5 features.

Embedding structural data

Example:

<div itemscope itemtype="http://schema.org/Person">
  My name is <span itemprop="name">Random Hacker</span>,
  And I'm a <span itemprop="jobTitle">software developer</span>
</div>
http://schema.org/
Schemas for structured data on the Internet, on web pages, in email messages, and beyond.

Video and audio support

HTML 5 add video and audio tags and corresponding JS API to support video and audio playback.

https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats
Media formats supported by the HTML audio and video elements.
https://support.mozilla.org/en-US/kb/html5-audio-and-video-firefox
HTML5 audio and video widget in Firefox.
https://developer.mozilla.org/en-US/docs/Web/API/Web_Video_Text_Tracks_Format
Introduction to WebVTT.

Center an object.

To center block-level element:

<div style="margin-left: auto; margin-right: auto; position: relative; width: 700px;">
  <div>SOME</div>
</div>

To center inline element:

<p style="text-align: center;">TEXT</p>

Browser support.