rtzrztrztrtz
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Page 1 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Table des matières
1. OBJECTIFS DE LA FORMATION ............................................................................. 4
2. NOTE.......................................................................................................................... 5
3. INTRODUCTION ........................................................................................................ 5
4. LES CARACTÉRISTIQUES ET SPÉCIFICITÉS DE L'ÉCRITURE WEB.................. 8
4.1. L'INTERNAUTE ET LA LECTURE..................................................................................... 8
4.1.1. La lecture en mode "recherche" ou "scannability" ......................................................................9
4.1.2. La lecture en mode "consultation" ..............................................................................................9
4.2. L'HYPERTEXTUALITE....................................................................................................... 9
4.3. LES REGLES EDITORIALES APPLICABLES................................................................. 11
4.3.1. Le modèle de la pyramide inversée..........................................................................................11
4.3.2. La règle des 5 "W"....................................................................................................................12
4.3.3. Les lignes directrices................................................................................................................13
4.4. LISIBILITE DU CONTENU............................................................................................... 13
4.5. L'ACTUALISATION DU CONTENU ................................................................................. 13
4.6. L'INFLUENCE DU REFERENCEMENT........................................................................... 14
4.7. L'ACCESSIBILITE ............................................................................................................ 14
5. RECOMMANDATIONS PRATIQUES ...................................................................... 18
5.1. PROPOSEZ DU CONTENU A FORTE VALEUR AJOUTEE .......................................... 18
5.2. PROPOSEZ DES URLS PARLANTES POUR VOS UTILISATEURS............................. 19
5.3. DEFINISSEZ UNE ARCHITECTURE DE L’INFORMATION EFFICACE ........................ 19
5.3.1. Définissez une arborescence régulière et équilibrée................................................................19
5.3.2. Structurez l’information de manière logique .............................................................................19
5.3.3. Organisez votre site de manière thématique en fonction de ce que souhaite l’utilisateur ........21
5.3.4. Distinguez clairement les aspects organisationnels des services concrets offerts aux citoyens
...........................................................................................................................................................21
5.3.5. Définissez une catégorisation « exclusive » des informations..................................................21
5.3.6. Identifiez vos rubriques transversales ......................................................................................22
5.3.7. Rubrique transversale « Actualités »........................................................................................23
5.3.8. Rubrique transversale « Publications »....................................................................................23
5.3.9. Rubrique transversale « Législation » ......................................................................................24
5.3.10. Rubrique transversale « Formulaires » ..................................................................................25
5.4. RUBRIQUES DE SUPPORT IMPLIQUANT UNE ATTENTION REDACTIONNELLE .... 25
5.4.1. Rubrique « Plan du site ».........................................................................................................25
5.4.2. Rubrique « Liens » ...................................................................................................................26
5.4.3. Rubrique « Contact » ...............................................................................................................27
5.4.4. Rubrique « A propos du site »..................................................................................................27
5.4.5. Rubrique « Notice légale » .......................................................................................................27
5.5. SYSTEME DE SOUS-RUBRIQUES ................................................................................ 28
5.6. CHEMIN DE LOCALISATION.......................................................................................... 28
5.7. RESPECTEZ UNE LIGNE EDITORIALE CLAIRES ET COHERENTE........................... 29
5.7.1. Cohérence................................................................................................................................29
5.7.2. Vigilance et qualité ...................................................................................................................29
5.8. FAVORISEZ LA LECTURE PAR VOS INTERNAUTE – PROPOSEZ UN CONTENU
« SCANNABLE »..................................................................................................................... 30
5.8.1. Structurez les pages de contenu..............................................................................................30
5.8.1.1. Clarté et concision.............................................................................................. 30
5.8.1.2. Mise en relief ...................................................................................................... 31
5.9. PROPOSEZ DES TITRES ET SOUS-TITRES POUR VOS PAGES............................... 32
5.9.1. Le titre ......................................................................................................................................32
5.9.2. Les sous-titres..........................................................................................................................33
Page 2 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
5.10. ORIENTEZ LES UTILISATEURS AVEC LES LIENS HYPERTEXTES......................... 33
5.10.1. La présentation des liens .......................................................................................................33
5.10.2. L'utilisation des ancres nommées ..........................................................................................34
5.11. DISTINGUEZ LES LIENS INTERNES DES LIENS EXTERNES................................... 34
5.12. LES DOCUMENTS TELECHARGEABLES ................................................................... 35
5.13. UTILISEZ LES ELEMENTS CONTEXTUELS................................................................ 36
5.14. PALETTE DE COULEURS ............................................................................................ 37
5.15. ELEMENTS GRAPHIQUES........................................................................................... 38
5.15.1. Les images.............................................................................................................................38
5.15.1.1. Les formats de compression ............................................................................ 38
5.15.1.2. Le format GIF ................................................................................................... 39
5.15.1.3. Le format JPEG................................................................................................ 40
5.15.1.4. Les images entrelacées ................................................................................... 42
5.16. QUELQUES RECOMMANDATIONS POUR LA PAGE D’ACCUEIL DU SITE ............. 43
6. CHECK-LIST DES RECOMMANDATIONS................................................................ I
7. LIENS UTILES ...........................................................................................................X
7.1. ACCESSIBILITE.................................................................................................................X
7.2. NAVIGATEURS..................................................................................................................X
7.3. CONVERSION PDF EN LIGNE .........................................................................................X
7.4. TRAITEMENT DES IMAGES (LOGICIELS GRATUITS) ...................................................X
7.5. TRADUCTION EN LIGNE .................................................................................................XI
Page 3 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
1. OBJECTIFS DE LA FORMATION
Les objectifs de la formation sont :
Comprendre les caractéristiques et spécificités de l'écriture Web
Etre capable de structurer et d'adapter du contenu aux exigences spécifiques du
média Internet
Etre capable de proposer aux utilisateurs un contenu répondant à leur attente
Page 4 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
2. NOTE
Le présent document fait partie des annexes de ReNo (Référentiel de Normalisation
pour les sites web du Gouvernement luxembourgeois).
L’intégralité de ReNo (document officiel et différentes annexes) est téléchargeable à
l’adresse suivante :
http://www.eluxembourg.public.lu/actualites/2007/11/reno/index.html
3. INTRODUCTION
Contrairement aux idées reçues, un site Internet n’est pas qu’une affaire de
technologie.
Il est un savant dosage entre 5 composantes essentielles. Chacune de ces
composantes doit contribuer à faciliter et satisfaire l'utilisateur lors de son exploration
du site web.
Le contenu
Le contenu représente la somme des connaissances et des informations proposées
aux utilisateurs d’un site Internet (texte, images, vidéos, rubriques, etc.).
Exemple : Quel serait l’intérêt du site amazon.com sans son contenu ?
Page 5 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
L’accessibilité
Un site Internet est accessible lorsqu'il est possible pour n'importe quelle personne d'y
accéder de façon équivalente, quelle que soit :
le navigateur utilisé (Firefox, Internet Explorer, Opéra, Safari, navigateur texte ...) et
sa configuration (javascript activé ou désactivé, pop-up active ou désactivée, …),
l'interface (utilisation du clavier ou de la souris),
la plate-forme (Windows, Mac OS ou encore Linux ...)
le périphérique d'affichage (un écran plat 17 pouces, un ordinateur portable, un
téléphone mobile relié au web...)
"l'aide technique" utilisée (une loupe d'écran, une plage braille ou une synthèse
vocale...)
L’accessibilité est abordée ponctuellement dans ce manuel. Pour obtenir plus
d’informations sur la problématique de l’accessibilité, vous pouvez consulter le guide
accessibilité pour rédacteur.
La navigation
La notion de navigation englobe les moyens permettant de se déplacer à l’intérieur du
site et d’accéder à l’information.
Une navigation efficace requiert :
des principes de navigation intuitifs et cohérents,
une page d’accueil efficace,
un index du site,
un repérage facile dans l’arborescence.
Les fonctionnalités
L'ensemble des fonctionnalités proposées sur le site doit être conçu dans la même
optique de simplicité et de confort d'utilisation.
Page 6 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
La mise en place d'un forum de discussion, d'un formulaire de contact, d'un moteur de
recherche... doit faire l'objet d'une réflexion essentielle sur la manière dont les
internautes vont l'utiliser.
Tout comme le reste des éléments d’un site, les fonctionnalités devront donc :
être utiles et apporter une réelle valeur ajoutée,
répondre aux attentes et besoins des utilisateurs.
Le design
La notion de design englobe tous les aspects graphiques de votre site Internet.
Un bon design requiert :
une cohérence avec l'image de l’organisme et de sa stratégie de communication en
ligne,
une charte graphique homogène,
des éléments graphiques au service de l’information.
L’ensemble de ces éléments rejoint la notion d’ergonomie plus amplement décrite dans
le « Référentiel de Normalisation pour les sites web du Gouvernement
Luxembourgeois »(ReNo). Plus largement, ReNo fixe un cadre pertinent et cohérent
pour les sites publics luxembourgeois.
Si les aspects techniques et graphiques peuvent facilement être gérés via l'architecture
centralisée, les aspects « éditoriaux » liés à la production de contenu sont de la
responsabilité des rédacteurs. En effet, le « Content Management System » garantit le
cadre technique de la gestion de contenu mais ne peut décharger le rédacteur de sa
responsabilité éditoriale.
En parallèle à cette documentation, les lecteurs peuvent consulter le code de rédaction
du SIP.
Page 7 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
4. LES CARACTÉRISTIQUES ET SPÉCIFICITÉS DE L'ÉCRITURE WEB
L'écriture prend une dimension particulière sur Internet. Il est important de bien en
comprendre les caractéristiques et spécificités pour répondre aux exigences des
utilisateurs et fournir un contenu de qualité.
4.1. L'INTERNAUTE ET LA LECTURE
Les études en ergonomie et l'analyse de la manière dont les internautes lisent sur
Internet mettent en évidence l'existence de différents modes de lecture.
Les comportements peuvent radicalement varier selon qu'ils sont à la recherche
d'information (mode "recherche") ou selon qu'ils aient trouvé cette information et qu'il la
consulte (mode "consultation" ou "consommation").
Ce constat existait déjà avec la presse écrite : l'expression « Lire en diagonale » n'a
pas vu le jour avec Internet ! Mais sur Internet, où la masse d'information est énorme et
les principes de navigation abondants, le phénomène semble s'être fortement
accentué.
Un bon site web devrait donc répondre à deux objectifs presque contradictoires :
permettre aux utilisateurs de "scanner" rapidement le contenu du site à la
recherche de l'information qui les intéresse,
répondre au besoin d'information de manière suffisamment consistante.
Dans la pratique, l'utilisateur est rarement totalement en mode "recherche" ou
totalement en mode "consultation". La démarche consistera donc à mêler en quelque
sorte, interpellation/légèreté et richesse/lourdeur afin de répondre aux exigences et
comportements des utilisateurs.
Page 8 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
4.1.1. La lecture en mode "recherche" ou "scannability"
Dans sa quête d'information, l'utilisateur parcourt un site afin de savoir si l'information
recherchée est présente ou pour localiser une information dont il sait qu’elle s'y trouve.
Pour ce faire, l'utilisateur scanne les pages. Sa lecture est de type "balayage"
(en diagonale).
L'œil du lecteur procède par sauts. L'internaute ne suit pas un chemin linéaire. Il
appréhende, à chaque fixation, non pas une lettre, ni même un mot, mais un groupe de
mots, une expression.
L'œil a besoin d'être guidé, au risque de se perdre et de tourner en rond, créant chez
l'utilisateur un sentiment d'incompréhension, de malaise puis de rejet.
Les principales raisons de ce mode de lecture sont les suivantes :
la lecture à l‘écran est 25% plus lente que la lecture sur papier. Cela rend encore
plus grande la nécessité d’être concis et précis dans sa rédaction,
les internautes sont des lecteurs pressés. Leur but : trouver rapidement
l‘information recherchée sans passer trop de temps à cette recherche,
l’information sur Internet est accessible sur un grand nombre de sites. L'utilisateur
qui ne trouve pas ce qu'il recherche, changera très rapidement de site.
Le mode "recherche" exigera donc du rédacteur une écriture, axée sur le guidage et
la signalisation. Il devra veiller à structurer au mieux l'information.
4.1.2. La lecture en mode "consultation"
En mode "consultation", il faut considérer l'utilisation de l'information d'une manière
plus large que la simple lecture.
Bien que la majorité des internautes lisent à l'écran, il faut garder à l'esprit que
l'impression pour une lecture ultérieure reste une pratique courante, au même titre que
la sauvegarde sur support numérique.
Le mode "consultation" exigera donc du rédacteur une capacité à développer son
sujet, ainsi qu'un effort de concision.
4.2. L'HYPERTEXTUALITE
L’hypertextualité perturbe les habitudes des arborescences hiérarchisées et la
tradition de lecture linéaire issue du livre. De ce fait, on peut considérer que
l’hypertexte représente un changement important dans la manière d’appréhender la
consultation et la publication d’informations.
Page 9 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
En effet, au lieu de présenter une information de manière linéaire qui part d’une idée
centrale et qui la développe au fil des pages, l’hypertextualité la décompose en pages
reliées entre elles par des liens et ce, sans ordre hiérarchique prédéterminé.
Le lecteur doit donc construit son propre cheminement en définissant une structure qui
relie les pages entre elles. Il existe par conséquent une pluralité de possibilités de
lecture d’un contenu. Le rédacteur doit donc laisser le choix au lecteur de trouver
une orientation, sa propre manière de consulter l’information et cela, dans
l’ordre qu’il souhaite.
En cela la logique de l’hypertexte se rapproche de celle des livres, " dont vous êtes le
héros ", qui furent à la mode, il y a quelques années. Au lieu de développer une
histoire de manière linéaire, ces livres présentent une structure narrative décomposée
en segments de texte numérotés, généralement constitués de un ou de plusieurs
paragraphes, ce qui rend tout à fait impossible la lecture de l’ouvrage de manière
linéaire.
À la fin de chaque segment numéroté, le lecteur fait un choix pour continuer l’histoire.
En fonction de l’option choisie, le numéro indique à quel segment il doit se rendre. Et
chaque lecteur, en fonction de ses choix, prend des chemins différents pour construire
l'histoire relatée dans l’ouvrage.
Mais avec Internet, l’hypertextualité va beaucoup plus loin. Sur Internet, le contenu
des pages peut renvoyer vers d'autres pages du même site ou vers d'autres
pages d'autres sites.
Page 10 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
De plus, sur Internet, l'hypertexte s'est vu complété par l'hypermédia, c'est-à-dire la
possibilité de définir des liens non seulement sur du texte, mais également sur des
images, sur des parties d'images, voire sur des animations.
Le schéma ci-dessus illustre la notion d'hypertextualité sur Internet. Les liens
hypertextes relient les pages du site ou d'autres sites entre elles, créant ainsi de
multiples possibilités d'exploration de l'information. Et de ce fait une lecture totalement
non linéaire.
Une lecture de ce type implique donc une écriture particulière.
4.3. LES REGLES EDITORIALES APPLICABLES
Une grande partie des acquis littéraires classiques reste précieuse sur Internet.
4.3.1. Le modèle de la pyramide inversée
La règle journalistique de la "pyramide inversée" qui veut que le journaliste
approfondisse progressivement son sujet, de l'information finale vers l'information
globale, avec un chapeau qui développe le titre, avec un article qui développe le
chapeau,... reste applicable.
Page 11 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Sur Internet, il est particulièrement conseillé de placer l'information ciblée en amont et
les informations globales plus en profondeur. L'expérience démontre que l'internaute
(à l'instar du lecteur classique) commence par lire le haut d'une page et s'en éloigne
dès qu'il estime en savoir suffisamment.
Dans le même ordre d'idée, il est conseillé de consacrer un paragraphe par idée, le
lecteur pouvant prendre la décision de sauter un paragraphe entier après lecture des
premières lignes.
L'unique différence entre Internet et la presse écrite - mais elle est notable - est que
l'effet pyramide peut être obtenu, sur Internet, non pas forcément au sein d'une même
page, mais à travers les liens hypertextes.
Ainsi, on proposera normalement, sur la page d'accueil, des accroches, menant vers
des articles plus complets, conduisant eux-mêmes vers des informations plus
détaillées, jusqu'à remonter éventuellement aux sources elles-mêmes.
Quel que soit le moment où l’internaute arrête sa lecture, il doit avoir profité de
l’essentiel.
4.3.2. La règle des 5 "W"
La règle journalistique des 5 "W" reste également applicable sur Internet.
Page 12 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Elle consiste à répondre aux 5 questions de base que se pose le lecteur :
Who?
What?
When?
Where?
Why?
4.3.3. Les lignes directrices
Sur Internet, il est fortement conseillé d'adopter un processus d'édition rigoureux.
ReNo définit un certain nombre de critères éditoriaux.
Les feuilles de styles (CSS) par exemple permettent d'organiser la cohérence
typographique d'un site. En clair, de veiller à ce que les informations de même niveau
(titres principaux, titres secondaires, texte standard, légendes,...) se présentent partout
de la même manière. Elles sont le garant d'une uniformité et cohérence visuelle.
Au niveau du contenu lui-même, les attributs associés à chaque type de contenu
permettent de structurer l'information et son affichage à l'écran.
Par exemple, dans un agenda, on décidera de mentionner, systématiquement et dans
l'ordre :
la date de l'événement,
la ville où l'événement a lieu,
le thème de l'événement en deux lignes maximum,
les personnes de contact et leurs fonctions.
4.4. LISIBILITE DU CONTENU
La lisibilité est très importante sur le Web. Cette notion revient à savoir si un texte peut
visuellement être lu (taille des caractères, couleur de fond). La lisibilité est souvent
associé à un caractère plaisant, agréable d’un contenu.
4.5. L'ACTUALISATION DU CONTENU
A la différence de la presse qui sort des versions, des numéros voir des volumes à des
moments précis et moyennant des tirages bien précis; à la différence de la télévision
qui diffuse ou rediffuse des émissions à des moments précis; un site Internet est, en
règle générale, édité en flux tendu.
C'est donc en temps réel que le contenu d'un site Internet peut être actualisé, en tout
ou en partie... L’actualisation est le facteur clé dans la réussite d’un site.
Page 13 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Pour les rédacteurs, la gestion du temps n'est donc pas toujours facile : les demandes
d'actualisation du contenu peuvent survenir au coup-par-coup et souvent dans
l'urgence... Une organisation rigoureuse est requise si l'on veut pouvoir y répondre.
Si vous promettez un contenu consistant, couvrant tel ou tel domaine, il faut pouvoir
l'assurer ! C'est toute la problématique du « content management » : celui-ci demande
une définition des tâches et des rôles au préalable.
Qui produit les contenus ?
Qui les approuve ?
Qui les intègre ?
A quelle fréquence ?
Moyennant quel budget-temps ?
Internet a donc l'énorme atout de pouvoir allier instantanéité et traçabilité ! A titre
d'exemple, un site Internet peut contenir à la fois de l'information en temps réel
(webcams, données boursières, etc) et de l'information archivée.
4.6. L'INFLUENCE DU REFERENCEMENT
Ecrire pour Internet c'est écrire pour être lu, par conséquent pour être référencé dans
les moteurs de recherche et annuaires qui vont assurer une grande partie de la
fréquentation du site.
Plusieurs "métadonnées" (données liées de façon indirecte à l'information) ont une
importance particulière dans le référencement d'un site.
Il s'agit p.ex. de l'URL nom de domaine de votre site (p.ex. : http://www.sport.public.lu),
du titre d'une page.
Les "metatags" sont destinés à aider les moteurs de recherche à référencer votre site.
Dans cette perspective, les tags Description et Keywords sont importants.
Notez que le contenu lui-même (le texte qui se trouve dans la partie de
votre page HTML) est pris en compte par les moteurs de recherche.
Les moteurs de recherche évaluent notamment la pertinence des mots clés, à savoir le
fait que votre contenu reflète bien les mots clés définis dans la partie META de votre
document. Les titres sont également pris en compte. D'où l'importance d'être le plus
explicite possible et de bien renseigner ces données.
Pour de plus amples informations en matière de référencement, un guide du
référencement web est à disposition des rédacteurs.
4.7. L'ACCESSIBILITE
L'une des spécificités d'Internet est de permettre l'accessibilité de l'information à tout le
monde, y compris les personnes souffrant d'un handicap.
Page 14 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
L'accessibilité pour tous est l'un des principaux objectifs du programme eLuxembourg
et eEurope.
Qu'est-ce que l'accessibilité?
Comme expliqué précédemment, un site Internet est accessible lorsqu'il est possible
pour n'importe quelle personne d'y accéder de façon équivalente, quelle que soit :
le navigateur utilisé (Firefox, Internet Explorer, Opéra, Safari, navigateur texte ...) et
sa configuration (javascript activé ou désactivé, pop-up active ou désactivée, …),
l'interface (utilisation du clavier ou de la souris),
la plate-forme (Windows, Mac OS ou encore Linux ...),
le périphérique d'affichage (un écran plat 17 pouces, un ordinateur portable, un
téléphone mobile relié au web...),
"l'aide technique" utilisée (une loupe d'écran, une plage braille ou une synthèse
vocale...).
Concernant ce dernier point, précisons qu'il s'agit de moyens permettant aux
personnes souffrant d'un handicap (déficience sensorielle, motrice, intellectuelle ou
cognitive) de compenser celui-ci afin d'avoir accès à l'information présente sur le site.
Voici quelques exemples pratiques :
une personne malvoyante pourra utiliser un "logiciel loupe d'écran" (aide
technique) afin de grossir la taille des pages qu'elle parcourt et ainsi lire
correctement son contenu,
un non-voyant utilisera une plage braille ou une synthèse vocale à partir d'un
navigateur texte.
Il convient de bien comprendre que notre définition de l'accessibilité ne se réduit pas
à la notion de handicap.
Nullement besoin d'être handicapé pour se retrouver bloqué devant un site nécessitant
la dernière version de tel ou tel navigateur, l'utilisation de telle ou telle technologie
spécifique.
Un site accessible est accessible à tous, personne handicapée ou non !
Qu'implique l'accessibilité?
Garantir l'accessibilité des sites, implique le respect d'un certain nombre de contraintes
techniques et conformité de code lors de la réalisation des sites. Les choix de ReNo
vont dans ce sens.
L'accessibilité des sites publics nécessite une compatibilité aux Web Content
Accessibility Guidelines du W3 Consortium (WCAG), qui est l'organisation qui gère et
Page 15 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
émet les standards technologiques pour Internet. Plus précisément, une compatibilité
niveau AA est visée.
Voici quelques exemples concrets pour mieux comprendre :
Il s'agit ci-dessous de la page d'accueil du site www.gouvernement.lu, dans un
navigateur de type texte : Lynx.
Ce résultat très satisfaisant a été obtenu par une optimisation du code des pages.
L'exemple ci-dessous illustre la fonctionnalité "Magnifier" de Windows, permettant
d'agrandir une partie de l'écran comme une loupe.
Page 16 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
L'exemple ci-dessous illustre l'augmentation de la taille des caractères du contenu
grâce à l'utilisation d'une feuille de styles appropriée.
Page 17 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Pour plus d’informations concernant les questions d’accessibilité qu’un rédacteur web
est amené à prendre en considération, vous pouvez vous référer au guide accessibilité
pour rédacteur .
5. RECOMMANDATIONS PRATIQUES
Comment concrètement tenir compte des caractéristiques et spécificités de l’écriture
web pour produire du contenu répondant aux attentes des utilisateurs ?
Le chapitre suivant vise donc à fournir des recommandations d’ordre pratique aux
rédacteurs
Toutes les recommandations pratiques présentées ci-après sont basées sur des
critères d’ergonomie communément admis. Pour plus d’informations concernant ces
critères d’ergonomie, le lecteur peut se référer à ReNo.
5.1. PROPOSEZ DU CONTENU A FORTE VALEUR AJOUTEE
La mise à disposition et la maintenance du contenu est la composante fondamentale
de la qualité web.
La nature du contenu à mettre en place découle directement de l’analyse des besoins
des utilisateurs. Si cette analyse a été judicieusement réalisée, chaque page du site
devrait offrir un contenu spécifique à part entière.
Tout d’abord, pour chaque page :
proposez en priorité les informations que les utilisateurs attendent,
allez à l’essentiel,
proposez un contenu adapté au langage des utilisateurs ciblés. Veillez à utiliser
une terminologie largement comprise de tous.
Evitez une communication trop administrative, pas en adéquation avec les
préoccupations concrètes des citoyens ou entreprises.
Ensuite :
chaque page du site devrait proposer un contenu spécifique (un système de sousrubriques
n’est pas considéré comme étant un contenu spécifique),
la rédaction d’une page ne devrait pas se limiter à l’énumération des sousrubriques
qu’elle propose,
la rédaction d’une page ne
devrait pas se limiter à proposer
des liens et des documents
téléchargeables dans une boîte
« Pour en savoir plus ».
Page 18 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Autre point important en terme de valeur ajoutée, mentionnez vos sources.
5.2. PROPOSEZ DES URLS PARLANTES POUR VOS UTILISATEURS
Les différentes URLs du site devraient être dans la mesure du possible significatives
pour l’utilisateur. P.ex., elles ne devront pas être basées sur des termes en anglais
pour un site rédigé en français, ou encore sur des chiffres lorsque cela ne fait pas de
sens.
Elles ne devraient pas non plus, pour différentes raisons d’accessibilité et d’ergonomie,
présenter de majuscule, de caractère spécial, de souligné (« underscore ») ou
d’espace.
5.3. DEFINISSEZ UNE ARCHITECTURE DE L’INFORMATION EFFICACE
L’architecture de l’information renvoie à la façon dont est structurée l’information
d’un site web (catégorisation, ordonnancement et hiérarchisation des informations).
Cette notion est étroitement liée aux questions de labelling (cf. partie « Proposez
des titres et sous-titres » 5.9) et de navigation et est souvent associée à un livrable
spécifique, l’arborescence du site.
Il existe de nombreux critères de base à considérer lorsque l’on définit une architecture
de l’information. Néanmoins, il est important de notifier à nouveau que c’est le contexte
d’utilisation (principalement les caractéristiques des utilisateurs et l’activité qu’ils
mettent réellement en place pour réaliser leurs tâches) qui doit conditionner la mise en
place de l’architecture de l’information.
5.3.1. Définissez une arborescence régulière et équilibrée
L’arborescence du site doit dans la mesure du possible être régulière et équilibrée. Elle
doit d’abord être pensée en largeur puis en profondeur :
il est préférable d’adopter une largeur de 7± 2 éléments pour chaque type et
niveau de navigation et une profondeur de 5 niveaux maximum pour l’intégralité du
site web. Au cas où l’analyse du contenu aboutirait à des niveaux de navigation
supérieurs à 5, un développement de la structure du site web en largeur plutôt
qu’en profondeur devrait s’imposer,
les informations importantes devraient être accessibles en trois clics depuis la
page d’accueil,
si une rubrique propose des sous-rubriques, ces dernières doivent au moins être
au nombre de deux.
5.3.2. Structurez l’information de manière logique
En fonction du contexte d’utilisation, il existe plusieurs moyens pour structurer les
informations, entre autres :
Page 19 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Fréquence d’utilisation des informations
En plaçant les informations les plus fréquemment utilisées en premier lieu,
Alphabétique
L'architecture alphabétique est particulièrement intéressante pour les visiteurs qui
savent exactement ce qu'ils recherchent. La logique alphabétique peut être utile
pour trier l'information au sein d'un "dossier". Elle reste cependant peu porteuse de
sens. Une page d'accueil devrait être plus riche qu'un index de mots clés.
Thématique
Il s'agit d'une structuration par thèmes.
Chronologique
Elle permet de mettre en valeur l'information sous un angle chronologique.
L'exemple le plus courant : la rubrique « Actualités ».
Géographique
Il s'agit d'une structuration par zones géographiques.
Typologique
Il s'agit d'une structuration par types de contenu. L'exemple le plus courant : la
rubrique « Publications » qui comptent des rapports, communiqués, brochures, etc.
Orientée « action »
Il s'agit d'une structuration par actions à réaliser. On s’adresse à l’utilisateur de
façon plus directe.
Exemple : créer une entreprise, transmettre une entreprise, …
Orienté « audience » (structuration en fonction des profils des utilisateurs) :
Il s'agit d'une structuration en fonction de la nature des visiteurs auxquels le
contenu s'adresse.
Exemple : citoyens, entreprises, agents de l'Etat
Attention toutefois, un mélange mal approprié de différents types d'architecture est à
l'origine de nombreuses incohérences.
Dans un même ordre d’idée, il est fondamental de distinguer « arborescence
physique » du site, et moyens d’accès à l’information. Par expérience, il est très difficile
de garantir une catégorisation exclusive (cf. la partie « Définissez une catégorisation
« exclusive » des informations » partie 5.3.5) des informations si l’arborescence
physique est basée sur plusieurs approches différentes de catégorisation (p.ex. par
« Thématiques », puis par « Profils utilisateur », puis par « Situations de vie »).
Page 20 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Il est préférable de définir une approche unique de catégorisation pour l’arborescence
physique (p.ex. par « Thématiques ») et de proposer des moyens d’accès parallèles
(p.ex. par profils, par situations de vie, etc.),
5.3.3. Organisez votre site de manière thématique en fonction de ce que
souhaite l’utilisateur
Les informations devraient être structurées en fonction des caractéristiques des
utilisateurs et de leurs tâches, et non pas en fonction de l’organisme (p. ex. de
l’administration ou du ministère) représentant le site web. Il est en effet conseillé
d’organiser le site de manière « thématique », plus parlante pour vos utilisateurs.
Par définition, les rubriques thématiques sont des rubriques qui abordent un thème
spécifique.
Exemple : sur www.112.public.lu, les rubriques « Urgences et garde », « Formation de
1er secours », « Organisation des secours », « Devenir volontaire » sont des
rubriques thématiques.
Exemple d'erreur courante :
L'une des erreurs rencontrées le plus couramment est de structurer l'information
sur le même schéma que l'organisme (en services, départements, qui ont chacun
des missions particulières). En effet, l’utilisateur ne connaît pas la structure de
l’organisme en question et ne sait pas quelle entité est en charge de quelle mission.
5.3.4. Distinguez clairement les aspects organisationnels des services
concrets offerts aux citoyens
Il est en général préférable de proposer tout d’abord les aspects organisationnels
(p.ex. « Le ministère »), puis les services concrets offerts aux citoyens, dans des
rubriques distinctes de manière à clairement les dissocier.
5.3.5. Définissez une catégorisation « exclusive » des informations
Même si une même information peut être accessible à partir de plusieurs endroits dans
le site web, elle ne doit pas se trouver à deux ou plusieurs endroits différents dans
l’arborescence du site. En d’autres termes, le site ne doit pas proposer des
informations redondantes dans différentes parties de l’arborescence du site.
Les erreurs fréquentes à éviter sont par exemple : mettre en place deux pages qui
présentent des contenus similaires, utiliser un titre identique pour plusieurs pages,
proposer des rubriques ou sous-rubriques via le menu de gauche qui rentrent en conflit
avec les rubriques de support en place, etc.
Page 21 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
5.3.6. Identifiez vos rubriques transversales
Par définition, les rubriques transversales sont des rubriques qui regroupent un
type particulier d’information pouvant faire référence à plusieurs thèmes
proposés sur le site. Par exemple sur www.112.public.lu, les rubriques « Actualités »,
« Législation », « Publications » et « Statistiques » sont des rubriques transversales.
Identifiez ces types de contenus « transversaux » et centralisez-les dans des
rubriques transversales.
La mise en place de rubriques transversales permet d’optimiser l’exploration du site
par l’internaute en offrant plusieurs moyens d’accès aux mêmes informations.
L’utilisateur a en effet un accès direct au premier niveau dans le menu de gauche, et le
rédacteur peut en parallèle faire des renvois depuis les rubriques thématiques vers les
rubriques transversales concernées via le système des boîtes « Pour en savoir plus ».
Si les rubriques transversales sont sous-catégorisées de manière thématique, il est
généralement préférable pour des raisons de navigation de conserver la logique
thématique définie par les rubriques thématiques.
Les rubriques transversales les plus fréquemment rencontrées sur les sites web
publics sont les rubriques « Actualités » (présentant les actualités du site),
« Publications » (présentant les publications proposées sur le site, c’est-à-dire les
éléments dédiés à l’impression papier), « Législation » (recensant les documents de
lois proposés sur le site), « Formulaires » (recensant les formulaires liés aux thèmes
du site), « Statistiques ». Pour ces cinq rubriques transversales récurrentes,
l’ordonnancement retenu est le plus souvent « Actualités », puis « Publications »,
« Formulaires », « Législation » et enfin « Statistiques ».
Les rubriques thématiques doivent être clairement distinguées des rubriques
transversales.
Dans cette optique :
le menu vertical de gauche doit d’abord proposer les rubriques
thématiques (en haut), puis les rubriques transversales (en bas),
un espacement physique doit être prévu entre les deux types de
rubriques pour accentuer la distinction,
Pour chacune des rubriques transversales identifiées et afin de
faciliter la navigation et la compréhension des informations
proposées, il est nécessaire de définir des templates de
présentation spécifiques et de les utiliser de manière homogène au
sein des rubriques en question.
Les rubriques transversales « Actualités », « Législation » et
« Formulaires » étant des rubriques très fréquentes sur les sites, des
templates de présentation standard sont à disposition des
concepteurs et rédacteurs.
Page 22 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
5.3.7. Rubrique transversale « Actualités »
Par définition, la rubrique « Actualités » centralise toutes les actualités présentes sur le
site. Elle recense plus précisément des évènements particuliers comme des
conférences, des colloques, des réunions officielles diverses, des alertes, des
expositions, des salons professionnels, etc. Elle est à dissocier de la rubrique
« Nouveau sur ce site » (décrivant de manière rétro chronologique les derniers
éléments ajoutés au site).
Cette rubrique « Actualités » est gérée de manière automatique par le CMS via un
template.
En général, la première page de la rubrique propose les « n » dernières actualités
mises à disposition sur le site, sous forme d’une liste avec les titres des actualités en
lien cliquable. La date de l’actualité est proposée en guise de sous-titre. En fonction
des cas, il est possible de proposer un sur-titre mettant en valeur le type d’actualité
(p.ex. « Discours », « Conférence », etc.). Ce système de sous-titre et de sur-titre est
repris dans les fiches descriptives des actualités.
Les actualités antérieures sont archivées et accessibles via une
right-box spécifique (avec la possibilité de rechercher par mois
et par année).
5.3.8. Rubrique transversale « Publications »
Par définition, la rubrique « Publications » centralise toutes les publications présentes
sur le site et ayant un rapport direct avec les thèmes du site. Elle recense plus
précisément tous les documents principalement dédiés à l’impression : rapports
d’activité, rapports d’enquête officiels, brochures, livres numérisés etc.
Page 23 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Généralement, les informations de cette rubrique sont présentées sous la forme d’une
liste catégorisée, homogène et rapidement scannable (p.ex. en mettant en valeur
le titre de la publication, en proposant un descriptif textuel succinct et un visuel
représentatif de la publication, l’éditeur, la date de la publication, le lien permettant le
téléchargement de la publication, le type et le poids du document entre parenthèses).
Des choix de conception et de présentation plus évolués doivent être réalisés en
fonction du type et de la quantité des publications proposées.
5.3.9. Rubrique transversale « Législation »
Par définition, la rubrique « Législation » centralise tous les textes de lois (génériques
et spécifiques) présents sur le site et ayant un rapport direct avec les thèmes du site.
Dans certains cas spécifiques, des éléments d’ordre législatifs peuvent être proposés
dans des rubriques thématiques. Par exemple, pour une rubrique « Missions »
décrivant les missions d’un ministère, il est pertinent de décrire les éléments de lois sur
lesquels les missions en question sont basées. Néanmoins, les éléments de loi
proposés dans ces rubriques thématiques doivent se limiter à une explication
vulgarisée destinée au grand public, et proposer d’autres contenus que la simple
énumération de la loi en question. Dans ce cas spécifique, une boîte « Pour en savoir
plus » doit être proposée depuis la rubrique thématique vers la partie « Législation »
décrivant de manière plus officielle le document de loi en question.
Généralement, les informations de cette rubrique sont présentées sous la forme d’une
liste catégorisée, homogène et rapidement scannable (par exemple avec le titre du
document en lien, suivi d’un descriptif succinct du document de loi).
Des choix de conception et de présentation plus évolués doivent être réalisés en
fonction du type et de la quantité des documents d’ordre législatif proposés.
S’il est souhaité de mettre à disposition des documents de lois hébergés sur le site
www.legilux.public.lu, il est alors nécessaire de le stipuler clairement à l’internaute et
de proposer un lien vers la page HTML du site www.legilux.public.lu donnant accès à
la dernière version du document téléchargeable en question.
Page 24 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
5.3.10. Rubrique transversale « Formulaires »
Par définition, la rubrique « Formulaires » centralise tous les formulaires
téléchargeables présents sur le site et ayant un rapport direct avec les thèmes abordés
par ce site.
Généralement, les informations de cette rubrique sont présentées sous la forme d’une
liste catégorisée, homogène et rapidement scannable (par exemple avec le titre du
formulaire en lien, suivi d’un court descriptif, puis du type et du poids du document
entre parenthèses).
Des choix de conception et de présentation plus évolués doivent être réalisés en
fonction du type et de la quantité des documents d’ordre législatif proposés.
5.4. RUBRIQUES DE SUPPORT IMPLIQUANT UNE ATTENTION
REDACTIONNELLE
5.4.1. Rubrique « Plan du site »
La rubrique « Plan du site » permet de donner un aperçu général de la structure du
site. Elle correspond à une table des matières de l’ensemble du contenu du site et est
générée automatiquement par le système de gestion de contenu. Par défaut, ce plan
présente les trois premiers niveaux de menu de gauche du site.
Il est important de veiller à ce que ce plan reflète réellement la structure du site, c’està-dire
:
qu’il reprenne les titres exacts de toutes les rubriques de premier et second niveau
du menu de gauche du site,
que l’ordre du plan du site corresponde à l’ordre de présentation des informations
proposées par le menu vertical de gauche du site.
Page 25 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Pour des raisons de densité informationnelle, les liens du plan du site ne sont pas
soulignés.
5.4.2. Rubrique « Liens »
La rubrique « Liens » permet de mettre à disposition de l’internaute un ensemble de
liens en rapport direct avec le thème du site et considéré comme utile pour
l’internaute. Elle met également en avant la liste des principaux portails publics
luxembourgeois.
Ces liens sont généralement classés par catégories (par thèmes, par pays, etc.) et
renvoient vers les pages d’accueil de sites web en relation avec le sujet du site web en
question.
Plusieurs alternatives de présentation sont possibles, mais il est important d’adopter
une approche homogène. En général, il est conseillé d’adopter l’approche suivante :
www.urldusite.com : descriptif du site.
Page 26 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
5.4.3. Rubrique « Contact »
La mise en évidence des informations de contact est essentielle.
Cette rubrique propose différentes manières de contacter l’éditeur du site (par
courrier, fax, téléphone, e-mail) et d’autres informations en fonction du contexte (par
exemple un plan d’accès, les heures d’ouvertures etc.).
Il est de rigueur, dans la mesure du possible :
que toutes les informations de contact site (adresse postale, e-mail, personne de
contact, numéro de téléphone, fax) des entités présentant un lien direct avec la
thématique du site soient centralisées dans cette rubrique,
que si un plan d’accès est proposé à l’internaute, il le soit via une image cliquable
dans une « Context box »,
que l’adresse de contact du site respecte le formalisme « info@nom.public.lu »,
que le pays soit spécifié dans toutes les adresses postales proposées,
que les numéros de téléphone, de fax et les adresse e-mail proposés sur le site
respecte les formalismes suivants « Tél. : » ; « Fax : » ; « E-mail : »,
que l’indicatif téléphonique du pays soit précisé devant le(s) numéro(s) de
téléphone et de fax proposé(s) sur le site web,
si plusieurs contacts sont proposés dans la page, de mettre le contact principal
dans le corps de la page et les contacts jugés comme secondaires dans une rightbox.
Afin de fournir des services rapides et efficaces aux citoyens et de ne pas nuire à
l’image de l’Etat, les e-mails entrants devront être traités dans des délais aussi courts
que possible.
5.4.4. Rubrique « A propos du site »
Cette rubrique offre des informations sur l’éditeur du site et le cas échéant sur les
partenaires qui ont contribué à la mise en œuvre du site.
5.4.5. Rubrique « Notice légale »
Cette rubrique offre des informations concernant les questions de responsabilité, de
copyright, de crédit photos et de protection des données.
Page 27 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
5.5. SYSTEME DE SOUS-RUBRIQUES
Le système de sous-rubriques correspond à l’élément de navigation proposé pour les
troisièmes et niveaux inférieurs dans l’arborescence du site :
le recours au système de sous-catégories est optionnel pour les pages de premier
niveau dans l’arborescence du site. S’il est souhaité de proposer ce système dès le
premier niveau pour une rubrique donnée, il est préférable d’homogénéiser cela à
l’ensemble des rubriques de premier niveau du site,
le recours au système de sous-catégories est obligatoire pour les pages inférieures
au premier niveau (deuxième, troisième et niveaux inférieurs) dans l’arborescence
du site,
pour les pages inférieures au premier niveau dans l’arborescence du site, seul le
système de sous-catégories doit être employé pour proposer un accès direct aux
pages inférieures à la page en cours. Par exemple, un élément devant être
proposé dans un système de sous-rubriques ne peut pas être placé dans une rightbox
ou dans une boîte « Pour en savoir plus ».
Dans certains cas très spécifiques, notamment dans le cas de page présentant une
liste d’information de même nature (par exemple. la rubrique « Actualités »), le
système des sous-catégories ne doit pas être employé. Un template spécifique de
présentation doit alors être mis en place.
5.6. CHEMIN DE LOCALISATION
Le chemin de localisation (ou chemin de navigation ou encore « breadcrumb » en
anglais) est l’élément de navigation qui décrit la position de l’internaute dans le site :
le chemin de localisation doit décrire de manière fidèle la position de l’utilisateur
dans le site et reprendre tous les titres des pages associées,
Page 28 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
les éléments présents dans le chemin de localisation doivent être cliquables,
excepté le dernier qui correspond au titre de la page en cours.
5.7. RESPECTEZ UNE LIGNE EDITORIALE CLAIRES ET COHERENTE
Maintenir un site Internet requiert une véritable organisation et une ligne éditoriale
clairement définie.
5.7.1. Cohérence
Veillez à la cohérence globale de votre site Internet.
Utilisez une terminologie et un style cohérents à travers le site,
Conservez le même ton éditorial à travers le site. Plus il y a de rédacteurs, plus
ceci devient complexe,
Veillez à une cohérence visuelle, garant d'un professionnalisme,
Si vous utilisez des numérotations, veillez à ce que le format soit cohérent d'une
page à l'autre,
Évitez, grâce aux feuilles de styles, la multiplication des polices de caractères dans
le site.
5.7.2. Vigilance et qualité
Évitez les erreurs grammaticales, orthographiques et typographiques qui ralentissent la
lecture et donnent une mauvaise impression du site.
Utilisez les majuscules uniquement lorsque cela est nécessaire et veillez à une
utilisation cohérente à travers le site. D’une manière générale, les textes entièrement
en majuscules sont à proscrire,
Méfiez-vous des sigles et acronymes, souvent utilisés mais par forcément
compréhensibles par tous.
D’une manière générale, la signification de chaque abréviation ou acronyme doit être
précisée lors de leur première occurrence au sein de chaque page (ou document) où
ils apparaissent
Conservez le soulignement pour les liens uniquement,
D’une manière générale, il est très utile de faire relire vos pages (principes des 4
yeux minimum).
Page 29 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
5.8. FAVORISEZ LA LECTURE PAR VOS INTERNAUTE – PROPOSEZ UN
CONTENU « SCANNABLE »
Les études d’ergonomie web démontrent que les internautes ne lisent pas de manière
conventionnelle mais « scannent » (ils survolent tel un scanner) les pages qu’ils
explorent.
Différentes règles sont à considérer dans cette perspective.
5.8.1. Structurez les pages de contenu
Le texte d'introduction suit le même processus que pour le titre. Il doit être le résumé
de la page, en reprenant toutes les idées importantes de la page. L'utilisateur doit avoir
profiter de l'essentiel s'il décide d'interrompre sa lecture.
La première recommandation est donc de bien structurer les pages de contenu :
Structurez les pages avec 2 ou 3 niveaux de titres : titre, sur-titre, sous-titres et
éventuellement sous-sous-titres
Appliquez le principe de la pyramide inversée : commencez vos pages par un bref
résumé (chapeau) et ajoutez au fur et à mesure plus de détails (texte
développé),
Structurez le texte en paragraphes, de préférence un sujet/idée par paragraphe.
Chaque paragraphe pouvant faire 10 lignes maximum.
5.8.1.1. Clarté et concision
Afin de garantir la lisibilité et de permettre une lecture en diagonale, il est important de
veiller à la clarté du contenu.
Pour des questions de lisibilité utilisez des polices de caractères appartenant à la
famille de polices « sans sérif » et alignez les contenus de la page à gauche.
Culturellement les utilisateurs européens on appris à lire de gauche à droite et
même si cela peut paraître parfois plus équilibré graphiquement, le contenu centré
ou pire, aligné à droite apporte une difficulté de lecture inutile à l’utilisateur.
Utilisez avec beaucoup de précautions les caractères italiques difficiles à lire à
l'écran. L'utilisation de l’italique doit être conservé pour des informations très
spécifiques, telles que les citations, les extraits d’articles, les textes de lois, etc.
Utilisez des structures de phrases simples,
Parce que les internautes balayent les pages, facilitez une lecture rapide : soyez
bref. Un texte en ligne doit contenir 2 fois moins de mots qu’un texte imprimé.
Évitez les périphrases et les pléonasmes du genre "absolument essentiel",
Page 30 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Éliminez les mots superflus, et concentrez-vous sur la transmission précise de faits,
N'abusez pas d'abréviations, sigles et autres acronymes qui ne sont pas forcément
compris par tout le monde. Si vous vous référez dans votre texte à des concepts ou
organisations dont l’acronyme est plus souple à utiliser que l’intitulé complet,
utilisez à la première citation l’intitulé complet, suivi de l’acronyme. Par exemple :
« L’inspection du Travail et des Mines (ITM) est en charge de… »
Une autre facette importante de la rédaction web est la concision.
La concision consiste à obtenir le même résultat informatif en moins de mots, en
moins de phrases, moyennant moins de "bruit" (au sens linguistique du terme).
Quel que soit le support utilisé, la concision est une qualité précieuse pour le
rédacteur. Mais ce qui est un atout au niveau de l'écriture traditionnelle devient une
véritable nécessité sur Internet, dans un contexte où la lecture (à l'écran) est plus
difficile et où les internautes lisent en diagonale.
Présentez une idée par paragraphe,
Faites des phrases courtes,
Préférez la forme active à la forme passive.
5.8.1.2. Mise en relief
La difficulté de la lecture à l'écran et le fait que les internautes lisent en diagonale font
qu'il est très important, sur Internet, de donner du relief visuel à l'information.
Pour améliorer le relief d'une page :
Utilisez des titres et sous-titres,
Utilisez les caractères gras pour rendre plus visibles les mots, expressions, idées
importantes,
Utilisez des listes à puces ou des listes numérotées. Ces listes permettent
d’organiser l’information et de la mettre en évidence,
Utilisez les schémas, dessins, images pour illustrer certains contenus (ex
procédures, comparaison, etc.),
Utilisez les liens hypertextes pour renvoyer vers une autre page. Soyez
explicite et suffisamment informatif pour les liens hypertextes,
Page 31 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
5.9. PROPOSEZ DES TITRES ET SOUS-TITRES POUR VOS PAGES
Le titre est le principal identificateur de la page. Si la conception du site correspond aux
exigences en matière d’architecture de l’information, chaque titre de page présent
sur le site devrait être unique.
5.9.1. Le titre
Un titre de page doit répondre aux caractéristiques suivantes :
être précis,
être explicite et signifiant pour l’utilisateur 1 ,
être concis,
être descriptif et représentatif de l’information vers laquelle il renvoie,
respecter le formalisme suivant : première lettre en majuscule et lettres suivantes
en minuscules.
D’une manière générale, l’intitulé de chaque élément présent dans une zone de
navigation 2 doit se retrouver comme titre de la page vers laquelle il renvoie.
Exemple :
Préférez "La gastronomie luxembourgeoise" par rapport à "La gastronomie" qui
est plus précis pour l'utilisateur qui pourrait arriver sur la page à partir d'un moteur de
recherche.
Le respect de ces critères de base est d’autant plus important que le titre d’une page a
des répercutions à plusieurs niveaux.
Tout d’abord, il se retrouve :
comme titre HTML de la page, c’est-à-dire comme dénomination de bookmark de
la page,
comme label dans le système de navigation (menu de gauche ou sousrubriques)
pour les niveaux 1, 2 et 3 dans l’arborescence,
comme expression ajoutée dans le chemin de localisation (ou « breadcrumb » en
anglais),
Ensuite, il sert :
comme nom de la page trouvée à travers une recherche,
comme métadonnée importante pour l’indexation des pages par les différents
moteurs de recherche (internes au site ou externes).
1 Une erreur fréquente est de proposer des abréviations hermétiques en guise de titre
2 Il existe trois zones principales de navigation : les rubriques de support, la zone de navigation principale (menu
vertical de gauche), et la zone de navigation pour l’accès aux 3ème et niveaux inférieurs, appelée « Système de sousrubriques
»)
Page 32 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
5.9.2. Les sous-titres
Les sous-titres ont une grande importance sur Internet. Non seulement, ils permettent
de bien scinder les paragraphes et aident l'utilisateur en mode "recherche" qui va
parcourir la page en diagonale.
Les sous-titres devraient correspondre aux mêmes caractéristiques que les titres de
page.
5.10. ORIENTEZ LES UTILISATEURS AVEC LES LIENS HYPERTEXTES
Utilisez les liens pour orienter l’utilisateur. Attention néanmoins à ne pas créer un effet
labyrinthe en multipliant de manière déraisonnable les liens hypertextes dans une
page. En général, il est recommandé d’intégrer au maximum 5 à 10 liens au
contenu d’une même page.
Les intitulés de liens devraient dans la mesure du possible être :
explicites et signifiants pour l’utilisateur. Evitez les intitulés de liens génériques
de type « cliquez ici »,
descriptifs et représentatifs de l’information vers laquelle ils renvoient, et
compréhensibles hors contexte, de manière à ce que l’utilisateur comprenne quelle
est l’information qui se trouve derrière,
discriminants (surtout pour les liens contigus qui doivent clairement se
différencier),
composés en moyenne de 3 ou 4 mots,
conçus de manière à ne pas interrompre l’activité de lecture de l’internaute.
Ensuite :
le « BODY » d’une page ne doit pas contenir de lien pointant vers la page en cours,
chaque intitulé de lien identique (ou sémantiquement identique) doit mener vers la
même page,
chaque lien adjacent doit être séparé du précédent par un caractère imprimable.
Par exemple :
"inscrivez-vous en ligne en cliquant ici" doit être remplacé par "inscrivez-vous en ligne".
5.10.1. La présentation des liens
La présentation des liens est gérée par les feuilles de styles. Les liens apparaissent
toujours soulignés dans une couleur fixée au préalable dans la feuille de styles.
Le non soulignement des liens dans le contenu peut être considéré comme un progrès
esthétique, mais il est déconseillé, pour la raison toute simple que sa première
conséquence est la nécessité de les rechercher...
Page 33 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Dans la même perspective, le soulignement doit être conservé pour les liens.
Illustration : les liens non visités apparaissent en vert-bleu, les liens cliqués en orange
5.10.2. L'utilisation des ancres nommées
Le système d’ancre au sein d’une même page ne devrait pas être utilisé, excepté
pour le cas des messages d’erreur dans des pages présentant des formulaires.
L’utilisation de ce type d’ancre ne doit en aucun cas se substituer à une mauvaise
architecture de l’information.
Il est toutefois possible d’employer les ancres permettant de faire des renvois vers des
parties précises d’autres pages.
5.11. DISTINGUEZ LES LIENS INTERNES DES LIENS EXTERNES
Par définition, un lien interne est un lien qui renvoie à une page du site en cours de
consultation. Un lien externe est un lien qui mène à la page d’un autre site.
Page 34 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Quelques règles de base sont à observer :
chaque lien interne (pointant vers une page du site en cours) doit s’ouvrir dans la
fenêtre courante,
chaque lien externe (pointant vers une page d’un autre site) doit s’ouvrir dans une
nouvelle fenêtre,
aucun lien externe ne doit directement s’ouvrir lorsque l’utilisateur clique sur une
zone de navigation 1 .
Il est à noter que le rédacteur a la possibilité, s’il le souhaite et si cela fait du sens, de
proposer des liens internes et/ou externes dans une boîte « Pour en savoir plus ».
Dans le cas où le rédacteur souhaiterait proposer dans cette boîte « Pour en savoir
plus » un lien déjà présent dans le « BODY » de la page, il est préférable de définir des
intitulés de liens homogènes.
5.12. LES DOCUMENTS TELECHARGEABLES
Un document téléchargeable est tout autre document que du HTML (p.ex. un
document PDF, un document Word, un JPEG, un PPT, etc.).
Généralement, il est conseillé d’utiliser des formats largement répandus. Un format
PDF (dont le plug-in nécessaire à leur lecture est disponible par défaut dans la plupart
des versions de navigateurs) sera préféré aux formats Word, Excel, PowerPoint,
nécessitant MS Office.
Néanmoins, il est important de notifier que l’on constate encore trop souvent une
utilisation abusive du PDF alors que les informations pourraient être directement
proposées en version HTML. Les documents téléchargeables ne doivent pas
remplacer les pages HTML et le format PDF devrait être conservé uniquement pour
des documents dont la fonction première est d’être téléchargée (et/ou imprimée).
Les rédacteurs sont invités à proposer des documents téléchargeables aussi légers
que possible pour un téléchargement rapide.
Quelques autres recommandations sont à observer :
même s’ils sont déjà présents dans le « BODY » de la page, chaque document
téléchargeable doit obligatoirement être à nouveau proposé dans une boîte « Pour
en savoir plus » 2 . Les intitulés du document téléchargeable en question devraient
dans la mesure du possible être identiques (ou très similaires) dans le « BODY »
de la page et dans la boîte « Pour en savoir plus »,
1 Il existe trois zones principales de navigation : les rubriques de support, la zone de navigation principale (menu
vertical de gauche), et la zone de navigation pour l’accès aux 3ème et niveaux inférieurs, appelée (« Système de sous
rubriques »)
2 Ce standard ne s’applique pas aux pages qui ont pour vocation de présenter une liste de document téléchargeables.
Dans ce cas très spécifique, il n’est pas nécessaire de placer les documents téléchargeables dans une boîte « Pour en
savoir plus ». Des templates sont à disposition des concepteurs et rédacteurs
Page 35 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
aucun document téléchargeable ne doit directement s’ouvrir lorsque l’utilisateur
clique sur une zone de navigation 1 ,
tous les documents téléchargeables (internes ou externes) doivent s’ouvrir dans
une nouvelle fenêtre,
pour chaque document proposé en téléchargement, il est nécessaire de spécifier le
type et le poids associé en respectant le formalisme suivant :
Titre_du_document (TYPE DU DOCUMENT - poids du document en Ko),
5.13. UTILISEZ LES ELEMENTS CONTEXTUELS
Au-delà du fait qu'elle aide l'utilisateur à trouver ses repères, la contextualisation peut
être utilisée pour enrichir votre contenu. La contextualisation donne du sens à
l'information.
La contextualisation peut se faire par trois moyens : la boîte « Pour en savoir plus … »,
la « right-box », la « context-box ».
Utilisez la boîte "Pour en savoir plus …" pour :
proposer des liens vers des pages complémentaires à l'intérieur du site,
proposer des liens vers des sites offrant de l'information complémentaire,
proposer des liens vers des documents à télécharger offrant de l'information
complémentaire.
Le but de la boîte "Pour en savoir plus …" est de permettre à l'internaute d'accéder à
des informations complémentaires en relation avec le contenu de la page. Elles
permettent un approfondissement de la page en cours.
Utilisez les right-box pour :
mettre en évidence une information représentant un intérêt certain pour les
utilisateurs.
1 Comme précisé précédemment, il existe trois zones principales de navigation : les rubriques de support, la zone de
navigation principale (menu vertical de gauche), et la zone de navigation pour l’accès aux 3ème et niveaux inférieurs,
appelée (« Système de sous rubriques »)
Page 36 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Les right-box permettent de mettre en valeur toutes sortes d'informations liées au
sujet de la page ou encore d'intérêt général pour le site. Elles permettent de mettre le
focus sur une information importante pour l’utilisateur à un moment donné.
Utilisez la boîte « Contextuelle » pour :
présenter des informations spécifiques et concises (p. ex. des adresses ou des
contacts) en relation directe avec le contenu d’une page.
5.14. PALETTE DE COULEURS
Les couleurs doivent être employées avec parcimonie sur un site web.
Gardez à l’esprit que les couleurs doivent remplir avant tout un rôle fonctionnel et ne
pas créer de confusion pour les utilisateurs. Il est par exemple recommandé de réaliser
les premières maquettes du site sans la couleur, puis de définir un code couleur
pertinent en fonction des informations proposées sur le site. Ensuite, il est
généralement préférable d’utiliser une couleur de fond neutre et claire (par exemple du
blanc).
Pour des raisons d’accessibilité, il est dans la mesure du possible, recommandé :
Page 37 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
que l’information véhiculée par la couleur soit être également disponible lorsque les
couleurs sont désactivées,
que les différences de contraste entre l’avant et l’arrière plan soient suffisamment
élevées. Cela implique par exemple que ces différences soient perceptibles par
une personne ayant une déficience au niveau des couleurs, ou encore qu’elles
soient visibles sur un écran en noir et blanc.
5.15. ELEMENTS GRAPHIQUES
Un élément graphique peut renvoyer aux différents visuels constituant le lay-out (logo,
images, bandeau visuel), aux boutons d’action, aux icônes, aux schémas, aux images
et photos présents sur le site etc.
Il est généralement conseillé :
de privilégier un texte mis en forme à un texte mis sous forme d’image,
de privilégier la mise en place d’éléments graphiques qui apportent une réelle
plus-value aux informations des pages dans lesquelles ils s’insèrent,
de veiller à la lisibilité de ces éléments graphiques de manière à ce qu’ils
véhiculent facilement l’information qu’ils sont censés proposer,
d’associer, lorsque cela fait du sens, des légendes et des descriptions HTML aux
éléments graphiques (p. ex. pour un organigramme, une carte géographique, etc.),
de concevoir des éléments graphiques (en particulier pour les logos et les icônes)
qui soient pour l’utilisateur d’une part explicites et signifiants, et d’autre part
descriptifs et représentatifs de l’information vers laquelle ils renvoient.
Ensuite, il est préférable que :
chaque élément graphique propose une alternative textuelle, excepté ceux
destinés à la décoration. Ces derniers doivent être commentés par une alternative
texte nulle,
pour chacun des éléments graphiques qui sont en même temps des liens, le texte
contenu dans l’alternative de l’élément graphique doit donner la fonction du lien.
5.15.1. Les images
5.15.1.1. Les formats de compression
En quoi les 3 images de la figure ci-dessous sont-elles différentes ? Par leur format.
Celle de gauche est non compressée, celle du milieu au format GIF et celle de droite
au format JPEG.
Page 38 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Ces 3 formats d'images sont utilisés sur Internet et ils ont un point commun : ils sont
compressés pour que les images se chargent plus rapidement.
Image non compressée Compression GIF Compression JPEG
Nous n'entrerons pas dans les détails techniques de la compression. Sachez toutefois
qu'il existe 2 sortes de compression :
Sans perte de données : lorsque le fichier est affiché, chaque pixel retrouve sa
place exacte dans l'image.
Avec perte de données : le fichier subit une dégradation d'autant plus importante
que le taux de compression est élevé.
Le choix du format d'image s’effectuera dans un meilleur compromis entre qualité du
visuel et poids de l’image obtenue.
5.15.1.2. Le format GIF
Ce format est compressé sans perte de données.
Autres avantages, il est possible de créer des animations dans ce format et une de ses
couleurs peut être définie comme couleur transparente (c’est fort pratique quand
l'image s'intègre dans un fond).
L'inconvénient, c'est que le format GIF n'enregistre que 256 couleurs. Du coup, les
nuances d'une image sont rendues sous forme de bandes de densités différentes.
Page 39 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Observez la figure ci-dessous : à gauche, un dégradé en 256 couleurs, à droite, le
même dégradé en 8 couleurs.
Image non compressée
(226 Ko)
Compression GIF 256
couleurs (45 Ko)
Compression GIF 8
couleurs (8 Ko)
Alors quand utiliser et quand éviter le format GIF ?
Pour :
les boutons et bannières, car la typographie n'est pas dégradée.
les logos (surfaces de couleurs).
Les images nécessitant un détourage.
les photos en noir et blanc (elles ont généralement 256 niveaux de gris) ou en
monochromie.
Contre :
les photographies en couleur ou présentant des dégradés importants.
5.15.1.3. Le format JPEG
Ce format affiche jusqu'à 16,7 millions de couleurs.
Il n'est pas possible de créer d'animations ni de définir une couleur de transparence.
La compression est à perte de données, comme on le remarque sur la figure cidessous
:
Sur l'image de droite un taux de compression élevé révèle la destruction de données
que peut entraîner ce format.
Page 40 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Image non compressée
(226 Ko)
Compression JPEG 90%
(10 Ko)
Compression JPEG 10% (5
Ko)
La dégradation est très forte car le taux de compression est très élevé. En
compressant moins, la dégradation aurait été moins visible. Il est même possible de
l'éviter complètement en choisissant une compression nulle, mais alors attention aux
temps de chargement !
Alors quand utiliser et quand éviter le format JPEG ?
Pour :
les photographies en couleur et images comportant des dégradés importants.
Contre :
les images comportant de la typographie (les lettres "éclatent"), les images à motifs
géométriques,
Inutilisable pour : les détourages et les animations.
Il est très important de bien définir vos taux de compression.
La plupart des logiciels graphiques récents permet de définir le taux de compression
de vos images JPEG et le nombre de couleurs pour vos images GIF. Il est important
de bien définir ces critères afin d'obtenir le meilleur compromis qualité/poids.
Page 41 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
5.15.1.4. Les images entrelacées
En surfant sur le Web, vous avez sans doute vu s'afficher progressivement des
images. Ce procédé permet de faire patienter l’internaute en lui donnant très vite une
idée globale de l'image. C’est moins agaçant que de voir un cadre blanc se remplir
bande par bande.
Tous les formats d'image du Web sont capables d'entrelacer l'affichage des images.
C'est au moment de l'enregistrement au format GIF, JPEG que cette option est
proposée. Il est souvent possible de définir le nombre de passes : 3, 4 ou 5. En
général, 3 suffisent largement.
Remarque : Il est à noter que même si cette technique est toujours utilisable elle date
d’une époque où les connections Internet étaient encore bien plus lentes
qu’aujourd’hui. Il est donc moins utile d’utiliser ce principe, qui risque de donner une
image de vieux site.
Image intermédiaire d’affichage entrelacé
Image finale
Page 42 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
5.16. QUELQUES RECOMMANDATIONS POUR LA PAGE D’ACCUEIL DU SITE
La page d’accueil est le point d’entrée du site web et doit se démarquer des autres
pages du site. L’une de ses fonctions principales est d’optimiser la découverte du site
par l’internaute et plus spécifiquement :
de permettre à l’utilisateur de comprendre
rapidement quel est l’objectif du site,
quels sont les services et les informations
qu’il pourra trouver sur le site et ceux qu’il
ne pourra pas trouver, quelle est la
structure générale du site, etc.
de mettre en évidence les derniers
éléments ajoutées et importants pour
l’utilisateur,
de mettre en avant les informations à
forte valeur ajoutée et de proposer un
accès rapide à ces dernières.
Il est important de ne pas surcharger la page d’accueil en informations, de lui donner
une structure intelligible, transparente et aérée. L’utilisation de photos et d’images est
également souhaitée afin de lui conférer une apparence accueillante.
Ensuite il est de rigueur :
que la page d’accueil permettre une distinction claire entre les informations de type
« zones de navigation 1 » des informations de type « contenu 2 », communiquer
clairement les éléments cliquables et les différents moyens d’accès aux
informations,
que l’espace dédié à la présentation d’information de type « contenu » ne soit pas
utilisé pour dupliquer des zones de navigation déjà proposées sur le site,
qu’un template « A la une » soit utilisé pour mettre en avant les informations
dernièrement ajoutées au site (qui ont un caractère actuel), importantes pour
l’utilisateur et destinées à être remplacées dans le temps (par exemple des
actualités récentes, des publications récentes, des lois récentes, etc.).
1 Les informations de type « zone de navigation » correspondent à tous les éléments constitutifs du
système de navigation (logo, rubriques de support, menu de gauche, etc.)
2
Les informations de type « contenu » correspondent à toutes les informations présentes dans le
« BODY » de la page hors éléments de layout, p.ex. L’espace « A la une », une « Right-box »
Page 43 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
L’élément proposé en « A la une » doit renvoyer à une page HTML dans
l’arborescence du site. Il ne doit pas être employé pour mettre en valeur des
informations permanentes. En général, l’espace « À la une » est employé pour afficher
les dernières actualités rajoutées sur le site, mais il peut être utilisé pour n’importe
quel autre type de contenu répondant aux critères précités.
Il est également possible d’employer un système de « subtitle » pour distinguer les
types d’éléments proposés en « A la une ». En général, sont proposés deux éléments
en « A la une » avec un visuel, puis plus bas dans la seconde section de la page, une
partie « Actualités » avec les « n » dernières actualités.
que le système de « right-box » soit utilisé pour mettre le focus sur des informations
importantes (soit du site éditeur, soit d’un autre site) n’ayant pas leur place dans
l’espace « A la une »,
que le poids de la page d’accueil soit le plus léger possible.
Les sites institutionnels et les grands portails thématiques présentant des
besoins différents, deux modèles de page d’accueil, un premier pour les sites
institutionnels, un second pour les portails sont à disposition des équipes projets.
Page 44 / 55
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
6. CHECK-LIST DES RECOMMANDATIONS
Toutes les recommandations pratiques présentées ci-après sont basées sur des critères
d’ergonomie communément admis. Pour plus d’informations concernant ces critères
d’ergonomie, le lecteur peut se référer au « Référentiel de Normalisation pour les sites
web du Gouvernement Luxembourgeois » (ReNo).
Proposez du contenu à forte valeur ajoutée
OK PAS OK
Assurez les bases rédactionnelles
Proposez en priorité les informations que les utilisateurs
attendent
Allez à l’essentiel
Proposez un contenu adapté au langage des utilisateurs
ciblés. Veillez à utiliser une terminologie largement comprise
de tous
Evitez un communication trop administrative, pas en
adéquation avec les préoccupations concrètes des citoyens
ou entreprises
Proposez un contenu pertinent pour chaque page
Chaque page du site propose un contenu spécifique (un
système de sous-rubriques n’est pas considéré comme étant
un contenu spécifique)
La rédaction de chaque page ne se limite pas à l’énumération
des sous-rubriques qu’elle propose
La rédaction de chaque page ne se limite à proposer des liens
et des documents téléchargeables dans une boîte « Pour en
savoir plus »
Crédibilisez votre contenu
Mentionnez vos sources
Proposez des URLs parlantes pour vos utilisateurs
Les différentes URLs du site sont significatives pour
l’utilisateur.
P.ex., elles ne sont pas basées sur des termes en anglais
pour un site rédigé en français, ou encore sur des chiffres
lorsque cela ne fait pas de sens
Les différentes URLs du site ne présentent de majuscule, de
caractère spécial, de souligné (« underscore ») ou d’espace
OK
PAS OK
Définissez une architecture de l’information efficace
Définissez une arborescence régulière et équilibrée
L’architecture a d’abord été pensée en largeur puis en
profondeur
Pour chaque type et niveau de navigation, une largeur de 7± 2
éléments et une profondeur de 5 niveaux maximum pour
l’intégralité du site web sont mis en place
Les informations importantes sont accessibles en trois clics
depuis la page d’accueil
OK
PAS OK
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Si une rubrique propose des sous-rubriques, ces dernières
sont au moins au nombre de deux
Structurez l’information de manière logique pour vos utilisateurs cibles
Le site est organisé de manière thématique, en fonction de ce
que souhaite les utilisateurs
Les informations sont organisées en fonction des
caractéristiques des utilisateurs et de leurs tâches, non pas en
fonction de l’organisme (p. ex. de l’administration ou du
ministère) représentant le site web
Les aspects organisationnels doivent clairement se distinguer
des services concrets offerts aux citoyens
Définissez une catégorisation « exclusive » des informations
Même si une même information peut être accessible à partir
de plusieurs endroits dans le site web, elle ne se retrouve pas
à deux ou plusieurs endroits différents dans l’arborescence du
site
En d’autres termes, le site ne propose pas des informations
redondantes dans différentes parties de l’arborescence du
site. Les erreurs fréquentes à éviter sont p.ex. : mettre en
place deux pages qui présentent des contenus similaires,
utiliser un titre identique pour plusieurs pages, proposer des
rubriques ou sous-rubriques via le menu de gauche qui
rentrent en conflit avec les rubriques de support en place, etc.
Identifiez vos rubriques transversales
Identifiez les types de contenus récurrents sur le site et
communs aux différentes thématiques proposées sur ce
dernier (p.ex. des publications, des documents de lois) et
centralisez-les dans des rubriques transversales
Les rubriques transversales sont clairement distinguées des
rubriques thématiques.
Dans cette optique :
le menu vertical de gauche propose d’abord les
rubriques thématiques (en haut), puis les rubriques
transversales (en bas),
un espacement physique est prévu entre les deux
types de rubriques pour accentuer la distinction.
Pour chacune des rubriques transversales identifiées, des
templates de présentation spécifiques sont définis et utilisés
de manière homogène au sein des différentes rubriques
transversales
Principales rubriques transversales
La rubrique transversale « Actualités » centralise toutes les
actualités présentes sur le site. Elle recense plus précisément
des évènements particuliers comme des conférences, des
colloques, des réunions officielles diverses, des alertes, des
expositions, des salons professionnels, etc.
La rubrique transversale « Publications » centralise toutes les
publications présentes sur le site. Elle recense plus
précisément tous les documents principalement dédiés à
l’impression : rapports d’activité, rapports d’enquête officiels,
brochures, livres numérisés etc.
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
La rubrique transversale « Législation » centralise tous les
textes de lois (génériques et spécifiques) présents sur le site
et ayant un rapport direct avec les thèmes du site
Dans certains cas spécifiques, des éléments d’ordre législatifs
peuvent être proposés dans des rubriques thématiques.
P.ex. pour une rubrique « Missions » décrivant les missions
d’un ministère, il est pertinent de décrire les éléments de lois
sur lesquels les missions en question sont basées.
Néanmoins, les éléments de loi proposés dans des rubriques
thématiques doivent se limiter à une explication générique
destinée au grand public, et proposer d’autres contenus que
la simple énumération de la loi en question.
Dans ce cas spécifique, une boîte « Pour en savoir plus » est
proposée depuis la rubrique thématique vers la partie
« Législation » décrivant de manière plus officielle le
document de loi en question
S’il est souhaité de mettre à disposition des documents de lois
hébergés sur le site www.legilux.public.lu, il est alors nécessaire
de le stipuler clairement à l’internaute et de proposer un lien
vers la page HTML du site www.legilux.public.lu donnant accès
à la dernière version du document téléchargeable en question
La rubrique transversale « Formulaires » centralise tous les
formulaires téléchargeables présents sur le site et ayant un
rapport direct avec les thèmes abordés par ce site
Définissez des titres parlants pour vos utilisateurs
OK PAS OK
Chaque titre est précis
Chaque titre est explicite et signifiant pour l’utilisateur
Chaque titre est descriptif et représentatif de l’information vers
laquelle ils renvoient
Chaque titre est concis
Aménagez les rubriques de support
Rubrique « Plan du site »
Le plan du site présente les trois premiers niveau de menu de
gauche du site
Le plan du site reprend les titres exacts de toutes les
rubriques de premier et second niveau du menu de gauche du
site
L’ordre du plan du site correspond à l’ordre de présentation
des informations proposées par le menu vertical de gauche du
site
Rubrique « Liens »
La rubrique « Liens » met à disposition de l’internaute un
ensemble de liens en rapport direct avec le thème du site et
considéré comme utile pour l’internaute. Elle met également
en avant la liste des principaux portails publics
luxembourgeois
OK
PAS OK
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Ces liens sont classés par catégories (par thèmes, par pays,
etc.) et renvoient vers les pages d’accueil de sites web en
relation avec le sujet du site web en question
Les liens sont présentés de manière homogène
Rubrique « Contact »
La rubrique « Contact » centralise toutes les informations de
contact site (adresse postale, e-mail, personne de contact,
numéro de téléphone, fax) des entités présentant un lien
direct avec la thématique du site
Si un plan d’accès est mis à disposition, il est proposé via une
image cliquable située dans une « Context-box »
L’adresse de contact du site respecte le formalisme
« info@nom.public.lu »
Le pays est spécifié dans toutes les adresses postales
proposées
Les numéros de téléphone, de fax et les adresse e-mail
proposés sur le site respectent les formalismes suivants
« Tél. : » ; « Fax : » ; « E-mail : »
L’indicatif téléphonique du pays est précisé devant le(s)
numéro(s) de téléphone et de fax proposé(s) sur le site web
Si plusieurs contacts sont proposés dans la page, le contact
principal est exposé dans le corps de la page et les contacts
jugés comme secondaires dans une right-box
Rubrique « A propos du site »
La rubrique « A propos du site » offre des informations sur
l’éditeur du site et le cas échéant sur les partenaires qui ont
contribué à la mise en œuvre du site
Rubrique « Notice légale »
La rubrique « Notice légale » offre des informations
concernant les questions de responsabilité, de copyright, de
crédit photos et de protection des données
Utilisez le système des sous-rubriques à bon escient
Le recours au système de sous-catégories est optionnel pour
les pages de premier niveau dans l’arborescence du site.
Malgré tout, s’il est souhaité de proposer ce système dès le
premier niveau pour une rubrique donnée, ce choix est élargit
à l’ensemble des rubriques de premier niveau du site
Le système de sous-catégories est utilisé pour les pages
inférieures au premier niveau (deuxième, troisième et niveaux
inférieurs) dans l’arborescence du site
Pour les pages inférieures au premier niveau dans
l’arborescence du site, seul le système de sous-catégories est
employé pour proposer un accès direct aux pages inférieures
à la page en cours.
P. ex., un élément devant être proposé dans un système de
sous-rubriques ne peut pas être placé dans une right-box ou
dans une boîte « Pour en savoir plus »,
Dans certains cas très spécifiques, notamment dans le cas de
page présentant une liste d’information de même nature (p.ex.
la rubrique « Actualités »), le système des sous-catégories
n’est pas employé. Un template spécifique de présentation est
mis en place.
OK
PAS OK
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Vérifiez les principes de base pour le chemin de localisation
Le chemin de localisation décrit de manière fidèle la position
de l’utilisateur dans le site et reprend tous les titres des pages
associées.
Les éléments présents dans le chemin de localisation sont
cliquables, excepté le dernier qui correspond au titre de la
page en cours.
OK
PAS OK
Respectez une ligne éditoriale claire et homogène
OK
Homogénéisez la terminologie et le style à travers à tout le
site
Conservez le même ton éditorial à travers le site. Plus il y a de
tons éditoriaux différents, plus cela devient difficile pour
l’utilisateur
Si vous utilisez des numérotations, veillez à ce que le format
soit cohérent d'une page à l'autre.
Évitez, grâce aux feuilles de styles, la multiplication des
polices de caractères dans le site.
Évitez les erreurs grammaticales, orthographiques et
typographiques qui ralentissent la lecture et donnent une
mauvaise impression du site.
Utilisez les majuscules uniquement lorsque cela est
nécessaire et veillez à une utilisation cohérente à travers le
site. D’une manière générale, les textes entièrement en
majuscules sont à proscrire.
Méfiez-vous des sigles et acronymes, souvent utilisés mais
pas forcément compréhensibles par tous.
Conservez le soulignement pour les liens uniquement
Faites relire vos pages (principe des 4 yeux minimum).
PAS OK
Favorisez la lecture par vos internautes – Proposez un contenu
scannable
OK PAS OK
La base
Structurez les pages avec 2 ou 3 niveaux de titres.
Structurez vos pages suivant le principe de la pyramide
inversée :
De la conclusion vers l’information détaillée. Mettez
l’information importante en début de phrase et les phrases
importantes en début de paragraphe
Structurez le texte développé en paragraphes, de préférence
un sujet/idée par paragraphe. Chaque paragraphe pouvant
faire 10 lignes maximum
Clarté et concision
Utilisez des polices de caractères qui appartiennent à la
famille de polices « sans sérif »
Alignez les contenus de la page à gauche.
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Utilisez avec beaucoup de précautions les caractères italiques
difficiles à lire à l'écran. L'utilisation de l'italique est réservée
aux citations, extraits d'articles, de textes de lois
Utilisez des structures de phrases simples
Facilitez une lecture rapide: Soyez bref.
Un texte en ligne doit contenir 2 fois moins de mots qu’un
texte imprimé.
Évitez les périphrases, et les pléonasmes du genre
"absolument essentiel",
Éliminez les mots superflus, et concentrez-vous sur la
transmission précise de faits,
N'abusez pas d'abréviations, sigles et autres acronymes qui
ne sont pas forcément compris par tout le monde.
Définissez la signification de chaque abréviation ou acronyme
lors de leur première occurrence au sein de chaque page (ou
document) où ils apparaissent.
Présentez une idée par paragraphe
Préférez la forme active à la forme passive
Mise en relief
Utilisez des titres et sous-titres
Utilisez les caractères gras pour rendre plus visibles les mots,
expressions, idées importantes
Utilisez des listes à puces ou des listes numérotées. Ces
listes permettent d’organiser l’information et de la mettre en
évidence
Utilisez les schémas, dessins, images pour illustrer certains
contenus (ex procédures, comparaison, etc.)
Utilisez les liens hypertextes pour renvoyer vers une autre
page. Soyez explicite et suffisamment informatif pour les liens
hypertextes,
Proposez des titres et sous-titres pour vos pages
OK PAS OK
Chaque titre présent sur le site est unique
Chaque titre est précis
Chaque titre est explicite et signifiant
Chaque titre est concis
Chaque titre est descriptif et représentatif de l’information vers
laquelle il renvoie
Chaque titre respecte le formalisme suivant : première lettre
en majuscule et lettre suivante en minuscules
L’intitulé de chaque élément présent dans une zone de
navigation 8 se retrouve comme titre de la page vers laquelle il
renvoie.
Orientez les utilisateurs avec les liens hypertextes
Règles de base
OK
PAS OK
8 il existe trois zones principales de navigation : les rubriques de support, la zone de navigation principale (menu vertical de
gauche), et la zone de navigation pour l’accès aux 3ème et niveaux inférieurs, appelée (« Système de sous-rubriques »)
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Utilisez les liens hypertextes pour orienter les utilisateurs.
Attention néanmoins à ne pas créer un effet labyrinthe en
multipliant de manière déraisonnable les liens hypertextes
dans une page. En général, il est recommandé d’intégrer au
maximum 5 à 10 liens au contenu d’une même page
Les intitulés de liens sont explicites et signifiants pour
l’utilisateur. Evitez les intitulés de liens génériques de type
« cliquez ici »
Les intitulés de liens sont descriptifs et représentatifs de
l’information vers laquelle ils renvoient, et compréhensibles
hors contexte, de manière à ce que l’utilisateur comprenne
quelle est l’information qui se trouve derrière
Les intitulés de liens sont discriminants (surtout pour les liens
contigus qui doivent clairement se différencier)
Les liens sont composés en moyenne de 3 ou 4 mots
Les liens sont conçus de manière à ne pas interrompre
l’activité de lecture de l’internaute
Le « BODY » d’une page ne contient pas de lien pointant vers
la page en cours
Chaque intitulé de lien identique (ou sémantiquement
identique) mène vers la même page
Chaque lien adjacent est séparé du précédent par un
caractère imprimable
Présentation des liens
Les liens sont toujours soulignés
Le soulignement est conservé pour les liens
Système d’ancre
Le système d’ancre n’est pas employé au sein d’une même
page.
Quoi qu’il arrive, l’utilisation du système d’ancre ne doit pas se
substituer à une mauvaise architecture de l’information. Il est
néanmoins possible d’employer les ancres permettant de faire
des renvois vers des parties précises d’autres pages
Distinguez les liens internes des liens externes
OK
Chaque lien interne (pointant vers une page du site en cours)
s’ouvre dans la fenêtre courante
Chaque lien externe (pointant vers une page d’un autre site)
s’ouvre dans une nouvelle fenêtre
Aucun lien externe ne s’ouvre directement lorsque l’utilisateur
clique sur une zone de navigation 9.
PAS OK
Documents téléchargeables
OK
PAS OK
9 Comme précisé précédemment, il existe trois zones principales de navigation : les rubriques de support, la zone de navigation
principale (menu vertical de gauche), et la zone de navigation pour l’accès aux 3ème et niveaux inférieurs, appelée « Système
de sous-rubriques »)
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
Les documents téléchargeables sont uniquement conservés
pour des documents dont la fonction première est d’être
téléchargée. Attention ! Les documents téléchargeables (p.ex.
PDF, Word, etc.) ne doivent pas remplacer les pages HTML
Même s’ils sont déjà présents dans le « BODY » de la page,
chaque document téléchargeable est obligatoirement proposé
à nouveau dans une boîte « Pour en savoir plus » 10 . Les
intitulés du document téléchargeable en question sont dans la
mesure du possible identiques (ou très similaires) dans le
« BODY » de la page et dans la boîte « Pour en savoir plus »
Aucun document téléchargeable ne s’ouvre directement
lorsque l’utilisateur clique sur une zone de navigation 11
Tous les documents téléchargeables (internes ou externes)
s’ouvrent dans une nouvelle fenêtre
Pour chaque document proposé en téléchargement, le type et
le poids associé sont proposés en respectant le formalisme
suivant :
Titre_du_document (TYPE DU DOCUMENT - poids du
document en Ko),
Utilisez des éléments contextuels
Utilisez le système des boîtes pour en savoir plus pour mettre
en évidence des informations complémentaires en relation
avec le contenu de la page. Les boîtes pour en savoir plus
permettent un approfondissement de la page en cours
Utilisez le système des boîtes de droite (« Right-box ») pour
mettre en valeur toutes sortes d’informations liées au sujet de
la page ou encore d’intérêt général pour le site
Les right-box permettent de mettre le focus à un moment
donné sur une information.
Utilisez la boîte « Contextuelle » pour présenter des
informations spécifiques et concises (p. ex. des adresses ou
des contacts) en relation directe avec le contenu d’une page.
OK
PAS OK
Palette de couleurs
L’information véhiculée par la couleur est également
disponible lorsque les couleurs sont désactivées
Les différences de contraste entre l’avant et l’arrière plan sont
suffisamment élevées. Cela implique p.ex. que ces
différences soient perceptibles par une personne ayant une
déficience au niveau des couleurs, ou encore qu’elles soient
visibles sur un écran en noir et blanc
OK
PAS OK
Eléments graphiques
10 Ce standard ne s’applique pas aux pages qui ont pour vocation de présenter une liste de document téléchargeables. Dans
ce cas très spécifique, il n’est pas nécessaire de placer les documents téléchargeables dans une boîtes « Pour en savoir plus ».
Des templates de sont à disposition des concepteurs et rédacteurs
11 Comme précisé précédemment, il existe trois zones principales de navigation : les rubriques de support, la zone de
navigation principale (menu vertical de gauche), et la zone de navigation pour l’accès aux 3ème et niveaux inférieurs, appelée
(« Système de sous-rubriques »)
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
La base
Privilégiez la mise en place d’éléments graphiques qui
apportent une réelle plus-value aux informations des pages
dans lesquelles ils s’insèrent
Veillez à la lisibilité de ces éléments graphiques de manière à
ce qu’ils véhiculent facilement l’information qu’ils sont censés
proposer
Associez, lorsque cela fait du sens, des légendes et des
descriptions HTML aux éléments graphiques (p. ex. pour un
organigramme, une carte géographique, etc.)
Concevez des éléments graphiques (en particulier pour les
logos et les icônes) qui soient pour l’utilisateur d’une part
explicites et signifiants, et d’autre part descriptifs et
représentatifs de l’information vers laquelle ils renvoient
Pour chaque élément graphique, proposez une alternative
textuelle, excepté ceux destinés à la décoration. Ces derniers
doivent être commentés par une alternative texte nulle
Pour chacun des éléments graphiques qui sont en même
temps des liens, le texte contenu dans l’alternative de
l’élément graphique doit donner la fonction du lien
Format des images
Le format GIF doit être employé pour les boutons, les
bannières, les logos, les images nécessitant un détourage, les
photos en noir et blanc.
Le format JPEG doit être employé pour les photographies en
couleur et images comportant des dégradés importants
OK
PAS OK
Quelques recommandations pour la page d’accueil
Mettez en avant les objectifs du site
Votre page d’accueil doit permettre à l’utilisateur de
comprendre rapidement quel est l’objectif du site, quelles sont
les informations et les services qu’il pourra trouver sur le site
et ceux qu’il ne pourra pas trouver, quelle est la structure
générale du site
La page d’accueil doit mettre en évidence les derniers
éléments ajoutées et importants pour l’utilisateur
Optimisez la navigation
La page d’accueil met en avant les informations à forte valeur
ajoutée et propose un accès rapide à ces dernières
La page d’accueil permet une distinction claire entre les
informations de type « zones de navigation 12 » des
informations de type « contenu 13 », et communique clairement
les éléments cliquables et les différents moyens d’accès aux
informations
Le système de « right-box » est utilisé pour mettre le focus sur
des informations importantes (soit du site éditeur, soit d’un
autre site) n’ayant pas leur place dans l’espace « A la une »
OK
PAS OK
12 Les informations de type « zone de navigation » correspondent à tous les éléments constitutifs du système de navigation
(logo, rubriques de support, menu de gauche, etc.)
13 Les informations de type « contenu » correspondent à toutes les informations présentes dans le « BODY » de la page hors
éléments de lay-out, p.ex. L’espace « A la une », une « Right-box »
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
L’espace dédié à la présentation d’information de type
« contenu » n’est pas être utilisé pour dupliquer des zones de
navigation déjà proposées sur le site
Elément « A la une »
Un template « A la une » est utilisé pour mettre en avant les
informations dernièrement ajoutées au site (qui ont un
caractère actuel), importantes pour l’utilisateur et destinées à
être remplacées dans le temps (p.ex. des actualités récentes,
des publications récentes, des lois récentes, etc.)
L’élément proposé en « A la une » renvoie à une page HTML
dans l’arborescence du site
L’espace « A la une » n’est pas employé pour mettre en
valeur des informations permanentes
En général, l’espace « A la une » est employé pour afficher
les dernières actualités rajoutées sur le site, mais il peut être
utilisé pour n’importe quel autre type de contenu répondant
aux critères précités
Dernières recommandations
Le poids de la page d’accueil est le plus léger possible
Des photos et images sont proposées pour donner une image
accueillante
7. LIENS UTILES
7.1. ACCESSIBILITE
Programme eEurope :
http://europa.eu.int/information_society/topics/citizens/accessibility/web/index_en.htm
W3 Consortium :
http://www.w3.org/
Web Accessibility Initiative du W3C :
http://www.w3.org/WAI/
7.2. NAVIGATEURS
Opéra :
http://www.opera.com
Mozilla :
http://www.mozilla.org
Lynx – simulation en ligne :
http://www.delorie.com/web/lynxview.html
7.3. CONVERSION PDF EN LIGNE
PostScript to PDF conversion :
http://www.ps2pdf.com/convert/convert.htm
PDF – HTML conversion :
http://www.gohtm.com/convert_pdf.asp
Microsoft Office file formats – PDF :
http://www.k2pdf.com
7.4. TRAITEMENT DES IMAGES (LOGICIELS GRATUITS)
Slowview :
Rédaction de contenu pour Internet
Date: 20 février 2009
Version : 01-01
http://www.slowview.at
Irfanview :
http://www.irfanview.com
7.5. TRADUCTION EN LIGNE
Traducteur de textes ou de sites en ligne GOOGLE :
http://www.google.com/language_tools
Change language