Utiliser un squelette HTML

Un squelette est le cadre de soutien d'un organisme.

Il est généralement fait de quelque chose de dur, pour protéger un corps plus vulnérable.

Encyclopédie

Chaque développeur Web devrait avoir un squelette HTML.

Il doit être conservé dans sa poche et utilisé pour chaque travail :

Exemple

<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<title>Page Title</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="">
<style>
</style>
<script src=""></script>
<body>

<img src="img_la.jpg" alt="LA" style="width:100%">

<div class="">
 <h1>This is a Heading</h1>
 <p>This is a paragraph.</p>
 <p>This is another paragraph.</p>
</div>

</body>
</html>

Cliquez sur le bouton "Essayez-le vous-même" pour voir comment cela fonctionne !

Essayez de remplacer le texte "Ceci est un titre" par "Ceci est mon mariage".

Est-ce que tu l'as fait?

Toutes nos félicitations! Vous savez maintenant comment éditer le HTML.


Squelette HTML expliqué

Le DOCTYPE doit être présent. Il informe le navigateur qu'il s'agit d'un document HTML :

<!DOCTYPE html>

Une balise html de début et une balise html de fin définissent le début et la fin d'un document HTML.

La langue est l'anglais :

<html lang="en">

</html>

Une balise meta charset définit le jeu de caractères (UTF-8) :

La page HTML ne contient pas de balises d'en-tête. Les balises d'en-tête ne sont pas nécessaires en HTML.

En HTML, tout ce qui précède la balise body est considéré comme faisant partie de la tête.

<meta charset="UTF-8">

La norme HTML requiert un titre de page approprié :

<title>Page Title</title>

Une balise meta viewport rend la page belle sur toutes les tailles d'écran (ordinateur portable, mobile) :

<meta name="viewport" content="width=device-width,initial-scale=1">

La balise de lien renvoie à une feuille de style :

<link rel="stylesheet" href="name">

La balise de début et la balise de fin entourent le futur style CSS :

<style>
</style>

La balise de script renvoie à un script :

<script src="name"></script>

La balise de début et la balise de fin entourent le corps visible du document HTML :

<body>
</body>

Les balises d'image définissent les images HTML :

<img src="img_la.jpg" alt="LA" style="width:100%">

Prenez l'habitude de "emballer" les sections HTML dans des éléments div.

Préparez-vous à donner à chaque section un nom de classe :

<div class="class name">
</div>

Les balises d'en-tête définissent les en-têtes HTML :

<h1>This is a Heading</h1>

Les balises de paragraphe définissent les paragraphes HTML :

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>