Iufm Champagne Ardenne J Bresson Réaliser ses premières pages Web avec Word page

Etablisst Machin

Description

Niveau: Elémentaire, Primaire, CM1
Iufm Champagne Ardenne - J.Bresson - Réaliser ses premières pages Web avec Word page 1/1 Réalisation de quelques pages Web / Les natures mortes au CM1 Principe : Il s'agit de réaliser avec Dreamweaver qautre pages web (donc au format Html, hypertexte Markup Language) et les lier entre elles. Structure de navigation : 1. Mise en page, c'est parti... Création d'un nouveau document « page Web » Fichier Nouveau Onglet « pages Web » Nouvelle page Web Composition du texte de la première page De la photo… Nous écrire Notre petit musée ? Les travaux pratiques ? Quelques sites ? Attention, un logiciel de messagerie doit être installé sur l'ordinateur . En cliquant ici, il est activé, un nouveau message est créé comportant l'adresse du destinataire. Index.htm musee.htm tp.htm sites.htm Pour éviter l'espacement vertical important entre deux paragraphe, procéder par un retour à la ligne + Sélectionnez les différentes parties du texte et appliquez une police Arial ou Comic sans MS, en taille 3 pour les Titres et 2 pour le contenu informatif de la page. Fenêtre des objets, elle offre des boutons permettant d'insérer des images, un tableau etc. Fenêtre des propriétés, elle affiche les propriétés de l'objet sélectionné.

• html sélectionner


• bips banque d'images et de scénarios pédagogiques


• nom de la page de destination pour le lien


• lien hypertexte

Sujets

• CM1
• Machin
• Hyperlien

Informations

• Publié par: profil-uprya-2012
• Nombre de lectures: 71
• Langue: Français

Extrait

Réalisation de quelques pages Web / Les natures mortes au CM1 Principe : Il s'agit de réaliser avec Dreamweaver qautre pages web (donc au format Html, hypertexte Markup Language) et les lier entre elles. sites.htmmusee.htm tp.htm Structure de navigation : Notre petitLes travauxQuelques musée pratiquessites Index.htm   De la photo…   Attention, un logiciel de messagerie doit être installé sur  l'ordinateur . En cliquant ici, il est activé, un nouveau message  est créé comportantl'adresse du destinataire. Nous écrire

1. Miseen page, c'est parti... Création d’un nouveau document « page Web » Fichier Nouveau Onglet « pages Web » Nouvelle page Web Composition du texte de la première page

Sélectionnez les différentes parties du texte et appliquez une police Arial ou Comic sans MS, en taille 3 pour les Titres et 2 pour le contenu informatif de la page.

Iufm Champagne Ardenne

Pour éviter l'espacement vertical important entre deux paragraphe, procéder par un retour à la ligne <Maj> + <Entrée>

[e-mail]

Fenêtre des objets, elle offre des boutons permettant d'insérer des images, un tableau etc.

Fenêtre des propriétés, elle affiche les propriétés de l'ob et sélectionné.

- J.Bresson - Réaliser ses premières pages Web avec Word

page 1/1

Enregistrement de la page Cette page constitue la page d'accueil du site et sera nommée index.htm

Veiller à enregistrer l'ensemble de vos pages dans le même dossier de travail

Respecter la règle des trois pas:

•pas d'accents, •pas d'espaces, •pas de majuscules. Choix d’un arrière plan (couleur, trame ou texture) pour la page Format Arrière-plan En fait, on choisira une image existante dans le dossier de travail "crepi.gif"

Donner un titre et des mots-cles pour cette page Fichier Travaux d'élèves Natures mortes Propriétés (onglet résumé) Le titre apparaît dans la barre de titre du navigateur, on peut mettre des accents, le titre est différent du nom de fichier. Enregistrer de nouveau le document. Mise en place d'un lien hypertexte vers la page travaux pratiques… Cette page existe déjà dans le dossier de travail elle est nommée tp.htm, inutile de l'ouvrir pour mettre en place le lien hypertexte. Se positionner dans la page index.htm et sélectionner le texte qui constituera le support du lien à savoir "quelques exemples",puisactiver la commande « Lien hypertexte » du menu insertionou dela barre d’outils : rechercher avec le bouton parcourir la page de tp.htm destination pour ce lien : ici tp.htm sinon, pour une adresse de page sur un site web, saisir l'adresse de la page La zone de saisie inférieure ne sera pas utilisée, elle permet d'atteindre d'autres endroits d'une même page web.

Iufm Champagne Ardenne

- J.Bresson - Réaliser ses premières pages Web avec Word

