Vous trouverez dans
cette page des exemples de sites
sur lesquelles nous avons travaillé avec certains stagiaires
!
L'animation d’introduction codée dans une balise DIV juste après la balise BODY (corps du document) est positionnée juste à gauche du premier titre et juste au dessus du deuxième titre grâce aux paramètres de positionnement de sa balise DIV.
Ces paramètres sont donc des règles de style, elles mêmes définies dans la feuille de style.
Tous les paramètres de style sont donc transmis au document visualisé via un lien numérique vers une feuille de style.
Ce lien est lui-même codé dans la balise « HEAD » (l’entête du document).
Ouf ! vous remarquerez que finalement un document que l’on peut visualiser dans le navigateur, comme le document même que vous lisez dans votre navigateur Internet, est codé avec ce que l’on appel des balises (pas des valises sous les yeux, des Balises).
Dans notre exemple, la balise « div », la balise « body » et la balise « head » contiennent respectivement :
1. balise DIV : contient l'animation d’introduction
2. balise BODY : contient la balise DIV qui contient elle-même l'animation d’introduction
3. balise HEAD : contient le lien vers « la feuille de style »
C’est quoi « une feuille de style » ?
Ben je vous l’ai déjà dit, elle contient des règles de style ; c’est un autre document que vous ne pouvez pas lire directement dans le navigateur, ce document invisible transmet dans le document visible (que vous lisez en ce moment) la façon dont doit être coloré les liens (là où il y a une petite main), la couleur du fond de la page, la position de l’animation d’introduction ou la position d’autres éléments (barres de lien etc.)
Pourquoi ne pas écrire ce code « des styles » directement dans le document visible ?
La réponse est d’une part à cause de votre impatience à voir s’afficher les pages dans votre navigateur, en effet la page visualisé est plus légère car il y a en moins les kilo-octets que constituent les codes de style enregistrés dans le document invisible.
D’autre part la feuille de style fonctionne en plus pour toutes les pages du site ce qui évite d’avoir à réécrire les codes de style dans chaque page, en outre il y a l’esthétique apportée par la cohérence du style qui est le même pour chaque page.
D’où ce fameux lien vers la feuille de style dans chaque page du site. C’est logique non !
Pour conclure je vais vous donner la définition de deux langages utilisés pour la conception des pages Web.
1. le langage HTML décrit la structure de la page avec des balises qui contiennent elles même des balises (texte, images et liens)
2. le langage CSS décrit la mise en page, la mise en forme et les effets visuels avec des règles qui s’appliquent aux balises HTML…
Toutefois en premier lieu ce qui est intéressant dans cette page d’accueil, c' est le système de liens en haut de la page constitué d'une barre de lien proposant des sous liens.