Le 14 septembre 2017, nous avons publié une version actualisée de notre Politique de confidentialité. En utilisant video2brain.com vous vous engagez à respecter ces documents mis à jour. Veuillez donc prendre quelques minutes pour les consulter.

L'essentiel des CSS

Explorer les différents modules

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Comprendre les feuilles de style, c'est avant tout commencer par vous appuyer sur le standard régit par le W3C. Le consortium vous permet de synthétiser et documenter l'ensemble des modules, en publiant les travaux de chaque groupe de travail.
05:54

Transcription

Depuis CSS3, la condition d'utilisation modulaire a vraiment été mise en avant et on n'aura plus CSS4, CSS5, etc comme on aurait pu le penser. Ici, dans CSS3, tout est question de module. On le voit bien sur ce schéma qui est dans Wikipédia, qui nous permet de comprendre la décortication des CSS par module. Ici, par exemple, j'ai le module Selector. Donc ici, Selector c'est celui qui va me servir pour pointer un élément dans la page pour lui affecter des déclarations. Ici, on voit que le Selector est vert. Vert, c'est quoi ? C'est recommandation. Recommandation, ça veut dire que le W3C l'a validé, l'a homologué, et que maintenant l'intégralité de la communauté l'utilise. Candidate Recommandation, c'est en cours de validation, c'est en pourparlers, c'est une des versions pré-finales. Le Last Call, c'est le groupe de travail qui est en charge du développement du module qui va inviter la communauté globale, y compris nous, les développeurs, ou les utilisateurs, à pouvoir lire ces Candidate Recommandations afin qu'elles deviennent des Candidates Recommandations. En rouge, c'est les Working Draft, donc tous les modules qui sont en cours de développement, de travail. Pour pouvoir mieux capter tout ce qui se passe à l'intérieur de ces modules, je vous invite à vous rapprocher de W3C qui est le constructeur qui régit l'intégralité des standards. Et donc, si par le passé, son site était un capharnaüm, ici, aujourd'hui, c'est quand même très bien fait, c'est propre, c'est super organisé... Vous avez un blog ici qui vous permet d'être informé, de pouvoir suivre l'actualité du W3C. Ici, une page dédiée aux standards, avec les principaux axes de standards, avec le semantic web, le web architecture, etc. Vous pouvez bien sûr participer à tous les groupes de travail, à tous les forums de discussion qui existent autour de chacun des modules des technologies, des langages, etc... C'est très très volumineux. Je vous invite à venir le parcourir. Quoiqu'il en soit, on va retenir 3 pages principalement, ici qui vont nous amener toutes à ces fameuses recommandations qui expliquent un module en particulier des CSS. Que vous cherchiez des informations sur Google, ou que ce soit un lien sur un site, vous pouvez arriver sur ces pages de documentation. Mais encore faut-il les lire, encore faut-il les appréhender ! Alors, ce que je vous propose ici, c'est une page d'entrée différente à chaque fois, ici, soit par all CSS specifications qui va permettre de regrouper par modules généraux, on va dire, l'intégralité des travaux. Ici, si on prend l'exemple du sélecteur, je peux soit accéder à la recommandation du Selector Level 3, soit accéder à son historique. Et là, son historique me dira : « ce travail a commencé le 3 août 1999 et s'est terminé par une recommandation le 29 septembre 2011.» Donc ça vous permet de pouvoir suivre toutes ces recommandations, et par exemple d'accéder au working draft qui existait en 2000, vous accédez directement à l'élément. Ici au niveau du current status, c'est la même chose mais avec un accès différent, c'est-à-dire que là, c'est par rapport au travail qui est en cours d'organisation, d'une part, et puis de regroupement. Ce qu'il faut voir, ici, c'est que vous avez show details qui vous permet de lister un certain nombre d'informations, vous voyez ici dessous. Ou hide details qui permet de n'avoir que le titre du module. Si vous savez quel module vous cherchez, c'est plus facile de le retrouver par là. Il n'est pas classé par ordre alphabétique, il est classé par dates et en fonction des standards, des brouillons, etc. Les Candidates Recommandations, vous les avez toutes. Et là, pareil, si je prends Media queries Level 4, j'accède directement à la recommandation qui lui est associée. Enfin, celui qui est le plus visuel d'entre tous, qui est le Current work & how to participate, c'est module par module, et surtout dans leur état. Ça rejoint un peu le côté visuel de Wikipedia, sur lequel j'ai démarré, qui permet d'avoir des couleurs, et surtout des petits acronymes, alors WD, working draft, last call, candidate recommandation et recommandations etc. Donc vous les voyez directement, ici, à ce niveau-là, vous pouvez savoir où se trouve, en gros, l'état d'avancée du travail. Ce qui est important de voir ici avant tout, je prends region exprès, parce qu'ici c'est assez explicite, on va le voir. Ici, quand j'arrive sur la recommandation des CSS regions, ici, je me retrouve avec plein de versions. Cette version en cours, là où on est, la latest version, la dernière version en cours, l'editor's draft, le previous version... Ça fait beaucoup de versions tout ça ! Il faut savoir que le groupe de travail qui écrit ces recommandations, qui les homologue, commence par une personne qui va travailler seule sur sa copie pour recopier tout ce qu'a fait le groupe, et ça, c'est l'editor's draft, et là, attention, on est en rouge, c'est un peu en wiki, c'est un document de travail très avancé qui n'est pas encore la proposition de recommandation faite par le groupe. Donc c'est en rouge quand c'est vraiment l'éditeur. Vous pouvez le contacter ici, vous avez les coordonnées. Donc c'est ouvert, c'est vraiment public, c'est vraiment quelque chose d'assez riche à travailler. Alors, ici, si je prends l'exemple qu'on avait tout à l'heure, sur les selectors on était partis sur une version an 2000. Admettons que ce soit Google qui m'amène sur cette page, ce qu'il faut s'assurer dès qu'on arrive sur une page, c'est de bien être sur la latest version la dernière version qui est retenue. Parce qu'ici, il peut être dit : "on va faire ci, ça" et puis 2 versions après... Tant que ce n'est pas une recommandation, que c'est un working draft, ça a pu être bougé, changé. Donc assurez-vous d'être sur une dernière version. En cliquant là-dessus, maintenant, vous voyez une dernière version qui a été faite le 29 septembre 2011, ce qui n'est pas le cas ici, car j'étais en 2000, donc il y a 11 ans de plus qui s'est rajouté sur la page ! Et qu'est-ce que je peux avoir ici, dans les selectors ? On va pouvoir venir creuser, et on a tout le détail, avec l'intégralité du contenu qui est sommarisé, ici, très riche, et puis surtout on a toujours des tableaux qui vont nous permettre de voir tous les types de sélecteurs sur lesquels on va pouvoir venir s'appuyer et travailler et sur lesquels les navigateurs modernes devraient venir s'appuyer. Voilà, donc encore une fois, avec cette approche en module, ça va permettre de décomposer une masse énorme de possibilités technologiques qu'apportent les CSS, et je vous invite donc à venir les travailler de manière verticale, en passant par le W3C et la publication de chacun de ses modules.

L'essentiel des CSS

​Explorez et assimilez les outils de base des CSS pour en comprendre les interactions visuelles. Structurez et gérez ainsi l’apparence et le visuel de vos sites web.

5h09 (54 vidéos)
Aucun commentaire n´est disponible actuellement
 
Logiciel :
Thématiques :
Design web
Standards du web
Spécial abonnés
Votre/vos formateur(s) :
Date de parution :28 avr. 2016
Durée :5h09 (54 vidéos)

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !