Détourage pour sites web et boutiques en ligne.

De plus en plus, les sites et boutiques en ligne effectuent systématiquement un détourage photo de leurs produits pour maximiser leur impact. Une étude de l’agence GARLAND (E.U. - 2007 – sur 100 sites) montre qu’un site web qui effectue le détourage des images de son catalogue en ligne augmente instantanément ses ventes de 18 %. En effet le détourage garantie un effet de clarté et de professionnalisme qui séduisent et rassurent. Les images détourées ont beaucoup plus d’impact et le produit est plus lisible.

Une image détourée et placée sur un fond uni pèse beaucoup moins lourd que l’image originale. Le détourage sur fond blanc avec marge à 10 %, réduit en général au tiers le poids d’image parce que la partie détourée est efficacement compressée par JPEG, PNG ou GIF.  En effet le fond blanc uni est très bien encodée par JPG notamment et ne pèse pratiquement plus rien en comparaison de la partie dite "utile". Cela présente un intérêt certain pour un catalogue en ligne; Optimiser le poids des images revient à augmenter la rapidité d’affichage d’un site internet.

Pour 95 % des sites, les photos détourées sont placées sur fond blanc (RVB: 255,255,255) au format JPEG ou GIF ou PNG. Vient ensuite le fond noir très utilisé sur les sites de joaillerie et autres produits de luxe. Les autres couleurs de fond sont plus rares.

De plus en plus souvent, les détourages sont placés sur fond transparent au format PNG (PNG 24 ou PNG 12) et deviennent ainsi compatibles avec tous les fonds HTML (backgrounds). Un détourage sur fond transparent offre au webmaster la flexibilité de décider à posteriori le fond sur lequel viendra s’insérer l'image détourée, ou encore d’utiliser des scripts dynamiques (serveur ou client) qui sélectionnent un fond à la volée alors que l’image détourée s’affiche.

Attention : Seuls les navigateurs (browsers) les plus récents acceptent les fonds transparents PNG. Les fonds transparent au format GIF sont plus généralement compatibles avec les navigateur plus anciens.

Les fonds transparents au format GIF sont désormais à éviter parce que l’anti-aliasing n’est pas supporté dans GIF. Un détourage sur fond transparent sans anti-aliasing fera donc apparaitre une pixelisation sur le contour de l’objet. Il faut donc privilégier PNG pour les détourages à placer sur fonds transparents.

Détourage Photo Web sur fond transparent dans Photoshop. Tous Droits réservés.

 A noter : Le format GIF n’est pas un mauvais format de sauvegarde pour le détourage à condition de remplacer le fond par la couleur finale dans Photoshop puis de sauvegarder en GIF. Dans ce cas le fond et l’objet détouré sont parfaitement fondus et sans effet de pixelisation sur les bords car c'est Photoshop qui se charge d'anti-aliaser les bords de l'objet dans le fond. C’est seulement pour la sauvegarde de GIF avec fond transparent que le problème de pixelisation existe, et deviendra évident lorsque le GIF sera incrusté dans la page HTML.

Article : Détourage pour sites web et boutiques en ligne. Tous droits réservés.