General HTML CSS Style Guide

Adapted from the Google HTML/CSS Style Guide.

Licensed under CC-BY 3.0.

For Style Guides specific to either HTML or CSS, see:

• HTML Style Guide
• CSS Style Guide

General Rules

Protocol

Omit the protocol portion (http:, https:) from URLs pointing to images and other media files, style sheets, and scripts unless the respective files are not available over both protocols.

<!-- Not recommended -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<!-- Recommended -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

/* Not recommended */
.example {
  background: url('http://www.google.com/images/example');
}

/* Recommended */
.example {
  background: url('//www.google.com/images/example');
}

Indentation

Indentation should use 2 spaces at a time, never tabs or a mix of tabs/spaces.

<div>
  <p>Fantastic</p>
  <p>Great</p>
</div>

.example {
  color: #ffffff;
}

Capitalization

<!-- Not recommended -->
<A HREF="/">Home</A>

<!-- Recommended -->
<img src="google.png" alt="Google">

/* Not recommended */
color: #E5E5E5;

/* Recommended */
color: #e5e5e5;

Encoding

Use UTF-8.

Specify the encoding in HTML templates and documents via <meta charset="utf-8">.

There is no need to specify the encoding of style sheets as these assume UTF-8.