1.
Techniques et bonnes pratiques pour
Écrire pour le Web
Remis à jour le 2 janvier 2010
Présentation conçue par Luc Legay (Les Explorateurs du Web) en
collaboration avec Joël Ronez (Ronez.net), Jean-Philippe Cathelin (A Conseil),
Sébastien Bailly (Paris-Normandie), Xavier de Mazenod (Adverbe.com).
Autres sources : Jean-Marc Hardy (redaction.be), Jakob Nielsen (useit.com), Laurent Goffin (gwix.net)
Diffusable sous licence Creative Commons by-nc-nd/2.0
http://creativecommons.org/licenses/by-nc-nd/2.0/fr/

2.
Techniques journalistiques

3.
Loi de proximité
Nation
Ma région
Ma ville
Collègues
Mon quartier
Amis
Travail Voisinage
Loisirs
Argent Chez moi
Moi Conjoint
Famille
Société
Aujourd’hui
Demain Santé
Hier Vie politique
Avant-hier Religion

4.
Combien de
niveaux de lecture
dans un titre
de presse ?

5.
Tétières, rubriques,
titres, surtitres,
chapeaux, intertitres,
photos, dessins,
légendes, accroches,
relances, exergues,
cabochons, signatures,
encadrés (nombreux
types d’encadrés…),
date, lieux, genre,
source, crédit...

6.
Parfois plus de
100 niveaux
de lecture différenciés
par un traitement graphique
et éditorial spécifique

7.
Finalité recherchée ?

8.
Eviter l’ennui…
Creative Commons Alexander N http://www.flickr.com/photos/64939463

9.
Print versus Web

10.
Quelles di érences de contraintes ?
11

11.
Print Web
qualité du support, Pixels, RVB,
format support, résolution écran,
encre, CMJN, 300 72 dpi, choix typo
dpi, couleur-offset, limité, débit de
roto, tirage, connexion,
calibrage des référencement,
textes… poids des pages…

12.
Spéci cités du Web face aux autres médias
TV Radio Presse Web
ACCESSIBILITÉ OUI
TEXTE OUI OUI
PHOTO OUI OUI
VIDÉO OUI OUI
INTERACTIVITÉ OUI
INFOGRAPHIES OUI OUI
OUI MIX NON

13.
Lecture à l’écran

14.
Lisibilité
Sur écran on lit en moyenne
25
moins vite
%
que sur papier
Source : http://www.useit.com/alertbox/percent-text-read.html

15.
Source : http://www.useit.com/alertbox/percent-text-read.html

16.
Lecture zapping
20%
80%
lecture mot à mot
lecture en diagonale
Source : http://www.useit.com/alertbox/percent-text-read.html

17.
Eyetracking

18.
Source : http://www.useit.com/alertbox/reading_pattern.html

19.
Lecture en « F »
Je m’intéresse
Je recherche
Source : Laurent Goffin http://www.gwix.net/web_gwix/article.asp?filID=233

20.
“scannabilité”
ou perception de l’information

21.
3/10 e de seconde
pour “scanner” un site

22.
Spéci cités d’une page Web

23.
La ligne de ottaison d’une page
24

24.
Ligne de ottaison
Seuls 22 %
des internautes
scrollent jusqu’au
Source : ClickTale sur 120 000 pages vues
entre nov. 2006 et Déc. 2006.
pied de page
http://blog.clicktale.com/?p=19 25

25.
Optimiser l’architecture du site

26.
le rubricage
structure et organise
les informations

27.
les codes implicites
Creative Commons Brian Talbot http://www.flickr.com/photos/b-tal/116220689/

28.
Navigation principale
Navigation secondaire
Raccourcis contextuels
Liens transversaux
Mentions légales, crédits
Source : http://www.ergolab.net/articles/architecture-information.html

29.
Fil d’ariane Navigation principale
Navigation secondaire
Navigation transversale
Mentions légales, crédits, contact

30.
hypertexte ?
interactivité ?
lisibilité ?
multimédia ?

31.
Hypertexte :
une page web est toujours reliée

32.
Quel texte sur un lien ?
Cliquez-ici

33.
Proposer des liens vers des
articles internes complémentaires

34.
242 liens internes

35.
Proposer des liens vers des
ressources externes complémentaires

36.
Multimédia
Images, vidéos, animations

37.
Interactivité
Commentaires, réactions, avis…

38.
consommateurs vs producteurs

39.
Viral
Envoyer à un ami, ajouter à Delicious,
poster sur Twitter…

40.
Règles d’écriture Web

41.
La pyramide inversée

42.
Organiser l’information
du synthétique vers l’exhaustif

43.
1. News 2. Sports 3. Tech 4. Life 5. Travel

44.
l’essentiel
les détails

45.
+ récent + immédiat + important + proche
Titre
chapeau
texte
+ détaillé + loin

46.
QQOQP
Qui, quoi, où, quand et pourquoi ?

47.
5W+2
who (qui), what (quoi), when (quand),
where (où), why (pourquoi)
et, parfois, how (comment)
et how much (combien) ?

48.
Faciliter la lecture
Creative Commons Thomas Hawk http://www.flickr.com/photos/thomashawk/2354086423/

49.
Ecrire court
Creative Commons Margolove (Margo C.) http://www.flickr.com/photos/margolove/1810357551/

