INFORMATIQUE CRÉER UN SITE INTERNET GUIDE

Transcription

1

2 OBJECTIF : après ce travail tu dois être capable : Gérer des fichiers, des dossiers sur le disque dur et à travers le réseau Utiliser le logiciel Kompzer pour créer un mini site internet comportant ; des liens hypertextes, des images Ta tâche sera de : 1. Créer un dossier 2. Telecharger des image dans ton dossier personnel 3. Créer 5 pages WEB (internet) CONDITIONS DE TRAVAIL : 60 minutes Méthode de travail : Individuel Lieu : espace Informatique MATERIEL / DOCUMENTS FOURNIS 3 fiches guides MATERIEL / DOCUMENTS PERSONNELS : matériel d écriture habituel As-tu lu les tableaux précédents? Ton matériel est-il prêt? au travail!... ON DEMANDE Réaliser un site internet sur le thème des saisons. Le site sera composé de cinq pages (voir organigramme cidessous), la page principale que vous enregistrerez sous le nom saison comportera quatre liens hypertextes vers les quatre sous pages que vous enregistrerez sous les noms printemps, ete, automne, hiver. Les sous pages comporteront un lien hypertexte vers la page saison ORGANIGRAMME DU SITE SAISON Printemps Eté Automne Hiver Image Lien hypertexte PRINTEMPS ETE AUTOMNE HIVER Printemps Eté Automne Hiver Retour Retour Retour 1. CREER UN DOSSIER ET TELECHARGER LES IMAGES Ouvrir le dossier eleve / 3 eme / 3eme couleur Menu [Fichier, Nouveau, dossier] saisir : tp kompozer nom1 nom2 Télécharger les images à partir du site technocalvisi.free.

3 2. CRÉER UN SITE WEB Lancer le logiciel Kompzer Cliquez sur le menu fichier nouveau document ou sur l icône nouveau document 3. COMPOSER LA PAGE SAISON Saisir le texte comme sur le modèle ci contre Régler les propriétés de la page Menu Format / couleur et fond de page Couleur du texte : Bleu marine Couleur du lien : mauve Fond: Jaune Enregistrer votre page : Menu [Fichier, Enregistrer sous.] Titre de la page : index sélectionner votre dossier Nom du fichier : Saison 4. COMPOSER LA PAGE : PRINTEMPS Menu [ fichier ] [nouveau document] Saisir le titre : PRINTEMPS; sauter 5 lignes Ajouter en bas à droite le texte :: Retour Choisir la couleur de fond de votre choix Sur cette page vous placerez une image du printemps Menu [Insertion] [Image] Sélectionner l images Enregistrer votre page : Menu [Fichier, Enregistrer sous] Dossiers [public] [3eme] [3 X] [votre nom] [site saison] Nom du fichier : printemps 5. COMPOSER LA PAGE : ÉTÉ Menu [ fichier ] [nouveau document] Saisir le titre ; sauter 5 lignes Ajouter en bas à droite le texte : Retour Choisir une image d arrière plan : Menu Format / couleur et fond de pag.. Cliquer sur [parcourir] placer l image été.gif Enregistrer votre page : nom du fichier : ete 6. COMPOSER LA PAGE : AUTOMNE Choisir comme image automne.gif et pour l arrière plan : fond_automne.gif Enregistrer votre page : nom du fichier : automne 7. COMPOSER ET ENREGISTRER LA PAGE : HIVER

4 8. CRÉER DES LIENS HYPERTEXTE ENTRE LA PAGE SAISON ET LES 4 SOUS PAGES. A présent que vos pages sont réalisées et enregistrées, vous devez les relier par des liens hypertextes. Se placer dans la page SAISONS Onglet index Sélectionner le texte qui sera le lien (le mot Printemps) Menu [Insertion] [lien] ou sur l icône La fenêtre suivante apparaît : Cliquer sur l onglet pages ouvertes Sélectionner la page printemps.htm, puis [OK] Le lien hypertexte est créé, le texte printemps apparaît souligné et d une autre couleur Retourner dans la page saison, et créer des liens vers les pages été, automne, hiver 9. CRÉER DES LIENS HYPERTEXTE ENTRE LES 4 SOUS PAGES ET LA PAGE SAISON. Se placer dans la page printemps Onglet printemps Sélectionner le texte qui sera le lien (retour) Menu [Insertion] [lien] Puis Cliquer sur la page saison.htm, puis [OK]. Le lien hypertexte est créé, le texte retour apparaît souligné et d une autre couleur créer le lien de retour des pages été automne, hiver vers la pages saison Enregistrer successivement les 5 pages 10. VISUALISER LE RESULTAT AVEC LE NAVIGATEUR INTERNET EXPLORER Menu [fichier] aperçu dans le Cliquer sur tous les liens hypertextes pour contrôler votre travail Appeler le professeur pour validation n COMPLÉTER LE SITE La structure du site étant créé, vous allez le compléter en ajoutant des images animées, et d autres liens. Retourner dans Kompzeren cliquant sur la fenêtre réduite insérer une image (saison, printempsgif, étégif, automnegif, hiversgif) à gauche du titre sur les 5 pages Enregistrer tout Menu.. Visualiser le résultat dans le navigateur, actualiser la page avec la touche [F5] insérer à droite de la photo l image flèchedroite.gif sur les 4 pages (printemps, été, automne, hivers) Créer des liens hypertextes à partir de ces 4 images permettant de passer à la saison suivante (printemps >été ; été >automne..) Enregistrer successivement les 5 pages Visualiser le résultat dans le navigateur,. (penser à actualiser l affichage pour chaque pages avec la touche [F5] ) Appeler le professeur pour validation n 2

