Obligement - L'Amiga au maximum

Vendredi 29 mars 2024 - 11:40  

Translate

En De Nl Nl
Es Pt It Nl


Rubriques

Actualité (récente)
Actualité (archive)
Comparatifs
Dossiers
Entrevues
Matériel (tests)
Matériel (bidouilles)
Points de vue
En pratique
Programmation
Reportages
Quizz
Tests de jeux
Tests de logiciels
Tests de compilations
Trucs et astuces
Articles divers

Articles in english


Réseaux sociaux

Suivez-nous sur X




Liste des jeux Amiga

0, A, B, C, D, E, F,
G, H, I, J, K, L, M,
N, O, P, Q, R, S, T,
U, V, W, X, Y, Z,
ALL


Trucs et astuces

0, A, B, C, D, E, F,
G, H, I, J, K, L, M,
N, O, P, Q, R, S, T,
U, V, W, X, Y, Z


Glossaire

0, A, B, C, D, E, F,
G, H, I, J, K, L, M,
N, O, P, Q, R, S, T,
U, V, W, X, Y, Z


Galeries

Menu des galeries

BD d'Amiga Spécial
Caricatures Dudai
Caricatures Jet d'ail
Diagrammes de Jay Miner
Images insolites
Fin de jeux (de A à E)
Fin de Jeux (de F à O)
Fin de jeux (de P à Z)
Galerie de Mike Dafunk
Logos d'Obligement
Pubs pour matériels
Systèmes d'exploitation
Trombinoscope Alchimie 7
Vidéos


Téléchargement

Documents
Jeux
Logiciels
Magazines
Divers


Liens

Associations
Jeux
Logiciels
Matériel
Magazines et médias
Pages personnelles
Réparateurs
Revendeurs
Scène démo
Sites de téléchargement
Divers


Partenaires

Annuaire Amiga

Amedia Computer

Relec


A Propos

A propos d'Obligement

A Propos


Contact

David Brunet

Courriel

 


En pratique : HTML - Mise en forme du texte (espaces, tabulations, entités caractères)
(Article écrit par Jean-François Richard - octobre 2008)


Retour sur l'article précédent. Pour les plus observateurs d'entre vous (dont le rédacteur en chef d'Amiga Power, n'est-ce pas Murakami), vous aurez remarqué que le source de Hello World a une erreur, la balise de fermeture de l'élément HTML est absente. Mais est-ce si important que cela ? En fait, non, car le HTML, enfin surtout les navigateurs HTML, sont très permissifs (tolérants) aux erreurs. Mais pour moi, je pense que les erreurs n'ont pas lieu d'être. Un code propre est une garantie d'un site stable et évolutif, car comme vous le verrez plus tard avec le cours sur le XHTML, des erreurs de ce type plante l'interprétation de la page par le navigateur.

Maintenant, reprenons le déroulement de notre cours, où en étions-nous ? Ah oui, la mise en forme de texte avec HTML. Voyons la page avec du texte espacé.

Interprétation des espaces et tabulations dans un navigateur

Code source de la page "texte_espacé" :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr" dir="ltr">

<head>
       <title>Texte espacé</title>
</head>

<body>

Ce 
texte 
subit
un 
retour 
chariot
après
chaque
mot
de
cette
ligne
,
cela
ne
se 
voit 
pas 
dans 
l'
affichage
de
la 
page
dans 
le 
navigateur
.
Voici maintenant une ligne tapée de façon tout à fait naturelle.
Enfin  entre chaque mot    de     cette  ligne  existe des    tabulations.
Le résultat est évident!

</body>

</html>

Cette page a été tapée de la façon dont elle est décrite dans le texte, mais cela n'apparaît pas à l'écran.

On peut expliquer cela simplement, car le HTML ne prend pas en compte les espaces, les retours chariots (saut de ligne) et les tabulations dans son traitement du fichier source.

HTML
Visualisation d'un code source HTML avec des espaces et tabulations

En résumé : le HTML n'interprète pas les retours chariots, indentations et autres tabulations apparaissant dans l'éditeur du code source. Par contre, cela souligne l'importance des balises remplissant ce rôle de structuration du texte étudié plus avant dans ce cours. Pour faire qu'un espace soit pris en compte par le navigateur, il faut utiliser une entité caractère &nbsp; (cf. le tableau caractères spéciaux et le paragraphe suivant).

