SlideShare uma empresa Scribd logo
1 de 15
Ecrire pour le Web
Sylvie de Meeûs
L’ÉCRITURE WEB
2
Des écritures, des supports
• Page d’accueil
• Page produit
• Page de présentation
• Page contact
• Billet de blog
• E-mailing
• Lecture à l’écran, sur smartphone,…
3
L’ÉCRITURE “AVANT”
4
Ecriture classique vs web
Ecriture classique
Introduction

développement

conclusion
Lecture
« en sens unique »
Ecriture web
Conclusion
  
détails détails détails
 
Action (clic)
Ordre de lecture aléatoire
5
La lecture à l’écran
• Coup d’œil pour « scanner » la page (3/10ème sec)
• Lecture à l’écran 25% plus lente que sur papier
• 25% du texte d’une page web est lu (moyenne)
• 22% des internautes scrollent jusqu’en bas
• 15 à 20 mots correspond à l’empan de la mémoire
(10), soit à notre capacité moyenne de
mémorisation immédiate des informations (20)
6 Source : www.useit.com, 60canards.com
Lecture d’une page web
Source : http://www.formstack.com/the-anatomy-of-a-perfect-landing-page
La scannabilité de la page
• Titre (4 à 10 mots) qui résume la page
• Paragraphe de résumé autonome (« chapeau »)
• Une idée par bloc de texte
• Titre (H2) pour chaque bloc
• Premiers mots en gras
• Listes à puces (énumération)
• Précédées d’une phrase d’intro
• Bouton d’action avant la ligne de flottaison
• Liens à la fin avec libellés clairs
On ne lit pas,
on « scanne »
la page
L’écriture web
• La règle des 5 W : what what what what what
• Décrire plutôt que vanter
• Phrases simples (sujet + verbe + complément)
• Phrases courtes et actives
• A la relecture, supprimer 50% du texte !
9
Astuce :
enregistrez-vous !
Les mots à bannir du web
• Les mots vagues (conception, réalisation, faire...)
• Le jargon sectoriel
• Les abréviations
• Les références au contexte
• « il y a 2 ans, le mois prochain »
• « ci-dessus, ci-dessous »
• « il, elle, ce dernier »
• Les mots trop longs
10
Un texte
compréhensible
par tous
La lisibilité de la page
• Longueur des lignes
• 40 à 70 signes* (site)
• 115 signes* (article de blog)
• Contraste : texte foncé sur fond clair opaque
• Espace entre les lignes (1,25)
• Espace entre les paragraphes (1 ligne)
• Maximum 3 polices différentes (titres + texte)
* Voir www.lettercount.com
11
La lisibilité des textes
• Police du texte « Sans Serif »
• Taille du texte : 16 pt minimum
• Titres (H1) : 40pt et sous-titres (H2) : 30 pt
• Texte aligné à gauche
• A éviter :
• Texte souligné (sauf les liens)
• I’Itallique
• Les MAJUSCULES
12
Mes 5 pages prioritaires
• ……………………………….
• ……………………………….
• ……………………………….
• ……………………………….
• ……………………………….
13
Mes 5 résolutions
• ……………………………….
• ……………………………….
• ……………………………….
• ……………………………….
• ……………………………….
14
Pour en savoir plus…
Un conseil par jour
sur les réseaux sociaux…
Twitter @amaranthe
Facebook
www.facebook.com/amaranthe
Slideshare
www.slideshare.net/amaranthe
Le blog d’Amaranthe
www.amaranthe.be/blog

Mais conteúdo relacionado

Semelhante a Ecrire pour le web

Animation Numérique de Territoire "Atelier Création d'un Site avec Jimdo / Ve...
Animation Numérique de Territoire "Atelier Création d'un Site avec Jimdo / Ve...Animation Numérique de Territoire "Atelier Création d'un Site avec Jimdo / Ve...
Animation Numérique de Territoire "Atelier Création d'un Site avec Jimdo / Ve...Kate De Gourdon
 
Content marketing : l'importance du contenu 2
Content marketing : l'importance du contenu 2Content marketing : l'importance du contenu 2
Content marketing : l'importance du contenu 2Core-Techs
 
Formation bien démarrer sur internet
Formation bien démarrer sur internetFormation bien démarrer sur internet
Formation bien démarrer sur internetSylvie de Meeûs
 
Le clés d'une stratégie éditoriale réussie
Le clés d'une stratégie éditoriale réussieLe clés d'une stratégie éditoriale réussie
Le clés d'une stratégie éditoriale réussieCore-Techs
 
6 1-ergonomie du web
6 1-ergonomie du web6 1-ergonomie du web
6 1-ergonomie du webRYMAA
 

