Médiaforma

Squelette minimal d’une page HTML

Print Friendly

Voici la structure minimale d’une page HTML 5 :

<!DOCTYPE html>
<html>
     <head>
     </head>
     <body>
     </body>
</html>

La balise <!DOCTYPE> doit toujours apparaître en premier. Elle indique au navigateur les règles d’écriture utilisées dans le code. Cette première ligne indique que la version 5 du langage HTML sera utilisée. Dans les versions précédentes, la balise <!DOCTYPE> était bien plus complexe. Mais cela fait partie du passé, et vous utiliserez uniquement cette version simplifiée.

La balise <html> matérialise le début du document HTML, et la balise </html> la fin de ce document.

Les balises <head> et </head> délimitent l’en-tête du document. Vous verrez ce qui peut être placé entre ces deux balises dans une autre rubrique.

Enfin, les balises <body> et </body> délimitent le corps du document. Tout ce qui est écrit entre ces deux balises apparaîtra dans le navigateur Web.

Lancez la commande Enregistrer dans le menu Fichier, sélectionnez Hyper Text Markup Language dans la liste Type, donnez le nom squelette à la page, choisissez le dossier de stockage du document et cliquez sur Enregistrer.

Déroulez le menu Exécution et lancez la commande :

  • Launch in IE pour ouvrir ce document dans Internet Explorer ;
  • Launch in Chrome pour ouvrir ce document dans Google Chrome ;
  • Launch in Firefox pour ouvrir ce document dans Mozilla Firefox ;
  • Launch in Safari pour ouvrir ce document dans Safari.

Bien entendu, ces commandes supposent que les navigateurs correspondants sont installés sur votre ordinateur. Dans le cas contraire, elles n’auront aucun effet.

Comme vous pouvez le voir, rien ne s’affiche.

Entrez du texte entre les balises <body> et </body>. Ici par exemple, nous entrons le texte « Bonjour« . Sauvegardez le document avec la commande Enregistrer dans le menu Fichier ou avec le raccourci clavier Ctrl+S.

Remarque

Si vous n’avez pas l’habitude des raccourcis clavier, sachez le raccourci Ctrl+S est obtenu en maintenant enfoncée la touche Ctrl, en appuyant puis en relâchant la touche S, puis en relâchant la touche Ctrl. Cela a l’air compliqué, mais une fois que le mécanisme est compris, il est difficile de s’en passer !

Lancez à nouveau la commande Launch in IE dans le menu Exécuter. Cette fois-ci, le texte « Bonjour » est affiché dans le navigateur.

Bravo, vous venez de créer votre premier document HTML5 !

Vous avez aimé cet article ? Partagez-le avec vos réseaux...
 
Comments

Je pense que le squelette comporte une erreur: la seconde balise ne ferme pas la première cela devrait être une balise , non?

Bonjour Akuma,

C’est exact, il manque un « / » à la deuxième balise head.
Je corrige tout de suite.

Ce code ouvre une page mais pas le contenu.
Je ne sais pas quoi faire.
Aidez moi svp…

Bonjour,

Le squelette minimal n’affiche rien. Il s’agit simplement de la structure des pages HTML5.
Pour afficher quelque chose, vous devez insérer des balises entre body et /body.

La balise est obligatoire entre les balises , même avec html5 !

la balise title est obligatoire entre les balises head, même avec html5 !

Leave a Reply