Appuyez sur “Entrée” pour passer au contenu

Image png zone transparente

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 :la transparence 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 : opacité - transparence - photoshopContrairement 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 transparence Pour en tirer profit, faites déplacer l’un des formats suivants sur le contenu de la page.

JPEGtransparenceGIF non transparenttransparenceGIF transparenttransparencePNG-8 non transparenttransparencePNG-8 transparenttransparencePNG-24 non transparenttransparencePNG-24 transparenttransparence

 

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 transparency en remplissant les pixels transparents par un bleu clair (azur) transparency qui a la valeur hexadécimale #d3e6ea ou si vous voulez la valeur RGB(211,230,234).
READ  Arctan(a+b)

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 transparence Par contre on peut avoir des valeurs fractionnaires dans les deux variables taille et poids. Remarquez bien cette image qui contient la lettre G :
anti-aliasing - anticrénelage

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 ?

31 juillet 2019 • Outils

4/5

1

2

3

4

5

Partager

En tant qu’e-commerçant, que ce soit pour mettre en valeur vos produits, proposer des visuels professionnels s’intégrant complètement au design de votre site et des réseaux sociaux, ou encore faciliter le chargement du contenu par les utilisateurs, il est préférable de privilégier le fond transparent pour vos photos produits (image au format PNG).

Supprimer l’arrière-plan d’une photo; cela peut paraître simple dit comme ça…

En réalité, c’est une tâche qui peut vite se compliquer et prendre beaucoup (trop) de temps. Surtout si l’on n’utilise pas les bons outils et si l’on est seul à s’en charger.

Et pourtant, il existe de nombreux logiciels de retouche photo permettant d’optimiser vos images produits quand vous les diffusez sur le Web.

Celui qui vient en premier à l’esprit est Photoshop, le logiciel de retouche par excellence !

Difficile d’accès pour les débutants, il demeure cependant le plus performant et le plus complet dans son domaine.

Pas pour vous ? La bonne nouvelle c’est qu’il existe d’autres solutions pour enlever le fond d’une image et le rendre transparent, plus simples, plus intuitives et surtout, moins coûteuses.

Dans cet article, retrouvez une sélection des logiciels disponibles sur le marché, en espérant que vous y dénicherez votre bonheur !

Remove Background : Détourer gratuitement votre image en 5 secondes

Pour tous les “pas doués en informatique”, les “je n’ai pas le temps de le faire” et les “j’aimerais que ça se fasse automatiquement”, Remove Background est le logiciel fait pour vous.

Ce logiciel en ligne, gratuit et sans inscription, est un outil de détourage qui vous permet de rendre l’arrière-plan transparent et ne garder que l’essentiel de votre image.

Leur promesse : supprimer le fond de l’image, 100% automatiquement, en 5 secondes, sans un seul clic – gratuitement.

Alors il ne reste plus qu’à se lancer !

Première et dernière étape

Je me connecte au site www.remove.bg et je charge une image via mon ordinateur ou via une URL. Et c’est presque déjà terminé !

Je dois avouer que le résultat est plutôt bluffant, d’autant que cela ne prend, effectivement, pas plus de 5 secondes !

Pour finir, vous n’avez plus qu’à télécharger votre image au format PNG en cliquant sur le bouton « Download ».

READ  Conjuguer le verbe être en anglais

Zoom sur le bouton Edit

Si vous souhaitez affiner votre image, enlever davantage de pixels, en rajouter… vous pouvez le faire via le bouton “Edit”. Et encore une fois, c’est très très facile d’utilisation.

Avec l’espace “Foreground”, vous pouvez peaufiner la transparence du premier plan de votre image. Vous pouvez choisir l’option “Restaurer” ou “Supprimer” tout en ajustant la taille et donc la précision de l’outil.

Avec l’espace “Background”, vous pouvez modifier l’arrière-plan en un clic : couleur, image de fond… En bref, travaillez votre image pour qu’elle corresponde à ce que vous voulez !

Je le répète, cet outil est vraiment bluffant.

Et il répond parfaitement à ses promesses.

Et dans le genre bluffant, vous me croyez si je vous dis que vous avez, dans votre ordinateur, un logiciel intégré pour détourer les contours de toutes vos images ?

Aperçu et Paint.net, des logiciels intégrés à votre ordinateur

Le logiciel Aperçu pour Mac

