Mehdi Kabab, auteur du livre « Sass & Compass avancé, optimiser ses feuilles de styles CSS » et Expert front-end à Clever Age Lyon, partage avec nous dans une courte interview son point de vue et ses motivations concernant son dernier ouvrage.
Toutes les informations sur le livre : Sass & Compass avancé, optimiser ses feuilles de styles CSS
Vous pouvez également feuilleter quelques pages sur le site des éditions Eyrolles.
Pourquoi avoir écrit le livre Sass & Compass avancé ?
Utilisateur de Sass et Compass depuis début 2010, j’ai commencé à écrire quelques articles sur mon blog pour tenter d’évangéliser le préprocesseur CSS auprès des intégrateurs web.
Il y a un peu plus d’un an, j’ai participé à la relecture de l’ouvrage CSS Maintenables de Kaelig Deloumeau-Prigent qui propose une initiation à Sass et à Compass. Cette expérience m’a conforté dans l’idée que le sujet méritait un plein ouvrage. En effet, jusqu’à aujourd’hui, aucun ouvrage dédié n’existait pour le marché francophone. J’ai donc proposé mes services aux Éditions Eyrolles.
Peux-tu nous expliquer en quelques mots le principe de Sass combiné à Compass ?
Sass, le préprocesseur CSS, est un métalangage de feuille de style. C’est à dire qu’il enrichit la syntaxe de CSS de mécanismes avancés qui font défaut au langage de présentation : variables, directives de contrôles, fonctions, etc.
Compass est un framework CSS3 basé sur Sass. Il facilite la création de feuilles de styles CSS de niveau 3, notamment en apportant un support cross-browser avancé.
Quel intérêt pour les entreprises d’intégrer Sass et Compass dans leurs projets ?
J’ai eu l’occasion de mettre en pratique les notions présentées dans mon livre dans le cadre de projets que j’ai mené pour Clever Age Lyon.
Par exemple, dans le cadre de la refonte des sites internet du Groupe APRIL, l’aide apportée par Sass pour modulariser les feuilles de styles ont facilité la déclinaison des thèmes Drupal, grâce à une forte réutilisation du code entre les différents sites du groupe. Par ailleurs, le découpage logique des feuilles CSS des sites a permis une prise en main plus rapide par de nouveaux intervenants.
Les mécanismes avancés apportés par Sass facilitent la mise en œuvre du principe DRY, ce qui apporte un gain de productivité important lors des phases d’intégration. Finies les répétions de code ; désormais, tout ce qui est mutualisable ou réutilisable est stocké dans des variables, des mixins ou des fonctions. Bien évidemment, la gestion et la maintenance du projet d’intégration est d’autant simplifiée puisque le code métier est centralisé et plus disséminé aux quatre coins de la feuille de styles.
Compass facilite le support cross-browser des projets d’intégration qui doivent encore supporter d’anciennes versions de navigateurs, tels que Internet Explorer 7 et 8. Embarquant un module de création de sprites CSS, l’intégrateur n’a plus de difficultés à employer cette technique habituellement ingrate, améliorant ainsi les performances du site en réduisant les temps de chargement.
Le préprocesseur CSS et son framework CSS3 ont fait leurs preuves. C’est pourquoi des entreprises comme le Groupe APRIL, Rezulteo, la BBC News, The Guardian ou encore LinkedIn ont adopté ces outils dans leur workflow de production.
Une petite anecdote en passant : LinkedIn a embauché Chris Eppstein, qui n’est autre que le co-mainteneur de Sass et le créateur de Compass, pour maintenir et faire évoluer ces deux projets.
Aussi, la pérennité d’un outil est primordiale. Épaulé par une grande communauté d’utilisateurs, nous avons vu de grands acteurs du web comme Google et LinkedIn s’investir dans le projet. Investir une montée en compétence sur Sass et Compass est aujourd’hui un bon investissement.
À qui est destiné ton livre ? Que va-t-on y trouver ?
Le livre Sass & Compass avancé est avant tout destiné au développeur-intégrateur qui cherche à s’approprier Sass et son framework CSS3, Compass. L’apprentissage du langage est à l’honneur avec une découverte de sa syntaxe et de ses mécanismes sur plus de 100 pages.
À l’issue de la lecture de cet ouvrage, l’intégrateur expérimenté aura les clés pour penser des arborescences projet plus robustes, et naturellement, l’amener à rendre ses projets plus modulaires et donc en faciliter la maintenance.
L’intégrateur y trouvera également de l’aide pour générer des sprites CSS (classiques et Haute Définition) en un tour de main grâce à un chapitre de 42 pages dédié au sujet !
Enfin, le chef de projet pourra s’assurer que les intervenants d’un projet travaillent avec les mêmes versions des outils.