Comment préparer des images pour la publication en ligne


Comment choisir la meilleure taille d'image pour votre site web ?
La préparation des images en vue de leur publication en ligne permet d'accélérer le chargement de votre site web. Deux étapes suffisent. Tout d'abord, vous devez modifier la largeur et la hauteur de votre image à l'aide d'un éditeur de photos, par exemple un éditeur gratuit en ligne. Ensuite, vous devez compresser l'image à l'aide d'un compresseur d'images, ce quiréduira la taille du fichier.
Les images de petite taille se chargent plus rapidement. La taille de l'image dépend de deux paramètres :
1. La largeur et la hauteur de l'image en pixels (les images dont la taille est de 3000 х 2000 pixels sont plus grandes que les images de 300 x 200 pixels).
2. Le contenu de l'image - plus l'image contient de détails et de couleurs, plus sa taille est importante.

Nous vous recommandons de préparer une image pour sa publication en ligne en la recadrant d'abord, puis en supprimant les détails inutiles afin d'accélérer son chargement.
Quelle est la taille d'image idéale ?
Lors du téléchargement sur Tilda, toutes les grandes images sont automatiquement redimensionnées à 1680 pixels. Les images inférieures à 1680 pixels conservent leur taille d'origine.

Comme il s'agit d'un processus automatisé, il se peut que la qualité de votre image soit diminuée pour que le chargement soit plus rapide. C'est pourquoi vous pouvez éditer vos photos manuellement : vous préserverez ainsi mieux leur qualité.
Avant de télécharger une image de grande taille sur Tilda, réduisez la taille de l'image à au moins 1680 pixels si elle est mesurée par rapport à son bord le plus long.
Idéalement, vous devriez télécharger des images dont la taille correspond à celle qu'elles devraient avoir sur le site web. Si la photo n'a pas la taille qu'elle devrait avoir dans la mise en page, le navigateur compresse ou étire l'image automatiquement. Il ne fait ni l'un ni l'autre, de sorte que la photo peut apparaître floue.

Pour connaître la taille de votre image, ajoutez un bloc de texte à la page, activez la grille dans les paramètres du bloc et vous verrez le nombre de colonnes que l'image occupera. La largeur d'une colonne est de 60 pixels, la distance entre les colonnes est de 40 pixels.
Comment réduire la taille d'un fichier image ?
Vous pouvez utiliser un logiciel spécial qui compresse les images en combinant des couleurs similaires. Ces programmes combinent les couleurs d'une manière si complexe que vous ne pourrez pas faire la différence entre "avant" et "après". Ils peuvent réduire la taille de votre image jusqu'à 70 %.

Vous pourriez vouloir vérifier :
Exemples d'optimisation d'images
Utilisons cette image de Christoph Bengtsson Lissalde que nous avons téléchargée depuis Unsplash, pour montrer comment fonctionne l'optimisation des images.

Taille de l'image originale : 4405 х 2478 pixels, taille du fichier : 3.5MB.
Chargeons l'image telle quelle sur Tilda . L'image sera recadrée à 1680 x 945 pixels, et sa taille deviendra 1,2 Mo.

Ouvrez le fichier original dans Photoshop, modifiez la taille de l'image à 1680 х 945 pixels et enregistrez-la - sa taille sera réduite à 832 Ko.

Téléchargez la photo vers TinyPNG pour la compresser, et vous obtiendrez une image de 353 Ko.
Nous avons réussi à préserver la qualité de l'image.
Fabriqué le
Tilda