Un plan de salle modifiable avec les grilles et propriétés personnalisées CSS
Retrouvez les slides en ligne sur
→ ffoodd.fr/paris-web.2019.
Once upon a time 🧚
Bla bla bla !
Le principe de moindre pouvoir 🦄
C’est un des axiomes du web, proposés par Tim Berners-Lee en 1998 — à côté de kiss, du design modulaire, de la tolérance ou de la décentralisation.
Le mantra de l’amélioration progressive, en somme…
Le code 🧐
Quelques Indice 🧐 sont disséminés dans les slides !
Les fondations 🧱
Document minimal, balisage et accessibilité
Indice 🧐
header, main, aside…
Les gens 👥
On fait l’appel ?
Le décor 🖥
Où l’on cache des choses…
Indice 🧐
Connaissez-vous le rôle presentation ?
Le plan 📦
Définir les espaces
Indice 🧐
Saviez-vous qu’on peut utiliser des custom properties
dans la fonction repeat() ?
L’aménagement 📦
On place les bureaux
Indice 🧐
Il y a deux solutions, dont une supportée uniquement par Firefox Nightly.
Portrait et paysage 🧭
Un parcours d’orientation
Indice 🧐
Une seule propriété suffit — mais plusieurs valeurs à tester.
Placer les gens 📌
Avec style
Indice 🧐
La propriété existe déjà, mais manque cruellement de variables…
On fait les cartons 🤸
Déménagement progressif
Indice 🧐
Quelques details pour la form.
On se bouge 🤸
Un heureux événement
Indice 🧐
Le style n’est que l’écoute des changements, pas vrai ?
Sauvegarder ses positions 💾
Mais où ?
Indice 🧐
On reste dans le navigateur — en local.
Une sidebar masquée 🙈
Ohé ohé 🎵
Indice 🧐
Masquée, vraiment ?
Exporter, c’est donner 🖅
Et données, c’est data
Indice 🧐
Il suffit de faire le lien vers les data.
Import 🐷
C’est pas bientôt fini ?
Indice 🧐
Un type sur un champs qui n’accepte pas n’importe quoi.
Le droit à l’oubli 🗙
Repartir de zéro
Indice 🧐
Il y a un type pour ça.
Flécher le parcours ↔
Quatres boutons dans le vent
Indice 🧐
On arrête les details, ça donne des boutons.
Rester branchés 🔌
Faut revoir la transimission
Indice 🧐
Transmettre les ordres avec méthode.
Le chant du clavier ⌨
Ni Christian ni Jean-Michel Jarre, merci
Indice 🧐
Il manque seulement une oreille.
Conclusion
Learning is fun 💃
J’espère que vous aurez appris un ou deux trucs !
Merci
Et à bientôt ☺
Crédits
- Moteur de présentation : AccesSlide — par Access42 ;
- Pictogrammes : Rounded UI — par Marek Polakovic ;
- Typographie de titraille : Bello Pro — créée par Underware ;
- Typographie de labeur : Museo Slab — créée par Exljbris.