Embedded Files
Constituer une page Web
Constituer une page Web
Fiche 4
Depuis sa création en 1990, le langage informatique HTML (HyperText Markup Language) est utilisé pour créer des pages Web. C'est l'une des trois inventions issues du W3C avec le protocole HTTP et les adresses Web.
Son acronyme signifie "langage de balisage d'hypertexte" car il permet en effet de réaliser de l'hypertexte à base d'une structure de balisage.
Le CSS (Cascading Style Sheets ou "feuille de styles cascade") est imposé dans les années 2000. Comme son nom l'indique, il permet de styler les textes d'une page Web : définir leur taille, leur couleur ou l'alignement d'un paragraphe. L'utilisation de feuilles de style au format CSS repose sur l'idée de séparation du contenu et de la mise en forme.
Visionner la vidéo HTML contenu, structure et lien
et répondre au questionnaire 4.3
Visionner la vidéo A quoi sert les CSS ?
et répondre au questionnaire 4.4
Créer sa première page Web
Créer sa première page Web
Fiche 5
Partie I : Structure d'une page Web
Structure d'une page Web :
Code minimum avec un titre, un en-tête et un corps.
Titres et paragraphes
Il y a 6 niveaux d’organisation pour les titres définis par les éléments h1, h2, h3, h4, h5 et h6. h1 étant le titre principal et h6 le titre le plus petit.
Pour ajouter un titre dans une page html, c’est très simple il suffit d’utiliser les balises comme par exemple:
<h3> Mon titre </h3>
Pour créer des paragraphes, il faut utiliser l’élément p. On peut créer autant de paragraphes que l’on souhaite dans une page. A chaque paragraphe, il faut utiliser un nouvel élément p.
<p> 1er paragraphe </p>
<p> 2nd paragraphe </p>
Il est vivement conseillé de bien indenter son code et de mettre des commentaires comme suit: <!-- mon commentaire -- >.
Exemple
Exemple
Partie II : Créer sa première page Web
Pour coder en HTML, nous allons utiliser Web dans Capytale.
Code Capytale :
Pour créer sa première page web, visionner les vidéos suivantes et suivre les instructions pas à pas.
Lumni - Créer un site en HTML (2/5) ajout de texte
Lumni - Créer un site en HTML (3/5) ajout d'images
attention au format des images .jpeg ou .gif ou adresse lien image internet, pas de .jpg
attention de mettre les "bons guillemets" et de ne pas oublier "/" à la fin de la commande img
Lumni - Créer un site en HTML (4/5) ajout du CSS
Lumni - Créer un site en HTML (5/5) ajout de liens
Attention !! l'idée n'est pas de créer exactement la même page mais uniquement d'utiliser sa structure.
A toi ensuite d'y mettre le contenu, les couleurs, les images, les photos que tu veux.
Trouve un sujet que tu veux partager et crée ta page web pour le décrire.
Consignes :
La page doit contenir
un titre principal
un titre intermédiaire
du texte
une liste
des images et/ou des gif
des couleurs
un lien hypertexte vers une autre page
un lien vers une vidéo sur la 2e page
N'hésite pas à trouver d'autres balises sur internet.
Page updated
Google Sites
Report abuse