page 2/2

Plus généralement, pour les liens entre différentes pages Html Sélectionner le texte ou l’image qui sera support du lien Activerla commande « Lien hypertexte » du menu insertionou dela barre d’outils. Saisir le nom de la page de destination pour le lien ou la rechercher avec le bouton parcourir Le nom peut être : Une adresse de page sur Internet du typewww.truc.fr Une autre page déjà réalisée et stockée sur le disque dur (choisir parcourir) Une adresse électronique (saisir l'adresse précédée demailto: c'est le cas par exemple pour le lien vers l'adresse électronique de l'établissement sur la page index.htm) Mettre en place le lien permettant le retour de la page "tp.htm" (on choisira la flèche comme support de lien) vers la page index.htm (un aperçu de la page tp.htm figure en annexe du présent document). Tester ces liens sous Word. Enregistrer les modifications réalisées sur ces deux pages.

Il est également possible de visualiser les pages sous un navigateur Le bouton dans la barre d’outils « standard » permet de provoquer l’affichage de la page Html générée dans le navigateur par défaut. Réalisation de la page "musee.htm" Remarque : Le positionnement des images dans les pages Html Hormis les cas où l’image est « mise en vedette » (pas de texte à gauche et à droite de l’image), une image ne pourra être positionnée avec précision par rapport à du texte, que si elle est insérée dans une cellule d’un tableau. Utiliser l'outil tableau pour insérer un tableau Puis la commandeInsertion > image > à partir du fichier(parcourir pour recherchée l'image) Notre petit musée La Raie (Chardin 1728)Pommes vertes (Cezanne 1873)

Nature morte (Morandi1926)

Enregistrer la page sous le nom de fichier musee.htm

Iufm Champagne Ardenne

Crâne de chèvre bouteille et bougie (Picasso 1952)

musee.htm

Ecrivez en jaune sur fond noir pour mettre en valeur les images. Pas de bordure pour les tableaux.

Insérer l'image flech_g.gif

- J.Bresson - Réaliser ses premières pages Web avec Word

page 3/3

Mettre en place le lien permettant le retour de la page "musee.htm vers la page "index.htm" (on choisira la flèche comme support de lien) Afficher les propriétés de la page "musee.htm" et lui donner un titre "Notre petit musée" Enregistrer de nouveau la page musee.htm Mettre en place les liens de la page index.htm vers la page musee.htm Enregistrer les modifications réalisées sur cette page index.htm Réalisation de la page "sites.htm" Cette page contiendra des liens vers des sites web. Attention, dès lors que les hyperliens ont été mis en place, il ne faut pas les tester depuis Word car ces pages contiennent du code plus élaboré que Word ne sait pas interpréter, il estdonc nécessaire de lire ces pages depuis un navigateur (Internet Explorer, Netscape etc.) sites.htm Nous avons sélectionné pour vous quelques sites.  http://www.bemberg-educatif.org/index.html Fondation BembergL'art en s'amusant http://www.apte.asso.fr Le site de l'éducation à l'image et aux médias... Bips Banqued'images et de scénarios pédagogiques http:// bips.cndp.fr Annuaire de sites artistiques http://www.mylinea.com/jeandif

Remarque : lorsque l'on souhaite ouvrir un document Word, on peut le faire depuis Word avec "Fichier > Ouvrir" ou encore depuis un dossier ouvert en double-cliquant sur un fichier dont l'extension est .doc Lorsque l'on procède par un double-clic sur un document dont l'extension est ".htm" Windows considère que l'utilisateur demande à consulter la page Web et non qu'il désire la modifier, il demande donc au navigateur Web d'ouvrir le document en question. Si l'on souhaite modifier avec Word un document dont l''extension est .htm, il est donc nécessaire de lancer préalablement Word et de procéderpar la commande "Fichier > Ouvrir" Pour en savoir plus (fonctions avancées), consultez les documents de formation : Création de pages Html avec Word Création de pages Html avec Publisher Documents disponibles Création de pages Html avec Frontpage dans le module de FOAD : Création de pages html avec Dreamweaver Construction de pages web

Iufm Champagne Ardenne

- J.Bresson - Réaliser ses premières pages Web avec Word

page 4/4

Annexe : Aperçu de la page tp.htm

Les travaux pratiques...

Nous avons composé des « vraies » natures mortes Ensuite nous les avons photographiées

Puis nous avons dessiné et peint à partir des photographies

Iufm Champagne Ardenne

- J.Bresson - Réaliser ses premières pages Web avec Word

tp.htm

page 5/5