Comment faire du "responsive design" ?

[@EcoleduWeb]

🎓 Tous mes cours sur l'École du Web (pour tout obtenir d'un seul coup) : www.ecole-du-web.net/ 🎁 Tous mes cours sur UDEMY : www.liste-des-cours.com/

[@DrChikenman]

Hello Enzo ! Actuellement professeur des écoles dans l'éducation nationale, je suis au départ titulaire d'un DUT informatique que j'ai obtenu en 2008 (eh ouais ça remonte...). J'ai décidé que j'allais lâcher l'EN dès l'année prochaine pour me reconvertir en tant que dev web et je passe la quasi intégralité de mon temps libre à me reformer avec des vidéos comme les tiennes. Je tenais à te dire que tes contenus sont précieux et d'une qualité assez rare. Merci pour le boulot abattu, c'est vraiment très très bon ! Bonne continuation à toi, et merci pour ta générosité dans cette démarche de partage de connaissances 😊

[@electronpositron7005]

Merci Enzo pour se condenser ! cela nous permet de faire un tour rapide et efficace concernant le responsive design ;)

[@JoeSmith-wu3yz]

Ce cours tombe à point nommé ! Merci l'ami ;)

[@rocramos6091]

J'ai vu pas mal de vidéos que tu faisais concernant CSS et ça m'a beaucoup aidé. Merci beaucoup et bon courage pour la suite

[@EcoleduWeb]

Merci à toi !

[@hafid1332]

12:29 Juste un détail on devrait plutôt dire "jusqu'a" pour "max-width" et "à partir de" pour "min-width" . je sais que c'est qu'un détail , mais ça peut être déroutant si on utilise pas les bons mots. à part ça encore une fois c'est toi qui explique le mieux sur youtube..

[@baptistebidaux]

Merci Enzo beaucoup de choses intéressantes ! Notamment l’utilisation de flex-shrink et flex-grow qui sera désormais plus claire pour moi ;-)

[@clementromanowski7333]

Se serait cool que tu utilise la dernière mise à jour yt et que tu fasses le sommaire de ta vidéo pour l'avoir dans la barre de lecture. Ça apporte un plus à la vidéo c'est vraiment cool de pouvoir facilement skip les parties qui nous intéresses pas.

[@EcoleduWeb]

C'est pas bête ça je vais voir comment le faire :)

[@bibiderennes]

Excellent ! Merci ! 👍

[@janjak5285]

Bon tuto avec plein d'infos sur lesquelles on pourra creuser pour ce qui nous intéresse. Merci à toi

[@pascalquetin8110]

La meilleur vidéo que j'ai vu concernant ce sujet. Avec un débit orale et des explications visuels un peu moins "speed" cela apporterait une plus facile compréhension pour les neueux de mon genre. Le recours aux tutos sont aussi pour les débutants. Dans tout cas, c'est clair mais Il faut simplement repasser beaucoup de fois "le cours".

[@ludovicleveque3485]

Merci beaucoup! Maintenant j'ai compris quand je regarde tes vidéos je prends un cahier avec moi y a toujours des petits tips à noter !!! si tu permets !

[@EcoleduWeb]

Bonne idée aha!

[@awalifouiny9798]

felicitation mon chers et courage pour la suite merci beaucoup

[@ThePokebip]

Merci pour cette vidéo, très instructive quand on crée notre portfolio en étant étudiant.

[@gabrielbuhendwa9864]

Merci beaucoup pour la video

[@yannickbonnaud1038]

Juste une petite correction, 13:10, ça ne passe pas en rouge A PARTIR DE 1500 px mais c'est rouge JUSQU'A 1500px... Et donc c'est aussi rouge sous les 1100 px, je m'étonne que personne n'ait relevé depuis tout ce temps :)

[@remitheguik1303]

merci pour cette vidéo, je me disais que ce que mon site faisait c'était chelou sur mobile, c'était à cause de la fameuse balise meta que tu présentes au début :p

[@emmanuelmichelzangna2202]

merci beaucoup vraiment merci c'es vraiment explicite j'adore mais je voulais savoir a propos de Rem/em, si tous les parents y compris n'a pas de size que va t'il se passer merci encore et stp j'attend ta reponse

[@59140Dunkerque]

super. merci pour ces explications

[@polov8092]

super video merci !!!

[@pastek2554]

merci t'es un bon

[@Unctroi]

merci c'est vraiment cool, ça complète bien openclassroom car je ne comprenais pas tout avec le chapitre de Mathieu Nebra qui parle de ça... par contre pourquoi est-ce qu'il y a l'attribut name dans la balise meta ? Pour moi name c'est utilisé uniquement dans les formulaires, du coup je comprends pas très bien...

[@EcoleduWeb]

Hello, name dans les balises Meta sert seulement à les différencier

[@patriciasaccaggipats]

Chouette, ça m'a aidé pour comprendre un peu et arranger une page externe de mon essai de site mais je mélange un peu tout (j'suis déb). Hors sujet de cette vidéo mais j'aimerais savoir quel genre d'hébergeur tu conseilles pour son portfolio ?

[@EcoleduWeb]

N'importe quel hébergeur classique fera l'affaire pour un portfolio (goDaddy, Ionos ...) Tu peux aussi l'herbeger gratuitement avec Github / Netlify / etc

[@m__link6499]

En m'entrainant à développer un site, j'ai fais une erreur de débutant: au lieu d'utiliser des margin auto par exemple, je les ai mis en pixel, du coup pour le responsive, je m'arrache les cheveux...😭

[@Ruben-ob3ey]

Bonsoir, petite question : Lorsque je réduis la taille de ma fenêtre, mes média queries fonctionnent sans aucun soucis, mais lorsque j'utilise l'inspecteur de google chrome pour utilise le toggle device toolbar, les changements appliqués dans les média queries ne fonctionnent plus... pourquoi ?

[@EcoleduWeb]

Ça arrive parfois quand on laisse toggle device toolbar ouvert trop longtemps, fermez et ouvrez à nouveau les outils / la fenêtre :)

[@Ruben-ob3ey]

@@EcoleduWeb merci

[@murielleturpeau6789]

Bonjour, Je viens de coder mon site et j'essaie de le rendre responsive mais c'est plus difficile pour moi. Pouvez-vous m'aider, svp?

[@MiliamuIrakiza]

Liked!

[@Ludo045]

C'est vrai que le max-width and min-width est interessant Le problème que j'ai souvent avec le *@media screen* et le responsive est que comme il y'a plusieurs écrans dans la console et d'un écran à l'autre le comportement est différent, et je me trouve à faire un ecran très petit pour qu'il corresponde directement à tous les écrans portable en même temps 😑 ou pire encore je me lance dans un incroyable travail fastidueux à faire des *@media screen* pour je ne sais combien de px ou mobile.. Et même ça ce ne marche pas parce que je retrouve avec des écrans comme *Nest Hub Max* ou *Nest Hub* qui bug à cause de la hauteur et non plus la largeur 😅

[@progamer8117]

Merciiii !!! il me fallais juste le min-width et max-width

[@shmoophy6024]

meric killiannes ! ! !!