Le site Web scolaire
Les archives de DISCAS
Le site Web scolaire

Présentation

Le présent guide pédagogique vise à outiller des enseignants du primaire qui désireraient se lancer, avec leur groupe d'élèves, dans l'élaboration d'un site Web scolaire, qu'il soit " de classe " (entendre un site Web appartenant en propre à un groupe d'élèves sous la responsabilité du même enseignant) ou " d'école " (qu'il s'agisse d'une section bien identifiée réservée à ce groupe d'élèves au sein d'un site plus vaste ou de contributions indifférenciées au site de l'école).

Compte tenu de la diversité des modalités de réalisation possibles d'un tel projet, ce guide ne prétend pas fournir une série de scénarios d'activités "clés en mains" comme le ferait un manuel scolaire. Il vise plutôt à clarifier une problématique de base, à présenter une liste de décisions qui devront être prises par l'enseignant et son groupe dans la réalisation du projet, à proposer des pistes d'activités et à présenter des ressources disponibles sur Internet en relation avec l'élaboration d'un site Web scolaire.

Ce projet est conçu à l'intention plus particulière des classes du deuxième cycle du primaire (3e et 4e années). Lorsqu'il sera pertinent de le faire, des suggestions d'enrichissement et d'approfondissement seront faites à l'intention des classes du 3e cycle (5e et 6e années).

L'élaboration d'un site Web scolaire est essentiellement un projet de communication et, à ce titre, concerne d'office le programme de français. Par contre, compte tenu du choix possible de certaines thématiques et du travail de recherche qui pourra être demandé aux élèves en cours de réalisation, le projet pourra intégrer des apprentissages provenant aussi de certains autres programmes disciplinaires.


Sommaire du projet

L'élaboration d'un site Web scolaire est un projet de communication riche en apprentissages potentiels et une source de motivation importante pour les élèves.

Ils y trouvent en effet :

Du point de vue de l'enseignant, ce projet permet une grande souplesse dans la prise en compte du temps consacré, de l'ambition du produit final, de l'orientation du contenu et, de façon plus pratique, des ressources matérielles et techniques disponibles ainsi que du degré de familiarité de l'enseignant avec les technologies.

En effet, des paramètres tels que le nombre de pages-écrans, la fréquence de mise à jour, sa structure thématique et l'ambition de son toilettage graphique et technologique relèvent entièrement de l'enseignant et de son groupe et permettent de moduler facilement le temps et l'énergie requis par la réalisation d'un tel projet. Contrairement à des publications "matérielles", un site Web, une fois mis en place, n'entraîne aucune limitation matérielle ou financière : on peut avoir tout l'espace que l'on veut sans que cela ne coûte un sou de plus! De plus, la facilité de modification des documents électroniques donne au produit un caractère dynamique, constamment en évolution. Finalement, une souplesse accrue provient de l'instantanéité de la diffusion : la contrainte des dates de tombée, par exemple, est absente d'un tel projet.

Par contre, le caractère entièrement électronique de la publication, si elle présente des avantages certains en ce qui concerne la production, entraîne des contraintes particulières au médium lui-même : une bonne maîtrise des outils technologiques de la part de l'enseignant; une gestion rigoureuse des fichiers électroniques composant le site Web; un contrôle strict de l'accès au serveur, particulièrement pour des raisons de sécurité.


Les préalables pour l'enseignant

Une première contrainte découle du caractère public du produit final : ce qui sera finalement mise en ligne, toute la planète pourra le voir, et ce sera associé au nom de l'école. Il est donc essentiel que l'enseignant s'assure que son projet a bien l'appui de sa direction d'école. D'ailleurs, l'école a peut-être déjà son site officiel et il faudra voir si le site des élèves doit s'y intégrer ou s'y harmoniser ou si, au contraire, il peut avoir une existence complètement indépendante. De même, si le site est mis en ligne sur le serveur de l'école ou de la commission scolaire, il faut s'assurer de la collaboration du responsable du serveur ou du technicien concerné.

Ensuite, compte tenu des contraintes technologiques liées à ce type de production, l'enseignant devra avoir une bonne longueur d'avance sur ses élèves!

Cela commence par une bonne expérience de la navigation sur Internet. L'enseignant devra connaître, comme usager d'abord, les possibilités et les limites de ce médium et il devra avoir visité un bon nombre de sites, tant professionnels que scolaires, pour se familiariser avec la logique particulière d'un site Web : page d'accueil, outils de navigation, sommaires, carte du site, intégration des graphiques ou des animations, usage des hyperliens, etc. Dans la section Ressources du présent guide, nous vous proposons quelques sites exemplaires, ainsi que des liens vers des conseils utiles.

Il devra ensuite pouvoir disposer, pour lui et pour son groupe, d'un accès Internet. Indépendamment de la nécessité de mettre en ligne le site (il en sera question plus bas), cet accès sera indispensable pour que les élèves puissent visiter et analyser différents sites et se familiariser avec la " grammaire " visuelle d'un site Web. De plus, la plupart des ressources visuelles du site (icônes, boutons, barres séparatrices, enjolivures graphiques, animations, graphiques) proviendront de sites de ressources logeant sur le Web. Notre section Ressources vous en indique quelques-uns.

Il lui faut ensuite pouvoir disposer d'un éditeur HTML et le maîtriser véritablement. Le langage HTML est en effet le langage de base utilisé sur Internet pour concevoir et afficher des pages Web. Même si les spécialistes ne jurent que par la programmation directement en code HTML (auquel cas un simple traitement de texte suffit pour écrire le code), cela nous semble d'une technicité inutile pour un profane (et carrément hors de la portée des élèves du primaire). Il existe des éditeurs HTML graphiques qui ne demandent pas plus de connaissances technologiques qu'un simple éditeur graphique ou qu'un traitement de texte perfectionné, et qui donnent d'excellents résultats. Ils sont beaucoup plus agréables à utiliser et permettent d'avoir toujours sous les yeux le résultat final. Ils sont, comme on dit en jargon, WYSIWYG (" What You See Is What You Get "). Des logiciels tels que Front Page, PageMill ou Claris Home Page entrent dans cette catégorie.

Il faut enfin disposer de l'accès à un serveur (qui rendra le site Web accessible à l'ensemble de la planète en le logeant à une adresse Web précise). En général, ce n'est pas un gros problème : ce sera généralement le serveur de l'école ou de la commission scolaire. Sinon, plusieurs entreprises offrent d'héberger gratuitement les pages Web de particuliers (et, à cet égard, une classe d'élèves est assimilable à des particuliers pour ce type d'entreprises, puisqu'il n'y a pas d'activités commerciales sur un site Web scolaire). Vous trouverez l'adresse de quelques-unes de ces entreprises dans la section Ressources, au cas où votre commission scolaire ou cotre école ne pourrait pas héberger le site Web de vos élèves.
Finalement, il vous faudra pouvoir accéder de façon logicielle au serveur pour y charger votre site ou le modifier. Ces téléchargements s'effectueront habituellement selon le protocole ftp et des logiciels habituellement gratuits tels que Fetch, Anarchie ou Transmit sont très faciles d'utilisation. Le technicien responsable du serveur qui hébergera votre site pourra vous fournir tous les renseignements nécessaires sur cette opération très simple.

