Si vous ouvrez une image avec un damier de gris en arrière plan, telle que celle que je vous présente ci-dessus, c’est donc une image avec le fonds transparent qui s’adaptera à la couleur de fonds de votre document ou de votre site web.
C’est de plus un format d’image qui accepte la compression sans perte de qualité.
Quels sont les formats d’images compressés ?
D’après les données du site w3techs.com, plus de 75% des sites internet utilisent la norme jpeg.
Fichier image JPG / JPEG
Quelle différence entre format jpg et jpeg ?
Réponse : il n’y a aucune différence entre l’extension jpg ou jpeg. Vous retrouverez plus souvent le jpeg sur Mac et jpg sur Windows.
Que veut dire jpeg ?
JPEG est une abréviation qui signifie en anglais : Joint Photographic Experts Group. La norme jpeg a été créée en 1992 par un comité d’experts.
Le format jpg c’est quoi ?
Réponse : le format JPEG est le format le plus populaire. C’est celui de vos images prises avec votre smartphone ou votre appareil photo numérique. C’est également sous ce format que vous trouvez la majorité des images, icônes ou dessins lorsque vous effectuez une recherche dans votre moteur de recherche (Google, Qwant, Ecosia, Lilo…).
Les images en version jpg sont dans un format compressé afin de prendre le moins de place possible sur votre stockage : carte sd dans un smartphone, disque dur dans l’ordinateur ou sur le serveur de votre site web. Ce format d’image est donc celui qui est le plus utilisé sur tous les sites internet puisque la vitesse d’accès à votre site est un des points clés d’un bon référencement.
Quelle est l’unité d’une image JPEG ?
Une image jpeg est une image pixelisée, donc contenant un certain nombre de pixels. C’est un carré et l’ensemble des carrés représente l’image. Si l’image est de qualité, l’oeil humain n’est pas capable de distinguer ces pixels. Par contre, si l’image n’est pas de bonne qualité ou si vous agrandissez trop une image, vous verrez ces fameux pixels, comme sur cette image ci-dessous.
Le détourage d’arrière-plan, pris en charge par les formats GIF, PNG et JPEG, simule la transparence par remplissage ou fusion des pixels transparents avec une couleur de détourage correspondant à la couleur d’arrière-plan de la page web. Le détourage d’arrière-plan donne de meilleurs résultats lorsque le fond de la page web est d’une couleur unie et que vous connaissez cette couleur.
Pour créer une transparence ou un détourage d’arrière-plan dans l’image optimisée, vous devez commencer par utiliser une image contenant des pixels transparents. Vous pouvez créer la transparence lorsque vous créez un calque ou que vous utilisez les outils Gomme d’arrière-plan, ou Gomme magique.
Lorsque vous travaillez avec des fichiers au format GIF ou PNG-8, vous pouvez créer des zones transparentes à bords nets : tous les pixels transparents à plus de 50 % dans l’image d’origine sont complètement transparents dans l’image optimisée, et tous les pixels opaques à plus de 50 % dans l’image d’origine sont complètement opaques dans l’image optimisée. Utilisez la transparence à bords nets lorsque vous ne connaissez pas la couleur d’arrière-plan de la page web ou lorsque cet arrière-plan présente une texture ou un motif. Toutefois, gardez à l’esprit que la transparence à bords nets peut produire des bords crénelés dans l’image.
Là on touche un point sensible au niveau de l’infographie. La transparence est primordiale, du fait qu’elle nous permet d’assurer une insertion maîtrisée de l’image dans n’importe quel arrière-plan.
Le JPEG ne supporte pas la transparence
Lorsque vous entendez enregistrer une image qui contient des pixels transparents et des pixels partiellement transparents sous le format JPEG, Photoshop vous propose de mélanger les pixels transparents avec une couleur qui peut être spécifiée dans le menu « Détourage » N°10 :
Il faut faire attention à ce propos :
- un pixel totalement transparent va avoir pour couleur celle spécifiée dans le menu « Détourage » car le pixel est totalement transparent et n’a donc aucune couleur inhérente ;
- pour le cas des pixels partiellement transparents la couleur finale sera le fruit de la couleur initiale du pixel ainsi que la couleur spécifiée dans le menu « Détourage ».
La transparence PNG-8 et GIF
Les deux formats PNG-8 et GIF supportent une transparence binaire qui se caractérise par deux états distincts : totalement opaque ou totalement transparent, ceci implique que les pixels partiellement transparents ne vont pas être restituésfidèlement mais plutôt ils vont être mélangés avec une autre couleur qui peut être précisée dans le menu « Détourage ».
La transparence PNG-24
Le format PNG-24 offre la possibilité d’une transparence graduelle à 256 niveaux selon l’opacité qui peut être réglée dans la fenêtre des calques : 
Contrairement aux formats PNG-8 et GIF, le format PNG-24 peutrestituer parfaitement les pixels partiellement transparents.
Pour bien parfaire vos connaissances quant à la transparence des formats d’mages je vous ai préparé une petite application 
Pour en tirer profit, faites déplacer l’un des formats suivants sur le contenu de la page.
JPEG
GIF non transparent
GIF transparent
PNG-8 non transparent
PNG-8 transparent
PNG-24 non transparent
PNG-24 transparent
Commentaires
- le format JPEG ne pourra en aucun cas supporter l’effet de transparence.
- les deux formats GIF et PNG-8 supportent uniquement une transparence binaire (opaque/transparent), autrement dit, ils ne peuvent pas exprimer une transparence à différentes intensités.
- pour les formats non transparents, Photoshop proposent toujours de mélanger les pixels totalement et partiellement transparents avec une autre couleur qui peut être spécifiée dans le menu détourage. A ce propos il y a 3 situations différentes :
- les formats d’images sont complètement opaques (JPEG, GIF, PNG-8 et PNG-24 non transparents) : la couleur spécifiée dans le menu détourage va cibler les pixels totalement et partiellement transparents.
- les formats PNG-8 et GIF transparents : la couleur spécifiée dans le menu détourage va cibler les pixels partiellement transparents.
- le Format PNG-24 peut restituer parfaitement les pixels transparents et semi transparents. Pour bien appréhender la transparence graduelle du PNG-24, déplacez l’image au dessus du texte pour admirer l’effet de transparence multiniveau : la bordure et les noms des navigateurs sont totalement opaque (opacité : 100% = alpha : 255), les icônes des browsers sont partiellement transparentes (opacité : 75% = alpha : 175), le fond est totalement transparent (opacité : 0% = alpha : 0).
En faisant survoler l’image sur le contenu de la page vous allez vous rendre compte que les icônes des navigateurs laissent apparaître plus ou moins ce qui est en-dessous.
- Internet Explorer 6 gère mal le canal alpha et affiche les images PNG-24 sans transparence, il se comporte d’une manière assez étrangère
en remplissant les pixels transparents par un bleu clair (azur) 
qui a la valeur hexadécimale #d3e6ea ou si vous voulez la valeur RGB(211,230,234).
Le canal alpha et le filtrage anti-aliasing (anticrénelage)
L’un des avantages appréciables du canal alpha en plus de la transparence graduelle, c’est la possibilité d’assurer un filtrage anti-aliasing. De quoi s’agit-il exactement ?
L’anti-aliasing permet de diminuer l’effet d’escalier des images qui apparaît tout au long des contours des éléments de l’image (les éléments internes de l’image : les tracés, textes, logos, bords d’objets etc.). L’effet aliasing est attribuable à l’aspect discret (discontinu) des données numériques : on peut pas avoir par exemple un demi pixel au bord d’un objet mais une image est constituée toujours d’un ensemble de pixels indivisibles, même si on a seulement besoin d’un demi ou quart de pixel pour dessiner le bord d’un tracé l’image va recevoir un autre pixel ce qui va un petit peut diminuer la qualité des bords.
Comme en statistiques il y a des variables continues comme la taille, le poids etc. et il y a des variables discontinues par exemple le nombre de célibataires, on peut pas dire qu’on atrois célibataires et demi sur cent (3.5/100) car un homme est indivisible 
Par contre on peut avoir des valeurs fractionnaires dans les deux variables taille et poids. Remarquez bien cette image qui contient la lettre G :
L’anti-aliasing permet de lisser les bords en dégradant (diminuant progressivement l’intensité) les couleurs des pixels formant les contours d’objets (dans notre cas la couleur noire). Pour voir un exemple vivant du filtrage anti-aliasing faites une comparaison entre les formats PNG-8 transparent, GIF transparent et le format PNG-24 transparent, vous allez vous rendre compte que les bords des icônes sont plus fins et plus soignés dans le format PNG-24 transparent que dans les deux autres formats.
Je parie que certains d’entre vous préfèrent apprendre le code XHTML des images, et qu’ils n’arrivent plus à se patienter davantage 
Calmos les gars 
Juste deux autres points à apprendre avant de passer au XHTML : Quel format d’images choisir pour le Web ?
Quel type d’images utiliser pour permettre un fond transparent ?Interrogée par: Louise Coulon | Dernière mise àjour: 26. Oktober 2022
Notation: 4.8 sur 5
(
14 évaluations
)
| Dernière mise à jour: 26. Oktober 2022
Conservation de la transparence d’arrière-plan dans une image au format GIF ou PNG. Les formats GIF et PNG-8 prennent en charge un seul niveau de transparence : les pixels peuvent être complètement transparents ou opaques, mais ils ne peuvent pas être partiellement transparents.
Comment rendre une image avec fond transparent ?
Ajouter une zone transparente à une image
Sélectionnez l’image dans laquelle vous voulez créer des zones transparentes. Cliquez sur Outils image > Recolorier > Couleur transparente. Dans l’image, cliquez sur la couleur que vous voulez rendre transparente.
Comment Appelle-t-on une image avec fond transparent ?
Plusieurs formats de fichiers permettent la transparence, mais le GIF et le PNG restent les plus courants.
Quel est le mieux JPEG ou PNG ?
En raison de leur méthode de compression, les fichiers JPEG contiennent moins de données que les fichiers PNG et sont donc plus légers. Contrairement au format JPEG, le format PNG prend en charge les arrière-plans transparents et s’impose ainsi pour le design graphique.
Quand on utilise le format PNG ?
– le format PNG peut être utilisé partout où la question du poids de fichier ne se pose pas, ou pour des éléments graphiques simples lorsque l’on cherche une qualité optimale, – enfin, le GIF est l’idéal pour les images animées, il est d’ailleurs célèbre pour ça.
Soyez le premier a laisser un commentaire