Caractéristiques

Ce site est fabriqué avec le logiciel adHoc. C'est un CMS ...
  • Simple
  • Léger
  • Modulaire
  • Multilingue
  • Multiutilisateur
  • Sans base de données
  • et par dessus tout... Libre

Version


0.49

Alpha


en cours de développement

Écrire pour le web - La structure et le style

Structure et style

On sait coller ou saisir du texte brut, il va falloir le mettre en forme, lui donner une structure et un style. Le contenu et la structure vont être spécifiques à chaque document, tandis que le style sera indiqué dans un fichier séparé commun à l'ensemble du site, la feuille de style.

La structure permet de donner du sens au contenu, des repères, pour faciliter son indexation (par les moteurs de recherche) et son accessibilité (par exemple pour les outils de synthèse vocale). Le contenu et sa structure se traitent depuis l'éditeur ou en mode source html, le style et l'apparence sont traités dans le CSS.

La structure, c'est avec des balises

Essentiellement les balises paragraphe et les balises titres hn (H1 à H6)

Les paragraphes sont créés par l'éditeur avant toute saisie chaque fois que l'on appuie sur la touche Entrée.

Les titres, on les choisit en cliquant sur l'un des niveaux hiérarchiques proposé habituellement par les éditeurs wysiwyg : H1 à H6 du plus important à celui de moindre importance. Dans la pratique, il est rare d'avoir besoin dans une page web de plus de 3 niveaux hiérarchiques pour les titres. On utilisera donc les balises H1 à H3, en prenant garde de toujours commencer par un niveau supérieur.

L'interprétation de la balise Hn relève a priori du navigateur et peut varier en fonction de celui utilisé par le visiteur :  un titre H1 est affecté d'un facteur de grossissement de 200% de la taille par défaut de la police du navigateur (environ 1em), H2 = 150%, H3 = 110%, H4 = 100%, H5 = 80%, H6 = 60%. Voir la page de test html pour y tester comment votre navigateur interprète la feuille de style de BlackLand. C'est là  >>>>>

Il ne s'agit pas d'obtenir par là un rendu agréable à l’œil, mais de structurer son texte en hiérarchisant ce qui est plus ou moins important.  Lors de la mise en page dans l'éditeur wysiwyg, il ne convient donc pas de choisir un titre en fonction de sa taille, de sa graisse ou de sa couleur : si le style d'un titre ne convient pas, il faut aller modifier ou créer sa description dans le fichier de CSS. Par exemple, comme cela:

h1{ text-align : center; text-decoration : none; font-family : Verdana, Geneva, Arial, Helvetica, sans-serif; font-size : 14px; font-weight : bold; color : #F5c503; 

Que sont les titres hn ?

Les balises Hn (pour h1 à h6) sont utilisées pour structurer le contenu de chaque section dans une page. Selon le W3C, la balise h1 est un élément qui décrit brièvement le sujet de la section qu’il introduit. C'est un titre de section identifiable comme tel. S'il y a plusieurs sections dans la page, on peut y trouver plusieurs balises h1. Le contenu de section peut organiser une structure en sous-titres et sous-sous-titres  en respectant la hiérarchie h2, h3 etc


Cette hiérarchie des titres offre certes un intérêt pour l'optimisation en direction des moteurs de recherche, car les textes affectés de titres de niveau élevé sont répertoriés en priorité. Mais pas seulement. Elle est essentielle au bon fonctionnement des logiciels de lecteur d'écran pour déficients visuels et aux internautes qui lisent souvent le web en se repérant aux titres importants.


Dans la pratique, pour un adHoc, il faudrait que chaque titre de document (correspondant donc à une section) soit affecté automatiquement d'une balise h1, à charge pour le rédacteur affecter les h2 etc depuis l'éditeur