10 mars Ecrire pour le Web Les bases de l’écriture informative Ecrire pour le web Communiquer en « rich media » Licence 3 Infocom – UCO-BS – Françoise Nicol

10 mars Print ou web : quelle différence ? Des supports différents  Papier : espace limité, périodicité fixe, information durable…  Ecran : volume d’information illimité, espaces différents selon les supports, lecture plus difficile, lecteur plus volatile… Des modes d’expression différents  Papier : textes, photos, dessins, graphiques  Ecran : textes, images fixes ou animées, son Un seul et même métier Recueillir, vérifier, organiser, traiter et diffuser des informations Ecrire de façon claire et concise et s’adapter à son lectorat Les mêmes règles de base Immuables quel que soit le support

10 mars Les règles de base Organiser les contenus Tenir compte des règles de lecture Définir le mode de traitement de l’information Aller de l’essentiel au détail Structurer les textes

10 mars Organiser les contenus Classer et organiser les sujets  Classement par rubriques (print) ou onglets (web) : choix éditorial en fonction du positionnement du support et des cibles ou du lectorat  Choix et organisation des sujets en fonction de leur importance : plus l’info est importante, plus elle est valorisée (emplacement, taille, photo, graphiques…) Exemple de l’Express : Exemple du Télégramme : Hiérarchiser les informations  Print : titraille, textes, photos, légendes, infographies  Web : titre (lead) et accroche au 1 er niveau, détails aux niveaux suivants

10 mars Sommaire de l’Express

10 mars Onglets Internet

10 mars Tenir compte des règles de lecture 1.L’œil parcourt la page pour avoir une idée globale du contenu 2.Puis il balaye le texte sélectionné pour localiser l’information qu’il recherche ou qui l’intéresse 3.Il s’appuie sur des repères : mots, série de mots, textes en gras, images…  Créer des hiérarchies dans la page et dans chaque article : taille des titres, taille de la photo, taille et emplacement des textes…  Mettre en valeur les informations importantes : l’essentiel en haut de la page, dans le titre, en début de texte et en début de paragraphe, dans les accroches, créer des repères typographiques (blancs, gras, italiques)…

10 mars Télégramme - la Une

10 mars Télégramme P. 2/3

10 mars Rue 89 - Page d’accueil/1

10 mars Owni - Page d’accueil/1

10 mars Owni - Page d’accueil/2

10 mars Définir le mode de traitement de l’info Qu’est-ce que ça vaut et comment j’en parle?  Sujet de Une ? Tête de rubrique ? Sous-papier ? Brève ?  Comment vais-je la traiter ? Article de synthèse, reportage, interview, enquête, portrait, photo légendée… Qu’est-ce que je dis et de quelle façon ?  Print : comment je découpe et je valorise mes informations ? Sous-papiers, encadrés Titraille Choix des photos, graphiques  Web : comment je structure l’information ? Quelle information à quel niveau ? Quel média pour quel type d’information ?

10 mars Aller de l’essentiel aux détails La pyramide inversée  Aller du plus important au plus détaillé  du concret à l’abstrait  du plus récent au plus ancien  du plus proche du lecteur au plus loin, dans le temps ou l’espace… La règle des QQCOQPC ou des 5 W et des 2 H  Qui ? Quoi ? Comment ? Où ? Quand ? Pourquoi ? Combien ?  Who ? What ? When ? Where ? Why ? How ? How much ?

10 mars Ce qu’il ne faut pas faire Questions Qui ? Quoi ? Comment ? Où ? Quand ? Pourquoi ? Combien

10 mars Ce qu’il vaut mieux faire Questions Qui ? Quoi ? Comment ? Où ? Quand ? Pourquoi ? Combien ? ARTFIG00360-internet-moteur-de-la- croissance-en-france.php medias/actu/ comment-internet-a- dope-la-croissance-francaise.htm

10 mars Structurer les textes La loi de proximité  La proximité temporelle : du passé proche ou du futur proche (actualité) au futur lointain puis au passé lointain  La proximité géographique : la rue, le quartier, la ville, la région, le pays…  La proximité psycho-affective : l’amour, la mort, la violence, l’argent, la peur, le chômage…  La proximité sociale : même âge, même milieu, mêmes centres d’intérêt… Mettre les bons éléments en haut de la pyramide  Définir quel est le sujet principal en fonction de son lecteur ? Le qui ? Le quoi ?  Répondre aux quatre questions de base dans le titre et le chapo (accroche) : Qui et Quoi ? Plutôt dans le titre. Quand et Où ? Dans l’accroche  Développer ces 4 questions en attaque puis expliquer le pourquoi et le comment  Enfin, entrer dans le détail de chacune des 6 questions pour un grand article

