Le HTML, qui est l’acronyme de HyperText Markup Language, est le langage de balisage standard utilisé pour la création de pages web. Il permet de structurer le contenu sur les sites web, y compris le texte, les images et autres éléments multimédias. Un navigateur web, comme Chrome, Firefox ou Safari, lit le code HTML pour afficher les pages web aux utilisateurs. HTML est principalement composé de balises, utilisées pour définir les éléments de la page. Chaque balise a une fonction spécifique et une manière spécifique d’afficher le contenu.
L’histoire et les versions du HTML
La genèse du HTML remonte à 1990, lorsque Tim Berners-Lee, un physicien britannique travaillant au sein du CERN – l’Organisation européenne pour la recherche nucléaire – a conçu ce langage de balisage. Cette innovation technologique n’avait toutefois pas encore atteint le grand public, ni le statut de standard officiel.
En 1995, cinq ans après sa création initiale, le HTML 2.0 a été présenté au monde et cette première version officielle a posé les jalons pour le développement futur du langage et a commencé à définir le format de ce qui allait devenir la pierre angulaire du Web tel que nous le connaissons aujourd’hui.
Deux ans plus tard, en 1997, la version HTML 3.2 a fait son apparition. HTML 3.2 a introduit des éléments de style plus avancés, offrant aux développeurs une plus grande flexibilité dans la conception des sites web. La même année, une autre version significative du HTML a été publiée, le HTML 4.0. Cette version marquante a ouvert la voie à une plus grande intégration avec les feuilles de style en cascade (CSS), facilitant la création de designs plus élaborés, et a renforcé le support pour le contenu multimédia, transformant ainsi le Web en une plateforme plus interactive et dynamique.
En 2000, une version révisée du HTML 4.0, connue sous le nom de HTML 4.01, a été introduite. Cette version mineure avait pour but de corriger divers bugs et problèmes découverts dans la version précédente. Malgré son statut de mise à jour « mineure », le HTML 4.01 a joué un rôle déterminant dans le développement du Web, restant la version standard du HTML pendant presque une décennie.
C’est en 2008 que le développement de ce qui allait devenir le HTML5 a commencé. Sous l’égide du consortium World Wide Web (W3C) et du Web Hypertext Application Technology Working Group (WHATWG), le HTML5 a cherché à répondre aux besoins des applications web modernes. Après six ans de développement, le HTML5 a été officiellement lancé en octobre 2014, introduisant une multitude de nouvelles fonctionnalités, y compris le support intégré pour le contenu vidéo et audio, éliminant ainsi la nécessité de plugins tiers. De plus, avec l’introduction de Canvas et SVG, le HTML5 a offert de meilleures possibilités pour l’interaction et le dessin, ouvrant la voie à des expériences web encore plus riches et pour les utilisateurs.
Un exemple de contenu HTML
Un document HTML de base ressemble à ceci :
<!DOCTYPE html>
<html>
<head>
<title>Ma première page HTML</title>
</head>
<body>
<h1>Bonjour le monde</h1>
<p>Bienvenue sur ma première page HTML.</p>
</body>
</html>
Dans le document ci-dessus, <!DOCTYPE html> est une déclaration qui indique au navigateur que le document est une page HTML5. Les balises <html>, <head> et <body> sont des balises de structure de base pour toute page HTML.
<title> définit le titre de la page, qui apparaît dans la barre de titre du navigateur. Les balises <h1> et <p> sont des balises de contenu, utilisées pour définir les en-têtes et les paragraphes respectivement.
Bien entendu, il existe bien d’autres utilisations du HTML. Voici quelques exemples d’usages :
1. Intégration d’une image
<img src="mon-image.jpg" alt="Description de l'image" width="300" height="200">
Cette balise affiche une image à partir du fichier mon-image.jpg, avec une description alternative et une taille spécifiée en pixels.
2. Création d’un lien hypertexte
Pour faire un lien vers une url ou un nom de domaine :
<a href= »https://www.example.com »>Visitez mon site</a>
Ce code crée un lien vers « www.example.com » avec le texte « Visitez mon site ».
3. Utilisation de listes
Sur notre site et sur d’autres un peu partout sur Internet, vous trouverez des listes dans les documents :
a. Liste non ordonnée
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
Cette balise crée une liste à puces.
b. Liste ordonnée
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
4. Utilisation de formulaires
Les formulaires peuvent prendre ce type de format :
<form action="/submit.php" method="post">
<label for="nom">Nom:</label>
<input type="text" id="nom" name="nom" required>
<button type="submit">Envoyer</button>
</form>
Cet exemple montre comment créer un formulaire simple de soumission avec un champ de texte pour le nom.
5. Intégration de vidéo avec HTML5
Pour la vidéo,, si elle n’est pas encapsulée dans un iframe de Youtube mais hébergée sur le site Internet, cela peut ressembler à ceci :
<video width="400" controls>
<source src="video.mp4" type="video/mp4">
Votre navigateur ne supporte pas la vidéo.
</video>
Ce code permet d’intégrer une vidéo et offre également des contrôles de lecture.
Quels langages sont utilisés le plus couramment avec HTML 5 ?
AInsi que nous l’avons vu, la dernière version de HTML est la cinq. Mais avec quoi cela se combine-t-il ? Voici quelques autres technologies utilisées en complément pour créer des expériences web interactives et dynamiques :
- CSS (Cascading Style Sheets) :
- Utilisation : CSS est utilisé pour styliser les pages web, y compris la mise en page, les couleurs, les polices, et les transitions ;
- Version actuelle : CSS3, qui fonctionne particulièrement bien avec HTML5 et offre des fonctionnalités telles que les animations, les transitions, et la conception réactive ;
- JavaScript :
- Utilisation du JS : JavaScript permet d’ajouter de l’interactivité et de la dynamique aux pages web. Cela inclut des choses comme des animations, des validations de formulaires, et la communication avec les serveurs et c’est de nos jours extrêmement présent sur le Web ;
- Frameworks et bibliothèques populaires : jQuery, Angular, React, et Vue.js sont quelques-uns des nombreux outils qui facilitent le développement avec JavaScript ;
- SVG (Scalable Vector Graphics) :
- Utilisation de SVG : C’est un langage XML pour décrire des graphiques en deux dimensions, à la fois statiques et dynamiques. Il est souvent utilisé avec HTML5 pour créer des graphiques et des animations vectorielles ;
- WebGL :
- Utilisation : WebGL est une API JavaScript pour le rendu de graphiques 3D et 2D sans l’utilisation de plug-ins. Il permet de créer des expériences visuelles complexes et interactives directement dans un navigateur ;
- JSON (JavaScript Object Notation) :
- Utilisation du JSON : Il est souvent utilisé avec HTML5 et JavaScript pour échanger des données entre le serveur et le client. Il est léger et facile à utiliser, ce qui le rend idéal pour les applications web modernes ;
- AJAX (Asynchronous JavaScript and XML) :
- Utilisation : AJAX permet de charger dynamiquement du contenu sans recharger toute la page. Il est souvent utilisé en combinaison avec HTML5 pour créer des expériences web plus fluides et réactives.
En combinant donc le HTML avec ces langages et technologies, les développeurs peuvent ainsi créer des sites web et des applications web riches et interactifs qui fonctionnent de manière cohérente sur une grande variété de dispositifs et de navigateurs.
R.C.
