Chaque fois que vous téléchargez une image, jusqu'à 5 copies de taille réduite sont créées. Guesty Sites Internet insère ensuite automatiquement l'image au format approprié sur les versions ordinateur, tablette et mobile de votre site, garantissant ainsi à vos visiteurs un affichage optimal sur leur appareil.
Note :
- Il est possible de télécharger jusqu'à 15 000 fichiers (images, clips audio, icônes et autres fichiers) par site, et chaque fichier ne doit pas dépasser 50 Mo.
Configuration système requise pour Webp
Les versions suivantes sont prises en charge pour les images Webp :
- iPhone : v14 et versions ultérieures
- Mac/Safari : dernière version
- Chrome : toutes les versions
- Android : toutes les versions
Les types de fichiers image suivants sont pris en charge :
png, jpg, jpeg, gif, svg, svg+xml, ico, x-icon, webp
Tailles d'image optimisées par appareil
La taille de l'image téléchargée n'est pas augmentée et seules des images plus petites que l'originale sont créées. Par exemple, si une image de 2 000 px de large est téléchargée, 5 nouvelles copies optimisées seront créées. Si une image de 100 px de large est téléchargée, aucune nouvelle image ne sera créée.
Type d'image |
Largeur de l'image |
|---|---|
Arrière-plan |
2880px |
Ordinateur de bureau |
1920px
Comprimé
1280px
Mobile
640px
Vignette
Miniature du blog
160px
300px
Note:
L’optimisation peut être désactivée pour les images d’arrière-plan, le Image et le Galerie de photos.
Pour plus d'informations, consultez les articles suivants :
La désactivation de l'optimisation des images peut avoir un impact sur la vitesse de chargement des pages et/ou sur les performances.
Taille maximale de l'image
La surface totale d'une image ne peut excéder 3 145 728 pixels. Il est peu probable que vos images dépassent cette limite, mais vous pouvez le vérifier rapidement en multipliant la largeur par la hauteur en pixels.
La taille de l'image ne doit pas dépasser 15 Mo.
Le téléchargement d'une image plus volumineuse que la limite peut entraîner les erreurs suivantes :
- Les images n'ont pas pu être téléchargées.
- Les images se téléchargent, mais les vignettes ne s'affichent pas dans le sélecteur d'images.
- Les images ne se chargent pas dans l'éditeur.
- Les images ne se chargent pas sur le site en ligne.
Recommandations concernant la taille des images par widget
Curseur
Le widget Slider est généralement utilisé avec des images de grande taille pour un effet saisissant. Les sliders s'étendent souvent d'un bord à l'autre ; il est donc conseillé d'utiliser des images plus larges pour qu'elles s'affichent correctement. Pour les sliders carrés, utilisez un format d'image symétrique, par exemple 1:1.
Il est préférable de choisir des images avec une marge suffisante afin que leur contenu principal ne soit pas tronqué lors du redimensionnement. Les proportions des images doivent être identiques dans le diaporama pour une présentation harmonieuse.
- Formats d'image courants : 16:9, 3:4
- Tailles de résolution courantes (px) : 1600x900, 1280x720, 1280x960
Note:
Les appareils mobiles ont souvent un format d'image inversé par rapport aux ordinateurs de bureau. Il peut être nécessaire d'utiliser la fonction « Masquer sur l'appareil » pour afficher correctement les diaporamas sur mobile.
Galerie photo
Le widget Galerie photo est le plus flexible pour la gestion des images grâce à ses nombreuses options de mise en page. Vous pouvez par exemple opter pour une galerie en mosaïque, où toutes les images ont la même taille, ou pour une galerie en mosaïque, où chaque image a une taille différente.
Le format des images dans la galerie photo doit correspondre à l'affichage souhaité.
- Par exemple, les galeries de style carré devraient avoir un ratio d'images de 1:1.
- Les galeries d'images au format vertical doivent avoir des proportions plus élevées, comme 2:5, ou 200px par 500px.
Les proportions des images doivent être identiques pour une cohérence visuelle. Prévoyez une marge autour des images pour profiter de l'effet de survol et éviter que elles ne soient tronquées.
- Formats d'image courants : Tous les formats d'image.
- Tailles de résolution courantes (px) : Toute résolution, mais pas supérieure à 1500 px pour une vitesse de chargement de la page.
Icônes
Les icônes sont essentielles à tout site web. Elles servent de repères visuels pour l'information et peuvent donner un aspect moderne à votre site. Vous pouvez utiliser des fichiers PNG transparents, JPEG ou SVG.
- Formats d'image courants : généralement 1:1, mais n'importe quel format d'image conviendra.
- Tailles de résolution courantes (px) : 200x200, 80x80 ou toute autre résolution. Les fichiers SVG peuvent avoir n'importe quelle résolution.
Pour plus d'informations, consultez la section Icônes du site.
Note :
Les fichiers SVG contiennent du code HTML. Par conséquent, ajouter une icône SVG à votre site revient à ajouter des lignes de code. Plusieurs icônes SVG complexes peuvent représenter des milliers de lignes de code et ralentir considérablement le chargement de votre site. Si vous devez utiliser plusieurs icônes SVG sur une même page, nous vous recommandons de convertir certaines d'entre elles en images classiques (format .png, .jpeg, etc.) afin d'éviter les problèmes de chargement ou de fonctionnement.
Favicons
Les favicons ne sont pas utilisés sur votre site web, mais s'affichent dans l'onglet qui s'ouvre lorsque les utilisateurs ouvrent votre site. Il est recommandé d'utiliser le format ICO. Pour convertir des fichiers image au format ICO, consultez la ressource suivante.
- Format d'image requis : 1:1
- Tailles de résolution autorisées (px) : 24x24, 36x36, 48x48
Logos
Il est recommandé d'utiliser le format SVG pour les images de logo, car les fichiers SVG ne sont pas optimisés de la même manière que les autres fichiers image ; ainsi, même si le logo que vous téléchargez est de petite taille, vous ne perdrez pas en qualité.
Format d'image vs résolution
Le format d'image correspond au rapport entre la largeur et la hauteur d'une image. Une image au format 16:9 peut avoir des dimensions de 16 x 9 pixels ou de 1600 x 900 pixels. Il s'agit de toute image dont la résolution respecte ce format.
Visualisation des deux formats d'image les plus courants :
Formats d'image par appareil
Bien que les images soient optimisées pour votre site, leur format d'affichage reste inchangé. Si vous utilisez une image au format 16:9 sur un ordinateur de bureau, elle s'affichera parfaitement, car l'écran d'un ordinateur est plus large. En revanche, sur un appareil mobile, l'écran est beaucoup plus petit ; une image au format 16:9 peut donc paraître trop petite.
Pour y remédier, vous pouvez soit utiliser la fonction « Masquer sur l'appareil » afin de créer des versions spécifiques pour ces appareils, soit redimensionner l'image pour qu'elle s'adapte. Les modifications de taille sont indépendantes de l'appareil.
Considérations
Le plus grand n'est pas toujours le meilleur
Télécharger des images en haute résolution sur votre site garantit à vos clients une qualité optimale. Cependant, n'oubliez pas que les images volumineuses ont un impact considérable sur la vitesse de chargement de vos pages. Comme les images haute résolution sont redimensionnées, les utilisateurs ne remarquent généralement pas la différence. Il est donc préférable de télécharger des images aux dimensions exactes de leur utilisation prévue. Par exemple, si vous avez une image de 300 x 300 pixels sur votre site, il est déconseillé de la télécharger en 4 000 x 4 000 pixels.