Ainsi équipé, tant sur le plan des compétences que sur le plan technique, tout enseignant devrait pouvoir facilement accompagner son groupe d'élèves dans l'élaboration d'un site Web scolaire. Nous attirons votre attention sur une ressource de DISCAS accessible à toutes les écoles abonnées à notre site La boîte à outils (et donc, d'office, à toutes les écoles de la commission scolaire de la Capitale) : la série de didacticiels Recherché sur Internet, destinée directement aux élèves. Ces didacticiels en ligne sont autant d'activités d'apprentissage structurées permettant, entre autres, de se familiariser avec les concepts essentiels de la navigation sur Internet : page d'accueil, structure arborescente d'un site, composantes essentielles, types de sites, etc. Non seulement s'agira-t-il d'un outil précieux pour initier les élèves mais l'enseignant lui-même y trouvera souvent une clarification formelle des concepts de navigation Web qu'il ne maîtrise parfois qu'intuitivement.

Il est possible, bien sûr, de pousser beaucoup plus loin la sophistication technologique. L'enseignant qui dispose d'un intérêt marqué pour les technologies ainsi qu'une bonne expérience de programmation pourra envisager de produire, avec ses élèves, un véritable site multimédia de qualité quasi-professionnelle, avec intégration de sons ou de séquences vidéo dans les pages, par exemple. De même, la connaissance de langages de programmation comme Javascript (relativement simple à maîtriser) ou Java (nettement plus spécialisé) permettra de donner au site des fonctionnalités supplémentaires, particulièrement au chapitre de l'interactivité.

Toutefois, sans décourager l'enseignant qui serait prêt à s'engager à ce niveau de sophistication ou qui en aurait déjà la compétence, nous ne le recommandons pas au primaire. Cette compétence est difficilement transférable à des élèves aussi jeunes, avec le résultat que c'est l'enseignant qui devra prendre seul en charge l'essentiel de la conception technique du site : ce n'est pas, selon nous, ce que doit viser un projet d'élèves.

Un dernier mot sur la portée et les limites du présent guide. Tout comme les autres guides de la collection, il vise à fournir à l'enseignant une vue d'ensemble (et essentiellement pédagogique) de la réalisation d'un tel projet avec ses élèves, ainsi qu'à lui proposer les principales d'une démarche générale de réalisation.

Il ne faut pas en attendre une initiation technique à Internet ou à l'usage de tel ou tel logiciel, pas plus que des réponses à des questions techniques ponctuelles (du type " Comment faire apparaître, dans une page Web, un espace où les usagers peuvent écrire? ", par exemple). Une maîtrise suffisante de l'éditeur HTML devrait répondre à la plupart de ces questions; de plus, Internet fourmille de telles ressources techniques (nous vous en indiquerons quelques-unes) et il est inutile de faire double emploi avec ce guide.

Par contre, les considérations technologiques (qui ont, nous en convenons, toute leur importance dans un projet de cette nature) ne doivent jamais faire perdre de vue qu'il s'agit d'un projet pédagogique destiné à susciter des apprentissages et à développer des compétences chez l'élève. Le produit final, aussi sophistiqué soit-il, ne demeure qu'un prétexte à apprendre et ne doit donc pas constituer une fin en soi. Nous espérons que ce guide permettra à l'enseignant à ne jamais perdre de vue cette préoccupation essentielle.


Qu'est-ce qu'un site Web scolaire?

Il ne suffit pas qu’une page Web provenant de votre classe soit accessible sur Internet pour que l’on puisse parler d’un authentique site Web scolaire. Un site Web ne se définit pas seulement par son médium, (Internet), mais aussi par son contenu et surtout par son organisation. Aux fins du présent projet, nous vous proposons les caractéristiques suivantes :

1 UN ENSEMBLE DE FICHIERS ORGANISÉS

2. AISÉMENT NAVIGABLE

3. COHÉRENT

4. DESTINÉ À UN PUBLIC

5. RÉGULIÈREMENT MIS À JOUR


Les grandes décisions

