Rechercher

DOM, la vie secrète de ton navigateur Internet

Ton navigateur est une interface qui t’ouvre en grand l’accès au monde d’internet. Elle se matérialise par les pages web des sites que tu visites. Et dans les profondeurs réside un composant essentiel de la représentation de ta page, le DOM.

C’est quoi le DOM ?

Le DOM html signifie Document Object Model, c’est une « charpente pour soutenir » ta page web dans le navigateur. Le HTML est traduit en objets du DOM dans la mémoire de votre ordinateur. Chaque représentation html (balise) devient un objet manipulable par les “langages du web” comme par exemple Javascript.

L’organisme W3C, le World Wide Web Consortium, est chargé de sa standardisation et, depuis « HTML 5 », le DOM est incorporé dans la norme HTML.

A quoi ça sert exactement le DOM ?

Le Dom sert à représenter une page web dans le navigateur, à la rendre dynamique, à “articuler” les gabarits web, à corriger les erreurs HTML pour obtenir une page valide, à modifier le contenu d’une page après le chargement dans le navigateur, de même qu’à tout instant, le rendre dynamique. Tout cela ? Oui tout cela et même plus car le DOM répond aussi à des évènements pour interagir avec le JavaScript.

Et, last but not least, le DOM est un composant essentiel du SEO, le Search Engine Optimization, l’optimisation du référencement naturel. Tu l’as compris, le DOM représente la face cachée de l’iceberg. Et Googlebot, le robot d’exploration de Google, l’utilise abondamment pour la recherche dans les pages.

Au fait, ça marche comment le DOM ?

Après avoir établi la communication Internet avec le serveur web, le navigateur reçoit la page demandée. Un mécanisme interne transforme la page html reçue en objets du DOM, qui, à son tour, est responsable de l’affichage de la page dans votre navigateur (le painting). 

Si le DOM est uniquement visible de l’intérieur pour les développeurs, il est essentiel pour la représentation visuelle de la page pour tous les visiteurs.

Et pour aller plus loin ?

Tu es curieux ? Tu veux voir le DOM ? Rien de plus simple avec les outils développeur de la plupart de vos navigateurs (Chrome, Safari, Firefox, …). Et tu vas être surpris, car la plupart du temps ça ressemble exactement à du HTML. 

Si tu es intéressé par le DOM, je te conseille cette excellente initiation d’openclassrooms https://openclassrooms.com/fr/courses/3306901-creez-des-pages-web-interactives-avec-javascript/3501871-decouvrez-le-dom

Ah oui…, Il y a aussi le Shadow-DOM, le « DOM fantôme », mais ça c’est une autre histoire !

Photo by Markus Spiske on Unsplash

Logo Discord

Envie de converser en mode Cozy Web avec toute la rédac’room et la formidable communauté bienveillante de plus de 500 personnes qui ont rejoint #BonjourPPC Le Digital pour tous ?
On vous accueille ici avec grand plaisir.

#UpToDate | Revue
#UpToDate

#UpToDate

Par PPC

Si tu as raté le fil de cette semaine et que tu cherches à prendre un coup d’avance sur les prochaines …

79 éditions
Proposé par
Patrick Massiot

Geek en veille !... Digitagile

Joindre la discussion

A lire dans cette thématique

La Playlist du DJ

La newsletter