Coding PandaCoding Panda - Joyeux NoelCoder c'est cool !Coder c'est cool !

HTML5 par Coding Panda

Une petite intro ...

Maitre HTML

HyperText Markup Language 5 ou plus communément dénommé HTML 5, est la dernière version de langage de structure de pages web. Il a été développé par W3C (World Wide Web Consortium) qui a pour but d’uniformiser et standardiser les pages web afin d’optimiser leur lecture sur différents navigateurs.

Pour vous familiariser avec ce langage, Coding Panda vous met à disposition des explications sur les nouveautés développées :

Le doctype

Le doctype permet aux navigateurs d’interpréter le type de langage dans lequel le fichier a été codé. Il faut donc écrire <!DOCTYPE html> sur la première ligne du code pour du codage HTML5. Le navigateur Internet Explorer n’étant optimisé comme les autres navigateurs, il y a un conflit si l’on ajoute un 5 dans le doctype, c’est pourquoi on privilégiera toujours l’écriture simplifiée, qui est d’ailleurs facile à retenir !

Les nouvelles balises pour structurer une page :

  • <header> : cette balise rassemble les données et le contenu servant d’en-tête. Il ne peut pas contenir d’autres balises telles que <header>, <footer> ou <section>. Généralement on utilise la balise header pour l’en-tête général du site ainsi que pour les sections.
  • <nav> : comme son nom complet l’indique : navigation, il s’agit d’une balise unique dans laquelle le menu de navigation se trouve. Il rassemble les liens vers toutes les pages du site pour constituer un menu.
  • <section> : La balise section rassemble tous les éléments ayant un lien entre eux. Cette balise est sémantique, c’est-à-dire qu’elle a du sens pour le « robot » qui l’interprète en la considérant comme une balise regroupant des informations liées. Contrairement à une div qui rassemble, certes des éléments, mais n’a aucun sens pour le « robot » qui l’interprète. Une section peut contenir une balise <header> qui lui servira de « titre » et des balises <article>.
  • <article> : un article permet de rassembler du contenu indépendant, qui se suffit à lui-même. En d’autres termes, un article englobe du contenus qui retiré ou déplacé de la page n’affectera pas la bonne compréhension de cette même page.
  • <aside> : c’est une balise qui sert de complément ayant un lien avec le contenu central de la page et de l’information qui la compose. C’est une balise qui n’est pas indispensable.
  • <footer> : cette balise est la conclusion d’un article, d’une section voire même d’une page entière (pied de page). Il ne peut contenir d’autres balises structurelles. Généralement, elle contient des liens et des informations tels que le sitemap ou les mentions légales.

super structure HTML5