Comment garder son code CSS maintenable et organisé ? Dans cette présentation j'ai expliqué ma façon de faire et des outils pour établir une base facilement maintenable avec un code CSS qui devient de plus en plus complexe. Sass, Compass, Modernizr…
43. _reset.scss
* { margin: 0; padding: 0 } : c’est le mal
Eric Meyer Reset CSS 2.0 ou YUI Reset
+ mes propres règles de reset
http://meyer web.com/eric/tools/css/reset/
48. _pages.scss
tout ce qui est spécifique à des pages en
particulier
overrides de styles par défauts pour une
partie du site
si ce fichier contient trop de règles, j’ai
peut être raté quelque chose
49. OOCSS
bien + qu’un framework : une façon
d’envisager CSS
séparation structure / apparence
séparation forme / fond
https://github.com/stubbornella/oocss/wiki
50. Exemple simple
.btn
.btn.btn-primary button.btn a.btn.btn-success
input.btn.btn-info div.btn.btn-danger
51. Pourquoi OOCSS ?
forte réutilisation du code CSS
HTML plus flexible
meilleures performances de rendu
facile à comprendre par un autre
intervenant sur le projet
54. Plein de bonnes
pratiques
HTML5 Boilerplate
http://html5boilerplate.com/
55. En bref
J’écris moins de code
Je recherche constamment un moyen
d’en écrire encore moins
Un code simple & accessible aux newbies
sera plus simple à revisiter par soi-même
dans 6 mois
Je réutilise le code d’un projet à l’autre