HTML/CSS best practice

1. Hold styles inside .css file

<link href="/styles/style.css" rel="stylesheet">

2. Class selectors for styles

3. Readable and clear names. Use hyphen instead of underscore


4. Urls without http/https

<script src="//"></script>

5. Don't use quotes in url()

background: url(//;

6. Divide blocks by one empty line and section - by 2 lines

7. 2 chars length spaces

  <li>One Piece</li>

8. Only lower case for classes/ids

9. utf-8

<meta charset="utf-8">

10. Comments inside css

{# TODO(Developer Name): What to do #}

11. HTML5

12. Set 'alt' attribute

<img src="image.png" alt="Image title">

13. Single line for short definitions

.style-white {color: #fff;}

14. Ordering - alphabetically

15. Split css files into sections, add comment at the top of the section with section name

16. Start section name from '$'

17. Don't use measurement units for line-height

18. Use '.8em' instead of '0.8em'

19. '#fff' better than '#ffffff'

20. New line for every selector

h3 {color: #fff;}


Licensed under CC BY-SA 3.0