Complément des cours en présentiel © Éric NÊME


Sujet du travail à rendre

Le travail à rendre consiste à créer 3 pages d'un site web, donc 3 fichiers HTML.
Ces 3 pages devront comporter un menu de navigation permettant de les afficher en cliquant sur des liens.

Le contenu textuel de ces pages est libre, et il n'est pas demandé de le créer de toutes pièces.
Vous pouvez utiliser n'importe quelle source pour ce contenu afin de vous éviter de perdre du temps à le rédiger.

Par contre, il est formellement interdit de recopier une page web, c'est-à-dire de copier un contenu déjà traité avec des balises HTML.

Le but de l'exercice est justement de choisir et placer les balises les plus adaptées à votre contenu, comme nous l'avons fait en cours. Si vous récupérez des fichiers de pages web, vous n'en serez pas l'auteur et l'exercice perdra tout son sens.
La finalité de ce travail est de vous placer en condition de rédaction d'un contenu pour alimenter des pages web, ce qui nécessite, comme je vous l'ai souvent répété en cours, de vous adresser simultanément à l'humain (le texte) et à la machine (les balises HTML).

Ce travail est à rendre au plus tard le dimanche 25 janvier 2026.
J'ai reculé cette date afin de vous laisser un mois pour le réaliser. Il ne devrait pas vous demander plus d'une journée de travail, une demi-journée pour les plus aguerris.
Pour information, quelques étudiants m’ont déjà rendu le leur. Vous étiez en attente de mon document complémentaire que j'ai tardé à vous fournir (je vous prie de bien vouloir m'en excuser), mais je pense que vous étiez en mesure, à la fin des cours, de commencer à bien le préparer, voire de le faire.

1 - Les attendus

Dans ce travail, je vous demande de choisir les balises les plus adaptées à votre contenu.
Il ne faut pas se contenter de placer des headers et des paragraphes. Un rédacteur pour le web doit faire l'effort d'exploiter au mieux, en fonction du contenu, la variété des balises que le langage HTML propose.
L'appréciation de votre travail repose sur l'attention que vous porterez à choisir vos balises qui devrait aboutir à une grande variété si votre contenu est assez riche (citation, listes, images, tableaux, formulaire, etc.).

2 - Envoi de votre travail

Une fois les fichiers réalisés et bien organisés dans vos dossiers, vous les placerez dans un dossier à votre nom et prénom dont vous ferez une archive zip.
Vous pourrez alors m'envoyer cette archive par courriel à l'adresse : eric.neme@univ-lyon3.fr.

Voici un exemple :
exemple du travail à rendre

Dans cet exemple on constate que :

  1. Le dossier dont vous ferez l'archive est : eric-neme.
  2. Ce dossier contient le dossier www, qui est le dossier racine du site web.
  3. Le dossier www contient tous les fichiers html et les images (éventuellement organisés dans des dossiers).

3 - Le document complémentaire au cours

Ce document est en fait l'ensemble des pages de ce petit site web que vous être en train de parcourir. Il a été réalisé uniquement en HTML. Il contient de nombreux rappels et les quelques notions que nous n'avons pas eu le temps d'aborder en cours.

Vous pouvez le parcourir en le consultant directement en ligne à cette adresse : complément de cours © Éric NÊME

Vous pouvez également le télécharger entièrement à cette adresse : fichiers du site web © Éric NÊME.
Je vous invite vivement à le télécharger. Vous pourrez ainsi l'ouvrir dans l'éditeur de texte ®Phœnix Code pour consulter dans le détail les balises HTML utilisées dans chaque page.
En remarque, le fichier que vous obtiendrez en cliquant sur le lien ci-dessus est une archive zip (complement-cours-eric-neme.zip). Vous devez l'extraire (sur Windows, faire un clic droit et choisir le menu "Extraire tout", sur Mac, faire double clic) pour obtenir le dossier "complement-cours-eric-neme" que vous pourrez ouvrir dans votre éditeur de texte (cf. Rappel sur l'éditeur de texte Phœnix Code)

Vous avez donc un modèle de ce que je vous demande de réaliser, à la différence qu'il contient 10 pages au lieu de 3 et que j'ai écrit moi-même le texte contenu dans ces pages.
Pour information, j'ai volontairement omis d'incorporer certaines balises qui auraient pu améliorer le résultat final dans le but de vous laisser le soin de découvrir, par vous-même, les autres balises en consultant la documentation officielle (MDN).

4 - Webographie