1. Commencez avec des images de haute qualité
Photographie de stock: vous n’avez pas besoin d’être un photographe professionnel pour utiliser de superbes images sur votre site Web. Chaque jour, il semble qu’il existe de plus en plus de sites de photos de haute qualité où vous pouvez télécharger des photos gratuites à des fins commerciales. Certains de nos favoris sont:
Pixabay
Unsplash
Images de la grange
PicJumbo
SplitShire
Petits visuels
… Et avec un site Web Jimdo, des images libres de droits sont disponibles directement dans votre bibliothèque d’images.
Lorsque vous téléchargez une image à partir de l’un de ces sites Web, il s’agit probablement d’un très gros fichier JPEG. Pour le compresser pour votre site Web, vous devrez réduire la taille et télécharger une version plus petite (plus d’informations ci-dessous). Mais ça va. Commencer par un grand format est idéal, car vous pouvez toujours réduire la taille d’une grande image. (Agrandir une petite image ne fonctionnera pas si bien).
Prendre vos propres (meilleures) photos: bien sûr, vous ne pouvez pas utiliser de photos d’archives pour tout (comme votre équipe ou votre produit). Il existe quelques astuces faciles pour rendre vos images bien éclairées et plus professionnelles, même sans équipement de caméra sophistiqué (comme ce tutoriel sur la création de votre propre lightbox).
Graphiques: si vous cherchez quelque chose de plus graphique, il existe une tonne de nouveaux outils en ligne gratuits que vous pouvez utiliser pour créer vos propres infographies ou photos avec des superpositions de polices. Nous adorons Canva et PiktoChart. Si vous recherchez un logo, nous vous recommandons de consulter notre créateur de logo.
2. Utilisez le bon type de fichier: JPEG ou PNG
Si vous vous posez des questions sur différents fichiers image tels que JPG, PNG, GIF et SVG, sachez simplement que sur votre site Web, vous êtes le plus susceptible d’utiliser un format JPEG (JPG) ou PNG. Il y a des avantages et des inconvénients de chacun, mais dans la plupart des cas, vous pouvez vous rappeler ce qui suit:
Les photographies doivent être enregistrées et téléchargées au format JPG. Ce type de fichier peut gérer toutes les couleurs d’une photographie dans une taille de fichier relativement petite et efficace. En utilisant des fichiers JPEG, vous ne vous retrouverez pas avec l’énorme fichier que vous obtiendrez si vous enregistrez une photo au format PNG.
Les graphiques, en particulier ceux utilisant de grandes zones plates de couleur, doivent être enregistrés au format PNG. Cela inclut la plupart des conceptions, des infographies, des images contenant beaucoup de texte et des logos. Les fichiers PNG sont de meilleure qualité que les fichiers JPEG, mais sont généralement fournis avec une taille de fichier plus importante également. Comme leurs proches, le fichier SVG, les PNG traitent les zones de couleur et de texte avec de belles lignes nettes, vous pouvez donc zoomer et ne perdre aucune qualité. Ils prennent également en charge les arrière-plans transparents (ce que vous voudrez si vous utilisez un logo). Si vous avez le choix, nous vous recommandons d’enregistrer les fichiers PNG au format «24 bits» plutôt que «8 bits» en raison de la meilleure qualité et du tableau plus riche des couleurs prises en charge.
Et si vous utilisez une photo avec du texte dessus? Si la majorité de l’image est une photographie, restez sur un JPEG.
La plupart des programmes d’images simples vous permettent de choisir JPG ou PNG en allant dans «Enregistrer sous», «Exporter» ou «Enregistrer pour le Web» et en choisissant le type que vous préférez. Il existe également des outils en ligne gratuits basés sur un navigateur comme Zamzar qui convertiront les fichiers pour vous.
Vous pouvez convertir un PNG en JPEG, mais vous ne gagnez rien en convertissant un JPEG en fichier PNG. En effet, un fichier JPG est déjà stocké dans ce qu’on appelle un format avec perte – les données d’image ont déjà été perdues lors de leur compression, vous ne pouvez donc pas les récupérer par magie. Par exemple, si vous ne disposez que de votre logo au format JPG, vous devrez vous adresser directement à votre concepteur et lui demander un fichier PNG à partir de son programme de conception d’origine, plutôt que d’essayer de procéder à une rétro-ingénierie d’un PNG à partir d’un fichier JPEG.
3. Redimensionnez les images pour optimiser la vitesse et l’apparence de la page
Avec les images Web, vous voulez trouver le bon équilibre entre taille et résolution. Plus votre résolution est élevée, plus la taille du fichier sera grande. Dans le monde de l’impression, les images haute résolution sont une bonne chose. Mais sur le Web, des images haute résolution de grande taille peuvent ralentir la vitesse de navigation de votre site Web. Cela nuit à l’expérience de vos utilisateurs et, éventuellement, à votre classement dans les moteurs de recherche. Les grandes images et les temps de chargement lents sont particulièrement ennuyeux pour les visiteurs mobiles.
Il y a des moments où vous voudrez utiliser de grandes images sur votre site Web, comme pour votre arrière-plan ou votre image de héros. Si vous utilisez des images de faible qualité et essayez de les faire exploser pour qu’elles soient suffisamment grandes, elles seront floues.
Alors, comment trouver le bon équilibre entre taille et qualité? Tout d’abord, il est important de comprendre qu’en matière d’images, la «taille» est un terme relatif. Ce dont vous avez besoin pour l’impression est généralement beaucoup plus important que ce dont vous avez besoin pour un site Web. Voici un aperçu des trois principaux aspects qui composent la «taille»:
Taille de fichier optimale: le nombre d’octets que le fichier occupe sur votre ordinateur. C’est le facteur qui peut ralentir votre site Web : . Une image de 15 Mo (mégaoctets) est énorme. Une image de 125 Ko (kilo-octets) est beaucoup plus raisonnable. Si la taille de votre fichier est vraiment volumineuse, cela indique que les dimensions de votre image sont trop grandes ou que la résolution est trop élevée.
Taille de l’image: les dimensions réelles de votre image, en pixels. Vous pensez probablement aux photos imprimées traditionnelles comme 4 × 6, 5 × 7 ou 8 × 10. Mais sur le web, la hauteur et la largeur sont mesurées en pixels. Ainsi, par exemple, une image typique sur un site Web ou un blog peut être de 795 × 300 pixels.
Résolution pour les images Web: à partir du monde de l’impression, la résolution est la qualité ou la densité d’une image, mesurée en points par pouce (dpi). Une imprimante professionnelle peut nécessiter des images d’au moins 300 dpi. Mais la plupart des moniteurs d’ordinateur affichent 72 dpi ou 92 dpi, donc tout ce qui est supérieur à cela est exagéré et rend votre image inutilement grande. Lorsqu’un programme de conception a la possibilité d ‘«enregistrer pour le Web», cela signifie qu’il doit être enregistré à une résolution faible et conviviale pour le Web.