Pages web : structure et style — Informatique, 7–10
Une page web contient du contenu et des instructions sur son apparence. HTML lui donne sa structure ; CSS change son aspect.
Idée
Imagine une page web comme un petit document conçu pour un navigateur. HTML indique ce qu’est chaque partie : un titre, un paragraphe, une image ou un lien. CSS indique l’apparence de ces parties : couleur, taille et espace, par exemple. Les deux rôles travaillent ensemble, mais ils sont différents.
Pourquoi cela existe
Une page a besoin d’une structure claire pour qu’un navigateur, un lecteur d’écran et une personne comprennent ses parties. Il faut aussi pouvoir changer son apparence sans réécrire chaque phrase. Séparer structure et style rend les pages plus faciles à modifier, partager et adapter aux différents écrans.
Exemple guidé
Supposons que tu veuilles créer une page sur ton chat. Étape 1 : place les mots « Mon chat Luna » dans un titre HTML. Étape 2 : ajoute un paragraphe : « Luna dort au soleil. » Étape 3 : ajoute une image et un lien. Étape 4 : utilise CSS pour rendre le titre bleu foncé et agrandir le paragraphe. Le contenu reste le même ; seule sa présentation change.
Un piège courant
Une erreur compréhensible consiste à utiliser beaucoup d’espaces ou de lignes vides pour pousser un élément au bon endroit. Cela peut sembler correct sur ton écran, mais un autre écran peut avoir une largeur différente et tout se déplacera. Les règles de mise en page CSS sont meilleures, car elles décrivent le lien entre les éléments au lieu de cacher le problème avec des espaces.
Hors de l’école
Chaque fois que tu lis une page d’actualités, une recette, une boutique ou le site d’un club, un navigateur organise du contenu structuré et lui applique un style adapté à ton écran. Tu peux utiliser les mêmes idées pour créer une page sur un loisir, un projet de classe ou un événement local. Une bonne structure aide aussi les personnes qui utilisent des technologies d’assistance.
Continue d'explorer
Autres langues
Chargement de MyLeoNes™…