 |
Mercredi 24 avril 2024 - 05:30 |
| Translate |
|
| Rubriques |
| Réseaux sociaux |
|
| Liste des jeux Amiga |
|
| Trucs et astuces |
|
| Glossaire |
|
| Galeries |
|
| Téléchargement |
|
| Liens |
|
| Partenaires |
|
| A Propos |
|
| Contact |
|
|
|
Le HTML (ou HyperText Markup Language) est, après une traduction littérale de l'anglais, un langage hypertexte à balises (ou marqueurs). Cela veut dire que l'on va gérer la façon dont un texte va s'afficher au sein du navigateur. Ainsi, on peut voir dans tout code source HTML en comparaison d'un éditeur de texte (comme Word pour le plus connu), des différences marquantes, comme des balises (ou marqueurs) dans le texte d'une page Web.
Les images, sons et autres contenus multimédias ne se retrouvent pas dans une page Web visualisée sous forme de code. Par contre, si on visualise dans un navigateur cette page Web, alors les images et les sons la composant seront là. La différence entre les deux réside dans le simple fait que les contenus multimédias comme les paramètres de formatage du document sont sous la forme de texte inclus au sein de ces balises précédemment citées.
Donc, HTML n'est pas un langage de programmation au sens classique du terme, mais est essentiellement un langage de formatage du texte, permettant l'habillage de pages Web qui sans celui-ci seraient bien dénuées d'intérêt. Les éléments du langage
Les spécifications HTML font la différence entre les types d'éléments et les balises (ou marqueurs). Exemple : l'élément page HTML et ses balises.
Les signes < et > délimitent la balise. Ici <html> est une balise d'ouverture et </html> une balise de fermeture. L'élément HTML est, quant à lui, encadré par une balise d'ouverture de l'élément HTML <html> et une balise de fermeture de l'élément HTML </html> contenant elle aussi le nom de l'élément et précédée par un slash (/) spécifiant la balise comme une balise de fermeture. La balise d'ouverture peut avoir divers attributs lui étant incorporé si nécessaire.
Attention, les éléments ou textes contenus entre ces deux balises sont considérés comme le contenu de l'élément HTML (ici le contenu de la page Web). On peut faire le même raisonnement avec tout type d'élément du langage, hormis le fait que certains éléments ne possèdent pas de contenu et ne possèdent pas de balises de fermeture, ce sont les balises orphelines (voir tableau 1 : les éléments).
Une autre notion importante de HTML est qu'il est basé sur la technique de l'hypertexte, cette technique permet de spécifier des URL au sein d'une même page ou entre des pages différentes. Si l'on prend la globalité des liens existant sur Internet on aurait un aperçu de ce qu'est le World Wide Web, une gigantesque toile sur laquelle des noeuds sont en fait des serveurs de contenus multimédias et les centaines de fils composants la toile les câbles reliant les machines au réseau.
Tableau 1 : les éléments
|
Exemple de balise sans attributs |
Exemple de balise avec attributs |
Exemple de balise orpheline |
Marqueur d'ouverture de l'élément contenant : |
<html> |
<p width=”150”> |
<br> |
Contenu de l'élément |
Code de la page Web |
Le texte affiché dans un paragraphe |
Pas de contenu |
Marqueur de fermeture de l'élément |
</html> |
</p>1 |
Pas de marqueur de fermeture |
1 : facultatif dans la pratique, mais obligatoire selon les spécifications.
Le futur de HTML
HTML n'est pas voué à disparaître soudainement, c'est un standard qui rayonne sur la toile et n'a pas fini d'être d'actualité, la version 4.01 est la plus aboutie et ne sera plus modifiée.
Par contre, HTML évolue vers XML et ce dernier étant plus indigeste pour les internautes novices en programmation, une nouvelle application émerge de cette recherche de passerelle entre le HTML et le XML, le bien nommé XHTML (HTML se retrouve englobé et modularisé dans XML par la spécification XHTML).
HTML et XHTML ont des bases communes, les différences spécifiques à XHTML seront précisées plus tard dans ce cours. Pour être simple, XHTML est une reformulation de HTML pour qu'il soit aux normes de XML. Mais le futur, HTML est en cours de formulation par le W3C et sera sans doute mis en place comme recommandation vers les années 2010. Alors "Back to the Future", nous étudierons le HTML 4.0.1 dans cette série d'articles, le HTML 5.0 sera détaillé dans un article ultérieur.
Lancement de l'éditeur
Pour lancer l'éditeur de texte
Sous AmigaOS 4, cliquez sur le raccourci Notepad (bloc-notes) du dock pour qu'il se lance. Le Notepad sera votre éditeur de page HTML, vous pourrez créer vos pages avec.
Sous AmigaOS 3.x ou MorphOS, vous pouvez utiliser Ed (inclus au système) ou des éditeurs de texte comme CygnusEd ou NoWInEd.
Maintenant lancez votre navigateur Web
Sous AmigaOS 4 : AWeb, IBrowse.
Sous MorphOS : AWeb, IBrowse, Voyager, Sputnik.
Sous AmigaOS 3.x : AWeb, Voyager, IBrowse.
Le démarrage de votre navigateur va provoquer la recherche d'une connexion à distance avec un FAI (Fournisseur d'Accès à Internet). Vous pouvez aussi travailler hors connexion, si vous êtes en cours de test et de débogage de vos sources HTML.
Astuce : si vous voulez vous éviter d'essayer de vous connecter à chaque démarrage sur la page d'accueil de votre FAI, il faut, dans le menu de votre navigateur, sélectionner une adresse en local (comme sur la page de démarrage d'AWeb sous AmigaOS). Ici dans l'image 1, on remarque que l'adresse locale est "file:///Work:Documentation/english.html".
Image 1
Pour éditer une page ".html", il suffit d'ouvrir le fichier et vous obtenez un texte ASCII lisible, avec des éléments plus mystérieux entourant ce texte ou selon le navigateur (ici AWeb) que vous utilisez sous AmigaOS, choisir "Edit Source" (pour modifier) ou View Source (pour le visualiser seulement) comme montré sur l'image 2.
Image 2
- Soit cliquer dessus et la page va s'ouvrir dans l'application à laquelle elle est liée (le navigateur Web).
- Soit aller dans le navigateur, choisir le menu "Fichier" et le sous-menu "Ouvrir" (puis parcourir le disque dur ou tout autre support pour trouver le fichier .html à visualiser).
- Soit glisser-déposer le fichier .html dans la fenêtre du navigateur.
- Les balises ont toujours le nom de l'élément comme premier mot de la balise et les mots supplémentaires sont les attributs de cet élément.
- Les balises sont de deux types : les balises d'ouverture (par exemple: <html>) et les balises de fermeture (</html>). Elles définissent et affectent une région du document HTML par la balise d'ouverture et continue jusqu'à la balise de fermeture correspondant à l'élément. <…> Une balise de fermeture ne contient jamais d'attributs. Seules les balises orphelines (ou éléments ouverts ou balises vides) ne possèdent qu'une balise d'ouverture sans balise de fermeture.
HTML 4.01 est un langage de formatage de documents diffusés par le biais du World Wide Web. Son créateur est Tim Berners-Lee, aussi inventeur du protocole http.
Attention le langage HTML n'est pas un langage de programmation au sens strict du terme, c'est un langage de description de page web. Il décrit la façon de mettre en forme le contenu de la page au sein d'un navigateur Web. Ce langage a été standardisé et cela le rend portable sur l'ensemble des systèmes le prenant en compte.
Le langage HTML octroie au créateur de pages Web diverses possibilités :
- De mise en page par la présence de...
- Séparateurs
- Divisions
- Paragraphes
- Règles
- De mise en forme par l'existence de...
- Titres
- Caractères en gras, en italique, souligné, biffé
- De navigation sur une même page, un même site, vers d'autres pages d'autres sites, grâce...
- Aux ancres
- Aux liens internes, externes, vers d'autres protocoles
- D'afficher des images et de les rendre interactives
- Images statiques
- Images cliquables
- Images liens, mappés
- De présentation sous forme de listes, de tableaux
- Tableaux pour la présentation de résultats
- Tableaux pour l'affichage d'une page
- Différents types de listes
- De séparation de la page en plusieurs cadres distincts
- Les cadres et la hiérarchie de l'affichage des pages d'un site
- D'interaction avec les visiteurs de votre site par le biais de formulaires
- Les différents types de champs utiles dans un cadre
- Ajout d'interaction avec l'utilisateur par le biais de champ de saisie
- Validation d'envoi d'un formulaire par un champ particulier
- Les différentes méthodes de récupération d'un formulaire HTML
|
|