| |
 Format GIF ou JPEG
Les deux formats d'images les plus présents sur le web sont le format JPEG et le format GIF.
Le format JPEG donne souvent un meilleur résultat que le GIF pour les dégradés et photos, mais les deux sont à tester quand on enregistre l'image pour le web dans l'éditeur de retouche (tel que paint).
Le format GIF, composé de 256 couleurs, est souvent plus approprié que le JPEG pour la réalisation de logos, images sans trop de couleurs et peut permettre ainsi un chargement rapide de la page web.
On l'utilise également pour créer des images animés (GIF animés), des bannières publicitaires.
Vous pouvez observez ci-dessous les différences entre les deux formats sur une image contenant des dégradés à un poids quasi identique :
 
| Image JPEG | poid : 4.70 ko |
Image GIF | poid : 4.97 ko |
Pour cette image comportant de nombreuses couleurs on préferera donc le format JPEG qui donnera un meilleur résultat à un poid inférieur.
Egalement, plus la taille des images sera grande et plus le temps de chargement de la page web sera long c'est pourquoi il faudra garder un ratio qualité/poid raisonnable.
note : une page html ne devrait pas avoir un poids (total) de plus de 70ko env pour charger correctement à bas débit (modem 56k) pensons à tout le monde :)
Comment inclure une image :
C'est la balise <img> qui sert à afficher une image dans la page web example : <img src="photo.jpg">
ici on affichera l'image "photo", l'option src indique le chemin où est stockée l'image.
Attributs de la balise <img> :
alt : permet d'afficher un texte quand le pointeur se trouve sur l'image ou à la place de l'image si celle ci n'est pas affichée.
ex : <img src="photo.jpg" alt="ma photo">
width & height : définissent les dimensions de l'image(la largeur et la hauteur), utiles pour un affichage plus rapide.
ex : <img src="photo.jpg" width="50" height="30">
border : définit l'épaisseur de la bordure de l'image.
ex : <img src="photo.jpg" border="0">
ici la bordure est supprimée.
background : définit l'image d'arrière plan d'une page web, d'un tableau ou d'une cellule.
ex : <body background="fond.jpg">
"fond.jpg" correspond à l'image de la page web
Faire un lien sur une image :
<a href="http://www.monsite.com/description.htm><img src="photo.jpg" alt="ma photo"></a>
Héberger vos images
Images
libres de droits
Sxc |
Vous trouverez sur ces sites des banques
d'images diverses et libres de droits. |
| Casimages |
Trouver des images et fonds
|
|