1. L’INTENTION DE COMMUNICATION

Pourquoi faire un site Web scolaire? Pas seulement pour être à la mode et s’afficher comme tout le monde sur Internet, n’est-ce pas?

Excluons d’abord les sites officiels d’écoles, qui ont généralement comme but de faire connaître l’école, son projet éducatif et ses services et dont la responsabilité relève habituellement de la direction ou d’un représentant dûment mandaté par elle. Ces sites peuvent aussi comporter des contributions d’élèves mais ils n’entrent pas dans le cadre de projets de communication qu’un enseignant peut piloter seul avec son groupe d’élèves.

Les autres sites scolaires ont, essentiellement, deux grandes intentions :

  • faire connaître le groupe ou les élèves qui le composent : chaque élève aura alors sa fiche personnelle et le site comportera une partie collective destinée à publiciser les caractéristiques du groupe, ses activités et ses réalisations;
  • faire partager des intérêts : c’est le but de sections thématiques du site, qu’il s’agisse de travaux de recherche, de productions littéraires ou de " topos " sur l’actualité des jeumes.

Les deux intentions peuvent d’ailleurs être combinées et, au fur et à mesure de la croissance du site, s’actualiser sous forme de projets ponctuels.


2. LA DYNAMIQUE DU SITE

Quelle est la durée de vie de ce site? S’agit-il d’un projet unique (on monte ensemble un site Web et, une fois mis en ligne, on passe à autre chose)? Envisage-t-on de lui donner une périodicité fixe, un peu comme un journal scolaire (une édition nouvelle à chaque étape de l’année scolaire, par exemple)? Veut-on le considérer comme un moyen de diffusion ou d’exposition commode et souple, sans contrainte particulière de mise à jour, et où on met en ligne du nouveau matériel quand on en a produit dans le cadre de tel ou tel autre projet scolaire?

Qu’arrivera-t-il du site à la fin de l’année scolaire? Fermera-t-il ses portes et sera-t-il tout simplement retiré du serveur? Va-t-on archiver en ligne les réalisations de l’année et faire place à celles de la cohorte suivante? Ou va-t-il acquérir une forme de vie en soi, évoluant à mesure que des cohortes successives d’élèves l’enrichiront ou l’actualiseront?

Toutes ces formules sont intéressantes et présentent chacune leurs avantages et leurs inconvénients. Mais le choix de la dynamique du site est capital, car il conditionne sa structure, l’organisation du travail, la fréquence de ses mises à jour, les critères de sélection du contenu et la quantité de temps et de travail que le groupe va y consacrer dans une année.


3. L’ARCHITECTURE DU SITE

Au-delà des pages techniques (page d’accueil, sommaire ou table des matières, page de crédits, dossier d’images), quelles vont être les principales sections du site?

