Compared to <link>s, @import is slower, adds extra page requests, and can cause other unforeseen problems. Avoid them and instead opt for an alternate approach
Compile your CSS with a preprocessor like Sass or Less into a single file
Place media queries as close to their relevant rule sets whenever possible.
Limit shorthand declaration usage to instances where you must explicitly set all available values.
Avoid unnecessary nesting. Just because you can nest, doesn't mean you always should. Consider nesting only if you must scope styles to a parent and if there are multiple elements to be nested.
For a complete list of properties and their order, please see
" elements of type number are used to let the user enter a number. They include built-in validation to reject non-numerical entries. The browser may opt to provide stepper arrows to let the user increase and decrease the value using their mouse or by simply tapping with a fingertip."
The value of input elements whose type attributes are in the Text, Search,
URL, or E-mail states and that are mutable (i.e. that do not have the readonly attribute specified and that are not disabled).The value of textarea elements that do not
have a readonly attribute and that are not disabled.
Note the input types that we can set spellcheck="false" include:
email url search text
Otherwise, if there is an ancestor element with a spellcheck content attribute that is not in the default
state, then: if the nearest such ancestor's spellcheck
content attribute is in the true state, then checking is enabled; otherwise, checking is
disabled.
User agents should take into account the other semantics given in
the document when suggesting spelling and grammar corrections. User agents may use the language of
the element to determine what spelling and grammar rules to use, or may use the user's preferred
language settings. UAs should use input element attributes such as pattern to ensure that the resulting value is valid, where
possible.
A figure can be used with or without a figcaption. However, without a caption, or an alternate means of providing an accessible name (e.g. aria-label) a figure may not provide much value in conveying its semantics alone. In some cases, it may not convey any semantics at all if its given no accessible name.
Headings in a <legend>
In forms, the <legend> element represents a caption for the form fields within a <fieldset>. Before HTML 5.2, the content of a legend had to be plain text. Now, we can include heading elements.
Browsers that support HTML5 form validation have one thing in common; if a <form> is submitted and has errors on multiple fields, the browser will only display the first error to the user.
instead of listening for submit on the <form>, I instead listen for a click on the <input type="submit">. Since the user is also able to submit the form pressing enter in text inputs, I attach a keypress listener to them to ensure the same logic runs.
The results and autosave attributes shown above are not standard. In WebKit and Blink browsers you can add the non-standard results attribute to get a looking glass icon to click to see the latest searches, and autosave to keep them across page loads.
When a value is present, a gray x control shows up on the right of the input in IE, Chrome, Safari and Opera (but not Firefox or Chrome on Android) which can be clicked to clear the value.
On mobile devices with on-screen keyboards, the search input type sets the submit button text to "Search".
On desktop devices, this should also enable submitting the form by pressing the Enter key?
Possible values are:
off: The user must explicitly enter a value into this field for every use, or the document provides its own auto-completion method. The browser does not automatically complete the entry.
on: The browser is allowed to automatically complete the value based on values that the user has entered during previous uses, however on does not provide any further information about what kind of data the user might be expected to enter.
name: Full name.
honorific-prefix: Prefix or title (e.g. "Mr.", "Ms.", "Dr.", "Mlle").
given-name: First name.
additional-name: Middle name.
family-name: Last name.
This attribute applies when the value of the type attribute is text, search, tel, url, email, or password, otherwise it is ignored.
minlength HTML5
If the value of the type attribute is text, email, search, password, tel, or url, this attribute specifies the minimum number of characters (in Unicode code points) that the user can enter.
maxlength
If the value of the type attribute is text, email, search, password, tel, or url, this attribute specifies the maximum number of characters (in UTF-16 code units) that the user can enter.
autocorrect
A Safari extension, the autocorrect attribute is a string which indicates whether or not to activate automatic correction while the user is editing this field. Permitted values are:
on
Enable automatic correction of typos, as well as processing of text substitutions if any are configured.
The :required attribute works on radio buttons. If you put required on one radio button (or all), that particular group of radio buttons will be required. On checkboxes, makes each individual checkbox required (to be checked).
a bit less data to produce the same quality, or will sound a bit better at the same bitrate
MP3 was also covered by a bunch of patents, so you had to license it for a fair bit of money; those patents have finally expired now. Ogg and Vorbis have always been free (and the reference implementation available under an LGPL and later BSD license).
Besides the data- prefix, the name of a valid custom data attribute must contain only letters, numbers, hyphen (-), dot (.), colon (:) or underscore (_). It cannot contain capital letters.
I recommend you use this method for quick prototypes rather than a production website, not least because CSS-only tooltips are not fully accessible.
Get the meta element out of your markup and and send the header over HTTP instead.
On Apache, add this to your root .htaccess file:
Header set X-UA-Compatible "IE=edge"