- Validate your HTML.
- Use HTML5 elements like
nav.* Make sure every image has
- Use the
picture element and
srcset to provide the image most suitable for the user’s device. You can use Picturefill to enable support for
picture in browsers that don’t support it yet.
- Think about performance: what are you loading that people won’t see?
- Ensure that your HTML document follows correct outline guidelines. See Document Outlines for an excellent introduction.
- Use HTML5 input types like
- Don’t use inline CSS (using the
style tag or
style attribute on HTML elements): use external stylesheets (using the
link tag). The exception is for critical CSS: initially sending a small amount of CSS in the head of the document so that page rendering starts as early as possible.
- Don’t use inline JS (using a
script tag or directly on an HTML element): include external JS files (using the
src attribute on a
script elements at the bottom of the page, or load them asynchronously by adding the
async attribute to the
- Colour and contrast. Ensure sufficient contrast to make site readable for everyone.
- Colour blindness test with Colorblind Web Page Filter