Retour de la conférence DotCSS 2016

Quelle belle conférence ce vendredi 02 décembre ! La DotCSS 2016 a eu lieu à Paris, au théâtre des Variétés, j’y étais et c’était top. Cette conférence fut dédiée entièrement aux CSS et à leurs fabuleuses capacités. Aussi, mon post de cette semaine sera sur cette conf qui a donné un beau coup de boost aux CSS dans la capitale.

Entièrement dédié aux CSS, comme son nom l’indique, cette conférence Dot CSS 2016, nous a offert des démonstrations passionnantes du pouvoir des CSS. Ils étaient 8, 8 intervenants passionnés et dynamiques, qui nous ont prouvé en direct (!) des possibilités considérables des CSS. Et ça, c’était un très bon moyen de se réengager dans le code CSS !

1 – Varya Stepanova

Varya nous a présenté son générateur de guide de style, une aide concrète pour concevoir une base de développement pour un site web, à partir de design patterns. En effet, le guide de style ne doit pas refléter que les CSS, mais tous les composants Javascript avec les interactions encadrant tous les éléments du projet. De plus l’intérêt est d’avoir une structure établie qui peut tenir face aux modifications et évolutions que traversera le projet.

Voir les slides de la présentation de Varya

Lire l’article Living SC5 Styleguide, the next level

prez-sarya-dotcss-2016

2 – Wenting Zhang

Wenting nous a fait du live coding pour une moustache en pure CSS. Pour ma part, le fait de voir en direct du code CSS au cours d’une conférence était enthousiasmant et stimulant. Une belle démonstration donc pour concevoir une moustache en pure CSS, ceci en utilisant les box-shadow, et les pseudo-elements :before & :after. Au-delà de ce live-coding, Wenting nous a tous encouragés par son esprit passionné et débordant d’envie de tester et jouer avec les CSS.

Surtout n’hésitez pas à voir son projet de pictos codées en CSS CSSICON

css-icon-wentin-catepeli-blog

3 – Philip Walton

Philip Walton nous a fait la démonstration du pouvoir des polyfills pour les CSS, plutôt la magie : the dark side of polyfilling CSS. Même si l’utilité reste à démontrer dans l’absolu pour un projet, le principe repose sur le CSS Object Model, et embarque les POSTCSS entre autres choses. En fait, la démo me parut un peu rude et je voudrais trouver un testing case pour cette méthodo. A découvrir et développer (pour ma part :)).

Je vous donne le lien pour l’article que Philip Walton a écrit : Houdini: Maybe The Most Exciting Development in CSS You’ve Never Heard Of.

Voir la prez de Philip Walton sur les polyfills CSS

Les polyfills CSS de Philip Walton sur le blog de Catepeli

4 – Chris Lilley

Une présentation passionnante de Chris Lilley (« Oh My God ! ») sur les font-variant, les font-palette… et surtout les variables fonts, des nouvelles features des CSS4 ! Ayé, c’est parti pour une gestion des fonts en responsive, flexibles et originales !

Voir la présentation de Chris Lilley Font-Level-Up.

webfont-chris-lilley-catepeli-blog

5 – Kevin Mandeville

Kevin Mandeville nous démontre la capacité de faire un emailing responsive avec la méthode des FabFour Properties.  Cette méthode utilise les CSS mais sans les media queries. Passionnant !

Voir la présentation de Kevin Mandeville Hacking HTML Emails with CSS.

emails-css-kevin-mandeville-catepeli-blog

6 – Lea Verou

Léa Verou nous présente les variables CSS, des propriétés aux nombreuses possibilités, qu’o peut notamment personnaliser, et nous pouvons déplorer l’absence de support pour Internet Explorer (11 & Edge…). Léa a pu nous démontrer (aussi en live coding) quelques cas des variables CSS. Cette nouvelle feature CSS a pour objectif de limiter la duplication de code, mais surtout de pouvoir utiliser le système de cascade sans modifier les sélecteurs. Une « dash dash » syntaxe très prometteuse.

Je m’interroge juste sur la comparaison d’écriture entre Sass et CSS, avec toutes les capacités de factorisation que nous donne Sass. Anyway, Léa Verou finit sa prez en nous annonçant  les mixins natives…. Serait-ce alors une transformation des CSS qui s’approprie les capacités des Sass ? A voir.

Voir la présentation de Léa Verou CSS (Variables) Secrets.

css-variables-lea-verou-catepeli-blog

7 – Val Head

Val Head a pu nous faire un exposé sur les Ins and Outs of Easing. En effet, Val Head est une experte des animations CSS, et pour cette intervention aux DotCSS, elle n’a pas manqué de nous amuser à travers une expérimentation des différentes animations CSS via les courbes de Bézier et la maîtrise du easing.

Je vous propose de retrouver le travail de Val Head sur Codepen, et les exemples liés au mini book Animations Pocket Guide Book.

Pour télécharger en free le book CSS Animations de Val Head : cssanimationspocketguide.

val-head-css-animations-catepeli-blog

8 – Håkon Wium Lie

Et enfin, le KING, l’inventeur (co-inventeur) des CSS ! Bien sûr c’est carrément impressionnant de pouvoir assister à un pitch de Håkon Wium Lie. Il nous invite vivement à écrire un livre, partager et distribuer nos connaissances par ce biais encore totalement physique et transportable. A partir de cette idée, il nous fait un cours magistral sur l’idée que les CSS peuvent aussi s’appliquer pour du print, construire les marges, les notes…. et qu’elles en deviennent une science physique, toujours aussi passionnante. Contextualiser les CSS pour un support qui n’est pas la cible nous donne une vision qui peut libérer notre écriture.

book-musee-imprimerie-lyon

Plutôt pas mal en guise de conclusion, liberté, passion et jeu pour poursuivre notre enrichissement des CSS.

Ainsi, tous ces intervenants ont pu rebooster notre curiosité et notre envie d’en faire plus, d’en faire mieux. Je pense que nos projets vont pouvoir s’enrichir de  beaux CSS ! Et bien sûr, nous avons en cette fin d’année l’annonce des CSS 4 bien plus concret avec ces quelques features prometteurs à tester tout de suite. Voici donc mon retour de conférence DotCSS 2016, très encourageante, on se sent pousser des ailes pour majorer notre code et réaliser tout le potentiel de ce langage mésestimé.

 

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Categories:
Tags:
Date:
  • 04/12/2016
Share:
%d blogueurs aiment cette page :