Création de la troisième page.
Cette page est consacrée à présenter quelques vues de la Haute-Marne.
Démarrez Claris.
Pour créer une page, tout doit y être, quel que soit l'ordre de fabrication. Pour changer, nous commencerons par définir la page, la nommer dans un fichier et nous la remplirons ensuite.
A partir de la page vierge ouverte avec Claris, cliquez sur "Option de Document" bouton (11), définissez le fond avec l'image "Fond-cuir.gif" du dossier "images", le titre du document "la Haute-Marne en images", validez l'ensemble et enregistrez le tout sous "h-m-images" dans le dossier "haute-marne" et non image.
Dans le document vierge, comme titre, nous écrivons "Des images du Pays" centré et avec le format "titre 2", le tout suivi d'un filet horizontal. Ce style est répété sur chaque page afin de donner une "charte graphique" à notre site.
Comme je vous l'ai déjà dit à la leçon 6, pour juxtaposer des images et du texte, il faut utiliser les tableaux.
Insérez un premier tableau, bouton (16), avec l'onglet "Toute" donnez
lui les caractéristiques suivantes:
une ligne (rangée), deux colonnes, sans bord (contours = 0), (les bords
sont plutôt réservés au tableau de textes / chiffres),
60% de largeur. Validez le tableau par la petite "x" en haut à droite.
Dans ce tableau et dans la cellule supérieure gauche, insérez l'image "Charmes" bouton (14)de type JPEG (type de fichier à sélectionner dans le champ inférieur) du dossier "images".
Cliquez l'image et centrez là (bouton (18) de mise en forme de § gauche - centré - droite). Double cliquez l'image. Une fenêtre s'ouvre et là, donnez une étiquette à votre image "le lac de Charmes".
C'est cette étiquette qui s'affichera dans votre navigateur Internet lorsque vous passerez la souris sur l'image, fermez cette fenêtre par la petite croix du cadre. Dans la cellule de droite du tableau, donnez votre commentaire (ex: un des 4 lacs de la région Langroise).
Positionnez-vous sous le tableau et insérez un "paragraphe" (touche entrée) et ensuite insérez un autre tableau d'une rangée sans contour et de 60% de largeur (onglet autres ou toutes). Dans la cellule de droite, insérez l'image "Alot" de type JPEG du dossier "images" et centrez là (18). Donnez-lui l'étiquette "la Pierre Alot" (double clics sur l'image) et mettez votre commentaire dans la cellule de gauche (ex: L'Homme est ici depuis bien longtemps). Sélectionnez le tableau, (un clic sur le bord du tableau) et positionnez-le "à droite" sur la page (bouton 19).
Positionnez-vous sous ce deuxième tableau, tapez un retour chariot et insérez l'image "champ-jorq.jpg" de type JPEG. Centrez là et donnez-lui une étiquette (Champigny). Cette image fait 17 kilo-octets.
Maintenant, votre page devrait ressembler à ceci.
Avec Internet Explorer, ce format d'affichage est obtenu en appuyant sur la touche F11.
Pour présenter aux visiteurs une image de Champigny de meilleure qualité, nous allons créer un lien depuis cette image qui "pointe" sur une deuxième image, la même, mais de qualité supérieure. Elle passe ainsi de 17ko à 306ko. Vous devez procéder ainsi car un site qui présenterait des images si importantes ne serait pas lu. Il faut plusieurs minutes pour charger une image de 300ko sur Internet. Cette précision peut être mise en commentaire sous l'image ou dans l'étiquette.
Cliquez une fois la dernière image "champ-jorq.jpg" , puis sur le bouton (10) "éditeur de lien", cliquez fichier, choisir le type "JPEG" et sélectionnez l'image "champ-jorqu.jpg".
Cliquez "ouvrir" et fermer cette fenêtre de lien (x). Un liseré bleu est apparût autour de la fenêtre. Il signale que cette image est associée à un lien. Si vous désirez retirer ce liseré, il faut double-cliquer l'image et mettre dans le champ "bordure" la valeur "0". Sous la photo nous pouvons mettre le texte suivant en italique et centré : "Si vous désirez une photo de meilleure qualité cliquez sur celle-ci. Attention, il faudra plusieurs minutes pour la charger. Pour revenir ici cliquez sur le bouton précédent de votre navigateur."
En bas de page il nous reste à ajouter en italique le texte "retour au menu" en italique et centré et à lui associer le lien vers le fichier "index.htm" du dossier "haute-marne" (cf. leçon 6).
Enregistrez la page avec le bouton (3) "Enregistrer"
Visualisez cette page avec l'aide de votre Explorateur Windows en double cliquant sur le fichier "h-m-image.htm" du dossier "Mes Documents, internet, haute-marne".
Il nous reste à définir tous les liens du menu créé à la leçon 5.
Dans Claris, ouvrez le fichier "index.htm" du dossier "haute-marne".
Sélectionnez le texte "situation géographique", prenez le bouton (10) "éditeur de lien" et établissez le lien avec le fichier " h-m.htm" puis fermez cette fenêtre par le petit "x".
Sélectionnez le texte "Quelques photos et commentaires" et établissez un lien vers "h-m-images.htm".
Il nous reste à créer un lien vers votre messagerie. Ainsi vos lecteurs pourront vous écrire pour vous féliciter (ceci fait plaisir) ou vous demander des renseignements complémentaires (ce qui fait aussi plaisir, c'est que vous êtes lus). Si vous ne recevez rien, c'est que votre site est à revoir (humour noir).
Pour cela sélectionner la dernière ligne, cliquez sur le bouton (10) "Editeur de liens" et comme le précise l'exemple, écrivez dans le champ de lien "mailto:toto.titi@orange.fr", c'est votre adresse Internet.
NB : un bug de Claris, il ne sait pas écrire @, pour ce faire il faut tenir la touche ALT enfoncée, et non ALT GR, et sur le clavier numérique tapez 64. Pour #, ALT 35 et \, ALT 92.
Note. Si votre micro ne possède pas de clavier numérique, ex: les portables, vous écrivez @, #, ou \ dans le bloc note Windows, Word ou autre logiciel, vous sélectionnez le caractère voulu puis "Ctrl + C" (copier) et dans Claris, à l'endroit choisi, vous faites "Ctrl + V" (coller). Personnellement j'utilise ce système car j'oublie toujours les codes de ces 3 caractères.
Votre adresse publiée peut vous améner des mél indésirables (SPAM). Pour l'éviter, il faut encoder votre adresse. Vous verrez ça plus tard.
Dans les liens, vous pouvez aussi créer des renvois vers:
- d'autres sites sous la forme htt://adresse .
- des points précis dans une page grâce aux ancres placées avec le bouton(12)
- des ancres d'autres pages ou sites.
- des serveurs FTP (files transfert protocol) ou serveurs de fichiers en français.
Il vous reste à enregistrer votre page et à lancer un essai via l'Explorateur Windows avec un double clic sur "index.htm". Si vous n'avez pas fait d'erreur, vous devez pouvoir naviguer dans vos pages comme si vous étiez en ligne. Vérifiez vos étiquettes pour les images sur lesquelles vous les avez servies, vos liens, l'enchaînement des pages.
Une astuce de Claris.
Vous pouvez visualiser vos pages depuis Claris à l'aide du bouton (8) "Navigateur". Le fait de cliquer celui-ci, ouvre une session de votre navigateur et visualise la page en cours. Il y a ouverture d'une nouvelle session à chaque appui. Personnellement, je ne l'utilise pas.
Si aucun logiciel n'est affecté à ce bouton,
choisissez le navigateur de visualisation dans le dossier "Program Files" et sélectionnez ensuite "Iexplore.exe "dans le dossier "Internet Explorer" ou ...
... ou "netscape.exe" dans le dossier "Netscape, Communicator, Program".
