Nous avons appris à lire, à écrire et à compter, ce n’est plus suffisant. Il faut aujourd’hui comprendre les codes informatiques qui prennent le contrôle de nos vies.
Presque toutes les pages que l’on regarde sur internet sont faites avec le code HTML. C’est un code très simple qui consiste à entourer un mot de balises pour le marquer. Pour indiquer un titre de niveau 1 on marque <h1>Titre</h1>, pour un paragraphe c’est <p>paragraphe</p>.
HyperText Markup Language
Le code HTML a évolué depuis sa création (version 5) mais la base reste la même et elle est très simple. Le système est géré par le W3C qui définit les standards.
Une page web est comme un document texte, il y a un titre, des sous-titres, des paragraphes, des listes…
<h1>Titre</h1>
<p>Paragraphe incluant du texte et une liste. J’ouvre la balise de la liste et je la ferme à la fin: ul=unordered list
<ul>
<li>élément de la liste ou list item</li>
<li>autre élément</li>
</ul>
Je suis toujours dans le paragraphe et je dois fermer sa balise.</p>
Il y a des balises pour insérer des liens, des images, créer des colonnes, des boîtes, tout ce qui permet de construire l’interface du site,
Sémantique des balises
On marque donc le texte avec des balises ayant chacune une signification précise qui pourra être interprétée par les navigateurs et les systèmes automatiques (lecteurs d’écran, robots d’indexation et autres). La sémantique des balises signifie que chaque balise a sa signification et doit être utilisée en conséquence. Par exemple la balise <strong> marque un texte important; en général ce texte sera mis en gras mais ce n’est pas le but de la balise. Pour la mise en page on utilise un autre code, le CSS, qui définira la mise en page de chaque balise. Le titre <h1> de la page pourra être tout petit ou très gros, sémantiquement ce sera toujours le titre principal.
Le fichier HTML
Le fichier HTML que notre navigateur affiche se divise en 2 parties, pour l’afficher il faut taper Ctrl+U en regardant une page web. Voici très sommairement en quoi consiste un fichier HTML.
Head
La première partie <head> contient les métadonnées: version HTML utilisée, encodage du texte, langue du site, <title> de la page, <description> de la page, lien vers le fichier de mise en page CSS, lien vers les fichiers Javascript, données pour les réseaux sociaux, etc…
Pour que la page soit indexée dans les moteurs de recherche le webmaster doit insérer ses mots-clefs dans les balises <title> et <description> qui doivent être différentes pour chaque page du site.
Body
Une page web doit respecter une hiérarchie. Elle commence avec un titre <h1> reprenant les mots-clefs et se développe avec des sous-titres et des paragraphes. La structure de la page est comme une poupée russe: un contenant principal comprend l’en-tête, le corps et le pied de la page. Le corps de la page peut comprendre une colonne pour les menus et plusieurs contenants chacun avec son texte et sa mise en page.
Pour plus de souplesse on définit des classes de balises. Un paragraphe du texte principal ou un paragraphe dans un encart pourront ainsi recevoir une mise en page différente. L’ajout d’une classe à la balise <p class= »encart »> me servira lors de la mise en page à définir les propriétés de cet encart (bordure, couleur du texte et du fond, taille de police, etc…).
La guerre des navigateurs
Les standards du W3C permettent de construire des sites qui vont s’afficher à peu près de la même manière selon les navigateurs. Plusieurs compagnies ont tenté d’imposer leurs standards, Microsoft par exemple qui détenait plus de 90% de la part des navigateurs à un moment. Les webmasters n’avaient pas le choix de rendre leur sites conformes à Internet Explorer mais le code n’étant pas standards il fallait avoir une autre version standard du site pour les navigateurs conformes, très compliqué à gérer.
Mais comme les logiciels de Microsoft n’étaient pas sécuritaires le mouvement du logiciel libre a créé Firefox un logiciel sécuritaire et plus performant. Son système d’extensions modulaires a été copié par tous les systèmes qui ont suivi. Le noyau du logiciel est léger et sécuritaire et on lui ajoute les extensions dont on a vraiment besoin..
Le navigateur le plus utilisé est aujourd’hui Chrome de Google mais les experts en sécurité recommandent Firefox.