Please enable JavaScript!
Bitte aktiviere JavaScript!
S'il vous plaît activer JavaScript!
Por favor,activa el JavaScript!
antiblock.org

Insérer les images dans une page de site avec Dreamweaver

 

Ce tutoriel illustre l'insertion d'images dans Dreamweaver CS5.

Nous allons maintenant ajouter une image à une page. Il y a plusieurs façons de le faire, nous allons donc commencer par celui qui semble être le plus populaire et flexible. La page que je vais utiliser est une page d'exemple Lorem Ipsum.... J'ouvre la page et place le curseur là où je veux que l'image apparaisse.

Exemple de page

Nous allons commencer par utiliser l'option Image dans le menu Insertion.

Menu insérer image

Au clic, une fenêtre de sélection de l'image apparaît. Notez que si vous avez nommer un dossier pour les imges du site, ce dossier vva s'ouvrir et si vous avez votre image hors du dossier racine du site, Dreamweaver vous demandera de l'importer dans ce dossier pour vous.

Sélection d'image à insérer dans la page

Sélectionnez Système de fichiers. Naviguez jusqu'au dossier qui contient l'image et sélectionnez l'image. Notez le panneau de prévisualisation sur la droite qui nous permet de vérifier que nous avons la bonne image. Notez également que lorsque vous naviguez et si on doit revenir à la racine du site à tout moment il y a un bouton avec flèche arrière en haut de la boîte de dialogue pour le faire.

Dans cette fenêtre, choisissez l'image que vous voulez insérer dans la page à l'endroit où vous avez choisi auparavant. Ensuite, en cliquant sur OK, une nouvelle fenêtre va surgir pour vous demander de renseigner une description pour l'image.

Vous pouvez aussi avoir avant ça une boîte de dialogue si l'image ne se trouve pas dans le dossier racine du site.

La description Texte secondaire permet de saisir des informations associées à l'image qui peuvent être utiles aux visiteurs et qui peuvent aider à indexer et localiser des images. J'entre dans un court terme dans la zone de texte alternatif. (Il sera utilisé par certains outils d'accessibilité pour identifier la nature d'une image pour les utilisateurs malvoyants) et aussi pour les moteurs de recherche pour indexer l'image. La description longue specifie l'emplacement et le nom d'un document texte qui peut contenir des informations supplémentaires sur l'image, comme où et quand elle a été prise.J'ai décidé de laisser la longue description vide pour le moment, mais pas le texte secondaire.

Renseigner description de l'image

Voilà! l'image est insérée dans le texte:

Exemple image insérée

On peut voir dans le panneau des propriétés des détails sur l'image insérée, son poids qui peut être optimisé pour qu'il soit moins conséquent, ses dimensions (longueur et hauteur), sa source.

Vous pouvez lui ajouter une bordure ou l'aligner à droite, à gauche ou par défaut.

 

 

Voir aussi comment optimiser les images pour le web

 

   

 

 

Chaîne YouTube

 

Extras Dreamweaver

Autres fonctions Dreamweaver

Référencement de site