10 mars Ecrire pour le Web Ce qui change par rapport au print Trois façons d’organiser les contenus Structurer les contenus Adapter son écriture au Web Exemples

10 mars Ce qui change Il faut accrocher le lecteur tout de suite Etre clair, distrayant, illustré, dynamique, facile à lire On joue sur la « profondeur » Plusieurs niveaux d’information, réparties dans des pages différentes, du plus succint au plus expert, grâce aux liens hypertexte On peut utiliser tous les médias et tous les genres Les textes, les photos, les sons, les vidéos, les infographies, fixes ou animées, les quizz, les serious game… On peut augmenter le trafic en adaptant son écriture En utilisant des mots clés pour créer du référencement naturel par les moteurs de recherche (SEO) En multipliant les liens internes ou externes En utilisant les blogs et les réseaux sociaux : Facebook, Twitter…

10 mars façons d’organiser les contenus L’écriture web : C’est adapter son écriture texte avec des liens, des mots clés… Positionnement SEO (search engine optimization) : indexation, référencement naturel par les moteurs de recherche L’écriture multimédia C’est utiliser des vidéos, des photos, des sons, des graphiques et les intégrer directement dans l’article Le rich média C’est organiser tous les types de contenus en tenant compte de leur spécificité et en faisant appel à l’interactivité

10 mars Structurer - 1 La pyramide inversée (Jacob Nielsen en 1997) Utilisée au départ par les médias de flux, tels ceux de la presse. Référencement par mots clés

10 mars Bretagne durable- Un site construit comme un magazine Pas de hiérarchie Titrage magazine Accroches trop longues et peu informatives Beaucoup de texte, pas de mots clés Photos prétexte Pas de liens internes en page d’accueil Peu de multimédia et d’interactivité

10 mars Structurer - 2 Schéma de Carole Rich (1998, université d’Anchorage, Alaska) Répartition de l’information sur 3 niveaux, les autres médias sont installés en périphérie Navigation assurée par des liens hypertextes Modèle Top/down aujourd’hui dépassé

10 mars Presse quotidienne régionale

10 mars Structurer - 3 Modèles de Ramon Salaveria (2005, université de Navarre) 5 types de narration : linéaire, parallèle, arborescente, réticulaire, mixte

10 mars Site du Monde

10 mars Site du Monde

10 mars Structurer - 4 La pyramide couchée (Joao Canavilhas) Hiérarchiser les informations dans les pages et aux différents niveaux  Niveau 1 : Lead (titre + accroche) Qui, quand, quoi ? Niveau 2 : Texte. Rappel du titre + chapo + pourquoi et comment ? Niveau 3 : Informations plus détaillées ou éclairages sur chacune des 6 questions, en texte, en diaporama, en vidéo, en son, en infographie… Niveau 4 : archives du site ou ressources externes

10 mars Les Echos - Niveau 1

10 mars Les Echos - Niveaux 2, 3 et 4

10 mars Les Echos - Niveau 3

10 mars Niveau 4 - Le Télégramme

10 mars Structurer - 5 Les Black’s Wheels (Roger Black, université de Sao Polo, USA, 1997) Chacun des cercles représente un élément de narration

10 mars Structurer - 6 Les Black’s Wheel complexes (université de Sao Polo, USA) Schéma de narration organisé autour de 8 lignes directrices Encore au stade du développement Les besoins de l’internaute Les éléments de l’identification L’interactivité Le multimédia La personnalisation La navigation Le taggage La documentation

10 mars Adapter son écriture au Web/1 Optimiser le référencement par les moteurs de recherche (SEO) Identifier les mots clés ou les groupes de mots clés les plus utilisés Anticiper sur la façon dont les utilisateurs vont faire leur recherche Visiter les sites concurrents pour repérer les contenus et les mots clés Créer un corpus sémantique qui sera utilisé dans la page Le tester sur Google tendances : Augmenter l’indice de densité de mots clés (IDM) 2,5 % à 3,5 %, soit environ 3 fois le même mot cl é pour 100 mots, 9 fois pour un texte de 300 mots Les placer à des emplacements stratégiques, repérés par les moteurs : Dans l’URL et l’intitulé des pages, le nom des photos, des vidéos et des infographies Dans la titraille : titre, accroche, chapo, intertitres, légendes… En début de texte ou de paragraphes, dans les listes à puces En les mettant en gras ou en couleur Dans le code source de la page : dans les balises, les liens et l’URL

