Internet
Site Web: fonctionnement, structure et programmation
Comme nous pouvons le constater dans le texte de la page de Marc, ce dernier a écrit la liste des villes qu'il a traversées au mois d'août. Afin que le navigateur sache qu'il s'agit d'une liste et afficher chaque item de la liste de façon plus claire, il convient de baliser le texte, comme le suggère l'image de droite ci-dessous:
Liste des villes visitées par Marc
Résultat désiré pour l'affichage de la liste
La création d'une liste en HTML nécessite l'utilisation de deux éléments qui, une fois combinés, formeront cette liste. Le premier élément sert à baliser chaque item de la liste. Le second détermine le type de la liste: numérotée ou non numérotée. Voici comment écrire la liste des villes en HTML:
Effectuez les modifications dans le fichier journal.html puis rechargez-le dans votre navigateur afin de vérifier le résultat. Notez que le navigateur se charge de numéroter automatiquement chaque item de la liste, ce qui vous évite d'avoir à le faire.
Dans l'anecdote du 2 juin située sur la page de Marc se trouve une liste: téléphone mobile, iPod, appareil photo numérique et barres protéinées. Modifiez le HTML correspondant afin de transformer cette énumération d'objets en liste non numérotée.
|
Insérer un élément HTML dans un autre élément s'appelle une imbrication de balises. A ce stade, vous avez déjà rencontré beaucoup d'éléments imbriqués. Vous avez placé un élément <body> dans un élément <html>, un élément <p> dans un élément <body>, un élément <q> dans un élément <p>, etc. Vous avez également inséré un élément <head> dans l'élément <html> et un élément <title> dans un élément <head>. En fait, les pages HTML sont toujours construites ainsi.
Dessiner le système d'imbrication des éléments d'une page web revient à dessiner un arbre généalogique. Chaque élément est symbolisé par un rectangle et chaque trait connecte l'élément imbriqué.
L'imbrication de balises permet par exemple de réaliser une liste dont l'un des items contient lui-même une liste. Afin de garantir une meilleure visibilité du code HTML, il est alors conseillé d'indenter correctement chaque bloc:
Afin d'éviter des surprises lors de l'interprétation du HTML par le navigateur, il est important d'imbriquer les balises dans le bon ordre. Par exemple, un élément <em> doit s'imbriquer entièrement dans un élément <p>:
L'élément <em> est bien imbriqué dans <p>
L'élément <em> est mal imbriqué dans <p>
Si votre HTML n'imbrique pas correctement les éléments, vos pages fonctionneront avec certains navigateurs mais pas avec d'autres. Penser aux imbrications évite les balises dépareillées et assure d'avoir un code HTML valide avec tous les navigateurs. Ceci prendra encore plus d'importance lorsque nous aborderons le standard XHTML.
Le code HTML suivant comporte des balises dépareillées. Trouvez les erreurs d'imbrication.
|
Pour chacun des éléments suivants, indiquez son nom ainsi que son type:
|
