Rechercher
 

Améliorations / Corrections

Vous avez des améliorations (ou des corrections) à proposer pour ce document : je vous remerçie par avance de m'en faire part, cela m'aide à améliorer le site.

Emplacement :

Description des améliorations :

Introduction

La langage HTML (HyperText Markup Language) est utilisé pour décrire la structure d'une page Web. C'est un langage descriptif à base de marqueurs (de tags, en anglais). Parfois, le terme de balise est aussi utilisé en lieu et place de marqueur.

Le langage HTML est utilisé conjointement avec les langages CSS et Javascript. Le langage CSS permet d'appliquer un style visuel (une charte graphique) à vos pages, tandis que Javascript permet d'y adjoindre des effets dynamiques.

La syntaxe HTML

Le langage HTML utilise des marqueurs (nous parlerons à partir de maintenant de tags) pour structurer vos documents. Historiquement parlant, le langage HTML avait défini deux types de tags : les tags ouvrants et les tags fermants. Par la suite XML avait rajouté la notion de tags ouvrants et fermants (donc sans contenu). HTML 5 hérite de ces trois possibilités. Reprenons chaque type un à un :

Définitions d'attributs sur un tag HTML

Un tag ouvrant peut de plus posséder des attributs. Un attribut HTML est défini par son nom et sa valeur : ces deux parties sont séparées par un caractère =. De plus la valeur d'un attribut et comprise soit entre deux appostrophes, soit entre deux doubles guillemets. Par exemple voici un tag définissant trois attributs (rel, type et href ): <link rel='stylesheet' type="text/css" href="file.css" />

Les entités HTML prédéfinies

Enfin, notez qu'il est possible d'utiliser des entités HTML prédéfinies. Ces entités permettent d'injecter dans votre document soit des caractères inaccessibles par votre clavier, soit des caractères ayant un sens du point de vue de la syntaxe HTML. Par exemple &lt; (lesser than en anglais) utilisé pour introduire un caractère < (normalement utilisé pour débuter un tag). Voici quelques premières entités HTML à connaître par coeur.

Entités prédéfinies Commentaire Caractère équivalent
&lt; lesser than <
&gt; greater than >
&amp; ampersand &
&quot; quote - surtout utile dans les valeurs d'attributs "
&apos; apostrophe - surtout utile dans les valeurs d'attributs '
&nbsp; non breaking space - utile pour forcer des espaces insécables (qui ne peuvent être supprimés)

Vous pouvez consulter une liste d'entités plus complète en activant le lien suivant : Liste des entités HTML prédéfinies.

Exemple de code

 1 
 2 
 3 
 4 
 5 
 6 
 7 
 8 
 9 
 10 
 11 
 12 
 13 
 14 
 15 
 16 
 17 
 18 
 19 
 20 
 21 
 22 
 23 
 24 
 25 
 26 
 27 
<!DOCTYPE html>
<html>
    <head>
        <title>A little HTML page</title>
        <meta charset="utf-8" />
        <link rel="stylesheet" type="text/css" href="file.css" />
    </head>
    <body>
        <header>
            <h1>A little HTML page</h1>
        </header>
        
        <h2>Another title of level 2</h2>
        
        <p>
           A small paragraph.
        </p>
    
        <footer>
            <hr/>
            <p>
                This is the page footer.
            </p>
        </footer>
        
    </body>
</html>
Une page HTML simple