HTML est l’abréviation de Hyper Text Markup Language.
Tous les sites Web utilisent le langage HTML, même celui-ci. Il s’agit d’un élément fondamental de la boîte à outils de tout développeur Web.
Le HTML fournit le contenu qui donne aux pages Web leur structure. En utilisant des éléments et des balises, vous pouvez ajouter du texte, des images, des vidéos, des formulaires et bien plus encore.
Apprendre les bases du HTML est une première étape importante dans votre parcours de développement web et une compétence essentielle pour les développeurs frontaux et dorsaux. Le langage HTML se comporte comme les éléments constitutifs d’un site Web.
Par exemple, si vous construisez un studio :
- – Vous créez la structure d’une pièce par les briques.
- – Ensuite, vous faites la peinture.
- – Puis vous ajoutez le fonctionnement de la pièce comme une ampoule.
Ainsi, le HTML est comme les briques, le CSS est comme la peinture et le JavaScript est comme l’ajout d’une ampoule.
Coder signifie écrire du code, bien évidemment.
Programmer signifie trouver un moyen de résoudre un problème, c’est-à-dire un algorithme, et l’écrire pour que l’ordinateur puisse résoudre le problème en entrant des données et en sortant des informations.
Cela signifie que le HTML est un langage de balisage. Un langage de balisage consiste en des règles sur la façon dont un document doit être formé et affiché. Contrairement aux langages de programmation, les langages de balisage ne peuvent pas être utilisés pour écrire des algorithmes (des solutions à des problèmes). Ce sont simplement des ensembles de règles sur la façon dont le texte doit être affiché.
Un code, ou plus précisément un code source, est un ensemble de règles écrites sous forme de texte lisible par l’homme et destiné à être exécuté par un ordinateur.
Par conséquent, écrire du HTML est du codage, parce que vous écrivez du code, mais ce n’est pas de la programmation, parce que vous n’écrivez pas un algorithme, des étapes qui mènent à la solution d’un problème.
Utilisation d’exemples de code en HTML
Vous pouvez inclure des exemples de code dans votre HTML en utilisant la balise <code>. Cela permet d’utiliser automatiquement une police de caractères monospace et d’étiqueter sémantiquement notre code comme étant ce qu’il est.
Le HTML
Supposons que nous voulions afficher ce code CSS sur notre page :
p { color: red; }
code { background-color: #eee; }Voici un exemple du HTML que nous avons mis dans notre page pour l’afficher :
<pre>
<code>
p { color: red; }
body { background-color: #eee; }
</code>
</pre>Nous utilisons la balise <code> pour indiquer que notre texte est en fait du code. Nous utilisons la balise <pre> parce que dans ce cas, nous voulons en fait que le navigateur affiche l’espace blanc que nous montrons. Cela permet au code d’être correctement espacé.
Stylisation du bloc de code
Afin d’afficher le code correctement et de manière facile à lire, nous devons styliser le bloc <code>. Cette page utilise les styles CSS suivants pour afficher le bloc de code :
pre code {
background-color : #eee ;
border : 1px solid #999 ;
display : block ;
padding : 20px ;
}
Vous pouvez donner à vos blocs de code le style que vous souhaitez. La propriété importante à retenir ici est le display : block ;.
Le <code> est en fait un élément HTML en ligne. Pour qu’il s’affiche dans un gentil bloc (comme sur cette page), nous utilisons cette propriété CSS pour lui indiquer de se comporter comme un bloc.
Si vous voulez utiliser un exemple de code qui inclut du HTML, vous devez utiliser des entités HTML pour vos < et >. Si vous ne le faites pas, il sera interprété comme du vrai HTML.