« Le langage HTML/Structure de base d'un document HTML » : différence entre les versions

Un livre de Wikilivres.
Contenu supprimé Contenu ajouté
Ligne 25 : Ligne 25 :
==== Que nomme-t-on une balise ? ====
==== Que nomme-t-on une balise ? ====


Une balise est composée d'un mot clef entouré des symboles "<" et ">". Par exemple <html><nowiki><code></nowiki></html> est une balise.
Une balise est composée d'un mot clef entouré des symboles "<" et ">". Par exemple <code><nowiki><html></nowiki></code> est une balise.


Les balises viennent en général par deux.
Les balises viennent en général par deux.

Version du 24 mars 2005 à 19:34

Le documents HTML doivent tous avoir une structure minimale. Dans cette partie, nous présenterons cette structure en donnant quelques explications sur les différents mots clef (aussi appelés balises) principaux.

Un exemple de page minimale:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
  <head>
    <title>Titre affiché dans la barre de titre du navigateur</title>
  </head>
  <body>
    Un peu de texte
    <!--Un commentaire qui ne sera pas visible-->
    Encore du texte
  </body>
</html>

Les balises

Le HTML utilise ce que l'on nomme des balises afin de structurer les informations et pour transformer votre code source en document correct affiché à l'écran. Connaitre toutes les balise par coeur n'est heureusement pas nécessaire mais il faut en avoir bien compris le principe pour pratiquer le HTML.

Que nomme-t-on une balise ?

Une balise est composée d'un mot clef entouré des symboles "<" et ">". Par exemple <html> est une balise.

Les balises viennent en général par deux.

  • Une ouvrante dont la syntaxe est décrite juste au dessus.
  • Une fermante qui s'écrit comme l'ouvrante sauf que l'on fait précéder de mot cléf par le caractère "/".

L'homologue fermante de la balise <html> est donc </html>

Contenu des balises

Entre un balise ouvrante et une balise fermante, il peux y avoir deux sorte de choses :

  • Du texte qui s'affichera ou non lors du rendu en fonction de sa position.
  • Un ou plusieurs couples de balises

Ordre des balises

Il est bon de dire qu'une balise ouvrante doit TOUJOURS être placer AVANT une balise fermante.

Attention, il est interdit de "croiser les balise" c'est à dire qu'il n'est pas permis de fermer une balise alors qu'une autre qui a été ouverte apres elle n'est pas encore fermée.

Un exemple de balises correctement agancées (ne vous inquiétez pas si vous ne comprenez pas les balises elle seront expliquées plus tard)


<html>
  <head>
  </head>

  <body>
    <h1>Voici une balise imbriquée 2 fois</h1>
  </body>

</html>

Maintenant un exemple de mauvaise imbrication des balises.


<html>
  <head>
  

  <body> 

  </head> la balise body n'est pas fermée et on ferme la balise head.
  
  </body>

</html>


Attributs

Un grand nombre de balises prennent des attributs. Ils servent à paramétrer finement le comportement d'une balise (par exemple en idiquant la cible d'un lien). Apres le mot clef, il suffit de mettre le nom de l'attribut suivit du symbole égale et de la valeur que l'on veut donner à l'attribut entre guillement.

Ainsi dans la balise <a href="http://fr.wikipedia.org">Lien vers wikipedia</a> on peux constater que :

Les attributs sont toujours de la forme nom_de_l'attribut="valeur".

Il peut y avoir un nombre illimité d'attributs dans une balise. Bien sur, comme pour les balises, il est inutile de connaitre par coeur tous les attributs et toutes les valeurs.

La définition de type de document

Un document HTML est précédé d'une définition de type document, servant à indiquer le standard utilisé (exemple : HTML 4.0). Cette définition est facultative, dans la mesure où les navigateurs n'en tiennent pas compte : en effet, les différentes versions de HTML ont principalement consisté en des ajouts, et non en des modifications importantes de l'utilisation des balises et de la syntaxe (au contraire du VRML, dont les deux premières versions sont extrêment différentes).

Exemple de définition de type de document : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

La balise <html>

Un document HTML est entièrement compris dans une balise html et possède deux parties principales : un entête (head) et un corps (body). L'entête est constitué de déclarations concernant la page HTML elle même dont un élément title qui est obligatoire. Le corps contient le document lui-même, ce qui sera affiché par le navigateur dans la fenêtre de rendu, cette partie ne contient pas d'élément obligatoire.

La balise <head>

La balise <head> indique des informations qui ne seront pas affichées directemnt dans la zone de rendu du navigateur. Par exemple le titre de la page, le lien vers la feuille de style, etc... L'entête des documents HTML est l'objet du chapitre l'entête.

La balise <body>

Tout le corps de notre documemt est dans la partie body. On y trouve donc le texte, les liens, la référence des images et tout ce qu'on peut vouloir mettre dans un document HTML.

Les commentaires

Le commentaires sont des textes qui sont écrits dans le code HTML mais qui ne sont pas visible dans le rendu de la page. C'est un genre de "post-it" que l'on met dans son code afin d'expliquer ce que l'on à fait, se rapeler quelque chose pour la prochaine scéance de codage...

Un commentaire est commencé par les caractères <!-- et est terminé par les caractères -->

Vous pouvez mettre ce que vous voulez à l'interieur d'un commentaire, du texte, des balises, etc...