Google HTML/CSS Style Guide を読んで意外だと思った点まとめ
HTML
-<!-- Not recommended --> -<a class='maia-button maia-button-secondary'>Sign in</a> +<!-- Recommended --> +<a class="maia-button maia-button-secondary">Sign in</a>
CSS
-/* Not recommended */ -border-top-style: none; -font-family: palatino, georgia, serif; -font-size: 100%; -line-height: 1.6; -padding-bottom: 2em; -padding-left: 1em; -padding-right: 1em; -padding-top: 0; +/* Recommended */ +border-top: 0; +font: 100%/1.6 palatino, georgia, serif; +padding: 0 1em 2em;
Do not use units after 0 values unless they are required. flex: 0px; /* This flex-basis component requires a unit. */ flex: 1 1 0px; /* Not ambiguous without the unit, but needed in IE11. */ margin: 0; padding: 0;
Do not use put 0s in front of values or lengths between -1 and 1. font-size: .8em;
-/* Not recommended */ -color: #eebbcc; +/* Recommended */ +color: #ebc;
Alphabetize declarations.
-/* Not recommended */ -a:focus, a:active { - position: relative; top: 1px; -} +/* Recommended */ +h1, +h2, +h3 { + font-weight: normal; + line-height: 1.2; +}
-/* Not recommended */ -@import url("https://www.google.com/css/maia.css"); -html { - font-family: "open sans", arial, sans-serif; -} +/* Recommended */ +@import url(https://www.google.com/css/maia.css); +html { + font-family: 'open sans', arial, sans-serif; +}