Responsive design CSS
Fermé
Gu1ll4um3111
Messages postés
1
Date d'inscription
dimanche 12 avril 2020
Statut
Membre
Dernière intervention
12 avril 2020
-
12 avril 2020 à 20:35
Pangolino - 13 avril 2020 à 04:25
Pangolino - 13 avril 2020 à 04:25
1 réponse
Salut,
vous pouvez commencer par donner des dimensions en pourcentage et absolument évitez toute dimension absolue(pixels, points à remplacer par % et em entre autres).
Ensuite il y a les media queries (CSS) qui permettent de faire plusieurs mise sen pages selon des critères comme des tailles limites.
"Je ne suis pas intéressé pour le moment de l'adapter à un format smartphone."
Ah pourtant les sites sont le plus souvent regardé sur des smartphones , vous vous privez donc de la majorité des visiteurs du web.
En plus ça rends le référencement auprès de Google moindre puisque Google privilégie les sites mobiles first(affichage pour mobile en premier) justement pour privilégier le plus d'utilisateurs.
"Sur mon pc 15" d'une résolution de 1920px voila ce que ça m'affiche : "
Surtout pas faire une mise en page en fonction de votre écran ou de celui de papa, il faut faire une mise en page pour tout le monde. Donc éviter et supprimer toute dimension fixe qui ne peut pas s'adapter à tout les écrans. Il y a des résolutions plus grande que la votre, des plus petites, des gens qui veulent regarder leur site Internet en mode fenêtré dans un navigateur qui est réduit à la moitié de l'écran et bien sûr les appareils mobiles et tablettes qui ont des affichages(résolution) plus petit et pas toujours en mode paysage(rectangle où la hauteur est plus petite que la longueur).
Comme vous le dites ce que vous faites s'appelle un bug puisque l'utilisateur(la plupart c'est à dire ceux qui n'ont pas la même résolution d'écran que vous) ne peut pas voir correctement une page.
Quelques pistes par là:
https://www.alsacreations.com/article/lire/1615-cest-quoi-le-responsive-web-design.html
je vous laisse chercher par vous-même des exemples de code qu'il faudra pratiquer un peu pour comprendre.
Et les enjeux et priorités pour tout les sites qui vont bien au delà du design (et font la différence entre un site de qualité et un qui ne l'est pas):
https://www.w3.org/WAI/
vous pouvez commencer par donner des dimensions en pourcentage et absolument évitez toute dimension absolue(pixels, points à remplacer par % et em entre autres).
Ensuite il y a les media queries (CSS) qui permettent de faire plusieurs mise sen pages selon des critères comme des tailles limites.
"Je ne suis pas intéressé pour le moment de l'adapter à un format smartphone."
Ah pourtant les sites sont le plus souvent regardé sur des smartphones , vous vous privez donc de la majorité des visiteurs du web.
En plus ça rends le référencement auprès de Google moindre puisque Google privilégie les sites mobiles first(affichage pour mobile en premier) justement pour privilégier le plus d'utilisateurs.
"Sur mon pc 15" d'une résolution de 1920px voila ce que ça m'affiche : "
Surtout pas faire une mise en page en fonction de votre écran ou de celui de papa, il faut faire une mise en page pour tout le monde. Donc éviter et supprimer toute dimension fixe qui ne peut pas s'adapter à tout les écrans. Il y a des résolutions plus grande que la votre, des plus petites, des gens qui veulent regarder leur site Internet en mode fenêtré dans un navigateur qui est réduit à la moitié de l'écran et bien sûr les appareils mobiles et tablettes qui ont des affichages(résolution) plus petit et pas toujours en mode paysage(rectangle où la hauteur est plus petite que la longueur).
Comme vous le dites ce que vous faites s'appelle un bug puisque l'utilisateur(la plupart c'est à dire ceux qui n'ont pas la même résolution d'écran que vous) ne peut pas voir correctement une page.
Quelques pistes par là:
https://www.alsacreations.com/article/lire/1615-cest-quoi-le-responsive-web-design.html
je vous laisse chercher par vous-même des exemples de code qu'il faudra pratiquer un peu pour comprendre.
Et les enjeux et priorités pour tout les sites qui vont bien au delà du design (et font la différence entre un site de qualité et un qui ne l'est pas):
https://www.w3.org/WAI/
