Cours rédaction web mai2013

  • 852 views
Uploaded on

 

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
852
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
74
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Rédaction Web29 mai 2013
  • 2. IntroductionPrésentation de la formationet des participants
  • 3. Spécificités de la lecture webAdapter la rédaction despages web au comportementde l’internaute
  • 4. Comportement de l’internaute• Recherche d’information– Avant de lire, vérification rapide en diagonale– La page contient-elle les bonnes informations?• « Scanning »– 80% scannent– 20% lisent• Lecture, une fois la vérification faite– 80% du texte lu– 20% parcouru
  • 5. Adapter la rédaction web• Autoriser aux internautes de « scanner »– Pages navigantes • Penser à donner à « lire »– Pages finales de contenu • Concevoir la page web pour– Supervision du contenu (5 sec)– Lecture éventuelle plus soutenue (30 sec)– Assimilation postposée de l’information (pdf)
  • 6. Les chemins de la lecture• Reportage video– Arte– Réal. Jean-Pierre Gibrat– artevod• Conclusions– Visibilité– Lisibilité– Compréhension
  • 7. Les chemins de la lecture
  • 8. Les chemins de la lecture
  • 9. Les chemins de la lecture
  • 10. Principes de la rédaction webLes 6 principesutiles pour rédiger sur le web
  • 11. Principes de la rédaction webAccessibilitéDécoupagePertinenceTitrageCohérenceIntégration des visuels
  • 12. AccessibilitéRendre le contenu accessible pour tous lesinternautes1
  • 13. Accessibilité• Citoyenne – Accès internet• Technique – Accès au site web et à la page• Linguistique – Langue, vocabulaire et syntaxe• Communicationnelle – Présentation et détails• Référentielle Google
  • 14. Éviter le jargon• Administratif– « La note susmentionnée, l’alinéa précité, … »• Technocratique– « La politique de la ville, contribuant à la vie desvaleurs essentielles, intéressant tous les champs del’existence, la personne et la société, le passé leprésent et le futur, devient une constructionmobilisatrice. »• Expert– « Les métadonnées et XML… »
  • 15. Éviter les difficultés lexicales• Néologismes• Sigles– Cocof, bfe…• Substantifs– écrits impersonnels (on, voix passive…)– actionner le vous!• Anglicismes– Teenager, coach, hacker, job, webmaster…
  • 16. DécoupageScinder l’information en petites unités, plusfaciles à assimiler2
  • 17. 3 - 5 - 7• Mémoire courte– 7 +/- 2 éléments par écrit– 5 +/- 2 éléments sur écran• Valable pour– Liste à puces– Blocs d’information– Modules• Exemples: téléphone, compte bancaire, …
  • 18. 3 - 5 - 7
  • 19. Test 1PommeRugbyMathématiqueCitronVolleyPruneTennisReligionBananeFootballMirabelleGolfChimieGymnastiquePoireOrangeBiologieInformatiqueVéritéHandballÉconomieBut : mémoriser le plus de mots en 20 sec (temps moyen de visibilité)
  • 20. Résultats du testParticipant Test 1 Test 2 Test 3
  • 21. Découpage• Réécriture par décomposition et regroupement– Exercice « »– Scinder et regrouper de manière pertinente– Sur www.brufo.be/redac• Identifiant: redacXX• Mot passe: redactionXX• Indiquer son prénom dans le profil
  • 22. PertinenceRegrouper les informations qui portent sur unmême sujet3
  • 23. Regroupement pertinentPommePoireBananeOrangeCitronPruneMirabelleRugbyFootballHandballVolleyGolfGymnastiqueTennisMathématiqueBiologieInformatiqueVéritéReligionChimieÉconomie
  • 24. Test 2SourisImprimanteClavierÉcranLogicielModemScannerCarotteCeleriPanaisChou-fleurArtichautTomateSaladeViolonPianoGuitareMélodieCompositionTrompetteFlute
  • 25. Se poser les bonnes questions• Les 5 W et 2 H– What, who, where, when, why– How, how much• En français– Quoi, qui, quand, où, pourquoi– Comment, combien
  • 26. La bonne info au bon endroitAccrocheCorps de texteDétails
  • 27. La bonne info au bon endroitPitch 5 WDéveloppement5 W et 2 Hinfos pratiques, liens,autour de l’article
  • 28. La bonne navigation interneSur la page navigantetitre et extrait (en bref)Sur la page de contenuarticle completEn lien, pour en savoir plusdocument pdf
  • 29. Regrouper grâce aux questions• Réécriture par regroupement– Exercice « »– Scinder et regrouper de manière pertinente– Se poser les bonnes questions• Travail à 2• Document Word
  • 30. TitrageAttribuer un titre à chaque bloc d’information4
  • 31. Titrage• Titrer– Page– Bloc d’information• Faciliter– l’assimilation du contenu– la reconnaissance de détails• à trouver pour ceux qui en ont besoin• à passer pour ceux qui n’en ont pas besoin
  • 32. TitrageFruits Sport SciencePommePoireBananeOrangeCitronPruneMirabelleRugbyFootballHandballVolleyGolfGymnastiqueTennisMathématiqueBiologieInformatiqueVéritéReligionChimieÉconomie
  • 33. Test 3Cuisine italienne Bricolage PâtisserieTiramisuCannelloniBolognaiseLasagneRisottoPizzaHuile d’oliveCaisse à outilsMarteauClé anglaiseVisMètreForeuseClouFarineSucreOeufMouleGâteauGaufreCrème fraîche
  • 34. TitrageType Identifie ExemplesGénériqueFonction du blocd’information( rédacteur)IntroductionContexteObjectifDéfinitionContenuContenu du blocd’informationLe monde du web aujourd’huiEmplacement des postes d’alarmeModes d’affichage d’un diaporamaCombinaison Les 2Définition : le bloc d’informationProcédure : encaissement d’un chèque
  • 35. Titrage• Écriture d’une page web– Exercice « » : le cake au citron– Pour un blog culinaire• Veillez à– Unicité de ton (actionner le vous )– Un même vocabulaire– Une structure pertinente – Une mise en forme cohérente
  • 36. CohérencePour un contenu semblable, utiliser lesmêmes termes, formats, …5
  • 37. Éviter les hiatus
  • 38. Éviter les incohérences
  • 39. Test 3Cuisine italienne Bricolage PâtisserieTiramisuCannelloniBolognaiseLasagneRisottoPizzaHuile d’oliveCaisse à outilsMarteauClé anglaiseVisMètreForeuseClouFarineSucreOeufMouleGâteauGaufreCrème fraîche
  • 40. Test 4 - cohérencePâtes Outils PâtisserieSpaghettiCannelloniTortelliniLasagneRigatoniTagliatellePapardeleTournevisMarteauTenailleClé anglaiseScieCutterPinceFarineSucreSelOeufBeurreVanilleCrème fraîche
  • 41. Éviter les incohérences
  • 42. Comprendre un ensemble de formes
  • 43. ProximitéAB
  • 44. Regroupement par proximitérapide
  • 45. Regroupement par proximité• Géographique• Ergonomique• Sémantique• Graphique
  • 46. Composition de la page
  • 47. Composition de la page
  • 48. Cohérence de la page
  • 49. Cohérence de la page• Vocabulaire• Titres d’un même type• Intonation unique– verbes d’action– emploi du « vous »• Mise en forme uniforme• Éléments typiques– Symboles– Pictogrammes
  • 50. Congruence de la page• Utiliser des mots– en accord avec le site• liste des mots « clés » ou expressions• regroupés par thème, en fonction des catégories• Définir une liste– conformément aux usages du Web• Voir les tendances des usagers sur google• Voir les données de recherche en interne
  • 51. Utiliser les bons mots• Limiter– +/- 5 mots pour une page– 10 ou 20 mots pour un site– 50 mots pour un site étendu• Définir un « thesaurus »• S’aider des outils Google– Google Tendances : les tendances de recherche– Google AdWords : les suggestions de mots-clés
  • 52. Utiliser les outils Google
  • 53. Utiliser les outils Google
  • 54. Utiliser les outils Google
  • 55. Utiliser les outils Google
  • 56. Les bons mots aux bons endroits
  • 57. Les bons mots aux bons endroitsAdresse URLBalise <Title>Balise <H1>TexteHypertexteMetadonnéesImg
  • 58. Trouver titres et bons mots• Réécriture avec titrage– Exercice « »– Scinder et titrer de manière pertinente– Se poser les bonnes questions– Trouver 5 mots clés– Rédiger des titres significatifs• Travail à 2• Document Word
  • 59. Intégration devisuelsUtiliser des éléments graphiques commepartie intégrante de la rédaction6
  • 60. La mort par la rédaction web• Comment causersa propre perte
  • 61. Pas assez d’images
  • 62. Test 3CuisineItalie• Tiramisu• Cannelloni• Bolognaise• Lasagne• Risotto• Pizza• Huile d’oliveBricolage• Caisse à outils• Marteau• Clé anglaise• Vis• Mètre• Foreuse• ClouPâtisserie• Farine• Sucre• Oeuf• Moule• Gâteau• Gaufre• Crème
  • 63. Cerveau gauche/droitimagelangage
  • 64. Parlerde manière imagée
  • 65. Intégration de visuels• Liste à puces• Tableau• Illustration• Pictogramme• Graphique• Diagramme
  • 66. Intégration de visuels• Présenter visuellement un texte présentant desconditions et actions• « Nous offrons un crédit aux clients qui nous ont déjàpassé des commandes. Si le montant d’une nouvellecommande est inférieur à 25€, nous nous attendonsà un paiement immédiat parce que les fraisadministratifs seraient trop élevés pour justifier uncrédit. Les clients dont la commande se situe entre25 et 500 € peuvent bénéficier d’un crédit. Dans lecas de commandes dont le montant est supérieur à500 €, vous devez consulter votre supérieur. »
  • 67. Intégration de visuelsSi le montant de lafacture estAlors< 25 € Refusez le créditEntre 25 € et 500 € Accordez le crédit>500 € Consultez le supérieur
  • 68. Intégration de visuels• Décrire une structureBruxellesFormationTremplinBureau etservicesIndustrie
  • 69. Intégration de visuels• Exercice– Expliquer lesA, B, C et D• Organigramme sous Powerpoint enregistré comme image• Schéma, organigramme, …