Première décision : chaque élève aura-t-il sa page à lui (généralement une fiche de présentation personnelle)? Aura-t-il sa propre section personnelle (qui pourrait devenir un genre de portfolio de ses réalisations)? Si oui, il faut donc créer un dossier " Élèves " (ou plus exactement " Eleves ", vous savez maintenant pourquoi). Encore mieux serait " Eleves2000-2001 ", ce qui permettra de différencier les cohortes d’élèves d’année en année. Si chaque élève a sa page et est limité à une page pour sa contribution personnelle, il suffira de créer, par exemple 25 fichiers HTML au nom de chacun (par exemple " StephanieB.html " et de les loger dans ce dossier. Si chaque élève se voit attribuer une section personnelle, il faudra plutôt créer 25 dossiers au nom de chacun. Dans chaque dossier logeront les fichiers HTML personnels de l’élève. Dans ce dernier cas, il est essentiel que chaque dossier personnel ait sa propre page d’entrée et que ces fichiers soient tous nommés (selon les exigences du serveur, " index.html " ou " default.htm "). Ainsi, le gestionnaire du site (l’enseignant, dans presque tous les cas) pourra aisément contrôler les liens entre la table des matières générale et les dossiers de chaque élève.

Seconde décision (peu importe que l’on ait répondu oui ou non à la première question) : quelles seront les grandes sections du site, qui vont contenir les réalisations non personnelles des élèves (qu’il s’agisse de réalisations collectives ou individuelles ne les rend pas personnelles pour autant; on appelle " personnelles " les seules réalisations décrites au paragraphe précédent, c’est-à-dire celles que l’élève gère lui-même, sans devoir tenir compte d’une thématique d’ensemble).

Il faut aller plus loin qu’un gros dossier fourre-tout intitulé " projets " ou " réalisations ". Si le site est résolument scolaire, on peut répartir le contenu à venir dans des dossiers qui correspondront aux différents domaine du savoir (sciences humaines, sciences, arts, etc.); on peut même envisager d’utiliser la classification Dewey que les élèves connaissent déjà par leur bibliothèque scolaire. Si l’on a déjà identifié quelques thématiques générales qui donneront sûrement lieu à des productions d’élèves, on peut, par exemple, créer des dossiers tels que " PaysDuMonde ", " Animaux " , " Poésie " , " Jeux " , "Acteurs " et ainsi de suite.

L’important est de limiter le nombre de sections à ce qui est affichable dans une page d’accueil ou un bandeau de navigation, c’est-à-dire une dizaine de sections au maximum. Chaque section pourra ensuite être subdivisée. Essayez de donner des titres parlants à vos sections : le visiteur sera peu attiré par une section nommée " Octobre 1999 ", même si elle contient des travaux merveilleux!

Pensez également à l’évolution future du site. Une section ou une sous-section peut, au départ, ne contenir qu’un seul fichier ou même être vide (" en construction ", selon le vocable courant). Vous l’enrichirez le temps venu; mais l’architecture du site demeurera stable.


4. LE RÔLE DE L’ENSEIGNANT

Avant même de décider de la répartition des tâches et des responsabilités entre les élèves, l’enseignant doit d’abord établir celles qu’il se réserve à lui-même et le faire savoir dès le départ au groupe. Une de celles-ci nous semble incontournable : la mise en ligne du site et de ses mises à jour. En effet, la visibilité théoriquement universelle d’un site Web lui donne un caractère public et seul l’enseignant peut en prendre la responsabilité. Il faut donc qu’il soit clair que tous les fichiers mis en ligne devront avoir été lus et approuvés personnellement par l’enseignant et que lui seul a accès au serveur pour leur mise en ligne.

Selon l’âge des élèves, leur habileté technologique et le temps que l’on peut consacrer au projet, on visera à leur laisser le plus possible aux élèves la responsabilité de la rédaction, de la conception et du formatage des fichiers du site; en effet, un éditeur HTML à interface graphique n’est pas plus difficile à utiliser qu’un traitement de texte ou un éditeur graphique.

Par contre, à notre avis, l’enseignant devrait assumer lui-même la liaison des divers fichiers du site, et donc établir les liens permettant de naviguer entre ces fichiers. Les pages strictement techniques, comme les bandeaux de navigation, la table des matières ou la carte de site, devraient relever de sa seule responsabilité. Il lui appartiendra de même de vérifier la cohérence et la validité de tous les liens du site : des logiciels permettent de détecter aisément tous les liens défectueux. S’il choisit d’associer des élèves à cette tâche, il devra les superviser de façon très étroite.


5. L’ORGANISATION DES TÂCHES

La réalisation d’un tel projet exige un équilibre entre des phases de travail collectif (choix des sujets, brainstorming de contenu, décisions collectives sur le titre, la page d’accueil, etc.) et des phases de travail personnel ou en équipes.

Nous suggérons de prévoir une section du site où chaque élève aura sa page (ou sa section) personnelle. Contrairement à d’autres médias plus "matériels" comme le journal ou l’exposition, il n’existe pas de contrainte d’espace sur le Web. On s’assure ainsi que chacun a l’occasion de réaliser personnellement tous les apprentissages nécessaires à la création d’une page Web. On pourra alors plus facilement, pour les autres sections du site, penser à créer des équipes de travail différentes et permettre une spécialisation des tâches, comme dans une équipe de production d’un journal ou dans la réalisation d’un spectacle.

Pour ces sections, on peut envisager deux approches et même les combiner :

  • l’approche intégralement coopérative : elle repose sur une répartition et une coordination précise des tâches entre les différentes équipes. Qui rédige les textes? Qui prend en charge la révision des textes? Qui s’occupe des images ou des sons? Qui effectue la mise en page HTML? Etc.etc. Cette approche a l’inconvénient de cantonner chaque équipe d’élèves à certains apprentissages liés à leur rôle dans l’équipe de production. Mais comme chaque élève a déjà la responsabilité complète de sa page personnelle, cet inconvénient a moins d’impact. Si l’on prévoit en outre des mises à jour périodiques du site, une rotation des tâches (à chaque étape de l’année scolaire, par exemple) est à recommander pour la même raison.
  • l’approche coopérative-compétitive : il peut être plus dynamique et plus responsabilisant, pour certaines contributions tout au moins, de faire des concours ou de mettre des équipes en compétition, par le biais de "soumissions ", par exemple : chacun propose un titre pour le site et le groupe choisit le meilleur; ou encore, deux élèves différents (ou deux équipes différentes) préparent chacun un projet de bandeau de navigation et le groupe choisit celui qui sera retenu. Cette approche a l’avantage de forcer une évaluation plus critique des produits par les pairs et de permettre ainsi des exigences de qualité accrues.

Quelques conseils de base sur le produit final

Note : ces conseils ne seront significatifs que pour l’enseignant déjà familiarisé avec la structure et l’environnement d’un site Web.


1. LA SOBRIÉTÉ

Une fois que l’on a maîtrisé les possibilités offertes par les éditeurs HTML, la tentation est forte de vouloir " en mettre plein la vue " et, pour imiter les sites commerciaux à la mode, de se lancer dans une débauche audiovisuelle, en intégrant des animations, des graphiques à profusion et des séquences sonores ou musicales. Il faut résister à cette tentation.

Pour des raisons communicationnelles, d’abord. L’usager ordinaire (que les concepteurs super-équipés avec du matériel de pointe ont tendance à oublier) n’a pas nécessairement la vitesse, la mémoire et les modules supplémentaires requis pour faire afficher rapidement les pages lourdement graphiques, pas davantage que le grand écran nécessaire à la visualisation de pages en haute résolution. Le site a beau être rutilant, si l’affichage de la page d’accueil prend trois minutes à charger tous les éléments, l’usager ordinaire sera déjà rendu ailleurs et ne verra rien de votre produit. Testez votre site avec un lien modem , un écran 640 x 480 et une allocation mémoire standard à votre fureteur. Vous aurez alors une idée très précise de ce qui est convivial ou pas pour votre visiteur (qui est, ne l’oubliez pas, votre destinataire, la raison d’être de votre site). Vous découvrirez sans doute, vous aussi, que " la modération a bien meilleur goût "!

Pour des raisons pédagogiques ensuite. Ce projet, ne l’oublions pas, est d’abord un prétexte à des apprentissages scolaires et ceux-ci risquent d’être oblitérés si l’élève consacre l’essentiel de son énergie à maîtriser des gadgets de programmation.


2. LA COHÉRENCE

Pensez encore à votre visiteur. Même si votre site contient de nombreuses sections et sous-sections (si chaque élève a sa page, par exemple), n’imposez pas à votre visiteur de devoir décoder chaque fois quelle procédure utiliser pour, par exemple, revenir à la page d’accueil ou accéder au sommaire du site.

L’interface générale de navigation doit être conçue globalement au départ. Les hyperliens ou les boutons permettant d’accéder à la page d’accueil, au sommaire du site et aux principales sections devront être regroupés dans un bandeau de navigation (ou dans un cadre — voir plus bas) facilement identifiable sur la page d’accueil. De même, des éléments de navigation (au minimum le bouton de retour à la page d’accueil) devront être présents sur chaque page du site, se présenter de la même façon et être localisés au même endroit sur l’écran.

Il faut aussi viser une cohérence esthétique : les couleurs ou les images de fond, les barres séparatrices, les couleurs des titres et les autres éléments graphiques devront, sans nécessairement être uniformes, présenter un " air de famille ". De même, la présence des hyperliens devra être signalée de la même façon (généralement par un choix de couleur spécifique et réservée) dans toutes les pages du site). Il importera donc de préciser au départ ce qui sera imposé d’office à toutes les pages à titre de normes de publication, ce qui devra être choisi parmi une liste prédéfinie et ce qui est laissé à la créativité de l’élève ou des équipes d’élèves.


