Cours – 12 Septembre 2025
Récapitulatif de la session précédente
Retour sur les notions vues précédemment : accessibilité numérique, structure HTML et importance de la sémantique dans le code.
Référencement – Introduction
Le référencement est un ensemble de techniques permettant d’améliorer la visibilité d’un site sur les moteurs de recherche.
Principe du système d’enchères
Les moteurs de recherche utilisent un système d’enchères basé sur le prix au clic (PPC). Les annonceurs paient lorsqu’un utilisateur clique sur leur lien sponsorisé.
Le SEO (Search Engine Optimization), ou référencement naturel, consiste à aider les moteurs de recherche à interpréter le contenu d’un site et à aider les internautes à le trouver.
Différence entre SEO et SEA
Ces deux approches sont complémentaires mais reposent sur des stratégies distinctes :
Critère | SEO (Search Engine Optimization) | SEA (Search Engine Advertising) |
---|---|---|
Type de trafic | Organique (gratuit, long terme) | Payant (publicités, court terme) |
Outils | Optimisation du code, contenu, mots-clés | Campagnes Google Ads, Microsoft Ads… |
Objectif | Améliorer la visibilité naturelle | Attirer immédiatement du trafic ciblé |
Accessibilité et outils d’assistance
Les outils d’assistance permettent de rendre le web accessible aux personnes en situation de handicap.
- NVDA : gratuit et open-source
- JAWS : logiciel payant (~2000€)
“Essentiel pour certains, utile pour tous !”
Reprise du cours : Contenu HTML
Les textes et paragraphes sont placés dans la balise <p>
.
Lorem ipsum est un texte factice utilisé pour tester la mise en page sans ajouter de contenu réel.
Balises de mise en forme
<br>
→ saut de ligne (balise orpheline)<strong>
→ texte important (gras sémantique)<em>
→ texte mis en évidence (italique sémantique)<mark>
→ texte surligné
<p>Ceci est un autre paragraphe avec <strong>du texte important</strong> et <em>un mot en italique</em>.</p>
<p>On peut aussi <mark>surligner</mark> une partie du texte.</p>
Création de liens – Base du web
La balise <a>
permet de créer un lien hypertexte.
- href : destination du lien (URL ou identifiant de section)
- target : ouverture dans un nouvel onglet (
_blank
) - id : ancre interne pour navigation dans la page
<a href="#section2">Aller à la section 2</a>
Balises de tableau
Les tableaux se construisent avec les balises suivantes :
<table>
→ structure du tableau<tr>
→ ligne du tableau<td>
→ cellule de données
<tr><td>Nom</td><td>Prénom</td></tr>
<tr><td>Dupont</td><td>Marie</td></tr>
</table>
On découvre également la fusion de cellules avec les attributs colspan
et rowspan
.