INITIATION : Site INTERNET et FrontPage  2000                      (Ph. DEVIERS)

OBJ : Savoir construire des pages web, avec un logiciel spécialisé (FrontPage , v. 2000)

(création de pages WEB avec des liens hypertextes et organisation d’un petit site internet)

Créer une structure simple de site Web :

Lancer FrontPage / Fichier / Nouveau / Site Web

Clic-gauche sur  Site Web personnel et créer le site.

Nommer ce site : EXOWEB : Outils / Paramètres ... / onglet Général / Nom du site Web  Taper Exoweb .

Visualiser l’arborescence du site : Affichage et clic-gauche sur Navigation.

Retrouver, sur le document joint, la structure (arborescence du site) qui est affichée (pages en grisé).

Ajouter deux pages à l’album Photo :

Clic-gauche  pour se placer sur la page Album (elle passe en bleu). Puis  Fichier / Nouveau / Page. Recommencer Fichier / Nouveau / Page.

Observer l’affichage des 2 nouvelles pages et la nouvelle arborescence.

Renommer les nouvelles pages : clic-droit sur la première page, et clic-gauche sur Renommer. Taper le nom « ville » et Entrée. Recommencer pour la deuxième page, taper le nom « soleil » et Entrée.

Transférer deux images par Couper / Coller :

Double clic sur la page Album Photo pour travailler dans la page. Clic-gauche sur la photo du coucher de soleil pour la sélectionner (8 poignées apparaissent) puis Edition / Couper. Ensuite,  Affichage et clic-gauche sur Navigation, puis double clic-gauche dans la page « soleil » et transférer la photo avec  Edition / Coller. Retourner dans la page Album, Affichage et clic-gauche sur Navigation , et, de la même manière, couper la photo de la ville et la copier dans la page « ville ».

Créer un lien vers chacune des nouvelles pages, avec un hypermot :

Retourner dans la page Album, sélectionner « Un coucher de soleil ». (placer le curseur devant  « Un », clic-gauche et, sans relâcher le bouton, se déplacer jusqu’à la fin du mot « soleil », puis relâcher le bouton). L’affichage change : Un coucher de soleil Dans la barre de menus en haut, cliquer sur Insertion / Lien Hypertexte pour obtenir la boîte de dialogue. Dans la liste des pages, double clic-gauche sur la page soleil.htm. Observer le changement de couleur et le soulignement qui marquent la présence d’un HYPERMOT (interactif). En gardant l’appui sur la touche Ctrl, déplacez le curseur sur l’expression « Un coucher de soleil » et observer le changement du curseur : la petite main indique un lien activable. En gardant Ctrl appuyé, déplacez le curseur : sur l’expression interactive la main apparaît. Si vous cliquez (Ctrl appuyé en même temps), vous passez aussitôt dans la page voulue (soleil). Clic-gauche sur Navigation puis retourner dans la page Album et recommencer la même opération avec l’expression « Une grande ville », pour la relier à la page « ville ».

Faire un lien de navigation pour retourner à la page précédente :

Affichage /  Navigation puis double clic-gauche sur la page « ville ». Avec Entrée, placer le curseur sous la photo et taper « page précédente ». Sélectionner cette expression et Insertion / Lien Hypertexte. Double Clic-gauche sur photo.htm  pour se brancher sur la page Album Photo. Vérifier le fonctionnement (appuyer sur Ctrl et clic sur le lien). Ajouter aussi un lien « page précédente » dans la page « ville », pour pouvoir remonter à la page Album. Vérifiez la navigation entre ces trois pages, en passant de l’une à l’autre (appuyer sur Ctrl et clic-gauche).

 Importer une image dans une page :

 Affichage /  Navigation puis retourner dans la page Centres d’intérêt (double clic-gauche).

Sélectionner tous les textes et les effacer (touche supprimer : Suppr ).

Cliquer sur Insertion / Image / A partir du fichier ... Dans la boîte de dialogue, cliquer en bas à droite sur l’icône de l’Explorateur pour aller chercher (sur le cdrom ou sur la disquette A :) le fichier Vesuve. Double clic-gauche sur le nom du fichier pour le charger dans la page. Avec les ascenseurs, observer l’image importée et identifier la position du cratère volcanique.

Créer une page pour lier un commentaire à une image :

Affichage /  Navigation et simple clic-gauche pour se placer sur la page Centres d’intérêt. Clic-gauche sur Fichier / Nouveau / Page. Se positionner sur cette nouvelle page, clic-droit et la renommer « volcan ». Entrée

Entrer dans cette page : double clic-gauche sur la page.