5 1) LES FONCTIONS DE FRONTPAGE EXPRESS : Front Page Express est une sorte de traitement de texte pour le Web World wide Web (internet). Il comporte de nombreux outils bien utiles, même sans connaissances préalables, vous pourrez créer des pages Web de bonne qualité. Vous pouvez saisir votre texte dans une fenêtre, puis lui appliquer des styles avec le pointeur de la souris, grâce à des commandes de menus et des boutons: modifier la tailles et le type de polices, écrire en gras, en italique, choisir une couleur et bien plus. Vous pourrez également ajouter des graphiques et des éléments multimédias. 2) PRÉSENTATION DE L INTERFACE : BARRE DES OUTILS ECRITURES FOND PAGE EN COURS D'ELABORATION Choix de la police de caractères Augmente ou diminue la taille des caractères Change la forme du texte Couleur du texte Alignement du texte Insérer un tableau Insérer une image Insérer un lien hypertexte Page précédente Page suivante Actualiser Arrêter

6 INFO Réaliser un site internet sur le thème des saisons. Le site sera composé de cinq pages (voir organigramme cidessous). La page principale que vous enregistrerez sous le nom saison comportera quatre liens hypertextes vers les quatre sous pages que vous enregistrerez sous les noms printemps, ete, automne, hiver. Les sous pages comporteront un lien hypertexte vers la page saison SAISON Printemps Eté Automne Hiver ORGANIGRAMME DU SITE Auto évaluation du TP PRINTEMPS ETE AUTOMNE HIVER Printemps.gif Eté.gif Autom- Hiver.gif Retour Retour Retour Retour 1. CREER UN DOSSIER COPIER ET Y LES IMAGES SAISONS 2. COMPOSER LA PAGE SAISON 3. COMPOSER LA PAGE : PRINTEMPS 4. COMPOSER LA PAGE : ÉTÉ 5. COMPOSER LA PAGE : AUTOMNE 6. COMPOSER ET ENREGISTRER LA PAGE : HIVER 7. CRÉER DES LIENS HYPERTEXTE ENTRE LA PAGE SAISON ET LES 4 SOUS PAGES. 8. CRÉER DES LIENS HYPERTEXTE ENTRE LES 4 SOUS PAGES ET LA PAGE SAISON 9. COMPLÉTER LE SITE /4 0 INFO INFORMATIQUE Réaliser un site internet sur le thème des saisons. Le site sera composé de cinq pages (voir organigramme cidessous). La page principale que vous enregistrerez sous le nom saison comportera quatre liens hypertextes vers les quatre sous pages que vous enregistrerez sous les noms printemps, ete, automne, hiver. Les sous pages comporteront un lien hypertexte vers la page saison SAISON Printemps Eté Automne Hiver ORGANIGRAMME DU SITE Auto évaluation du TP PRINTEMPS ETE AUTOMNE HIVER Prin- Eté.gif Autom- Hiver.gif Retour Retour Retour Retour 1. CREER UN DOSSIER COPIER ET Y LES IMAGES SAISONS 2. COMPOSER LA PAGE SAISON 3. COMPOSER LA PAGE : PRINTEMPS 4. COMPOSER LA PAGE : ÉTÉ 5. COMPOSER LA PAGE : AUTOMNE 6. COMPOSER ET ENREGISTRER LA PAGE : HIVER 7. CRÉER DES LIENS HYPERTEXTE ENTRE LA PAGE SAISON ET LES 4 SOUS PAGES. 8. CRÉER DES LIENS HYPERTEXTE ENTRE LES 4 SOUS PAGES ET LA PAGE SAISON 9. COMPLÉTER LE SITE /4 0