De vous à moi
Côté face, comme vous et moi ne pouvons échapper à la police des réalités de la vie quotidienne, je ponctuerai ces billets des parenthèses socialement utiles: bonnes adresses, livres, photos, conseils pratiques, vie associative, etc. Bref, c'est l'esprit Web 2.0.
Côté pile ou face, au gré de mes inspirations, je nous inviterai à nous regarder dans le miroir de notre époque épique.
Jeannot Pita
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0.1 Transitional//EN">
A la lecture de cette ligne de code HTML générée automatiquement par NVU (cf. billet 14/111), cette question à laquelle nous ne pouvons échapper se pose naturellement : cette ligne de code a-t-elle un sens ?
Oui, cette ligne de code HTML revêt un sens précis. Je vous propose donc de la décoder, pas à pas.
1) La balise <!DOCTYPE> qui est la première balise par laquelle commence obligatoirement tout document HTML, dans le cas présent, indique aux navigateurs (FireFox, Intenet
Explorer, Opera, etc.) la version de HTML (pour ce tutorial, c'est la 4.01) que nous allons utiliser pour écrire nos lignes de codes.
2) HTML PUBLIC veut simplement dire que la syntaxe à adopter
est celle d'un HTML Public (cf. W3C).
3) W3C est l'organisme qui tente de proposer un HTML standard et dont les balises soient reconnaissables par tous
les navigateurs.
4) DTD HTML 4.0.1 indique aux navigateurs que la syntaxe à adopter sera celle de HTML
4.0.1. C'est tout.
5) EN servira, si pour une raison ou pour une autre, vous souhaitez passer d'une langue à une autre. Nous aborderons ce point dans des exemples plus loin.
La suite est à lire ici.
(a):Tout document HTML, quel qu'il soit, commence obligatoirement par la balise <!DTD> qui permet de préciser la syntaxe du langage. Voyons, ci-après, à quoi peut ressembler, l'en-tête d'une page
HTML.
Quand vous passez cette page vide en mode source, vous aurez ceci:
La suite est à lire ici.
Maintenant, nous avons suffisamment d'éléments pour pouvoir passer à l'ossature d'une page Web. A toutes fins utiles, je vous propose
d'ouvrir le bal par un petit récapitulatif de la terminologie HTML. Nous allons donc définir les mots suivants: balises, conteneur, marqueur,
séparateur, attribut, valeur, etc. Après quoi, nous commencerons à écrire nos premières lignes de code HTML.
HTML (HyperText Markup Language)
Crée par le CERN (Laboratoire de recherche situé en Suisse), le HTML est, grosso modo, un langage à balises et qui permet à la fois de créer et de mettre en forme des
pages Web. Et celles-ci sont décodées et visualisées par les navigateurs tels que : Internet Explorer, Firefox ou Opera.
Balises (Tags)
C'est un élément d'un document HTML qui permet d'insérer un objet ou de mettre en forme du contenu (en disant aux
navigateurs la manière dont ils doivent afficher le contenu d'une page).
Exemple: <Html>, </Html>,
<Head>, </Head>,
<Body>, </Body> sont
des balises HTML.
Conteneurs
Ce sont des balises qui ne marchent que par pair pour mettre en forme un texte. Exemple: L'ouverture d'une page
Web commence toujours par <Html> (balise initiale) et se termine toujours par </Html> (balise finale précédée d'un Slash). Nous verrons des exemples très détaillés
plus loin.
Marqueurs
Loups solitaires. Ce sont des balises utilisables sans balises finales. Exemple, <Br> HTML est une balise qui
pemet de faire un saut de ligne. Et </Br> n'est pas une balise HTML.
Attribut
Un attribut est mot-clé pui permet de personnaliser la mise ne forme d'une page Web. Sa syntaxe est la suivante: <Balise Attribut = Valeur>. Je revienrdrai sur chacune des balises avec des exemples pour tirer les choses au
clair.
Séparateur
C'est un point déroutant que vous avez, à coup sûr, déjà rencontré. En effet, le HTML interprète la tabulation, le retour
chariot, comme un seul et unique espace. Nous verrons comment contourner astucieusement ce problème. A noter: la mise en forme d'une page Web n'a strictement rien à voir avec
celle d'un document saisi sous Word ou une autre plate-forme équivalente.
La suite est à lire ici.
Passons maintenant au menu Affichage qu'il nous faut également dérouler, comme nous l'avons pour les 2 précédents. A savoir: Fichier et Edition. Pour l'heure, nous n'avons écrit aucune ligne de code HTLM. Prenons le temps de nous familiariser avec NVU dont nous n'allons pas tarder à découvrir la puissance.
A noter:
- Barre d'outils contient des options que vous pouvez décochez (Principale, Mise en forme, etc.) quand bon vous semble. Le principe est identique à celui d'un traitement de texte classique. Pour avoir une interface dotée de
toutes ses options. Cochez-les toutes, comme ci-dessus;
- Mode d'édition normal permet de générer des codes HTML sans récourir aux balises
HTML. Je reviendrai sur ce point, à travers un exemple, dans le prochain billet;
- Sources HTML est une option qui vous permet d'écrire vous-même autant des lignes de codes HTML que
vous souhaiteriez. Nous verrons la différence entre le mode d'édition normal et le mode source HTML;
- Aperçu, comme son nom l'indique, est une option qui vous permet de voir vos lignes de codes (pages
Web) via un navigateur (Firefox ou Internet Explorer).
La suite est à lire ici.
