| HTML |
| Définition - HTML |
|
Nous pouvons voir Internet comme un regroupement de données mis à la disposition du monde sous forme de document texte, souvent agrémentés d'images, et parfois de son et d'animation. L'interactivité d'Internet n'est possible que grâce à ces documents de présentation, qui sont à l'origine de presque tous les sites. Pour fabriquer ces documents, le navigateur charge des fichiers d'extension HTML. Il arrive aussi que certains fichiers portent d'autre extension, comme PHP, EXE, ASP, et même dans ce cas, le navigateur reçoit toujours des données au format HTML de la part de l'ordinateur serveur.
Un document HTML est en faite un fichier contenant des informations de structure qui seront interprétées par le navigateur afin de créer une présentation, dite interactive, qui sera affichée à l'écran. L'HTML est le sigle de « Hyper Text Markup Language », qui peut être traduit en français par « Langage hypertexte à marqueurs ».
| Présentation - hypertexte - mise en forme |
|
Lorsque vous créez un document de présentation, il comporte du texte, parfois des images figées ou animées, et aussi quelques fois du son, des musiques, et d'autres éléments.
L'intérêt des présentations HTML, c'est l'interactivité provenant de la notion d'hypertexte. En effet, un hypertexte est un document texte qui comporte des mots pouvant être activés afin de rejoindre un autre document. Les hypertextes les plus connus, sont les fichiers d'aide (HLP) qui existent depuis le DOS.
Un document, que ce soit un texte ou une présentation, offre une bonne lisibilité grâce à sa mise en forme, défini par la case (minuscule / majuscule), la police (taille, couleur, forme), l'alignement (gauche, centrer, droite, justifier), le sens (horizontale, verticale), les colonnes, les titres, et aussi des images ; en faite, tous les effets visuels.
| Balise, conteneur et marqueur |
|
Pour définir une mise en forme, l'HTML utilise des marqueurs que nous appellerons balises en français. — Nous retrouvons le terme « Marqueur » avec la lettre « M » dans le sigle HTML. — Dans les paragraphes suivant, nous utiliserons des balises HTML comme agrémentation ; ne vous affolez pas, nous reviendrons précisément sur chacune de ces balises dans la suites de cette initiation.
Les balises fermantes </p> et </tr> (entre autre) sont définir dans la norme de l'HTML 3 comme optionnels et offrants au développeur la possibilité de transformer des marqueurs en conteneur grâce à l'ajout de ces balises fermantes associées. Vous verrez que l'utilisation d'un marqueur <tr> dans un tableau génère automatiquement une nouvelle ligne même si la balise fermante </tr> n'est pas rencontrée. En effet, la balise </tr> est purement ignorée par le navigateur. Il n'en va pas tous à fait de même pour </p> qui ferme un paragraphe et permet ainsi de continuer avec un texte sans aucun formatage. Pour une souplesse dans les assistants de conception, les balises de fermeture associées à la plupart des marqueurs ont été créer comme </tr>, </td>, </li>...
Tous marqueur ou conteneur inconnu ou erroné sera ignoré lors de l'interprétation ; ainsi aucun message d'erreur ne sera affiché. Cela permet, entre autre, de pouvoir lire des documents dans des vieux navigateurs.
| Attribut |
|
L'HTML propose un grande nombre de balise pour effectuer nos mises en formes. Cependant, certaines d'entre elles nécessitent des informations supplémentaires, qui leurs sont fourni sous forme d'attributs, aussi appelé paramètres.
C'est le cas pour un marqueur comme <input> qui peut être initialisé avec une valeur :
Avec l'apparition des formulaires, puis des styles (HTML 4.0), certains attributs sont devenus commun à l'ensemble des balises de mise en formes, qui sont l'ensemble des balises pouvant être utilisées à l'intérieur du conteneur « body » :
Il existe aussi l'attribut « name » qui permet d'identifier les structures ; elles sont souvent utilisées dans les formulaires, et sont unique dans un même formulaire ; ainsi deux formulaires différent peuvent contenir des éléments de même nom. L'utilisation de l'attribut « name » fait appel aussi à des notions d'encapsulation alors que l'attribut « id » définit une référence de manière unique.
Une balise fermante n'utilise pas d'attribut ; il est inutile de lui en définir, car ils seront tous simplement ignorés.
| Fichier HTML / Éditeur / Navigateur |
|
Un fichier HTML est un fichier que vous pouvez ouvrir et éditer avec le « Bloc-Notes » de Windows. C'est un fichier au format texte sans mise en forme ni codage. Ainsi vous pouvez obtenir le source d'affichage du navigateur de toutes les pages que vous visualisées.
Nous commencerons tous d'abord cette initiation au développement HTML avec l'outils le plus simple : Bloc-Notes (notepad).
Afin de continuer, je vous propose de réduire toutes vos fenêtres, d'ouvrir le « Bloc-Notes » et un navigateur comme Internet Exploreur. Pour les utilisateur d'autre système d'exploitation que Windows, utilisez un éditeur de texte brute, que vous utiliseriez pour faire un script système (Langage de control entre autre).
Une fois que ces deux fenêtres sont ouvertes, faites un clique droits sur la barre des tâches et sélectionnez le menu contextuel « Mosaïque Vertical< ». Dans votre « Bloc-Notes », faites [ Fichier | Enregistrer sous... ] et créer un fichier « Doc1.html » sur votre bureau par exemple ou dans un répertoire spécifique. Dans votre navigateur (Internet Explorer), allez dans les menu [ Fichier | Ouvrir... ] et sélectionnez votre fichier « Doc1.html ».
Maintenant, tous modifications, « sauvegardé » avec [ Fichier | enregistrer ], que vous effectué dans le document sous votre éditeur « Bloc-Notes » pourra être visualisé en effectuant un rafraîchissement du navigateur (F5 pour Internet Explorer). >
Toutes la suite de ces initiation s'appuie sur le fait que vous savez ouvrir en édition un fichier HTML et que vous savez affiché le fichier dans un navigateur.
| Dernière mise à jour : dimanche 06 janvier 2008 |