Fiche CSS : Récapitulatif des connaissances acquises en CSS.


Objet de la fiche

État de la fiche Terminée validée


Avant propos

Cette fiche reprend les points importants et les bonnes habitudes à adopter lorsque l'on personnalise une page HTML à l'aide des feuilles de style(CSS).

Styles CSS d'une page HTML

 

A la fin de la section HTML nous avons appris à définir le contenu d'une page HTML.

A la fin de la section feuilles de style (CSS) nous avons appris à structurer, présenter et positionner ce contenu.

Pour obtenir ce résultat on a appris à maîtriser les couleurs et image de fond, les styles de présentation des textes, tableaux et autres listes ainsi que la manière de positionner les divers éléments sur la page.

Une autre possibilité très intéressante pour construire un site  convivial a été d'utiliser la pseudo propriété hover afin d'exécuter une action lors du survol d'un élément.

Ce stade de connaissances suffit à celui qui veut créer un site Internet pour présenter des rapports, donner des informations, concevoir un petit diaporama, etc. ...Il suffira de se reporter à la rubrique hébergement pour installer le site sur un serveur et le rendre pleinement opérationnel.

Pour ceux qui veulent aller plus loin, les sections suivantes (DOM et Javascript) vont permettre de comprendre et de mettre en oeuvre de réels mécanismes d'interactivité.

Points importants sur les bonnes habitudes

  • Prenez garde à ce que les combinaisons de couleurs de premier plan et d'arrière plan produisent un contraste suffisant. Votre site peut être consulté par des personnes ayant des problèmes de perception des couleurs, ou des utilisateurs consultant le site à partir d'un écran noir et blanc.
  • N'utilisez pas de police de caractères exotiques car le navigateur de l'internaute risque de ne pas les interpréter. Si vous devez utiliser ce genre de police faite plutôt une image.
  • Essayer de garder le plus possible une homogénéité entre les différentes page de votre site et utiliser de préférence une feuille de style externe.
  • Pensez à prévoir une feuille de style pour le média print (impression).
  • Utilisez des directives de feuille de style qui puissent être comprises par la majorité des navigateurs (cas des filtres).
  • Pour les divers dimensionnements d'éléments de type block utilisez le plus possible les unités en em.
  • Chaque fois que vous définissez un style pour un élément de type block précisez par défaut les propriétés margin et padding à 0em, afin de conserver des positionnement identiques quelques soient les navigateurs. En effet les valeurs par défaut ne sont pas toujours identiques pour tous les navigateurs.
  • Testez votre site avec différents navigateurs, et parmi les plus courants FireFox, Opéra, Safari et Internet Explorer.

Respectons la propriété intellectuelle