1-6 : Insérez des images ici.

Format d'image : voici les 4 principaux :

JPG, JPEG :

Photos, ce format réduit le poids de photos, ce format s'affiche plus vite qu'en png.

PNG :

Image,graphique illustration, logos, dessin,avec la possibilité de garder une transparance; nb : peu de couleur, moins de 256 : PNG 8 bits ou GIF, beaucoup de couleur PNG 24 bits.

GIF :

Illustration animé.

SVG :

Icones, logo, dessin, ce format vectoriel permet de redimensionner sans perte de qualité, pas d'effet de pixélisation comme les autres. Plus d'infos, voir ici

Site Unsplash :

Images...libre de droit, gratuit ici.

Insérer une image :

Ecriture :

‹img src="nom_du_fichier ou lien" alt="texte qui décrit l'image"/›. L'attribut "src="", est la source de l'image. L'attribut alt="" est la description alternative. Elle est importante pour l'accessibilité aux non voyants, si l'image ne veut pas se chargé et pour le référencement des moteurs de recherches.

Exemple avec un fichier : ‹img src="../images_oc/logo_Nmini1.jpg" alt="Logo Nadège Bonins"› :

Info bulle :

Texte qui apprarait quand on survole l'image : pour cela rajouté "title="texte", comme ceci : ‹img src="nom_du_fichier" alt="texte qui décrit l'image" title="texte"/›:

Exemple : ‹img src="../images_oc/logo_Nmini1.jpg" alt="Logo Nadège Bonin" title="Logo OC"› : .

Rendre l'image clicable :

S'assuer d'avoir deux fichier, une version miniature et originale, utiliser la balise ‹a ›‹/a›, comme ceci : ‹a href="fichier_miniature"› ‹img src="fichier_original" alt="texte qui décrit l'image"/› ‹/a›.

Exemple : ‹a href="../Images_OC/logo_N1.jpg"›‹img src="../Images_OC/logo_Nmini1.jpg" alt="Logo Nadège Bonin" title="Cliquer pour agrandir"›‹/a› :

Nb : oc24 est l'image en grand, oc21 est l'image en miniature.