1. SOCIAL MEDIA WEEK
Ecrire pour le web
18 février 2013

2. SOMMAIRE
1. Comportements de lecture sur internet
2. Points techniques
3. Vos contenus vs. Google
4. Quelques conseils à garder en tête
5. Aller plus loin : texte et formats innovants
mail : fleur.douet@lanetscouade.com mail : corentin.marsac@lanetscouade.com
twitter : @fleurdouet twitter : @corentinmarsac

3. 1 Comportements de lecture sur le web

4. Le web est un média interactif
L'information est abondante
On ne lit pas... on « scanne » en attrapant des mots clés !
On lit 25 % moins vite à l'écran que sur papier
79 % des internautes scannent (balayent) les textes au lieu de les
lire
10 % seulement des internautes utilisent les barres de
défilement
Si on ne trouve pas, on part chercher ailleurs
L’internaute décide en un coup d’œil de l’intérêt de la page
Vous avez 3/10e de seconde pour le convaincre !
Il lit en moyenne :
20 % d'un texte de 600 mots
50 % d'un texte de 100 mots
Jakob Nielsen, Why Web users scan Instead of read, (1997) et Reading on the web (1997)

5. Carte de chaleur - Le F pattern
La lecture à l’écran est difficile
● On lit donc en diagonale, en survolant l’écran
● On lit bien un texte de gauche à droite
● Sur une page de résultats Google, tous les regards cumulés forment un triangle

6. Dans le palmarès des zones les plus ignorées on trouve :
● Les zones à faible densité informationnelle
● Les zones difficiles à lire ou à comprendre

7. Les internautes se concentrent sur les zones qui peuvent leur apporter le plus d'informations en un minimum
d'efforts. Ils regardent surtout :
● Les informations synthétisées (titres, tableaux, listes...)
● Les éléments de navigation (menu, moteur de recherche...)
● Les liens hypertextes
● Les images légendées

8. 2 Points techniques

9. Accessibilité : le web est aveugle
20% de la population française souffrant d’un handicap (source d’avril 2003). La moitié sont issues des
pathologies du vieillissement.
Un site accessible est un site qui est utilisable par tout usager quels que soient :
● son handicap
● le support utilisé pour accéder au site
● les moyens d’accès au site
Respecter les règles d’accessibilité améliore le site pour tous les utilisateurs en termes de :
● navigabilité
● ergonomie
● structure des contenus
● référencement naturel
Les navigateurs web peuvent être configurés pour améliorer l’accès aux sites pour les personnes handicapées :
● désactivation ou remplacement des feuilles de styles
● désactivation des couleurs
● désactivation des images
● grossissement des pages
● navigation au clavier sans utiliser la souris…
Règles d'accessibilité : WCAG : http://www.w3.org/Translations/WCAG20-fr/ et WAI : http://www.w3.org/WAI/
Tests d’accessibilité « accessiweb » : http://www.accessiweb.org/ et : http://accessibiliteweb.com/fr

10. Métadonnées : indexez votre contenu
Le contenu des pages web est structuré à l'aide de balises meta, en langage HTML. Les différentes balises
employées permettent de structurer les informations selon différents thèmes (mots-clés, description, auteur, titre,
sujet…).
● Indexer votre document pour les moteurs de recherche
● Rendre plus facile le "scan" du document pour le lecteur
● Automatiser la mise en page (feuille de style)

11. Référencement naturel : pas si naturel que ça ?
Algorithme secret de Google = prise en compte de 200 critères + PageRank
Page Rank : indicateur de pertinence d'une page web par rapport aux autres. Tous les liens ne se valent pas : un
site important pointant vers votre site améliore votre PageRank

12. 3 Votre contenu vs. Google

13. Google Panda, Google Pingouin
Et l'arche de Noé...

14. Google Panda
Sus aux fermes de contenus !
Fiche d'identité :
Fermes de contenus :
Sites web qui multipliaient la production de Nom : Google Panda
contenus bas de gamme (copiés/collés, ou pages Mise en action : février 2011, 3e version en août 2011
vides de texte) avec beaucoup de publicités dans a eu des effets drastiques
l'unique but de monétiser le trafic généré sur le site
web Effet : 12 % des sites web indexés par Google
Comment éviter d'être pénalisé par Googe Panda ? ont été pénalisés, en particulier
Produire du contenu original (non copié/collé d'un les sites de e-commerce, forums,
autre site web) portails d'actus, annuaires...
● Ne pas multiplier les pages redondantes Version : 23
● Produire du contenu de qualité c'est-à-dire :
- un contenu guidant la lecture de
l'internaute (structuration claire, titre, accroche,
intertires, body)
- un contenu documenté (liens hypertextes
pour approfondir le sujet) et qui intéresse
- éviter le flash : Google ne peut pas accéder
au contenu pour ensuite l'indexer

15. Google Pingouin
Sus aux abus d'optimisation du référencement inutiles
Fiche d'identité :
Avec Pingouin, Google part à la chasse aux
Nom : Google Pingouin
contenus cherchant à optimiser leur
référencement en utilisant de manière abusive : Mise en action : avril 2012
- des liens hypertextes, vagues ou sans valeur Effet : sanctionner les pages de sites web abusant de liens
ajoutée, hypertextes ou de mots clés inutiles, 3% des sites
- des mots clés, notamment dans les titres et indexés par Google ont été touchés par ce nouvel
accroches algorithme
Comment s'en prémunir ? Version : 3
● Renseigner des liens hypertextes pointant
vers un contenu spécifique, avec une
description sémantique juste
Ex : Lemonde.fr => description juste : Le journal
français Le Monde
● Eviter la juxtaposition de mots clés dans les
titres et accroches, ou dans les liens
hypertextes