50.
Relire pour réduire
Creative Commons Thomas Hawk http://www.flickr.com/photos/thomashawk/93821899

51.
15
à 20 mots
correspond à l’empan
de la mémoire(10), soit à notre
capacité moyenne de mémorisation
immédiate des informations (20)…
Source : http://www.cybertribes.com/lisibilite.html

52.
Capacité de mémorisation
Phrase 12 mots 17 mots 40 mots
Mémorisation 100% 70% 30%
Source : François Richaudeau, 1979

53.
Concision : 1 idée = 1 paragraphe

54.
Dé
cou
page
Un seul titre et un seul sujet par page
Licence Creative Commons by-nc-sa/2.0 : Semuthutan Azri http://www.flickr.com/photos/azriadnan/1818312422

55.
Aller à l’essentiel
Creative Commons Fernando Revilla http://www.flickr.com/photos/revilla/644219138/

56.
Structurer
Creative commons Dynamosquito http://www.flickr.com/photos/dynamosquito

57.
Rester clair
Creative Commons Anita Martinz http://www.flickr.com/photos/annia316/754581568

58.
Les sites web sont rendu plus accessibles
aux handicapés grâce à la norme AccessiWeb
Laquelle de ces phrases préférez-vous ?
AccessiWeb rend les sites web
plus accessibles aux handicapés

59.
Utiliser la voix active
Creative Commons Duncan c http://www.flickr.com/photos/duncan/3957636207/

60.
Connaître sa cible

61.
Dé nir l’o re en termes
de modes de traitement

62.
testé pour vous astuce actualité
dossier rendez-vous en images
interview info-service opinion
chronique 3 questions à bon plan
coulisses sondage glossaire conseils
reportage tribune commentaire
comparatif vidéo décryptage édito
coulisses dernière heure réponse

63.
Dé nir pour chaque traitement :
Nom, éléments de titraille, date, auteur, long. texte,
photo, légende, vidéos, citations, éléments
contextuels… Position dans la page

64.
Organiser l’accès aux contenus

65.
Organiser l’accès aux contenus
Thématique

66.
Organiser l’accès aux contenus
Géographique

67.
Organiser l’accès aux contenus
Chronologique
72

68.
Organiser l’accès aux contenus
Alphabétique

69.
Organiser l’accès aux contenus
Rédactionnelle
74

70.
Organiser l’accès aux contenus
O re produit
75

71.
Organiser l’accès aux contenus
Audience
76

72.
Organiser l’accès aux contenus
Fonctionnelle

73.
Organiser l’accès aux contenus
Popularité
78

74.
Organiser l’accès aux contenus
Pertinence
79

75.
Par où arrive le visiteur ?

76.
Pas toujours par la grande porte

77.
Chaque page peut devenir une porte d’entrée
82

78.
Titre
informatif versus incitatif

79.
« Georges Simenon est mort »

80.
« Maigret casse sa pipe »

81.
« La Nano, la voiture la moins
chère du monde, arrive en Inde »

82.
« Sortie embouteillée
pour la Nano low-cost »

83.
Ecrire des titres pour informer

84.
votre premier lecteur

85.
1000
milliards de pages web indexées

86.
17%
+
.com
83%
Part du tra c généré par les moteurs de recherche (France)
Janvier 2008 IAB et comScore

87.
42%
des utilisateurs de
cliquent sur le premier résultat

88.
5%
des utilisateurs de
cliquent sur le 4e résultat

89.
Visibilité
naturelle versus commerciale

90.
96

91.
7 principaux critères
de visibilité des contenus

92.
7 principaux critères de visibilité des contenus
1 Nom du domaine
http://www.mon-site.com

93.
7 principaux critères de visibilité des contenus
2 Titre de la page

94.
7 principaux critères de visibilité des contenus
3 Balises de titres
et enrichissements
<h1>, <h2>… <strong>,
<em>, <ul>…

95.
7 principaux critères de visibilité des contenus
4 Page Rank
Quantité et popularité
des liens entrants (PR)

96.
7 principaux critères de visibilité des contenus
5 Texte des liens o shore
Appellation des liens
qui pointent sur votre page

97.
Pour plus d’info
sur ce site web, cliquez ici

98.
Pour plus d’info
visitez France Info
Pour plus d’info visitez <a href="http://www.france-info.com/">France Info</a>

99.
7 principaux critères de visibilité des contenus
6 Termes lisibles de l’URL
http://monsite.com/termes-lisibles

100.
7 principaux critères de visibilité des contenus
7 Contenus, contenus
et contenus…
Quantité, qualité et actualisation
des contenus constituent la
meilleure garantie de visibilité

101.
Rédiger pour le Web
Présentation conçue par Luc Legay (Les Explorateurs
du Web) en collaboration avec Joël Ronez (Ronez.net),
Jean-Philippe Cathelin (A Conseil), Sébastien Bailly
(Paris-Normandie), Xavier de Mazenod (Adverbe.com).
Autres sources : Jean-Marc Hardy (redaction.be), Jakob Nielsen
(useit.com), Laurent Goffin (gwix.net)
Prière de ne reproduire les contenus et images de ce document que dans le cadre stricte de
cette licence, en conservant les liens vers les sources originales
Diffusable sous licence Creative Commons by-nc-nd/2.0
http://creativecommons.org/licenses/by-nc-nd/2.0/fr/