Dans la barre d’outils du haut, cliquer sur Tableau / Insérer. Sélectionner un tableau de 2 lignes sur 2 colonnes : Placer le curseur sous le tableau et ajouter à cette page un lien hypertexte pour revenir (« page précédente ») vers la page Centres d’intérêt.

Créer une zone réactive dans une image, pour faire un lien avec un commentaire :

Revenir dans la page Centres d’intérêt pour afficher la photo du Vésuve. Cliquer sur  Affichage / Barres d’outils. Si Barre d’outils Image est déjà coché, ne rien changer, sinon cocher Barre d’outils Image pour faire apparaître en bas de la page, les outils de traitement des images. Cliquer dans la photo: les poignées de contrôle apparaissent et la barre d’outils est activée. Cliquer dans l’outil  « rectangle ». Le curseur devient un crayon avec lequel il faut encadrer la zone du cratère.

Clic-gauche en haut et à gauche de la zone choisie, garder le bouton enfoncé et relâcher le bouton dans le coin en bas et à droite. La boîte de dialogue affiche la liste des pages : brancher la zone réactive vers la page « volcan », avec un double clic-gauche sur cette page. Vérifier le fonctionnement du lien (pour passer dans la page Volcan).

Inscrire du texte dans un tableau et importer du texte :

Dans la page « Volcan », positionner le curseur dans la case en haut et à gauche du tableau et taper, « au kilomètre », quelques phrases pour décrire le cratère, par exemple. Observer les passages à la ligne automatiques. Sélectionner tout le texte. Changer la police de caractères (essayez Comic Sans MS), augmenter ou diminuer la taille, le mettre en italique, souligner certains mots et enfin, sélectionner tout le texte et le déplacer dans la case en bas et à droite.

Si on veut rendre invisible le cadre du tableau : clic-droit dans le tableau, cliquer Propriétés du tableau et mettre la taille de bordure à zéro puis OK. Si on veut un fond coloré pour une cellule : positionner le curseur dans la cellule voulue et clic-droit puis cliquer  Propriétés de la cellule, faire défiler les couleurs d’arrière-plan, choisir puis OK.

Positionner de nouveau le curseur dans la case en haut et à gauche puis clic sur Insertion / Fichier. Aller chercher un fichier texte (.doc, .rtf, .txt, ...), sur la disquette, sur le disque dur, sur le cd-rom, ... et cliquer sur le fichier pour le transférer dans la page et dans la cellule choisie. Modifier la largeur des colonnes du tableau (curseur sur la bordure médiane) pour mieux mettre en page.

10- Insérer des liens vers des adresses de site ou de messagerie internet :

Affichage /  Navigation et double clic-gauche pour se placer dans la page « Sites Web »

Positionner le curseur en-dessous des textes de la page et taper  sur deux lignes :

« Serveur académique » et  « Ecrivez-moi ».

Sélectionner Serveur académique et Insertion / Lien Hypertexte.

Taper en face de URL et au bout de http:// , sans espace ni accents,  www.ac-orleans-tours.fr puis OK. Vérifier que le lien fonctionne (Ne tenez pas compte du message d’erreur : il faudrait passer dans Aperçu ou bien quitter FrontPage pour se connecter réellement).

Sélectionner Ecrivez-moi et cliquer sur Lien Hypertexte.  Cliquer sur le symbole de la messagerie (une petite enveloppe et tapez l’adresse de courrier électronique du destinataire du message (ex :  pdeviers@aol.com). La commande mailto déclenchera l’ouverture de la messagerie dans le navigateur (en passant dans Aperçu ou après avoir quitté FrontPage). Quitter la boîte de dialogue avec OK.

IMPORTANT : Revenir dans l’Explorater FrontPage et parcourir toutes les pages pour les afficher, les vérifier et les enregistrer.

Quitter FrontPage et lancer un navigateur  Explorer ou Netscape.

Travailler hors connexion. Visualiser le site créé  et vérifier l’affichage et le fonctionnement des liens.

On peut conserver ce site sur une disquette (Fichier, Publier le site, Parcourir, dérouler le menu pour choisir a : puis Ouvrir, puis Publier). On pourra ainsi le transporter, l’installer pour le retravailler, sur un autre ordinateur (équipé de FrontPage), le visualiser hors connexion (off line), avec un navigateur, Explorer ou Netscape.

On pourra ensuite faire évoluer ce site très sommaire, l’enrichir avec de nouvelles pages, modifier l’arborescence pour développer les liens hypertextes et l’interactivité (formulaires, ...), améliorer la présentation avec des couleurs, ajouter de l’animation (Gif animés) et des sons.

Il faudra ensuite le mettre en ligne chez un fournisseur d’accès (hébergement gratuit) et le faire connaître (référencement) pour qu’il soit consulté.