3. LA LISIBILITÉ

Pensez toujours à votre visiteur. Si vous employez une image de fond, assurez-vous que tous les caractères du texte ressortent clairement. Règle générale, contrastez fortement les caractères et le fond (des caractères foncés sur fond pâle constituent habituellement le choix logique.

Évitez de définir vos propre polices de caractères dans l’éditeur HTML et tenez-vous en aux polices génériques; ainsi, si l’usager ne dispose pas de telle police précise dans son système, l’affichage se fera néanmoins sans problèmes. Si, pour un élément précis (un titre ou un logo, par exemple) vous tenez à une police particulière, il est préférable de gérer cet élément globalement comme une image (de type GIF ou JPG); vous serez ainsi assuré du même affichage sur n’importe quel ordinateur et avec n’importe quel fureteur. Soyez cependant conscient que si des clics en différents endroits de l’image doivent conduire à des endroits différents, il vous faudra définir des zones cliquables sur cette image (des " imagemaps ", en jargon); c’est simple, mais il faut savoir le faire.

Finalement, privilégiez des pages-écrans courtes, qui s’affichent rapidement et qui ne forcent pas l’usager à utiliser les barres de défilement. Un long texte a avantage à être fractionné en plusieurs écrans (avec un bouton SUITE au bas de chacun) plutôt qu’à être chargé entièrement dans une seule page interminable. La gestion des liens est un peu plus complexe, mais la facilité accrue pour l’usager en vaut la peine.


4. LA GESTION DES FICHIERS

Chaque fichier (c’est-à-dire chaque page et chaque image) doit être nommé. Si c’est une page, le suffixe du fichier doit être .html ou .htm. Si c’est une image, le suffixe doit obligatoirement être .gif ou .jpg. Le nom du fichier lui-même (qui précède le suffixe) ne doit pas contenir d’espaces ou de caractères accentués : un fichier que l’on souhaiterait nommer " école branchée " devra se nommer, par exemple, " ecolebranchee.html ". Sur certains serveurs (tous les serveurs UNIX, notamment), majuscules et minuscules ne sont pas indifférentes : un lien portant sur MonPortrait.html, par exemple, sera invalide si le fichier de destination se nomme en réalité monportrait.html. Pour parer à toute éventualité, choisissez une convention et imposez-la (par exemple : tout en minuscules; ou encore, la première lettre de chaque mot en majuscules et le reste en minuscules).

Donnez des noms " parlants " à vos fichiers; cela facilitera grandement la gestion de votre site. Un fichier nommé texte22.html ne vous dira pas grand-chose quelques semaines plus tard; s’il se nomme VisiteZoo.html, vous aurez une idée beaucoup plus précise de son contenu.

Organisez logiquement vos fichiers dans des sous-répertoires (ou dossiers), eux aussi nommés logiquement. Pensez que la place d’un fichier dans un sous-répertoire donné conditionne l’adresse URL du lien qui y conduit. Une fois que vous avez créé des hyperliens vers un fichier donné, sachez que renommer le fichier ou le déplacer vers un autre répertoire vient automatiquement de rendre invalides tous les liens qui y conduisaient et qu’il faut donc corriger à la main chacun d’eux. Une tâche qui peut devenir fastidieuse et colossale, et qui plaide en faveur de la stabilité!

Placez dans le même répertoire (dossier) toutes les images (.gif ou .jpg) communes (icônes, logos, barres séparatrices, flèches, boutons, etc.) et demandez à vos élèves de s’y référer lorsqu’ils les intègrent dans leurs pages. Vous vous assurez ainsi d’une cohérence de l’interface, vous vous donnez les moyens de modifier facilement d’un seul coup tel ou tel élément de l’interface et vous économisez de l’espace-disque sur le serveur en ne chargeant qu’un seul exemplaire de chaque image.


5. LES CADRES

Les Français en parlent, faut-il s’en étonner, sous le nom de " frames "! Il s’agit d’une technique d’interface consistant à subdiviser l’écran en fenêtres indépendantes. Bien utilisée, c’est une technique très puissante qui permet, par exemple, d’afficher en permanence un bandeau de navigation et de ne plus jamais s’en préoccuper ensuite dans la conception des autres pages du site. Il vaut certainement la peine de faire l’effort de comprendre et de maîtriser cette fonctionnalité du langage HTML.

Toutefois, certaines règles s’appliquent. Ne pas en abuser, en tout premier lieu : pas plus de deux cadres par page (en général, un cadre de navigation assez discret et un cadre principal servant à l’affichage). Ensuite, éviter l’emploi des barres de défilement dans le cadre de navigation : tous ses éléments doivent être affichés d’un seul coup à l’écran. Bien maîtriser le paramètre target dans le langage HTML, de façon que les liens affichent les bonnes pages dans les bons cadres. Et, finalement, vous assurer que les liens qui conduisent à l’extérieur de votre site portent bien le paramètre "TARGET=_top", pour ne pas imposer à votre visiteur la présence de votre cadre tout au long de son parcours sur le Web.


6. LA PAGE D’ACCUEIL

C’est l’élément le plus important de votre site et il exige une attention particulière. Non seulement s’agit-il de la vitrine (qui accrochera le visiteur ou pas et lui donnera instantanément une impression de l’allure générale du site) mais cette page est aussi le carrefour à partir duquel votre visiteur va s’orienterpour la suite de sa navigation). Sa mise en page doit être aussi soignée que la Une d’un journal.