16. Quelques conseils à garder en
4 tête

17. 1. Définir une charte éditoriale
Un outil opérationnel
À destination des responsables, des rédacteurs et des animateurs du
site web et de l’écosystème social.
Les règles énoncées sont :
● des règles éditoriales ;
● des règles rédactionnelles ;
● des règles d’illustration ;
● un circuit de validation des contenus.
Elle détache les grands objectifs en termes :
● de fond :
○ Positionnement du site, missions, cibles ;
○ Concepts et Valeurs ;
○ Ton et style ;
● de forme :
o Structure et format des contenus ;
o Hiérarchie des informations.

18. 2. Écrire court
Chercher la voie la plus rapide de l’émetteur au lecteur
● Privilégier les titres courts
● Privilégier les phrases courtes
● Privilégier les paragraphes courts
● Privilégier les tournures simples
● La phrase simple est la mieux comprise
○ Une seule idée par phrase
○ 12 à 15 mots par phrase environ
○ Préférer les mots courts et courants
○ Éviter les acronymes

19. 2 (bis) La concision n'est pas l'imprécision

20. 3. Hiérarchiser l'information
La pyramide inversée

21. 4. Guider la lecture
La typographie est votre amie
Un travail mené en amont par le DA / graphiste et l'intégrateur.
Utiliser titre (H1), sous-titres (H2), sommaire et ancres pour faciliter la
recherche
Privilégier les listes à puces dès que possible
Mettre en évidence les mots importants (couleurs, gras, hyperlien)
Pour des citations, il est conseillé d'augmenter le corps des caractères,
ou la fonction "quote"
Éviter le «bruit» : animation, sons, contraste de couleurs inapproprié
De la même façon, n'utilisez pas le soulignement pour mette en avant
une idée : dans les conventions web, le soulignement identifie les liens
hypertextes.
UN TEXTE ECRIT EN MAJUSCULES EST LU 13 A 20 % PLUS
LENTEMENT
Un texte écrit en italique est lu 13 à 20 % plus lentement

22. 5. Illustrer le contenu
Les images libres de droit
Prévoyez une légende, n’oubliez pas de mentionner la source de votre
photo, et le nom de l’auteur si demandé (selon la nature de la licence
Creative Commons)
Vous pouvez utiliser les moteurs de recherche suivants :
http://commons.wikimedia.org/wiki/Accueil
http://search.creativecommons.org/
http://www.flickr.com/creativecommons
http://compfight.com/
www.sxc.hu/advanced_search
http://www.freefoto.com
www.photoree.com
www.wylio.com
www.freedigitalphotos.net
openphoto.net

23. 5 (bis). Compléments d'informations sur l'image
Le droit à l'image
Toute personne qui est prise en photo doit autoriser la prise de vue.
La personne autorise à ce que cette photo soit diffusée, elle peut
également le refuser.
Attention aux photos de groupe
L'alternative textuelle aux images
Ce qui est essentiel à la compréhension d’une image:
- la description d’un tableau ou d’un graphique
Ce qui n’est pas essentiel à la compréhension d’une image:
- les puces décoratives
- les images d’illustration
Accessibilité : Si aucune alternative textuelle n'est associée aux
éléments graphiques, les aides techniques vont néanmoins tenter de
retranscrier une information pour l'utilisateur. Dans la plupart des cas,
c'est le chemin du fichier de l'élément graphique qui est affiché, par
exemple, "upload/files/images/ar_000.jpg".

24. 6. Penser à la diffusion sur les réseaux sociaux
Des titres courts et accrocheurs :
● Pour inciter les internautes à consulter votre contenu
● Pour pouvoir être twittés facilement (moins de 140 cc)
Illustrez votre contenu :
● Afin qu'une image miniature (thumbnail) accompagne le lien que vous
partagez sur Facebook
Ajoutez des boutons de partage sur votre :
● Les algorithmes de ranking prennent de plus en plus la dimension
sociale de vos contenus : contenus les plus likés, retweetés etc...
Renseignez le profil Google+ de l'auteur du site / blog / contenu :
● Certains CMS possèdent un espace où une description de l'auteur
peut être renseignée. Si vous possédez un profil Google+, indiquez le !
● Google a tendance à privilégier les contenus dont le profil G+ est
renseigné
● L'image et la bio de votre profil G+ s'afficheront sous votre contenu
dans les résultats de recherche Google => propension plus forte à
cliquer

25. 5 Aller plus loin

26. Storify : la curation et le direct

27. Prezi : dynamiser vos infographies

28. Easil.ly : vos infographies en un clin d'oeil

29. Slideshare : intégrer vos pdf et présentations

30. http://www.nytimes.com/projects/2012/snow-fall/#/?part=tunnel-creek
Snow Fall - The avalanche at Tunnel Creek

31. http://www.whitehouse.gov/state-of-the-union-2013#webform
Discours "State of the Union"