Adopter une attitude citoyenne face aux informations véhiculées par

2
Adopter une attitude citoyenne face aux informations véhiculées par les outils informatiques.
Rappel du texte de référence :
Notions techniques liées aux items de ce domaine :
Lors de manipulations de données utiles aux activités d’apprentissage et à la suite
de débats organisés au sein de la classe, l’élève témoigne de sa capacité à :
2
• vérifier la pertinence et l’exactitude de données qu’il a saisies lui-même,
• prendre l’habitude de s’interroger sur la pertinence et sur la validité des résultats
•
produits par le traitement des données au moyen de logiciels et, plus généralement, témoigner d’une approche critique des données disponibles,
reconnaître et respecter la propriété intellectuelle.
Types d’activités en classe :
•
•
•
•
•
Fiche 2.1
Fiche 2.2a
Fiche 2.2b
Fiche 2.3a
Fiche 2.3b
Fabriquer des pages Web : définition et types de liens
Fabriquer des pages html avec Word (1)
Fabriquer des pages html avec Word (2)
Fabriquer des pages html avec Netscape Composer (1)
Fabriquer des pages html avec Netscape Composer (2)
Commentaires :
1 - Vérifier la pertinence et l’exactitude de données. Cette vérification pourra
prendre différentes formes :
• L’évaluation de l’ordre de grandeur de résultats chiffrés. Le contrôle des
•
Notions vues plus loin : copier/coller (une adresse Internet), utiliser le correcteur
orthographique, savoir chercher une information sur l’Internet.
erreurs de frappe et de l’orthographe en utilisant le correcteur orthographique;
Le respect scrupuleux des signes dans la saisie des adresses de courrier électronique et des sites Internet (sous peine d’erreurs dans leur exploitation
future).
2 - Propriété et validité des informations
• Comparaison des informations trouvées sur différents supports,
• Copier/coller l’adresse du site sous les informations recueillies sur Internet
lors des recherches (reconnaître et respecter la propriété)
3 - Comprendre la forme de l’information en hypertexte :
• Fabriquer des pages liées par hypertexte (pages HTML)
Les médias jouent aujourd’hui un tel rôle et ont pris une telle place dans la société
qu’il semble indispensable d’aider les élèves à s’interroger sur les informations ainsi
recueillies afin qu’ils se construisent une attitude critique.
L’ordinateur, machine multimédia, reste dépendante de l’homme et de ses failles.
C’est pourquoi l’élève doit apprendre à contrôler, dans toutes les étapes de son travail à
l’ordinateur, l’exactitude de ce qu’il saisit au clavier Types d’activités 1.
Sur l’Internet, la seule « signature » d’une information trouvée reste souvent l’adresse (URL). Celle de certains sites est « lisible » et correspond à une norme et une
codification institutionnelle permettant de garantir une certaine fiabilité
(www.education.gouv), il en est, cependant, beaucoup d’autres qui ne fournissent aucune garantie (adresse totalement incompréhensible). Si l’on peut aisément identifier les
auteurs d’un livre, d’une cassette vidéo, d’un cédérom…, en revanche aucune obligation
n’est faite aux concepteurs de pages web de se présenter. Sur l’Internet, tout le monde
peut lire et tout le monde peut écrire dans la quasi-totale liberté Types d’activités 2.
Enfin, permettre aux enfants de fabriquer eux-mêmes des informations en hypertexte
les amènera à mieux comprendre la technologie sous-jacente et d’adopter ainsi une attitude critique sur la forme de cette information Types d’activités 3.
Document d’aide B2I - Réalisation : Claire BARRAULT / Thierry DELAMOTTE - CPD Nles Technologies © Inspection Académique de l’Orne
p 16
Fabriquer des pages Web : définition et types de liens.
2.1
Préambule :
Une page web est une page réalisée en code HTML (ou autre) pouvant être lue par
tous les navigateurs de l’Internet.
Ce n’est pas une page physiquement définie en 21 x 29.7 (mode paysage ou portrait)
mais un fichier. Cette page peut donc être très longue (et nécessiter l’usage de
l’ascenseur vertical (un document de 30 pages peut n’être qu’une seule et même page
web). Enfin, sur une page web, les images ne sont jamais « collées », elles sont liées à
la page et doivent donc être déposées (en .gif, png ou jpg) dans le dossier de la page.
De nombreux éditeurs (logiciels) fabriquent ce code html : Netscape composer, OpenOffice Composer, Page, Mozilla Composer, Dreamweaver…
LES TYPES DE LIENS
1.3 - Lien externe à votre site avec un autre site
Accueil
Internet
Bienvenue
vers école
Jules Ferry
site : www.ecoledupont.fr
site : http://www.ecolejulesferry.fr
“Vers école Jules Ferry” est lié à l’adresse “http://www.ecolejulesferry.fr” (adresse à
inscrire dans la fenêtre lien)
1.1 - Lien interne au site avec une page de votre site
Page 1
Page 2
Le lien “vers page 2” est lié
au document “page2.html”.
vers page 2
vers page 1
Le lien “vers page 1” est lié
au document “page1.html”.
site : http://www.ecoledupont.fr
1.2 - Lien interne à la page avec un paragraphe de votre page ou avec une
image (lien appelé cible dans Netscape)
lien vers a
a -retour vers haut
de page
exemple.html
On utilise cette fonction pour naviguer dans une page très
longue.
Dans ce cas, il faut penser au temps de chargement qui
peut être très long aussi (surtout si ces pages comportent
des images).
1.4. - Lien externe à votre site avec une adresse électronique de messagerie
Inscrire dans la fenêtre Lien l’adresse électronique de messagerie exacte du
correspondant (faire précéder l’adresse de mailto:)
1.5. - Lien interne à votre site avec un document mis en téléchargement
Ce type de lien permet de mettre un document non html (un document de traitement de texte, au format Acrobat, …) en téléchargement. Le visiteur du site se
verra proposer d’enregistrer ce document sur son disque ou de l’ouvrir.
Attention :
Prévenir le visiteur du type de logiciel avec lequel vous avez réalisé le document
(il devra posséder ce logiciel pour ouvrir le document) et aussi du poids du document (s’il est trop lourd, il choisira peut-être de le télécharger plus tard).
Télécharger le BO
(word 2000, 1.2Mo)
BO en acrobat
(posséder Acrobat reader)
“a” est marqué comme cible. “lien vers a” est donc lié à la
cible “a” de la page web “exemple.html”
Site : www.education.gouv
Document d’aide B2I - Réalisation : Claire BARRAULT / Thierry DELAMOTTE - CPD Nles Technologies © Inspection Académique de l’Orne
p 17
Fabriquer des pages html avec OpenOffice.org HTML Editor (1)
2.2a
2.22a1
Préalable : Se créer un dossier « site » pour entreposer vos pages html et les images
(dans le dossier 'Mes Documents'). Lui donner un nom simple (un seul mot, si possible
de 8 lettres maxi sans accentuations ni majuscules).
Pour choisir une couleur de fond pour la
page : Format - Page - onglet 'Arrièreplan'.
Lancer OpenOffice.org Editor HTML (attention, il faut le lancer à partir de
’Démarrer’>’Programmes’>‘OpenOffice.org’>HTML Editor). Composer sa page
comme avec un traitement de texte ordinaire.
Pour choisir une couleur de fond pour la
tableau : Format - Tableau - onglet
'Arrière-plan' : choisir la couleur dans le
nuancier et indiquer à quoi elle va s'appliquer : cellule, ligne ou tableau.
1 - Enregistrer le document : Fichier - Enregistrer ou l'icône
(CTRL-S)
Renseigner ensuite le titre de la page : Fichier Propriétés (onglet Description/ligne Titre). Valider par 'OK'.
Les images dans les pages Web
Les images sont placées à l'extérieur des pages, contrairement à un traitement de texte.
Elles figureront dans la page à leur taille d'origine. Il faut donc veiller à ce
que cette taille soit en rapport avec la page.
Nous conseillons l'utilisation du logiciel XnView pour toutes les opérations sur les
images : renommer, redimensionner, recadrer, mettre du flou, créer une page Web avec
des miniatures, créer une planche contact,...
2 - Insérer un tableau :
Les pages web fonctionnent beaucoup avec des
tableaux (dont les bordures sont visibles ou non).
Cela permet de gérer plusieurs espaces dans la
page. Cela permet surtout de gérer les images
dans une page.
Insertion - Tableau (CTRL-F12): nommer le
tableau, choisir le nombre de colonnes et de
lignes désirées et une bordure.
Choisir soit une couleur standard proposée ou
cliquez sur le bouton autres couleurs et sur l’onglet
personnalisées.
Pour insérer une image dans une cellule.
Cliquer dans cette cellule puis manœuvre précédente.
.
Faire que cette image soit
centrée horizontalement
= procéder comme avec du texte (menu
centrer).
2 - Insérer des images : Insertion / Images.
Une fenêtre apparaît dans laquelle vous devez indiquer
quel est l'image à insérer et dans quel dossier elle se
trouve.
Document d’aide B2I - Réalisation : Claire BAR-
Faire que cette image soit
centrée verticalement dans la cellule
= Format - Cellule - milieu
Afficher /
cacher les
images
p 18
Fabriquer des pages html avec OpenOffice.org HTML Editor (2)
2.2b
2.22a1
S'il s'agit de faire apparaître une
page se trouvant déjà sur l'Internet, il faut retenir l'option suivante et renseigner l'adresse.
Nous avons pour l'instant réalisé notre sommaire.
Créons une nouvelle page. Fichier - Nouveau - Document HTML.
Nous allons dans celle-ci parler des sculptures réalisées par les élèves.
Enregistrons-la sous le nom 'sculptures.htm'. Donnons-lui un titre 'nos sculptures'.
Ajoutons un tableau dans lequel nous placerons les photos des œuvres et les commentaires ou les méthodes...
4 – Réaliser les liens
L'opération qui reste consiste à établir des liens entre les pages : il faut indiquer, dans
le sommaire, le mot ou l'image qui fera apparaître la page des sculptures.
Pour réaliser vos liens, il suffit de :
- sélectionner un mot, ou groupe de mots, une image...
- cliquer dans la barre d’outil sur l’icône de liens
Il peut s'agir d'un fichier
déjà existant (c'est le cas
ici).
Dans ce cas, il suffit de
cliquer sur le bouton pour
indiquer où se trouve le
fichier
Attention, ne pas
oublier de choisir
'Appliquer' avant de
'Fermer' la fenêtre !
Enfin, s'il s'agit de lier à l'envoi
d'un message électronique, il
suffira d'indiquer son adresse
électronique.
Vous n'oublierez pas, pour
conclure, de réaliser un lien de la
5 – Test des pages : naviguez (en local) sur votre site.
Fermez toutes vos sessions OpenOffice.org pour revenir à votre bureau.
Ouvrez votre dossier site.
Double-cliquez sur votre page d’accueil (accueil ou index) qui va s’ouvrir avec votre
navigateur par défaut.
Naviguez sur votre site et assurez-vous que tous vos liens fonctionnent.
Pour réouvrir vos pages et les modifier, ouvrez Word, puis Menu : Fichier/ouvrir,
recherchez votre page à modifier…
Document d’aide B2I - Réalisation : Claire BARRAULT / Thierry DELAMOTTE - CPD Nles Technologies © Inspection Académique de l’Orne
p 19
Fabriquer des pages html avec DreamWeaver V2 (1)
2.3a
2.22a1
Préalable : Se créer un dossier « site » pour entreposer vos pages html et les images
(dans le dossier 'Mes Documents'). Lui donner un nom simple (un seul mot, si possible
de 8 lettres maxi sans accentuations ni majuscules).
Pour choisir une couleur de fond pour la
page : Modifier - Page .
Lancer DreamWeaver. Composer sa page comme avec un traitement de texte ordinaire.
1 - Enregistrer le document : Fichier - Enregistrer ou le raccourci-clavier (CTRL-S)
Renseigner ensuite le titre de la page : Modifier - Propriétés de
la page (CTRL-J).
2 - Insérer un tableau :
Les pages web fonctionnent beaucoup avec des tableaux (dont les bordures sont
visibles ou non). Cela permet de gérer plusieurs espaces dans la page. Cela permet surtout de gérer les images dans une page.
Insertion - Tableau (CTRL-ALT-T) : choisir le nombre de colonnes et de lignes
désirées et une bordure (1= visible).
2 - Insérer des images : Insertion / Images.
Une fenêtre apparaît dans laquelle vous devez indiquer quel est l'image à insérer
et dans quel dossier elle se trouve.
Pour choisir une couleur de fond pour la
tableau :
Sélectionner le tableau : choisir la couleur
dans la fenêtre des propriétés.
Les images dans les pages Web
Les images sont placées à l'extérieur des pages, contrairement à un traitement de texte.
Elles figureront dans la page à leur taille d'origine. Il faut donc veiller à ce
que cette taille soit en rapport avec la page.
Nous conseillons l'utilisation du logiciel XnView pour toutes les opérations sur les
images : renommer, redimensionner, recadrer, mettre du flou, créer une page Web avec
des miniatures, créer une planche contact,...
Faire que cette image soit centrée horizontalement dans la cellule
Pour insérer une image dans une cellule.
Cliquer dans cette cellule puis manœuvre précédente.
Faire que cette image soit
centrée horizontalement
= procéder comme avec du texte (menu centrer) en
se plaçant après l'image.
Faire que cette image soit centrée verticalement dans la cellule
Document d’aide B2I - Réalisation : Claire BARRAULT / Thierry DELAMOTTE - CPD Nles Technologies © Inspection Académique de l’Orne
p 20
Fabriquer des pages html avec DreamWeaver V2 (2).
2.3b
2.22a1
Vous n'oublierez pas, pour
conclure, de
réaliser un lien
de la page des
sculptures vers
le sommaire
'Retour vers le
sommaire'.
Nous avons pour l'instant réalisé notre sommaire.
Créons une nouvelle page. Fichier - Nouveau (CTRL-N)
Nous allons dans celle-ci parler des sculptures réalisées par les élèves.
Enregistrons-la sous le nom 'sculptures.htm'. Donnons-lui un titre 'nos sculptures'.
Ajoutons un tableau dans lequel nous placerons les photos des œuvres et les commentaires ou les méthodes...
4 – Réaliser les liens
L'opération qui reste consiste à établir des liens entre les pages : il faut indiquer, dans
le sommaire, le mot ou l'image qui fera apparaître la page des sculptures.
Pour réaliser vos liens, il suffit de :
- sélectionner un mot, ou groupe de mots, une image...
- cliquer dans la barre d’outil sur l’icône de liens
Il peut s'agir d'un fichier déjà existant (c'est le cas ici).
Dans ce cas, il suffit de cliquer sur le bouton pour indiquer où se trouve le fichier
Modifier - Hyperlien - Créer un lien (CTRL-L) ou bien un clic droit, pour afficher le
menu contextuel et choisir alors 'Créer un lien'.
Pour faire un lien à une page se
trouvant déjà sur l'Internet, il faut
retenir l'option suivante et renseigner
l'adresse.
Pour faire un lien à une page, indiquer dans quel dossier il se trouve,
son nom +
Pour écrire à quelqu'un, taper
mailto: + adresse électronique.
5 – Test des pages : naviguez (en local) sur votre site.
Fermez toutes vos sessions DreamWeaver pour revenir à votre bureau.
Ouvrez votre dossier site.
Double-cliquez sur votre page d’accueil (accueil ou index) qui va s’ouvrir avec votre
navigateur par défaut.
Naviguez sur votre site et assurez-vous que tous vos liens fonctionnent.
Pour réouvrir vos pages et les modifier, ouvrez à nouveau DreamWeaver, puis ouvrez votre page à modifier…
Document d’aide B2I - Réalisation : Claire BARRAULT / Thierry DELAMOTTE - CPD Nles Technologies © Inspection Académique de l’Orne
p 21