Créer un Mini site – application

Cas : Club informatique « Espace Net 2001 »

 

Passionné d’informatique vous avez créé un club d’informatique. Votre ambition est main-tenant de faire connaître votre club à un très large public, d’informer vos adhérents, et de pré-senter les activités du club. Vous disposez du mode opératoire sur FrontPage Express ainsi que de la page d’accueil index.htm stocké dans le répertoire commun du serveur.

 

 

 

A l’aide de l’explorateur Windows, réalisez l’arborescence du site sur votre disque dur :

 

Récupérez le fichier index.htm et stockez le dans le dossier siteigc

 

 

 

Afin d’utiliser le même style pour l’ensemble des pages de votre site, vous devez réaliser un modèle de page utilisable pour toutes  les pages de votre site. Vous devez donc :

q       d’abord rechercher les images qui seront affichées à chaque page et les stocker dans le répertoire images.      (fond d’écran, flèches de déplacement, bouton page d’accueil, et toute autre image souhaitée) : Les images et fonds d’écran sont stockés sur le « serveur » (poste 1) dans le dossier secondes\images. Pour chercher les images vous pouvez utiliser le logiciel Image Browser

q       déterminer un style et une taille de police pour les titres et le texte

q       Paramétrer les propriétés de la page Modèle (menu Fichier – Propriété de la page) en particulier vous devez :

         * Donner un titre à la fenêtre,

         * Définir la couleur de police pour le texte et pour les liens (à définir par rapport au choix du fond d’écran)

q       déterminer un style et une taille de police pour les titres et le texte.

Vous pouvez par ailleurs définir un lien vers une adresse de messagerie (la votre ou celle d’un de vos G.F.I.)

Exemple de résultat à obtenir

 

 

 

 

Vous souhaitez mettre en ligne les statuts de l’association. Vous disposez du fichier statuts.htm dans le répertoire  \\commun sur le serveur.

 

Activité :

 

q       Ouvrez le fichier modèle (modele.htm) et sauvegardez le sous le nom stat.htm dans le dossier C:\siteigc\informations\statuts

q       Changez le titre de la page en indiquant « Statuts de l’association »

q       Insérez une ligne vierge après le titre

q       Insérez à partir de cette ligne le fichier statuts.htm disponible sur le serveur (Menu Insertion – Fichiers)

q       Afin de faciliter la lecture des statuts vous allez inclure immédiatement après le titre du document une barre de navigation dont chaque élément pointe sur un article de statut. Vous devez donc ensuite définir devant chaque article des signets et créer un lien hypertexte dans la barre de navigation. Afin de pouvoir accéder au sommaire vous devez de plus prévoir après chaque article, un retour vers le haut de page (un exemple vous est communiqué en page suivante).

 

 

 

 

 

 

 

 

 

q       Définissez le lien hypertexte permettant d’ouvrir la page d’accueil (dans la page statut)

q       Définissez l’ensemble des liens permettant de naviguer à l’intérieur de votre site.

 

 

 

q       Définissez l’adresse de messagerie sur chaque page du site où apparaît le texte « nous écrire »

q       Indiquez votre adresse de messagerie  ou à défaut l’adresse de votre G.F.I..

 

 

 

Votre G.F.I. a stocké sur le serveur les statuts de l’association au format Word, zip et lotus Wordpro.

Vous récupérez ces trois documents pour les stocker dans le dossier

C:\siteigc\download  (le répertoire download est à créer avant)

Dans la page statuts, vous avez pris la sage décision de proposer à vos visiteurs de télécharger les statuts selon les 3 formats précédents.

 

 

 

Vous souhaitez maintenant faire connaître le planning du club informatique. Vous disposez du tableau suivant :

 

Activités :

1)     Créez une nouvelle page sous FrontPage (vous pouvez utiliser le fichier modele.htm) et enregistrez cette page dans le dossier horaires sous le nom planning.htm

2)     Réalisez le tableau ci-dessus dans la nouvelle page (le tableau comporte 5 lignes et 4 colonnes (vous pouvez définir une image d’arrière-plan de motif clair à sauvegarder au préalable dans le dossier image exemple : fond059.jpg)

3)     Dans la dernière ligne les 3 premières cellules sont fusionnées

4)     Mettez tous les éléments de navigation sur la page permettant de revenir à la page d’accueil, sauvegardez. Prévoyez également dans la page d’accueil un lien vers la nouvelle page avec le planning

5)     Facultatif : Insérez une ligne en dessous du titre des colonnes et procédez aux modifications de cellules de manière à obtenir la présentation ci-dessous

 

 

 

 

 

Afin de présenter l’ensemble des activités du club, vous disposez des éléments suivants stockés sur le serveur :

- menuact.htm : menu des  activités
- haut.htm : fichier à inclure dans le cadre du haut

- accueilact.htm : fichier contenant la page d’accueil des activités

- cadre.htm : un fichier contenant le code html nécessaire à la création d’une page de cadre

- stage1.htm : page relative aux stages sur Excel débutant

- stage2.htm : page relative aux stages sur Excel niveau approfondissement

- stage3.htm : «         «          «      «             Flight Simulator débutant

- stage4.htm : “          “          “       “            Flight simulator Expert

 

Activités :

1)     Récupérez les fichiers du serveur et stockez les dans le répertoire stages

2)     Dans une page vierge, créez 3 cadres (utilisez pour cela le code contenu dans le fichier cadre.htm) : le cadre haut doit afficher le fichier haut.htm, le cadre de gauche le fichier menuact.htm et le cadre central doit contenir le fichier accueilact.htm

Sauvegardez la page de cadre sous le nom stage.htm

3)     Définissez tous les liens hypertextes. Attention la page d’accueil du site doit s’afficher dans une page entière.

4)     Revenez à la page d’accueil du site (fichier index.htm et définissez un lien hypertexte qui pointe vers la page de cadre (stage.htm)

 

 

 

 

q       Fermez FrontPage ;

q       Lancez internet Explorer 5.5

q       Dans l’adresse http:// saisissez l’adresse locale de la page d’accueil du site (c:\siteigc\index.htm accessible également depuis le menu Fichier - Ouvrir)

q       Vérifiez maintenant tous les liens. Si certains sont « défectueux », il faut revenir à FrontPage et corriger les erreurs

 

 

 

Vous avez normalement dû ouvrir un espace d’hébergement sur Voila et vous êtes donc prêt à télécharger votre site sur le serveur ftp de voila.fr

q       Démarrez le programme LeechFtp

q       Ouvrez une connexion et saisissez l’adresse du serveur, votre nom d’utilisateur, votre mot de passe et l’adresse de votre site.

q       Dans la fenêtre « locale » sélectionnez le répertoire c:\siteigc

q       Copiez (par glisser-déposer) tous les fichiers et dossiers de la fenêtre « dossier local » vers la fenêtre «dossier  distant ».

q       Déconnectez vous du serveur et quittez Leech

q       Admirez maintenant votre travail en lançant votre navigateur et en mentionnant l’adresse URL de votre site (du style http://site.voila.fr/nomdusite/index.htm )

 

 

-------------------------------------------------------------------