prise en main
premiers pas
Editez cette page et cliquez sur le bouton prévisualisation locale ! Vous pourrez voir en parallèle le code et le résultat, le texte balisé qu'il faut écrire et l'affichage correspondant.
Si vous comprenez le principe fondamental du langage utilisé, vous pourrez immédiatement composer des pages simples et progressivement, à votre rythme, monter vers des compositions plus sophistiquées.
Notez bien comment le titre initial, les quelques paragraphes qui suivent et certains mots sont simplement encadrés de couples de balises - des caractères alphabétiques entourés de crochets < et > - qui vont définir la façon dont ces textes doivent être affichées. Quelques explications :
- un mot (ou une portion de texte) encadré par les balises u et /u sera souligné ; devinez ce qui se passera avec les balises b et i !
- une portion de texte encadrée par les balises p et /p devient un paragraphe, avec un retour à la ligne avant et après. C'est cette balise qui fixe la nature de la police utilisée, sa taille, sa graisse et divers autres effets de style comme la justification à gauche et droite. Il est parfois nécessaire d'introduire un retour à la ligne forcé à l'intérieur d'un paragraphe ; on utilise la balise br - break -.
- une portion de texte encadrée par les balises h1 et /h1 devient un titre de niveau 1, le niveau le plus haut, avec un retour à la ligne avant et après ; on peut de la même façon définir des titres de niveaux 2, 3, 4, 5 et 6.
- cette liste de définition sur les balises est elle-même construite sur l'emboitement de balises ul - unordered list ou liste à puces - et li - list item ou article de liste -. Devinez ce qu'on peut faire avec la balise ol - ordered list - !
un peu plus loin ...
Vous savez maintenant écrire du texte structuré, et vous vous demandez normalement pourquoi il faut retourner dans la préhistoire du traitement de texte, quand on connaît les outils modernes comme Word où tout ceci peut se faire sans problème à l'aide de simples boutons et de raccourcis clavier, avec un affichage immédiat des effets souhaités, mise en gras, paragraphes séparés, etc... La réponse est simple ! Dès qu'il s'agit dans Word ou autre logiciel de ce genre d'appliquer une règle de style à une portion de texte, d'insérer de façon contrôlée une image ou de créer un lien vers des données externes, il faut en passer par des dialogues qui ne sont pas complètement évidents. Bon nombre d'utilisateurs de Word ignorent même ces fonctionnalités ou les utilisent de façon hasardeuse. Alors :
- pour ce qui est d'appliquer des règles de styles, c'est fait, baliser des titres, paragraphes, des listes, ... c'est appliquer des règles de styles !
- pour qu'un texte comme PIXAR devienne un lien il suffit d'utiliser la balise a : PIXAR devient PIXAR et un clic sur ce lien conduit au site http://www.pixar.com
- pour les images, voici ladybug, une image contrainte à la taille 100/100 avec un cadre de 5 pixels et une infobulle qui s'affiche au passage du curseur :
notez comment la balise img est contrôlée par 5 paramètres clairement identifiables.
... et ensuite ?
... prenez maintenant le temps de lire l'aide.
trop compliqué tout çà !
Pas vraiment convaincu ? Pas le temps ? Bon, alors il y a plus simple ! Il suffit simplement d'encadrer le texte entre les balises < pre style="font-size:1.3em" > et < /pre >, la taille étant ajustable (ici : 1.3em). Regardez bien ce qui suit :
Ce texte est entré directement, sans balise, tel quel, avec des retours à la ligne sans problème, sans devoir encadrer tout çà de balises < p > ou < br />. Les listes sont entrées facilement : - article 1 - article 2 1) article 21 2) article 22 3) article 23 - article 3 ... et c'est à peu près tout ce dont on a besoin pour l'essentiel. Et rien n'empèche de mélanger les genres, de réintroduire des balises élémentaires pour mettre en gras, en italique, créer destitres
, insérer des imageset des liens : PIXAR
Convaincu maintenant ?