Il est important, entre autres, de s’assurer de la présence des éléments suivants sur votre page d’accueil :

  • le titre du site; il peut être fantaisiste (" Le placard à surprises ") ou descriptif (" le site des élèves de 5e de l’école Isaac-Newton, de Laval ");
  • si cela n’a pas été fait dans le titre même, une identification claire de l’école et du groupe, de la ville et du pays (il faut penser aux visiteurs d’autres pays à qui la ville de Laval ne dira rien!);
  • un lien ou un bouton vers un sommaire ou une carte du site, sorte de table des matières qui permettra au visiteur d’en avoir une vue d’ensemble;
  • des liens vers les principales section du site (les " chapitres ");
  • la date de mise à jour;
  • un lien courriel pour recueillir les commentaires des visiteurs.

Une démarche

Il est évident que c’est la mise en ligne initiale du site qui mobilisera le plus d’énergie, car elle exige des prises de décision (vocation, titre, page d’accueil, conception graphique globale) qui détermineront le cadre à l’intérieur duquel s’effectueront les éventuelles mises à jour. Nous vous proposons ci-dessous les grandes étapes d’une démarche qui conduira à la réalisation de la mise en ligne initiale: les mises à jour ultérieures n’en reprendront que les éléments pertinents.


1) LES PRÉALABLES

On suppose tout d’abord que les élèves ont déjà navigué sur Internet et qu’ils sont à l’aise avec le langage et l’allure générale du Web. Si ce n’est pas le cas, il faut différer la réalisation du site Web scolaire et assurer d’abord ce préalable.

Même avec des élèves à qui le Web est familier, un tel projet ne s’annonce pas de but en blanc en classe sans une préparation soigneuse du terrain. Essentiellement, cette phase vise à réunir deux préalables :

  • la motivation des élèves à réaliser un site Web;
  • la connaissance de base des caractéristiques d’un site Web, avec les possibilités et les contraintes inhérentes à ce mode de communication.

Deux approches sont possibles. Dans le premier cas, on invite les élèves à visiter et à analyser des sites Web scolaires . Il est fort possible que le fait de voir ce que d’autres classes ont réalisé leur donne l’envie de les imiter. Dans le second cas, on s’efforce de faire émerger le besoin d’un projet de communication d’abord, d’orienter les élèves vers le site Web comme un moyen de satisfaire ce besoin et, finalement, de leur faire connaître les caractéristiques essentielles de ce médium..

La visite, l’étude et la comparaison de divers sites devraient permettre aux élèves de découvrir les caractéristiques énoncées précédemment (un ensemble de fichiers textuels et graphiques, aisément navigable, cohérent et régulièrement mis à jour) et d’en dégager les principales constantes :

  • graphiques : titre, logo, icônes, boutons, bandeaux de navigation, fonds, textures, tableaux, couleurs, etc.
  • formelles : le rôle particulier de la page d’accueil, titrage et sous-titrage, lignes séparatrices, cadres, etc.
  • structurelles : distinction entre textes d’information, d’opinion et d’expression, liens avec l’actualité,

2) LA VOCATION DU SITE

C’est au cours de cette étape que se prennent les décisions, évoquées précédemment, relatives à l’intention de communication. Elle peut être de :

  • faire connaître les élèves, leurs activités, leurs réalisations, leur groupe, leur école ou leur milieu;
  • traiter de sujets ou de thématiques qui les intéressent (loisirs, vedettes, sports, musique, mode juvénile…);
  • refléter l’actualité (locale, mais aussi régionale, nationale ou internationale : plusieurs sites scolaires se donnent comme vocation de choisir des événements de l’actualité générale et de les expliquer dans un langage de jeunes).

Un site peut aussi combiner plusieurs de ces vocations. Il s’agit aussi, à ce stade, d’envisager de façon large l’ensemble du site, y compris avec ses possibilités futures d’expansion, et pas nécessairement ce que sera mis en ligne lors du lancement.

Il est souhaitable que ce travail s’effectue de façon collective : brainstorming, formulation d’hypothèses, critique et, finalement, prise de décision — par vote si nécessaire.


3) LA MAQUETTE ET LES NORMES DU PUBLICATION

On détermine ici le cadre graphique général qui sera commun à toutes les pages du site et qui encadrera la forme et la présentation des textes et des images.