Aperçu est, dans la plupart des cas, l’application par défaut pour ouvrir une image ou un PDF sur Mac. Il vous suffit, pour cela, de double-cliquer sur l’icône correspondante.

Une fois l’image affichée :

1. Cliquez sur le bouton “Afficher la barre d’outils d’annotation”

2. Puis cliquez sur l’icône qui ressemble à une baguette magique autrement appelé le “Bouton Alpha instantané”

3. Cliquez et faites glisser le curseur sur une partie de l’arrière-plan (allez-y doucement pour ne pas empiéter sur l’image à conserver). Le logiciel sélectionne la zone sur laquelle vous avez fait glisser la flèche ainsi que tout pixel voisin de même couleur (la zone en question devient rouge)

4. Pour supprimer la zone sélectionnée (délimitée par des pointillés), cliquez sur “Édition” puis “Supprimer”. Si au contraire, vous désirez effacer tout ce qui entoure la zone, et donc garder la zone sélectionnée, cliquez sur “Édition” puis “Inverser la sélection”

5. Répétez ces actions jusqu’à ce que le résultat soit satisfaisant

6. Finalisez en enregistrant sous le format gérant la transparence, à savoir, le format PNG.

Aperçu est un outil pratique, simple et gratuit. Cependant, en matière de précision du détourage et des options de retouche, ce logiciel arrive vite à ces limites et vous ne pourrez pas effectuer d’importantes modifications à vos photos.

NB : Si Aperçu n’est pas votre application par défaut, il vous suffit de faire un clic droit sur votre icône puis “Ouvrir avec” et de sélectionner Aperçu dans le menu proposé.

Paint.net pour les PC

Paint.net est une application conçue pour Windows, disponible en téléchargement gratuit, et offrant de nombreuses possibilités pour vos retouches.

Petit bonus : pour aller plus loin, Paint.net propose gratuitement certaines fonctionnalités de logiciels normalement payants.

Et bien entendu la possibilité de mettre vos images sous fond transparent est incluse !

Sur le même principe qu’Aperçu, la première étape consistera à sélectionner la zone que vous voulez supprimer.

1. Pour commencer cliquez sur “Fichier” puis sur “Ouvrir”, et choisissez la photo à modifier.

2. Ensuite, il faudra choisir l’outil baguette magique (même icône que sur Aperçu) et cliquer sur la zone que vous souhaitez supprimer.

3. Attention ! Si une partie de votre photo est prise dans la zone à effacer (ce qui sera le cas si votre fond n’est pas uni), vous devrez ajuster la tolérance (barre de réglage située en haut de votre écran). Plus la barre de tolérance est haute, plus il y aura d’éléments sélectionnés, et inversement. Donc, à vous de régler la tolérance pour ne garder que le fond à enlever.

4. Une fois que tout est bon pour vous, aller dans le menu “Édition” puis “Supprimer la sélection”.

5. Pour ajuster le détourage, une fois la plus grande partie du fond supprimée, zoomez sur les contours et supprimez tous les pixels en trop en utilisant les outils “Gomme” ou “Baguette magique”, comme indiqué précédemment.

6. Enfin, pour enregistrer votre image en fond transparent, terminez ce processus en allant dans le menu “Fichier” puis “Enregistrer sous” et choisissez le “Format PNG”. Le format JPEG vous mettra, par défaut, un fond blanc.

GIMP, le plus proche de Photoshop

C’est peut-être le logiciel le plus puissant après Photoshop.

Disponible en téléchargement gratuit sur Mac ou PC, l’outil GIMP vous offre de nombreuses options de retouche et notamment la possibilité de mettre votre image sur fond transparent.

Toutefois, cet outil s’adresse à un public plutôt initié et demande un peu plus de manipulations.

Les grandes étapes pour gérer la transparence de vos photos :

READ  Devinette animaux qui suis-je

1. Commencez par importer votre image en allant dans “Fichier” > “Ouvrir”.

2. À partir du menu du haut, cliquez sur “Calque” > “Transparence” > “Ajouter un canal alpha”. Le canal alpha est ce qui vous permettra d’obtenir un fond transparent après suppression du fond actuel. Pas d’inquiétude, c’est tout à fait normal de ne pas voir apparaître ce calque après sa sélection.

3. Utilisez l’outil “Baguette magique” (autrement appelé “outil de sélection contiguë”) pour sélectionner la zone à rendre transparente.