Exercice : tapez un texte n'importe comment, sans queue, ni tête. Vérifiez les conclusions précédentes.

Les entités caractères

De plus, vous avez pu remarquer une chose étonnante dans le code source précédent, dans l'affichage du fichier source dans le navigateur, le texte apparaît écrit de façon normale.

Mais si l'on ouvre le fichier source dans un éditeur de texte au format ASCII, on remarque que certains caractères sont illisibles. Ce sont les entités caractères (ou caractères accentués) spécifiques de la langue choisie par votre système d'exploitation. Ici, ce sont les caractères spécifiques de la langue française, tels les caractères é, è, â, ù, etc.

Cela regroupe tous les caractères ne se trouvant pas dans le jeu normal de caractères alphanumériques. Ces caractères spéciaux sont spécifiés dans le langage HTML à l'aide des entités de caractères.

On définit les entités de caractères : soit un nom (&name;), soit une valeur numérique (&#nnn;). La façon la plus commode est l'utilisation des noms. Ainsi, lorsque le navigateur reconnaît une chaîne de caractères commençant par & et finissant par ;, il reconnaît un caractère spécial. L'entité caractère est définie entre ces deux caractères & et ;.

Les caractères les plus communs de la langue française sont :

&agrave; = à
&acirc; = â
&eacute; = é
&egrave; = è
&ecirc; = ê
&icirc; = î
&iuml; = ï

Exercice : écrire "la biologie moléculaire et les pathologies dans les hôpitaux". Entraînez-vous avec quelques caractères accentués.

Astuce : quand vous modifiez une page en cours de conception et que vous voulez voir les modifications effectives, déjà il faut avoir sauvegardé votre fichier modifié et il faut actualiser la page sous le navigateur. Alors le navigateur entre en jeu et transforme le code entité de caractère en caractère spécial correspondant (voir plus bas la partie sur les caractères accentués et spéciaux).

Attention, nous venons de commencer à comprendre un peu mieux la structure et la conception de page Web, mais on voit que certains caractères sont utilisés au sein des définitions de caractères spéciaux, ainsi pour les faire apparaître dans l'affichage d'une page Web, ils vont nécessiter un codage sous forme d'entité caractère (par exemple : <,, >, & et ").

Voici leur codification sous forme d'entité caractère :

Caractères spéciaux
Codage en entité caractère HTML
<
&lt;
>
&gt;
&
&amp;
"
&quot;
Tableau 1 : les caractères spéciaux

Remarque : pourquoi le ; n'est-il pas pris comme un caractère spécial ? C'est simple, le premier caractère ; suivant le & est considéré comme la fin de l'entité caractère. Tous les points virgules sont considérés comme des caractères normaux.

Exercice : faire une phrase avec des caractères accentués avec des mots de votre choix.

En résumé : il existe trois types de contenus : les balises, les commentaires (<!-- ... -->) et le texte (le texte ASCII est le seul format universel du Web et sur les différents types de machines ayant des systèmes d'exploitation, cela assure une pleine portabilité des sources HTML quel que soit le type de machine pourvu d'un navigateur Web).

Attention : les images et les fichiers multimédias au format binaire apparaissent sous forme de texte dans le code de la page HTML.

L'apparence du texte

Les utilisateurs peuvent modifier à volonté les caractéristiques d'affichage de leurs navigateurs Web. Cela tend à annuler les dispositions et formats de la page HTML. L'affichage d'une page dans un navigateur en mode plein écran (par exemple 1024x768) sera donc différent de l'affichage dans une fenêtre (de 500 pixels de large par exemple).

HTML HTML
Comparaison de l'affichage entre deux navigateurs de tailles de fenêtres différentes

Il existe des balises spéciales pour créer des effets au niveau de la présentation du texte dans une page HTML.

Remarque : dans cet exemple, nous voyons que l'importance de la résolution et de la taille de la fenêtre influencent énormément la visualisation d'une page HTML. Ainsi, selon les configurations des navigateurs et les caractéristiques du système d'exploitation, les pages peuvent être très différentes. D'où l'importance de la présentation du texte et des séparateurs dans les pages HTML.


[Retour en haut] / [Retour aux articles] [Article précédent] / [Article suivant]


Soutenez le travail de l'auteur