|
A " picture show " ou " galerie d' image» présente des photographies dans un portefeuille comme page web. Alors que des galeries d'images peuvent avoir de nombreuses configurations , un format populaire affiche des images miniatures sur le côté , en haut ou en bas de la page. Lorsque l'utilisateur clique sur chaque vignette , une version de la photo dans sa taille originale correspondante s'affiche dans le centre de la page . Dreamweaver CS3 prend en charge plusieurs méthodes pour créer des galeries d'images . Une des méthodes les plus faciles et plus courante consiste à utiliser un « cadres ». Un jeu de cadres est un conteneur Web HTML composé de deux ou plusieurs " cadres ". Chaque image affiche une page ou URL. Les choses dont vous aurez besoin Adobe Dreamweaver CS3
ou tard
Adobe Photoshop , Apple iPhoto , Windows Paint ou un éditeur d'images autres
Show More Instructions
Préparer vos Photos de < br > 1 redimensionner les photos dans votre logiciel de retouche d'image . Vous aurez besoin de deux versions de chaque image --- une version pleine grandeur (par exemple, 400 par 300 pixels, ou tout ce qui fonctionne le mieux pour la forme et la taille de vos photos) et une version miniature (par exemple, 100 par 75 pixels ) .
2 Définir la résolution pour chaque image à points " 72" ( ou pixels) par pouce ( ou "96" pour les écrans haute définition ) .
3 Enregistrer chaque image dans un sous-répertoire du répertoire dans lequel vous envisagez de créer votre site de la galerie d'images. Nommez les " images ". Sous- répertoire Enregistrez les images au format JPEG . Nommez-les " photo1 ", " photo2 ", et ainsi de suite , le nom des vignettes correspondantes " thumb1 », « thumb2 », etc
Le Création de votre Galerie d'images dans Dreamweaver
4 Ouvrez Dreamweaver , puis cliquez sur «Fichier» dans la barre de menu. Choisissez "Nouveau" pour afficher la boîte de dialogue Nouveau document .
5 Cliquez sur " la page de l'échantillon " dans la colonne de gauche de la boîte de dialogue , puis cliquez sur " Frameset " dans la colonne " Folder Sample" . Cela affiche une liste des jeux de cadres de l'échantillon dans la troisième colonne de la boîte de dialogue. Choisissez " gauche fixe . "
6 Cliquez sur "Créer". Dreamweaver affiche le "Tag accessibilité du cadre Attributs " boîte de dialogue . Cliquez sur « OK ». Les cadres sont nommés en fonction de leur emplacement sur la page. Le cadre de gauche est nommé " leftFrame », et le châssis principal est nommé " mainframe. "
7 Cliquez sur «Fichier» dans la barre de menu et choisissez " Enregistrer tout . " Dreamweaver vous invite à nommer trois fichiers , l'un après l'autre : " . Galerie " Tout d'abord, le jeu de cadres lui-même --- nommer Deuxièmement, le cadre principal --- nom il " photo1 . " Troisièmement, le cadre de gauche --- nommez-le « miniatures ».
8 Insertion " photo1.jpg " dans le cadre principal (à droite) , puis cliquez sur «Fichier» dans la barre de menu et choisissez " Enregistrer l'image ».
9 Créer un nouveau fichier HTML dans le cadre principal pour chaque photo et enregistrez-le comme ceci: Supprimer " photo1.jpg " dans le cadre principal. Insérer " photo2.jpg " dans le cadre principal . Cliquez sur «Fichier » dans la barre de menu et sélectionnez " Enregistrer l'image sous ". Nommez le fichier " photo2 " et enregistrez-le . Répétez cette procédure pour chacune de vos photos , en nommant chaque fichier HTML avec le nom de la photo correspondante .
10 Insérez vos images miniatures dans le cadre de gauche . Placez les images verticalement dans le cadre de l'ordre que vous avez nommé les --- " photo1 " première , deuxième " photo2 " , etc
11 Sélectionnez la première vignette. Allez dans le panneau Propriétés et tapez le nom du fichier et le chemin pour la première page entière photo HTML dans le champ " Link" , comme ceci: . " Images/photo1.html " ( sans les guillemets)
12 Cliquez sur le "Target" déroulant dans le panneau Propriétés et choisissez " mainframe. " Cela indique au navigateur de l' utilisateur pour charger photo1.html dans le cadre principal quand elle clique sur la vignette.
13 Répétez les deux étapes précédentes pour chacune de vos vignettes et des ensembles d'images en pleine taille .
14 Cliquez sur «Fichier» dans la barre de menu et choisissez " enregistrer l'image " pour enregistrer " thumbnails.html . "
15 Open " gallery.html " dans un navigateur pour tester votre galerie d'images .
|