10 mars Adapter son écriture au Web/2 Des règles d’écriture spécifiques Soigner la titraille et les accroches Un titre informatif : Qui ? Quoi ? Une accroche qui complète le titre : Où, quand, comment ? Un chapeau synthétique qui résume le texte et sa conclusion Le message essentiel dans les premières lignes Ecrire dense, plutôt que court Un texte resserré (1 200 signes/180 mots), découpé en paragraphes (maxi 10 lignes) Des phrases courtes (12 à 13 mots), de structure simple (sujet, verbe, complément), au présent, à la forme active Un seul message par phrase, placé au début Un vocabulaire simple, concret, précis, imagé, vivant Des blancs pour isoler les textes importants Des listes à puces ou à numéros pour faciliter la lecture Placer des liens Vers des sous-papiers, des cartographies, des vidéos… Vers des ressources internes ou externes

10 mars Communiquer en rich média Les principes L’architecture des informations Exemple de Géo Webreportages

10 mars Qu’est-ce-que le rich media ? * « Ce qui permet de traiter une information en combinant plusieurs modes d’expression, organisés de manière à mettre en valeur leurs spécificités et leurs complémentarités » > Maîtriser la technique et les spécificités de chaque média > Savoir articuler les modes d’expression numérique (sons, images fixes et animées) en tenant compte des attentes et des usages des internautes > Savoir utiliser l’interactivité entre les différents médias et avec les internautes La complémentarité des modes d’expression permet : > L’accès intuitif à des contenus attractifs > La possibilité de construire son propre parcours de lecture > La compréhension aisée d’informations ou d’événements complexes > L’accès à un volume quasi infini de contenus pour approfondir un sujet > L’actualisation par enrichissements progressifs * D’après « Communiquer en rich media », d’Alain Joannès, 2009, CFPJ

10 mars L’arbre TSIFIAL des modes d’expression Textes Sons Bruits Musiques Voix Images fixes Dessins Photos Cartographies Images animées Diaporamas Vidéos Animations électroniques Liens hypertextes

10 mars A chaque mode d’expression, son usage Le texte, indispensable mais insuffisant Ce qui est reconnu par les mœurs de recherche > mots clés Se conserve, s’améliore, s’actualise, s’assimile Mais il peut être interprété et ne permet pas toujours d’exprimer des sentiments, de donner des ambiances et d’expliquer des phénomènes complexes Le son alerte, suggère, touche, nuance Les bruits évoquent des images La musique véhicule des sensations, des humeurs, des sentiments… La voix précise, nuance, émeut, humanise… Les images fixes détaillent, crédibilisent, enrichissent Peinture ou photographie Les images animées représentent, attirent, interprètent Le cinéma ou le documentaire : efficacité, persuasion, désinformation ? La vidéo permet le direct, l’instantané, mais aussi le partiel et le partial ? L’infographie traduit, explique, synthétise, simplifie

10 mars Exemple Géo Web reportage « C’est le contenu qui détermine le média que l’on va utiliser » Jean-Luc Marty, directeur éditorial et rédacteur en chef de Géo (Prisma Presse)

10 mars Exemple Géo Web reportage/1

10 mars Exemple Géo Web reportage/2

10 mars Exemple Géo Web reportage/3

10 mars Exemple Géo Web reportage/4

10 mars Exemple Géo Web reportage/5

10 mars Exemple Géo Web reportage/6

10 mars Exemple Géo Web reportage/7

10 mars Structurer en rich media PrévisiblesImprévisiblesComplexesSimplesConcretsAbstraitsLongsBrefs Caractéristiques des événements adaptés au rich media Les plus adaptés : Les événements prévisibles, complexes, concrets et longs Exemple : la crise économique Modes de traitement possibles des différents aspects de la crise DonnéesImagesSonsTextes PertesGraphiques, statistiquesCommentairesListes d’établissements FaillitesPhotos, vidéos, cartesCommentairesCommentaires, chiffrages AidesGraphiquesCommentairesChiffrages, précisions PIBAnimations électroniquesCommentairesPrécisions EmploiVidéos, animations, cartesTémoignagesPrécisions PrixGraphiques, animationsCommentairesPrécisions, chiffrages

10 mars La crise vue par le Financial Times Une infographie animée de Wall Street avec un curseur chronologique allant de septembre 2007 à octobre 2008 Des données chiffrées révélées en passant la souris sur les gratte-ciel Un diaporama sur l’affaire Kerviel Les interviews en vidéo d’analystes financiers Mode de traitement

10 mars Pour aller plus loin… L’Ecrit web, traitement de l’information sur Internet, de Joël Ronez, 2007, CFPJ Communiquer en rich media, de Alain Joannès, 2009, CFPJ Livres Sites ou blogs le site d’Alain Joannès l’observatoire du journalismehttp://obsweb.net/ le web observatoire du journalisme sur Internethttp:// la Revue des industries créatives et des médiashttp:// l’actualité des médias, de l’édition et de la communicationhttp:// portail du journalisme (actus, emplois et stages) portail de l’édition (actu, emplois, stages) portail de la communication territorialehttp:// bons plans étudiants, actu, forumhttp://