Aller au contenu

Interfaces web

Checklist étudiante -- TP5 Projet Web

Checklist étudiante -- TP5 Projet Web¶

Structure générale du site¶

Mon site contient au moins 2 pages (accueil + page de liste/panier).
Le thème est uniforme sur toutes les pages :
- même en-tête
- même menu de navigation
- même pied de page
- mêmes couleurs et style
- site réactif (mobile first)

En-tête (sur toutes les pages)¶

Logo cliquable vers index.html
Nom du site / compagnie
Icône vers la liste/panier

Lien vers index.html
Au moins 2 autres liens (ancrage ou nouvelle page)
Lien vers la liste/panier

Pied de page (sur toutes les pages)¶

Présent en 2 colonnes
Droits d'auteur :
- lien vers le site original (si reproduction)
- ou
- mention « libre de droits » + source des images
Nom(s) de l'auteur / équipe

Page d'accueil (index.html)¶

Groupe de cartes Bootstrap
Un carrousel contenant au moins 2 diapositives
Les items à ajouter à une liste ici ou dans une page séparée

Les items (minimum 4)¶

Une image
Un nom / description
Un formulaire avec au moins une option (quantité, couleur, taille, etc.)
Un bouton « Ajouter »

Page de liste / panier¶

En-tête, menu, pied de page identiques
Affiche « Liste vide » si rien n'a été ajouté
Sinon, affiche pour chaque item :
- image
- options choisies
Affiche le total d'items (ou total du prix)
Bouton « Vider la liste »

Fonctionnalité JavaScript¶

Enregistrement des choix dans sessionStorage
Lecture du sessionStorage sur la page du panier
Génération dynamique du HTML (createElement, appendChild, etc.)
Aucun item écrit directement dans la page HTML du panier

Technologies exigées¶

Qualité du code¶

Aucune erreur au validateur HTML/CSS
Variables et fonctions bien nommées
Indentation propre
Pas de variables globales inutiles
Fichiers séparés (HTML / CSS / JS)
Dossiers bien organisés

Bonus (optionnel)¶

(+1) Afficher le nombre d'items à côté de l'icône du panier
(+1) Supprimer un item précis dans le panier