L'appellation « image numérique » désigne toute image (dessin, icône, photographie…) acquise, créée, traitée et stockée sous forme binaire.

Wikipedia

Types d'images

il existe deux façons de coder une image numérique:

  • le codage matriciel (bitmap en anglais) qui est un codage des couleurs des pixels.
  • le codage vectoriel qui est un codage des formes contenues dans le dessin.

Bitmap VS SVG Fr.svg
By Bitmap_VS_SVG.svg: Yug, modifications by 3247 derivative work: Tiger66 (talk) - Bitmap_VS_SVG.svg, CC BY-SA 2.5, Link

Images matricielles(ou bitmaps)

Une image matricielle est stockée sous forme d'un tableau de points de couleurs, ces points de couleurs sont appelés pixels, de l'anglais picture element.

Chaque point de l'image possède une abscisse, une ordonnée et une couleur.

Définition et résolution d'une image bitmap

La qualité d'une image matricielle dépend du nombre de pixels de l'image: sa définition.

La définition de l'image

La définition de l'image est le nombre de pixels de l'image.

Par exemple pour une image "SD"(Standard Definition) de 720 pixels sur 576, la résolution est 720 x 576 soit 414720.

La résolution de l'image

La résolution de l'image est le nombre de pixels de l'image par unité de surface, on l'exprime souvent en "ppi": pixel per inch(pixel par pouce) pour les images ou dpi dots per inch(points par pouce) pour les imprimantes et les scanners.

Par exemple pour une impression sur un format A4, une résolution de 300 dpi est en général suffisante pour que l'oeil ne distingue pas les points images. Pour un écran d'ordinateur une résolution de 76 dpi est en général suffisante.

Pour plus de détail, voir cet article sur Wikipedia.

 

On trouve actuellement des téléviseurs 16/9ème UHD 4K(3 840 × 2 160 pixels) de 55 pouces(140 cm) de diagonale.

  1. Calculer la définition et la résolution de ces écrans.
  2. En utilisant le lien ci-dessus, indiquer à quelle distance l'oeil serait capable de distinguer les pixels. Commenter dans le cas d'une utilisation normale de la télé.

Couleurs des pixels

La représentation des couleurs peut se faire de deux façons:

  • le codage RVB(ou RGB en anglais) qui décrit les composantes rouge, verte et bleu généralement avec un octet par composante soit 256 niveaux. Il est également possible de coder une transparence de la couleur dans le cas de superposition d'images comme par exemple dans le format RGBa.
  • le codage TSL( ou HSL en anglais) qui décrit la couleur à l'aide de trois composantes; sa Teinte, sa Saturation et sa Luminosité.
 

Dans un navigateur récent, le sélecteur de couleur de votre système s'ouvre en cliquant sur l'élément suivant:

  1. Comment obtenir du noir ou du blanc en RVB, et en TSL?
  2. Quel est l'effet du réglage de la teinte? et de la saturation?

Formats d'images matricielles

Les principaux formats matriciels sont BMP, GIF, TIFF, PNG, JPEG ou le plus récent WEBP.

Chaque format a ses propres spécificités et utilisations:

  • le format GIF ne supporte que 256 couleurs(1 octet), mais est animable contrairement aux JPEG et PNG.
  • le format JPEG supporte 16 millions de couleurs(3 octets), tout comme le format PNG cependant il est plus léger car les données sont compressées avec une perte de données réglable.
  • le format PNG est lui aussi compressé, mais sans perte, et il est capable gérer la transparence des couleurs contrairement au format JPEG.
  • le format WEBP qui propose une amélioration des performances des algorithmes de compression
  • sans perte du PNG et avec perte du JPEG pour obtenir des fichiers de même qualité 25% plus légers.

Images vectorielles

Une image vectorielle (ou image en mode trait), en informatique, est une image numérique composée d'objets géométriques individuels (segments de droite, polygones, arcs de cercle, etc.) définis chacun par divers attributs de forme, de position, de couleur, etc. Elle se différencie en cela des images matricielles (ou « bitmap »), qui elles sont constituées de pixels.

Par nature, un dessin vectoriel est dessiné à nouveau à chaque visualisation, ce qui engendre des calculs sur la machine.

L'intérêt est de pouvoir redimensionner l'image à volonté sans aucun effet d'escalier. L'inconvénient est que pour atteindre une qualité photoréaliste, il faut pouvoir disposer d'une puissance de calcul importante et de beaucoup de mémoire. Source Wikipedia

Formats

Les fichiers pdf sont des fichiers vectoriels très utilisés dans le domaine de l'édition. Ils peuvent être créés à partir de fichiers textes ou images des éditeurs LibreOffice par exemple.

Dans le domaine du web, le format svg est un format standard proposé par le W3C. Il peut être intégré directement dans les pages web sous forme de code svg ou par l'appel de fichiers externes avec l'extension svg. Voir le cours Dessin vectoriel en svg

Les fichiers svg peuvent être créés ou modifiés avec le logiciel de dessin vectoriel libre Inkscape.

Comparaisons de formats

Image vectorielle Image matricielle
Image vectorielle Image matricielle
Image vectorielle Image matricielle
Image vectorielle Image matricielle

Une image vectorielle est redimensionnable sans perte de qualité, contrairement à une image matricielle.

D'autres part une image vectorielle est souvent plus légère(sauf si elle ne contient pas de formes simples à dessiner!).

Cependant une image vectorielle nécessite d'être redessiné à chaque affichage ou redimensionnement, elle nécessite donc davantage de puissance de calcul et de mémoire vive.

 

En utilisant des images de divers formats de fichier(jpg, png, gif, svg), grâce à l'outil de recherche de Google Images.

Star Wars Logo.svg
By User:KAMiKAZOW - Transferred from en.wikipedia to Commons., Public Domain, Link

  1. Comparer la taille des fichiers rapportée au pixel(octet/pixel).*
  2. Calculer le rapport de compression supposant que le stockage consite uniquement à stocker la couleur des pixels. Par exemple, en GIF, un pixel peut avoir 256 couleurs soit 1 octet, les pixels RGB sont stockés sur 3 octets(16 millions de couleur), les pixels RGBA sur 4 octets(16 millions de couleurs ayant chacune 256 niveaux de transparence)
  3. Recommencer avec des images plus complexes telles que des photos.