Semelhante a Ecrire pour le web (7)

Animation Numérique de Territoire "Atelier Création d'un Site avec Jimdo / Ve...
Animation Numérique de Territoire "Atelier Création d'un Site avec Jimdo / Ve...Animation Numérique de Territoire "Atelier Création d'un Site avec Jimdo / Ve...
Animation Numérique de Territoire "Atelier Création d'un Site avec Jimdo / Ve...
 
Créer son site_jimdo
Créer son site_jimdoCréer son site_jimdo
Créer son site_jimdo
 
Content marketing : l'importance du contenu 2
Content marketing : l'importance du contenu 2Content marketing : l'importance du contenu 2
Content marketing : l'importance du contenu 2
 
Formation bien démarrer sur internet
Formation bien démarrer sur internetFormation bien démarrer sur internet
Formation bien démarrer sur internet
 
Le clés d'une stratégie éditoriale réussie
Le clés d'une stratégie éditoriale réussieLe clés d'une stratégie éditoriale réussie
Le clés d'une stratégie éditoriale réussie
 
Conception de sites Web
Conception de sites WebConception de sites Web
Conception de sites Web
 
6 1-ergonomie du web
6 1-ergonomie du web6 1-ergonomie du web
6 1-ergonomie du web
 

Ecrire pour le web

  • 1. Ecrire pour le Web Sylvie de Meeûs
  • 3. Des écritures, des supports • Page d’accueil • Page produit • Page de présentation • Page contact • Billet de blog • E-mailing • Lecture à l’écran, sur smartphone,… 3
  • 5. Ecriture classique vs web Ecriture classique Introduction  développement  conclusion Lecture « en sens unique » Ecriture web Conclusion    détails détails détails   Action (clic) Ordre de lecture aléatoire 5
  • 6. La lecture à l’écran • Coup d’œil pour « scanner » la page (3/10ème sec) • Lecture à l’écran 25% plus lente que sur papier • 25% du texte d’une page web est lu (moyenne) • 22% des internautes scrollent jusqu’en bas • 15 à 20 mots correspond à l’empan de la mémoire (10), soit à notre capacité moyenne de mémorisation immédiate des informations (20) 6 Source : www.useit.com, 60canards.com
  • 7. Lecture d’une page web Source : http://www.formstack.com/the-anatomy-of-a-perfect-landing-page
  • 8. La scannabilité de la page • Titre (4 à 10 mots) qui résume la page • Paragraphe de résumé autonome (« chapeau ») • Une idée par bloc de texte • Titre (H2) pour chaque bloc • Premiers mots en gras • Listes à puces (énumération) • Précédées d’une phrase d’intro • Bouton d’action avant la ligne de flottaison • Liens à la fin avec libellés clairs On ne lit pas, on « scanne » la page
  • 9. L’écriture web • La règle des 5 W : what what what what what • Décrire plutôt que vanter • Phrases simples (sujet + verbe + complément) • Phrases courtes et actives • A la relecture, supprimer 50% du texte ! 9 Astuce : enregistrez-vous !
  • 10. Les mots à bannir du web • Les mots vagues (conception, réalisation, faire...) • Le jargon sectoriel • Les abréviations • Les références au contexte • « il y a 2 ans, le mois prochain » • « ci-dessus, ci-dessous » • « il, elle, ce dernier » • Les mots trop longs 10 Un texte compréhensible par tous
  • 11. La lisibilité de la page • Longueur des lignes • 40 à 70 signes* (site) • 115 signes* (article de blog) • Contraste : texte foncé sur fond clair opaque • Espace entre les lignes (1,25) • Espace entre les paragraphes (1 ligne) • Maximum 3 polices différentes (titres + texte) * Voir www.lettercount.com 11
  • 12. La lisibilité des textes • Police du texte « Sans Serif » • Taille du texte : 16 pt minimum • Titres (H1) : 40pt et sous-titres (H2) : 30 pt • Texte aligné à gauche • A éviter : • Texte souligné (sauf les liens) • I’Itallique • Les MAJUSCULES 12
  • 13. Mes 5 pages prioritaires • ………………………………. • ………………………………. • ………………………………. • ………………………………. • ………………………………. 13
  • 14. Mes 5 résolutions • ………………………………. • ………………………………. • ………………………………. • ………………………………. • ………………………………. 14
  • 15. Pour en savoir plus… Un conseil par jour sur les réseaux sociaux… Twitter @amaranthe Facebook www.facebook.com/amaranthe Slideshare www.slideshare.net/amaranthe Le blog d’Amaranthe www.amaranthe.be/blog