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

Ecrire pour le web smw

Embed Size (px)

Citation preview

SOCIAL MEDIA WEEK

Ecrire pour le web

18 février 2013

1. Comportements de lecture sur internet2. Points techniques 3. Vos contenus vs. Google4. Quelques conseils à garder en tête5. Aller plus loin : texte et formats innovants

SOMMAIRE

mail : [email protected] : @fleurdouet

mail : [email protected] : @corentinmarsac

1 Comportements de lecture sur le web

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)

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

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

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

2 Points techniques

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

Accessibilité : le web est aveugle

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)

Métadonnées : indexez votre contenu

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

3 Votre contenu vs. Google

Google Panda, Google Pingouin

Et l'arche de Noé...

Fiche d'identité :

Nom : Google Panda

Mise en action : février 2011, 3e version en août 2011

a eu des effets drastiques

Effet : 12 % des sites web indexés par Google

ont été pénalisés, en particulier

les sites de e-commerce, forums,

portails d'actus, annuaires...

Version : 23

Fermes de contenus :

Sites web qui multipliaient la production de contenus bas de gamme (copiés/collés, ou pages vides de texte) avec beaucoup de publicités dans l'unique but de monétiser le trafic généré sur le site web

Comment éviter d'être pénalisé par Googe Panda ?

Produire du contenu original (non copié/collé d'un autre site web)

● Ne pas multiplier les pages redondantes

● 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

Google Panda

Sus aux fermes de contenus !

Fiche d'identité :

Nom : Google Pingouin

Mise en action : avril 2012

Effet : sanctionner les pages de sites web abusant de liens hypertextes ou de mots clés inutiles, 3% des sites indexés par Google ont été touchés par ce nouvel algorithme

Version : 3

Avec Pingouin, Google part à la chasse aux contenus cherchant à optimiser leur référencement en utilisant de manière abusive :

- des liens hypertextes, vagues ou sans valeur ajoutée,

- des mots clés, notamment dans les titres et accroches

Comment s'en prémunir ?

● 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

Google Pingouin

Sus aux abus d'optimisation du référencement inutiles

4Quelques conseils à garder en tête

À 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.

1. Définir une charte éditoriale

Un outil opérationnel

● 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

2. Écrire court

Chercher la voie la plus rapide de l’émetteur au lecteur

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

3. Hiérarchiser l'information

La pyramide inversée

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

4. Guider la lecture

La typographie est votre amie

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

5. Illustrer le contenu

Les images libres de droit

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

5 (bis). Compléments d'informations sur l'image

Le droit à l'image

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".

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

6. Penser à la diffusion sur les réseaux sociaux

5 Aller plus loin

Storify : la curation et le direct

Prezi : dynamiser vos infographies

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

Slideshare : intégrer vos pdf et présentations

http://www.nytimes.com/projects/2012/snow-fall/#/?part=tunnel-creek

Snow Fall - The avalanche at Tunnel Creek

http://www.whitehouse.gov/state-of-the-union-2013#webform

Discours "State of the Union"