ROYAUME DU MAROC
FORCES ARMEES ROYALES
MARINE ROYALE 1ème Année Cycle Licence
ECOLE ROYALE NAVALE
Travaux Pratiques 3
HTML5
Objectif du TP
Ce TP a pour objectif de créer trois pages web HTML liées entre elles par un menu de
navigation commun.
Le travail permet d’apprendre à structurer correctement des pages HTML5, créer un
menu de navigation, organiser un contenu et utiliser les principaux éléments HTML.
Travail demandé
Créer un dossier nommé : tp_plateforme_universitaire
Dans ce dossier, créer les trois fichiers suivants :
[Link]
[Link]
[Link]
Les trois pages doivent être reliées entre elles grâce à un menu de navigation réalisé
avec la balise <nav>.
Le menu doit être identique dans les trois pages et contenir les liens suivants :
Accueil
Filières
Inscription
Page 1 : [Link] - Accueil
1. Créer une page d’accueil présentant la plateforme universitaire.
2. La page doit contenir :
o une structure HTML5 complète ;
o un <header> contenant le titre principal :
- Plateforme universitaire ;
- un menu de navigation <nav> ;
- une partie principale <main> contenant une section de présentation ;
3. Une section de présentation contenant :
- un sous-titre : Présentation de la plateforme ;
- un paragraphe présentant le rôle de la plateforme universitaire ;
- une image représentant l’université ;
- une liste non ordonnée présentant quelques services proposés par la
plateforme ;
4. un lien permettant d’accéder à la page [Link].
5. un pied de page <footer> contenant : © 2026 - Plateforme universitaire.
Page 1
ROYAUME DU MAROC
FORCES ARMEES ROYALES
MARINE ROYALE 1ème Année Cycle Licence
ECOLE ROYALE NAVALE
Page 2 : [Link] - Filières
1. Créer une page présentant les filières disponibles.
2. La page doit contenir :
o une structure HTML5 complète ;
o un <header> contenant le titre :
- Filières de formation ;
- le même menu de navigation <nav> ;
- une partie principale <main> contenant une section ;
- un paragraphe expliquant le contenu de la page ;
3. un tableau contenant les colonnes suivantes :
- Filière ;
- Durée ;
- Responsable ;
- Salle ;
- au moins quatre filières différentes ;
- un lien permettant d’accéder à la page [Link] ;
4. un pied de page <footer> contenant : © 2026 - Plateforme universitaire.
Page 3 : [Link] -Inscription
1. Créer une page contenant un formulaire d’inscription.
2. La page doit contenir :
o une structure HTML5 complète ;
o un <header> contenant le titre :
- Formulaire d’inscription ;
- le même menu de navigation <nav> ;
- une partie principale <main> contenant une section ;
- un paragraphe expliquant l’objectif du formulaire ;
3. un formulaire contenant les champs suivants :
- Nom complet : champ texte ;
- Email : champ email ;
- Mot de passe : champ mot de passe ;
- Âge : champ numérique ;
- Choix de la filière : liste déroulante ;
- Sexe : boutons radio ;
- Centres d’intérêt : cases à cocher ;
- Message ou remarques : zone de texte ;
- Bouton Envoyer : bouton d’envoi du formulaire.
4. Un pied de page <footer> contenant : © 2026 - Plateforme universitaire.
Page 2