Voici, entre autres, les éléments faisant partie d’une maquette générale d’un site:

  • le titre du site, le graphisme et la couleurde ce titre, son logo s’il y a lieu, sa localisation sur la page d’accueil et, s’il y a lieu sur les principales pages d’entrée des sections;
  • l’identification de la classe, de la ville et du pays;
  • l’interface de navigation (boutons, bandeau de navigation, cadres, etc.);
  • la structure de la mise en page et, particulièrement, l’utilisation des cadres ou des tableaux;
  • la page d’accueil : son contenu et ses repères de navigation.
  • la longueur moyenne des textes;
  • les normes de publication : couleur ou texture de fond, taille et couleur des caractères utilisés pour le texte ainsi que pour les titres et sous-titres (pour les raisons évoquées plus haut, on travaillera avec une police générique et on ne se préoccupera donc pas de cet aspect). Vu le caractère technique de ces normes et la nécessité d’une cohérence globale, il serait souhaitable que l’enseignant fournisse à ses élèves des matrices électronique (c’est-à-dire des fichiers HTML vierges de contenu, mais déjà pré-formatés).

À l’exception des normes de publication qui relèvent, comme on vient de le dire, de l’enseignant, il est souhaitable que la maquette fasse l’objet d’une élaboration collective ou, au minimum, d’une prise de décision finale par le groupe. Cette partie du projet est l’endroit idéal pour exploiter une approche compétitive-coopérative : il peut être très intéressant d’organiser un concours pour trouver le titre du site ou de demander à différentes équipes de préparer un schéma de disposition de la page d’accueil — le groupe choisissant ensuite le meilleur des projets présentés.

Finalement, de façon à donner aux élèves une représentation concrète du produit final, il sera utile de fournir quelques exemples de fichiers HTML respectant les normes de publication mais exploitant des dispositions différentes : par exemple un album de photos avec leurs légendes, ou un texte disposé en blocs à l’aide d’un tableau, etc.


4) LE PLAN DU SITE

Il s’agit, essentiellement, d’un travail de contenu. Indépendamment des modalités de réalisation (que l’on déterminera à l’étape suivante), on fixe ici ce que doit et peut contenir la page (ou la section) personnelle de chaque élève. De même, on détermine les textes à produire, le sujet de chacun, sa longueur approximative et la section où ils logeront dans le site. Même si, lors du montage final du site avant sa mise en ligne, des changements peuvent toujours être apportés, on devrait néanmoins, au terme de cette étape, avoir une idée assez claire du contenu de chaque page.

Une fois cela décidé, l’enseignant devrait produire le squelette du site. On entend par là qu’il crée un fichier HTML vierge pour chaque texte à produire, lui donne un titre et le relie à l’interface de navigation. Ainsi, même avant que les élèves n’aient commencé à produire le contenu, tout le monde sait ce que va contenir le site, où on va trouver chaque texte à partir de la page d’accueil et de la table des matières et y parvenir effectivement. Il s’agit là non seulement d’une source de motivation importante pour les élèves qui voient rapidement leur site prendre forme, mais aussi d’un outil indispensable de coordination des travaux.

Le contenu dépend évidemment des choix effectués précédemment quant à la vocation et à la structure générale du site. Pour les sections générales du site, il faut, au terme d’un brainstorming et d’une discussion collectifs, choisir les sujets des textes et des images en prenant en compte des critères de diversité, d’intérêt des lecteurs et d’actualité. S’il y a des sections thématiques, il faut explorer les divers aspects du thème et s’assurer d’en couvrir les principales facettes.


5) L'ORGANISATION DU TRAVAIL

Si l’on exclut la mise en ligne, le travail de réalisation comporte deux grandes phases: la rédaction et la production.

La rédaction comporte la recherche d’information, l’écriture des textes, leur saisie et leur révision linguistique. Entre aussi dans cette phase la recherche ou la réalisation des illustrations.

La production comporte la mise en page, le formatage, le traitement graphique et l’établissement des hyperliens.

Pour la rédaction, les modèles possibles d’organisation du travail sont nombreux. Chaque élève aura-t-il un texte à écrire? Certains textes seront-ils écrits en collaboration? Lesquels requièrent une recherche préalable, une visite ou une entrevue? Lesquels sont liés à un événement précis dans le temps? Utilisera-t-on des mécanismes de compétition (deux élèves ou groupes d’élèves présentant des propositions différentes pour un même texte)? Les élèves devront-ils élaborer un plan de leur texte et le faire approuver avant de le rédiger? Tout le travail doit-il se réaliser en classe ou une partie peut-elle se réaliser à l’extérieur, sous forme de travaux personnels? La révision linguistique des articles sera-t-elle effectuée par l’auteur? Par un autre élève? Par un comité d’élèves? Par l’enseignant? Quel usage sera fait des correcteurs électroniques? Des apprentissages technologiques (principalement des techniques de traitement de texte et d’édition HTML) sont-ils à prévoir pour que les élèves puissent réaliser la saisie de leurs textes? Quelles illustrations sont à rechercher ou à réaliser?

Il est à noter que des questions similaires se posent même si le contenu rédactionnel du site est peu considérable et si le site est davantage orienté vers les arts, le graphisme ou la photo, voire le multimédia.

En tenant compte des réponses à ces questions, du temps à allouer aux élèves pour chacune des tâches, on établira un échéancier qui précisera, pour chacun des élèves concernés, la date à laquelle devront avoir été accomplies les tâches qui leur auront été attribuées, ainsi qu’une date de tombée. À cette date, tous les textes et toutes les illustrations du numéro devront être disponibles dans leur forme définitive, en fichiers HTML pour les textes, accompagnés des fichiers graphiques GIF ou JPG qui y seront intégrés pour les illustrations. On précisera aussi une date de lancement, qui sera celle de la mise en ligne du site sur le serveur.

