Enseignement de l'informatique et du numérique au lycée Boissy d'Anglas
https://icn-isn-boissy.yj.fr/wp/2016/07/21/activite-n1-creer-une-page-internet/
Export date: Mon Jan 20 19:04:43 2025 / +0000 GMT

Activité n°1 : Créer une page web [Archive/Obsolète]


Les bases du html


Pour apprendre les bases du html, on pourra utiliser les cours du site www.codecademy.com 1. Il est conseillé (mais non obligatoire) de s'inscrire sur le site. Cela vous permettra de retrouver ce que vous avez fait d'une séance sur l'autre.



Ne pas faire tous les cours du module, se limiter à ceux qui sont indiqués. Attention : les cours se succèdent et on ne s'aperçoit pas toujours que l'on est passé au suivant.

Pour commencer suivre le cours intitulé le b.a.-ba du language html 2. S'arrêter au dernier exercice, le n°14 (intitulé Félicitations). Ne pas commencer le cours d'après (Développer votre propre site internet).

Application


Installation des fichier


Télécharger le projet projet-batman.zip 3. Extraire l'archive dans un nouveau répertoire sur votre session.

Vous aller éditer les fichiers html pour créer un mini site web de deux pages. Pour cela, il vous faut un éditeur. Installer par exemple :

Travail à faire


À vous de jouer, vous aller éditer les fichiers batman.html et bruce-wayne.html afin d'aboutir au résultat suivant (cliquer sur les images pour agrandir) :











Page batman.html Page bruce-wayne.html
page-web_batman page-web_bruce-wayne

 

On doit pourvoir passer d'une page à l'autre en cliquant soit sur le texte (page batman.html) soit sur l'image (page bruce-wayne.html).

Les images sont dans le répertoire img créé lors de la décompression de l'archive zip.

Pour information les deux images sont sous licence Creative Common 6 (l'image de batman a été créée par BoggieNightBoy 7sur deviantart.com 8 ; celle de Christian Bale a été déposée sur wikipedia.org 9 par Siebbi 10).

Lorsque tout fonctionne parfaitement, vérifier que votre code html ne comporte pas d'erreurs sur le validateur html de la W3C 11.

Appeler le professeur en cas de problème.

Puis, passer à la suite 12.
Links:
  1. https://www.codecademy.com/fr/learn
  2. https://www.codecademy.com/fr/courses/web-beginner -fr-FR-DUBAD/
  3. http://icn-isn-boissy.yj.fr/wp/wp-content/uploads/ 2016/07/projet-batman.zip
  4. https://notepad-plus-plus.org/fr/
  5. https://www.sublimetext.com/
  6. https://fr.wikipedia.org/wiki/Creative_Commons
  7. http://boggienightboy.deviantart.com/
  8. http://boggienightboy.deviantart.com/art/Bruce-Way ne-SD-365791503
  9. https://commons.wikimedia.org/wiki/File:Christian_ Bale_2014_(cropped).jpg
  10. http://www.ipernity.com/doc/siebbi
  11. https://validator.w3.org/
  12. http://icn-isn-boissy.yj.fr/wp/2016/07/21/activite -n2-creer-votre-propre-site-internet/
Post date: 2016-07-21 10:57:21
Post date GMT: 2016-07-21 08:57:21

Post modified date: 2018-08-27 16:54:33
Post modified date GMT: 2018-08-27 14:54:33

Export date: Mon Jan 20 19:04:43 2025 / +0000 GMT
This page was exported from Enseignement de l'informatique et du numérique au lycée Boissy d'Anglas [ https://icn-isn-boissy.yj.fr/wp ]
Export of Post and Page has been powered by [ Universal Post Manager ] plugin from www.ProfProjects.com