TD5 - Un petit devoir sur machine.
HTML/CSS
2004-2005
IMAC 1
A la surprise générale, aujourd'hui sera le jour d'une petite interro, histore de savoir ce que vous avez réussi à apprendre au cours des TDs précédents.
Quelques remarques en vrac:
- vous serez notés aussi bien sur le fond que sur la forme,
- n'oubliez pas de citer vos sources,
- l'arborescence des fichiers formant ce site devra être contenue dans un répertoire dont le nom (en minuscules) sera formé de votre nom suivi d'un souligné '_' suivi de votre prénom (ou de vos prénoms séparés par des soulignés '_' s'il est composé, exemple dans le cas d'Olivier Derpierre le nom du répertoire sera derpierre_olivier),
- le site sera à rendre AVANT LA FIN DES 2 HEURES (heure du mail faisant foi) sous la forme d'un mail dont le titre sera "HTML/CSS-TD5" à olivier.derpierre@univ-mlv.fr sous la forme d'une archive compressée (utilisez la commande "tar cfz nom_prenom.tar.gz nom_prenom" dans le répertoire parent de votre répertoire nom_prenom) attachée au mail. Le corps du message contiendra vos noms et prénoms.
Vous allez devoir, en 2 heures, créer un petit site sur les X-Men (on se disait que vous deviez commencer à en avoir marre de superman).
Le thème de ce site sera donc...
Il était une fois les X-Men.
Le site sera architecturé de la façon suivante:
- Une page d'accueil présentant le site et fournissant des liens vers les différentes grandes sections du site,
- Une section historique retraçant l'histoire des X-Men,
- Une section héros et vilains proposant un choix vers un ensemble de pages décrivants les personnages marquants de la série,
- Une section superpouvoirs décrivant quelques uns des pouvoirs marquant des divers protagonistes.
Vous pourrez bien évidemment ajouter autant de sections supplémentaires que vous le désirerez.
La page d'accueil.
Outre un petit (ou grand si vous préférez) descriptif du contenu de ce site, cette première page devra disposer d'un menu (que l'on devra impérativement retrouver sur toutes les autres pages du site sous une forme ou une autre) permettant d'accéder aux diverses sections du site. Montrez ce que vous avez appris en matière de html, de css et de trucs et astuces divers.
L'historique
Cette page contiendra un (plus ou moins) bref historique des X-Men, sa création, etc...
N'hésitez pas à subdiviser cette page en sections et paragraphes.
La page de description des divers héros et vilains.
Outre l'indispensable menu cette page devra comporter un tableau contenant un lien vers les descriptions des divers personnages que vous souhaiterez décrire (au minimum 3 d'entres eux). Au passage au dessus de la cellule d'un personnage, une image de celui-ci devra être affichée.
Chacun de ces liens devra mener à une page décrivant le personnage qu'elle représente. Chacune de ces pages descriptives devra se conformer à un seul et même modèle que vous aurez le loisir de définir.
L'effet demandé pourra être obtenu en utilisant les pseudo-classes :link, :visited, :hover,et :active (référez vous à la documentation si vous avez des doutes: 5.11.2 The link pseudo-classes: :link and :visited et 5.11.3 The dynamic pseudo-classes: :hover, :active, and :focus). N'hésitez pas à améliorer l'effet visuel du survol d'une cellule en jouant notamment sur les bords.
La page des superpouvoirs
Cette page devra présenter une liste des quelques uns des pouvoirs marquants des personnages des X-Men (héros ou méchants) et proposer des liens vers des pages décrivant ces pouvoirs de façon plus détaillée.
Nous vous laissons toute liberté sur le design de cette section. Néanmoins chacune des pages descriptives devra se conformer à un seul et même modèle.