1485 sujets
Web Mobile et responsive web design
Bonjour,
Il n'y a pas (et il ne peut pas y avoir) de valeurs précises.
Le nombre et la valeur des breakpoints dépend du contenu et du design du site.
Si ton design est "cassé" à 750px, ton breakpoint sera à 750px.
Pour te rendre compte de la diversité des breakpoints possibles, voici un petit tableau des tailles de devices (loin d'être exhaustif) : http://mydevice.io/devices/
Bonne chance
Il n'y a pas (et il ne peut pas y avoir) de valeurs précises.
Le nombre et la valeur des breakpoints dépend du contenu et du design du site.
Si ton design est "cassé" à 750px, ton breakpoint sera à 750px.
Pour te rendre compte de la diversité des breakpoints possibles, voici un petit tableau des tailles de devices (loin d'être exhaustif) : http://mydevice.io/devices/
Bonne chance
Bonjour,
J'’ajouterais qu’il s’agit de «relevés» en pixel, or comme le dit Raphaël ça dépend énormément du contenu et du design, ce qui peut impliquer de partir sur des media-queries en em ( la conférence de Nicolas Hoizey est plutôt inspirante à ce sujet ).
Ça demande un peu plus de préparation, mais le résultat gagne réellement en qualité et en souplesse.
Bon courage !
J'’ajouterais qu’il s’agit de «relevés» en pixel, or comme le dit Raphaël ça dépend énormément du contenu et du design, ce qui peut impliquer de partir sur des media-queries en em ( la conférence de Nicolas Hoizey est plutôt inspirante à ce sujet ).
Ça demande un peu plus de préparation, mais le résultat gagne réellement en qualité et en souplesse.
Bon courage !
Bonjour,
Merci pour votre réponse et mes excuses pour la mienne tardive.
Toutefois, je souhaiterai profiter de ce post pour avoir d'autres informations/ explications. M'entraînant sur le sujet, je suis en train de refaire à ma "sauce" cette démo : http://wdfriday.com/blog/2012/03/css-et-mobile-first-proceder-par-amelioration-progressive/, issue d'un site ami/ partenaire d'Alsacréation (d'après ce que j'ai pu constater et lire dans les commentaires).
J'ai pris le parti de commencer par composer un code css pour un écran de type PC, avec une largeur de 960px pour le 'wrapper', et de continuer la mise en page en conséquence, c'est à dire avec 3 colonnes. Une fois ceci fait, j'ai embrayé avec les média queries, en partant sur une résolution de type smartphone, avec le contenu sur une colonne comme décrit dans la démo:
C'est à ce moment qu'apparaissent à nouveau les interrogations. Pour expérimenter et surtout pour essayer de comprendre, j'ai passé la largeur du 'wrapper' en pourcentage (100%). Première constatation, tous les articles (donc les images) basculent à gauche du conteneur. Si je rétabli cette même largeur en px (307px dans la démo), les éléments sont bien et correctement centrés. Pourquoi ?
Mais surtout, ce que je ne comprends pas, c'est la méthode de calcul de l'auteur pour les largeurs. Pourquoi la largeur du 'wrapper' en pixels et le contenu (les articles) en % ?
En vous remerciant,
Merci pour votre réponse et mes excuses pour la mienne tardive.
Toutefois, je souhaiterai profiter de ce post pour avoir d'autres informations/ explications. M'entraînant sur le sujet, je suis en train de refaire à ma "sauce" cette démo : http://wdfriday.com/blog/2012/03/css-et-mobile-first-proceder-par-amelioration-progressive/, issue d'un site ami/ partenaire d'Alsacréation (d'après ce que j'ai pu constater et lire dans les commentaires).
J'ai pris le parti de commencer par composer un code css pour un écran de type PC, avec une largeur de 960px pour le 'wrapper', et de continuer la mise en page en conséquence, c'est à dire avec 3 colonnes. Une fois ceci fait, j'ai embrayé avec les média queries, en partant sur une résolution de type smartphone, avec le contenu sur une colonne comme décrit dans la démo:
@media screen and (max-width: 479px)C'est à ce moment qu'apparaissent à nouveau les interrogations. Pour expérimenter et surtout pour essayer de comprendre, j'ai passé la largeur du 'wrapper' en pourcentage (100%). Première constatation, tous les articles (donc les images) basculent à gauche du conteneur. Si je rétabli cette même largeur en px (307px dans la démo), les éléments sont bien et correctement centrés. Pourquoi ?
Mais surtout, ce que je ne comprends pas, c'est la méthode de calcul de l'auteur pour les largeurs. Pourquoi la largeur du 'wrapper' en pixels et le contenu (les articles) en % ?
En vous remerciant,