La phase de production devrait être relativement brève si l’on a pris soin de travailler avec des matrices et des normes de publication claires. Il s’agit essentiellement d’équilibrer harmonieusement les textes et les éléments graphiques, d’aérer la mise en écran par des sous-titres ou des barres séparatrices, d’exploiter (mais avec modération) la couleur pour certaines mises en relief, à fractionner en plusieurs écrans successifs les pages trop denses, etc., etc.

Chaque élève le fait pour sa page (ou sa section) personnelle. Pour les sections collectives, on répartit le travail entre diverses équipes.

Le travail final de production (navigation complète du site, vérification de la cohérence de tous les liens, approbation finale du contenu et mise en ligne) devrait être pris en charge par l’enseignant.


6) LA DIFFUSION

Le travail ne s’arrête pas avec la mise en ligne du site, surtout si on entend lui donner un caractère évolutif et permanent. Il faut ensuite le faire connaître. Des projets de marketing du site, propices à de nombreux apprentissages diversifiés, peuvent utilement prolonger la réalisation proprement dite du site.

Logique oblige, il faut d’abord penser à un marketing électronique. Si, par exemple, on inscrit le site dans les principaux moteurs de recherche, il faudra penser à en rédiger une courte description. Si l’on souhaite que le site soit inscrit sur les liens recommandés par tel ou tel site pédagogique, les élèves auront l’occasion d’apprendre à écrire une lettre au responsable de ce site et de la lui faire parvenir par courrier électronique. On peut aussi faire partie de cercles d’écoles qui correspondent, échangent des fichiers ou même travaillent en commun à la réalisation d’un projet qui pourra ensuite être mis en ligne sur leurs sites respectifs. Les possibilités sont quasi-infinies et ne sont pas à négliger.

Il faut aussi penser à informer la communauté locale (au premier titre, les parents, mais aussi les autres élèves de l’école) du lancement de ce nouveau site scolaire. Lettres publicitaires, affiches, kiosque interactif à l’occasion d’une visite de parents sont autant d’occasions de créer des projets de communication subsidiaires qui viendront enrichir le projet principal.


7) L'ENTRETIEN ET LA MISE À JOUR

La suite des travaux dépend évidemment des décisions qui auront été prises concernant la dynamique du site. Sauf si l’on a choisi de laisser le site dans son état initial et de passer ensuite à autre chose, il faudra bientôt prévoir des séances de travail collectif pour déterminer ce que l’on produira dans les semaines ou les mois suivants pour enrichir et développer le site. Il faudra de même identifier dès maintenant les pages du site qui sont " périssables " (parce que collées sur l’actualité, par exemple) et qu’on devra (en précisant pour quelle date) retirer ou remplacer.

De même, si des pages du site comportent des liens vers des sites extérieurs (c’est le cas de rubriques du type " Nos sites préférés ", par exemple), il faut régulièrement vérifier si ces liens sont toujours valides. Si les sites vers lesquels pointaient ces liens ont déménagé ou disparu (et les choses vont vite, sur le Web!), il faudra rectifier ou remplacer ces liens.


L'évaluation

Il importe ici de distinguer trois objets d'évaluation bien différents : l'évaluation du produit, l'évaluation de la démarche et, finalement, l'évaluation des apprentissages.

1) LE PRODUIT

Il s'agit ici d'effectuer, collectivement, un retour critique sur le produit final. Le respect du plan et de la maquette, l'intérêt et la pertinence des textes et des illustrations, la qualité linguistique, la clarté et la lisibilité de la mise en page, la qualité de l'impression sont les principaux critères sur lesquels devrait porter cette évaluation.

Cette évaluation doit, bien entendu, être placée dans une optique prospective : qu'est-ce qui est à conserver et qu'est-ce qui est à corriger lors de la production du prochain numéro? Faut-il remettre en question certaines décisions qui ont été prises pour ce numéro?

2) LA DÉMARCHE

De la même façon, collectivement (cela peut se réaliser au cours de la même séance), on invitera le groupe à son fonctionnement lors des diverses étapes du projet : répartition des tâches, attribution des responsabilités, respect des engagements, qualité des prises de décision collectives, fonctionnement des diverses équipes, souci d'entraide, capacité de critique constructive, débrouillardise sont les principaux aspects à évaluer et à débattre. Logique oblige, la contribution de l'enseignant devrait elle aussi faire partie de cette évaluation!

Là aussi, le retour sur la démarche doit d'abord viser à améliorer le fonctionnement futur.

3) LES APPRENTISSAGES

L’évaluation des apprentissages est évidemment conditionnée par les compétences que l’enseignant aura choisir de développer à travers ce projet. Il s’agira aussi bien de compétences disciplinaires (en français et en arts plastiques pratiquement d’office, plus d’autres programmes qui peuvent être touchés par le contenu de certains textes) que des compétences transversales.

Nous voudrions ici insister plutôt sur l’importance de s’assurer que chaque élève aura eu l’occasion d’effectuer l’ensemble des apprentissages prévus (les mêmes pour tout le monde) et qu’il sera évalué sur ses apprentissages personnels, et non sur ceux de son équipe ou de son groupe. Si des tâches sont réalisées en équipe et si le jugement final porte sur le produit de l’équipe, il faudra aussi se donner les moyens d’identifier la contribution individuelle de chaque élève.

Finalement, il convient de rappeler que si l’auto-évaluation et l’évaluation par les pairs ont toute leur utilité dans l’évaluation formative, l’évaluation sommative demeure la responsabilité de l’enseignant. S’il choisit (ce qui est correct) d’y intégrer des jugements d’autres provenances, il lui incombe toujours de superviser et de valider ces derniers.