carrousel bootstrap avec photos: taille d'image optimale?
J'expérimente avec le carrousel de Bootstrap et j'aimerais l'utiliser avec des photographies.
Question: Quelle est la taille optimale pour les images à télécharger pour une utilisation sur le carrousel?
Dans la distribution Bootstrap actuelle (v3.2.0), l'exemple carousel.html utilise une image 1x1 pixel simple en tant qu'arrière-plan:
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="First slide">
Je ne pouvais pas trouver ce documenté et les photos que j'ai expérimentées sont étirées/déformées sur l'écran de mon ordinateur portable.
Il n'y a pas vraiment de taille d'image "optimale". Dans l'exemple avec le pixel 1x1, c'est un pixel qui se répète encore et encore pour couvrir toute l'étendue de son div contenant.
Ce D&EACUTE;MO BOOTPLY DU CARROUSEL utilise une image au format 1024x700 px. Si vous voulez avoir une image de carrousel qui couvre toute la largeur de l'écran, c'est probablement une bonne idée d'utiliser une image d'au moins 1024 pixels de large (éventuellement plus large), mais vous ne voulez pas qu'elle soit trop haute résolution puisque cela prendrait beaucoup de temps à charger.
La hauteur de l'image va probablement être inférieure à la largeur et dépend vraiment du type d'image que vous utilisez et de la hauteur souhaitée pour l'image du carrousel.
Sinon, la meilleure chose à faire est d'essayer différentes images et de voir ce qui est beau.
Remarque: la démonstration Bootply utilise http://placehold.it qui est un bon outil pour essayer différentes tailles d’image, ou consultez http://placekitten.com/ .
En fait, il y a un rapport d'aspect spécifique pour lequel ce carrousel force l'affichage des images. Si vous n'utilisez pas ce format, les images seront toujours déformées et affichées dans ce format. Le carrousel ne correspondra pas au rapport hauteur/largeur des images.
Le rapport de cul bizarre qu'il utilise, qui est en fait un assez bon rapport d'aspect à cet effet imo est. . . roulement de tambour s'il vous plaît . . . 84:25! Après plusieurs tentatives, j'ai trouvé que la meilleure taille pour moi était 1680x500. Il est vrai qu’elle s’étire un peu sur les gros appareils et perd un peu de netteté, mais elle reste belle et d’une taille de fichier gérable et est superbe sur la plupart des moniteurs.
Vous pouvez le confirmer en utilisant l'échantillon du carrousel sur getbootsrap. com et en l'ouvrant en plein écran et en prenant une capture d'écran. Puis découpez la zone avec le carrousel. Utilisez la méthode que vous préférez pour déterminer la taille des images et insérez ces chiffres dans votre calculateur de format d'image préféré.