Quelles dimensions pour vos images ?

Dans ce guide nous allons vous expliquer :

• • • • Quels sont les usages sur le web
      • Quels types de fichiers sont concernés
      • Prendre le temps de bien nommer ses fichiers (voir notre article précédent)
      • Quelles sont les tailles-dimensions idéales
      • Quel est le ratio taille-poids idéal

Puis nous vous indiquons quelques outils utiles

Quels sont les usages sur internet ?

Un site internet comporte des images qui sont de moindre définition que pour l’impression.
En effet, les écrans n’ont qu’entre 72 et 96 pixels par pouces  (Retina plus de 225 ppp) alors que les impressions professionnelles doivent contenir un minimum de 300 pixels par pouces.

La raison est que le rétro éclairage des écrans produit un halo sur chaque point et les yeux humains font la liaison et complètent les vides qui vont rester visibles à l’impression.

Quels types de fichiers sont concernés ?

5 types de fichiers image sont acceptés sur le web :

• • • • JPG – Format compressé, donc moins lourd.
      • PNG – Plus lourd que le JPG, ce format a l’avantage de gérer la transparence. Il est souvent utilisé pour les logos.
      • GIF – Permet de gérer des animations (image par image)
      • SVG – format vectorisé employé pour les pictogrammes

Le 5ème format : WebP – récemment accepté par WordPress – est LE format à privilégier. Des extensions Adobe proposent ce format, et d’autres programmes gratuits sont disponibles pour Mac ou PC.
Vous pouvez aussi faire la conversion directement en ligne =>  JPG en WEBP

Quelles sont les dimensions idéales pour mes images ?

Entrons concrètement dans le vif du sujet :

• • • • Images de bannière/carrousels, celles qui se trouvent sous votre menu.
        En principe elles doivent couvrir toute la largeur des écrans. Ce qui donne pour du Full HD un minimum de 1’920 px de largeur par 700-800 px de hauteur maximum.
        A noter que pour les smartphones, il faut remplacer ces images ‘paysage’ par des images ‘portrait’.
      • Images pour un fond d’écran format 16:9 – 2’560 px de largeur par 1’440 px de hauteur (2K).
        A noter que les écrans Retina sont en 4K et que la majorité des écrans sur le marché sont en Full HD = 1’920 x 1’080 px (illustration ci-dessous).
      • Images à l’intérieur des pages – Nous préconisons une taille de 1’000 px maximum sur le côté le plus long.

Quel est le ratio poids/taille idéal pour mes images ?

Vous avez sans doute remarqué que les écrans changeaient très vite, et bénéficiaient d’une technologie de plus en plus pointue. Il est compliqué de statuer sur un seul format qui conviendrait à tous, mais, à l’heure actuelle, nous préconisons les tailles suivantes :

Quelques outils gratuits en ligne

Création de visuels attrayants en ligne avec Canva

Canva est un outil polyvalent que nous utilisons chez App ‘n’ Web pour créer la majorité des visuels destinés aux réseaux sociaux, tant pour nous-mêmes que pour nos clients. Bien que Canva propose une version payante avec des fonctionnalités avancées, sa version gratuite offre déjà une panoplie de ressources suffisantes pour réaliser d’excellents designs.

Que vous ayez besoin d’une composition accrocheuse pour Instagram ou d’une bannière pour Facebook, cet outil vous permet d’adapter facilement vos créations aux diverses exigences de taille des plateformes sociales. Sa capacité à économiser du temps et des efforts tout en fournissant des résultats professionnels en fait un allié précieux pour de nombreux créateurs de contenu.

Même sans compte, certains de leurs outils en ligne restent accessibles.

Et un outil gratuit à installer sur votre ordinateur

Il est léger et facile d’utilisation et fera l’affaire pour les 3 options ci-dessus (redimensionnement, compression et recadrage). Il possède d’autres fonctions utiles comme les modifications de couleurs, l’amélioration de la qualité de l’image et de contraste.