HTML - Mise en forme

1. La mise en forme logique

Ces instructions, dites logiques, laissent le navigateur interpréter le formatage du texte. Ces balises sont souvent utilisées (mais de moins en moins) dans un environnement non graphique (sous DOS par exemple).

Pour utiliser ces balises, il suffit d’entourer votre texte avec la balise d’ouverture choisie et la balise de fermeture correspondante.

Voici toutes les balises de mise en forme logique et leur code source :

cite : Pour effectuer une citation <cite>cite : Pour effectuer une citation</cite>

code : Pour indiquer du code informatique <code>code : Pour indiquer du code informatique</code>

em : (emphase) Similaire à l’italique ` em : (emphase) Similaire à l’italique`

kbd : (Keyboard, clavier) Utilisé généralement pour indiquer une réponse d'utilisateur ` kbd : (Keyboard, clavier) Utilisé généralement pour indiquer une réponse d'utilisateur`

samp : Affiche les caractères de manière littérale ` samp : Affiche les caractères de manière littérale`

strong : Permet de faire ressortir du texte (gras) ` strong : Permet de faire ressortir du texte (gras)`

var : Indique une variable ` var : Indique une variable`

dfn : Permet de créer une sous définition ` dfn : Permet de créer une sous définition`

Vous pouvez bien sur imbriquer plusieurs balises attention tout de même à respecter l’ordre de fermeture.

Exemple : Texte en italique et en gras</em> ` Texte en italique et en gras</em>`

2. La mise en forme physique

Ces instructions, dites physiques, sont plus proches de l’auteur. En effet, avec ces balises ci-dessous, c’est vous qui décidez ce que le navigateur affichera, même s’il y a certaines limites.

Pour utiliser ces balises, il suffit d’encadrer votre texte avec la balise d’ouverture choisie et la balise de fermeture correspondante.

Voici toutes les balises de mise en forme physique et le code source :

b : Permet de faire ressortir du texte gras <b>b : Permet de faire ressortir du texte gras</b>

I : Met le texte en Italique ( ou )</i> ` I : Met le texte en Italique ( ou )</i>`

tt : Affiche le texte en police style machine à écrire ` tt : Affiche le texte en police style machine à écrire`

u : Souligne le texte ` u : Souligne le texte`

strike : Barre le texte

<strike>strike : Barre le texte</strike>

big : Permet d’utiliser une police plus grande ` big : Permet d’utiliser une police plus grande`

small : Permet d’utiliser une police plus petite ` small : Permet d’utiliser une police plus petite`

sub : Affiche le texte en indice (décalé vers le bas de la ligne) ` sub : Affiche le texte en indice (décalé vers le bas de la ligne)`

sup : Affiche le texte en exposant (décalé vers le haut de la ligne) ` sup : Affiche le texte en exposant (décalé vers le haut de la ligne)`

Vous pouvez bien sur imbriquer plusieurs balises les unes avec les autres. Attention tout de même à respecter l’ordre de fermeture.

Exemple : Texte en italique et en gras ` Texte en italique et en gras `

3. Les polices de caractères

Il n’y a rien de plus facile à spécifier qu’une police. La méthode à utiliser par le HTML s’appuie sur la balise <font>. Cependant, pour que votre document se visualise correctement (c’est à dire avec la police définie dans votre document), essayez d’employer une police standard (arial, courrier …) à toutes les plates-formes, sinon c’est la police paramétrée par défaut sur le navigateur de chaque visiteur qui prévaudra et sera affichée.

La balise <font> possède plusieurs attributs :

  • face : Permet de définir, par ordre de priorité, les noms des polices
  • size : Permet de définir la taille de la police de 1 à 7(valeur par défaut : 3) A noter qu’il peut être utilisé de deux manières :
  • Absolue : size=2
  • Relative : size= +2
  • color : Permet de définir la couleur du texte (soit avec le nom de la couleur soit avec la valeur hexadécimale correspondante)

Cas de la balise <basefont>

La balise <basefont> est utilisée pour définir la police standard. Elle ne possède pas de balise de fermeture, et elle emploie les mêmes attributs que la balise <font>. En réalité, il n’y a aucune différence importante avec la balise <font>.

Quelques exemples d’utilisation de la balise <font> et leur code source :

Police Comic Sans Ms - Taille par défaut (3)

<font face="comic sans ms, arial">Police Comic Sans Ms - Taille par défaut (3)</font>

<font face=”impact, verdana” size=2 color=”green”>Police Impact - Taille 2 - Couleur : Verte</font> <font face="impact, verdana" size=2 color="green">Police Impact - Taille 2 - Couleur : Verte</font>

4. L’accentuation

Pour inclure des caractères accentués, vous devez remplacer la lettre accentuée par l’entité correspondante (code ISO 88-59-1 ou ISO Latin-1). En effet, cela permet une harmonisation entre les différents systèmes d’exploitation et surtout entre les différentes particularités de chaque langue. Le principe est le même pour insérer des caractères spéciaux.