4. Une fois choisie, supprimez-la. Répétez l’opération en zoomant pour observer les détails et améliorer les contours.

Si le résultat vous convient, vous pouvez passer à la dernière étape !

5. Si le résultat ne vous convient pas, vous pouvez utiliser l’outil “Gomme” pour corriger les contours ou, toujours via la “Baguette magique”, ajustez le seuil (dans les options situées dans le menu à gauche) pour qu’un maximum de pixels soit intégré et que l’image corresponde au rendu final recherché.

6. Pour finir, pensez à enregistrer votre image en format PNG.

Le célèbre Adobe Photoshop

C’est LE logiciel n°1. Choisi par tous les professionnels de l’image, il permet de créer et d’embellir photos, images, illustrations 3D…

On peut le dire sans trop de risque, c’est la meilleure application d’imagerie et de retouche photo au monde !

Outre la maîtrise que l’outil exige, Adobe Photoshop est un logiciel payant avec une formule d’abonnement d’entrée de gamme à 11,99 €/mois (TTC).

Vous êtes l’heureux détenteur de cet outil ? Vous pourrez détourer vos images avec un outil professionnel en débutant par une technique de base assez simple d’application.

Choisir son image

Toujours le même procédé.

Allez dans “Fichier”, puis “Ouvrir” et sélectionnez votre image sur votre ordinateur.

Isoler l’objet à détourer

Une fois que la photo est dans la zone de travail (au centre), il faut choisir l’outil “Sélection rapide”.

Cliquez ensuite sur l’élément à détourer tout en maintenant le bouton gauche de la souris enfoncé.

Déplacez le curseur pour agrandir la zone jusqu’à ce qu’elle englobe l’ensemble de l’image à détourer. À ce stade, les contours sont encore trop approximatifs pour réaliser un travail de qualité.

Préciser le détourage

Pour un rendu plus net et plus professionnel, utilisez “Zoom” (dans la barre à gauche de l’écran). Cliquez sur la partie de l’image devant être agrandie. Répétez cette action autant de fois que nécessaire afin d’obtenir la taille souhaitée. Zoomez ou dézoomez à votre convenance pour détourer votre image de manière optimale.

Utilisez, de nouveau, l’outil “Sélection rapide” en maintenant la touche « Alt » enfoncée et cliquez sur les zones ne faisant pas partie de l’objet à conserver. De la même manière que pour isoler l’image, maintenez le bouton gauche de la souris enfoncé pour élargir la zone à supprimer.

Supprimer l’arrière plan

Le résultat vous convient ? Il ne vous reste plus qu’à supprimer le fond de votre photo. Pour ce faire, faites un clic droit sur l’objet et choisissez “Calque par copier”.

Un nouveau calque apparaît dans votre menu, à droite de votre écran (au même endroit que tous vos calques).

Faites un nouveau clic droit sur le calque “Arrière-plan” et “Supprimer le calque”.

Une fois ces actions terminées, il ne vous reste plus qu’une étape… enregistrez votre image en format PNG !

Au-delà des options et du professionnalisme de ces outils, ce qui est important, c’est que vous puissiez réussir à faire ce que vous souhaitez avec vos images. Il est donc indispensable de choisir un outil adapté à vos besoins présents et futurs ainsi qu’à vos propres moyens.

Vous ne cherchez qu’un outil basique, vous permettant de ne faire que le minimum, à savoir, mettre vos images sur fond transparent ? Et vous savez pertinemment que vous n’aurez pas besoin de plus… Optez pour un logiciel gratuit, accessible avec peu de fonctions. Maîtriser le détourage des images est une étape clé pour le succès de votre communication, et c’est pour cela que le logiciel doit vous faciliter la tâche et non l’inverse.

Si vous souhaitez aller plus loin, travailler votre image, sa lumière, sa texture… Lancez-vous et préférez un outil qui pourra évoluer avec vous, un outil plus complet tel que GIMP ou même Photoshop.

Dans tous les cas, ce qui est certain, c’est qu’une image bien traitée, avec un fond transparent est un gage de qualité et de sérieux auprès des utilisateurs et de vos clients. Vous aurez tout le temps, par la suite, d’améliorer votre technique et passer aux étapes supérieures du traitement d’image.

Soyez le premier a laisser un commentaire

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *