Ce qu'il faut et ne pas faire en CSS : Les balises
Date de publication : 07/05/2009
Par
Alen Grakalic (Auteur)
Alban Lelasseux (Traducteur)
Cet article est la traduction de l'article : http://cssglobe.com/post/1960/css-dos-and-donts-part-2-markup. Retrouvez toutes les traductions de CSS Globe disponibles sur cssglobe.developpez.com.
CSS Globe poursuit sa série de petits articles appelés "Ce qu'il faut
et ne pas faire en CSS". Ces séries ont pour but de pointer les
mauvaises habitudes lorsqu'on utilise le CSS et en général les
standards du Web. On tentera de répondre aux questions les plus
fréquentes relatives au CSS. Cette deuxième partie portera sur les
balises.
Introduction
Structurer un document
Balises structurelles et de présentation
Le choix des balises
La validation
Résumé
Introduction
Si vous voulez vraiment entrer dans les standards Web, vous découvrirez
bientôt que la chose la plus importante est le codage. Un code correct,
solide et bien structuré. Le HTML, XHTML, les balises, les attributs,
la structure...C'est tout ce dont il s'agit réellement.
Nous sommes attachés aux termes des standards Web et CSS. Le terme
CSS est presque devenu un synonyme de standard. J'ai souvent utilisé
le terme "CSS designer" ou "CSS ci", "CSS ça" pour expliquer
rapidement les méthodes et l'approche dont je parlais. Mais la vérité
est que le CSS ne signifierait rien si votre structure de codage
comporte une erreur. Le codage est le roi.
Structurer un document
La clé des documents conformes aux standards Web est leur structure.
Elle doit être significative et logique. Le document devrait suivre
un certain flux, il doit être lisible et compréhensible sans style CSS.
La plupart des documents ont différentes sections (navigation,
contenu principal, contenu latéral, le droit d'auteur, zone de contact,
etc.). Un utilisateur, humain ou non humain, devrait
être capable de comprendre ces sections comme des sections importantes
du premier regard.
La section la plus importante doit être aussi élevée que possible
dans le flux, mais l'importance de certaines sections est également
définie par la position des balises d'en-tête (h1, h2, h3, h4, h5, h6).
En un sens les titres définissent la structure des documents.
Balises structurelles et de présentation
Dans le monde des standards Web, on entend souvent parler d'un syntagme
"séparant la présentation du contenu". Qu'est-ce que cela signifie ?
Fondamentalement, cela signifie que les éléments HTML ne devraient
exister que pour la présentation. Vous devriez éviter d'avoir des div
vident pour les ombres ou autres effets. Laissez aux balises leur sens structurel
afin qu'elle existe en tant que partie logique d'un document.
Le choix des balises
Il existe une multitude de possiblité dans le choix des balises.
Ne comptez pas uniquement sur les div pour faire office de conteneur.
Parfois, un simple paragraphe, contenant quelques span ou em,
est suffisant pour obtenir ce que vous voulez. Nous utilisons tous
des listes numérotées ou non, mais nous avons aussi un autre
type de listes qu'on n'utilise pas assez : les listes de
définitions. Les dl sont idéales dans de nombreux cas à cause de
leur structure à "2 dimensions". D'ailleurs, pourquoi nous n'utilisons pas
les balises address pour les informations de contact que nous
plaçons au bas de la page (dans le "footer") ? Faîtes votre choix !
La validation
La validation a son importance dans l'analyse de votre code. Mais la
validation seule ne signifie pas que votre document est construit
selon les normes. Vous pouvez avoir l'ensemble du document fait
de div avec les noms de classes, ce qui permettrait de valider le
code, mais serait-ce utile ? Pas à tout le monde et certainement
pas aux moteurs de recherche.
Résumé
À faire
- Accorder une grande attention à la structure du document. C'est la chose la plus importante ;
- Penser à la sémantique, utiliser les balises dans un ordre significatif, créez un "flux" HTML logique ;
- Utiliser une variété de balises possibles, choisissez la plus appropriée à vos besoins et surtout au type de contenu ;
- Utiliser une variété de balise, choisissez celle appropriée pour un certain type de contenu ;
- Penser à l'aspect utile avant les effets de style ;
- Essayez d'utiliser aussi peu d'éléments HTML que possible pour le même effet, vous vous sentirez plus à l'aise ;
- Faire des compromis en terme de design. Parfois, il est préférable de ne pas utiliser certains effets et d'avoir un code propre.
À ne pas faire
- Penser que si quelque chose est valide il est automatiquement conforme aux standards Web ;
- Sur-exploiter certaines balises, comme les div ;
- Utiliser des balises de présentation ;
- Ne pas éviter d'utiliser certains éléments en pensant qu'ils ne sont pas des "standards web" (oui, je veux parler des tableaux) ;
- Faire des compromis en termes de codage.
Copyright © 07/05/2009 CSS Globe. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts. Cette page est déposée.
Copyright © 2000-2012 - www.developpez.com