web design

NUMÉRIQUE + DE 2 ANS

Publiée par :

Le 11/09/2020 à 09h07 441 vues

Question d'origine :

Bonjour, je me permets de vous contacter car je suis enseignant et je souhaite m'informer sur la mise en page du web. Je constate avec l'évolution du HTML5 que les balises permettent désormais de mettre en page les sites web selon une norme implicite (header-main-footer pour faire court). Je cherche donc à connaître l'origine de la réflexion de cette mise en page, si elle s'inspire des unes de journaux par exemple. Je vous remercie d'avance.

Réponse du Guichet

bml_ecm - Département : Espace numérique

Le 15/09/2020 à 14h56

Réponse de l'Espace numérique

Une page Web, affichée dans un navigateur Web, constitue la base de tout site web. Cette page se crée actuellement à partir de deux langages fondateurs, le HTML5 (HyperText Markup Language) et le CCS3 (Cascading Style Sheet) qui permet une mise en forme de la page Web.

Petit historique
Tim Berners-Lee travaille dès 1991 sur les premières versions du HTML.
La première version de HTML sortira en juin 1993. Les versions s’enchainent ensuite pour arriver au HTML4 en décembre 1999. Mais comme le langage HTML possède des limitations intrinsèques (par exemple, pas d’éléments sémantiques), le W3C (Word Wide Web consortium), publie en 1998 la recommandation d’un nouveau langage : le XML (eXtensible Markup Language), qui doit permettre de créer des éléments très structurés et donc faciliter les échanges de données structurées via le Web. Ainsi, afin de permettre au HTML (qui a une syntaxe permissive) d’être compatible avec le XML, le W3C reformule la syntaxe du HTML, ce qui mène à la création du XHTML (eXtensible HyperText Markup Language), dont la première recommandation sort en janvier 2000. Cependant, ces recommandations de syntaxe très strictes font que le langage XHTML est déconnecté de la réalité du monde des développeurs Web. De ce fait, le W3C ferme son groupe de travail.

Le groupe du WHATWG
Devant le constat d’échec sur l’évolution du HTML par le W3C, un groupe extérieur se forme en 2004. Le WHATWG (Web Hypertext Application Technology Working Group) regroupe différents développeurs de navigateurs web et a pour but le développement de nouvelles technologies destinées à faciliter l'écriture et le déploiement d'applications à travers le Web. C'est ce dernier groupe qui a posé les bases du HTML 5 ou HTML Living Standard HTML Living Standard. Le WHATWG propose ainsi une version « vivante » du HTML et le W3C effectue la normalisation de ce langage.

L’avènement du HTML5
L’HTML5 est maintenant un langage de balisage hypertexte standardisé pour le Web, qui a comme objectif d’être compatible avec les pages web existantes. HTML5 correspond à la cinquième révision du format de création de sites web et de développement d’applications web. Cette version a été lancée en 2014 pour pouvoir être adaptée notamment pour les terminaux mobiles.

Les nouveaux éléments de structure d'une page HTML5
Cette version de HTML5 apporte de nouveaux éléments et de nouveaux attributs par rapport à la version précédente.

L’élément main
Cet élément HTML permet de cibler le contenu principal de la page : il représente le contenu majoritaire du <body> du document.

L’élément Header
Il permet d’insérer une zone d’affichage pour les en têtes, pour une page (en haut de page, avec slogan, logo…) ou pour une zone d’affichage (au niveau des contenus).

L’élément Footer :
De même que pour les en-têtes, ces pieds de page peuvent être définis pour une page ou pour une autre zone d’affichage ou un article. Il s’agit donc plutôt du « pied d’une zone d’affichage ».
Le W3C précise ainsi que son « ancêtre » le plus proche correspond à une section.

L’élément Article
Cet élément permet d’insérer un contenu autonome.

Pour aller plus loin

HTML5 et CSS3 : maîtrisez les standards de la création de sites web [Livre] / Christophe Aubry

HTML5 et CSS3 : les nouveaux standards du web [Livre] / Christophe Aubry

Premiers pas en CSS3 & HTML 5 [Livre] / Editions Eyrolles

et Culture numérique [Livre] / Dominique Cardon

Vous trouverez aussi sur le site de mozilla.org les références des éléments HTML.

Vous pouvez consulter cette page qui explique la structure globale d'un document HTML5.

Ou encore visiter le site Openclassroom