   A partir de l’appel d’offre (un cahier des
    charges fonctionnel)
   Bien cerner les besoins et constituer les équipes
    en fonction des nécessités
   Dans le cadre des projets de S1, c’est simplifié:
    il n’existe que des projets de sites web statiques
   La constitution des agences sera donc la même:
    des groupes de 3:
     Un développeur HTML/intégrateur/ergonome
     Un graphiste
     Un concepteur/rédacteur de contenu
   Parmi les trois, un chef d’agence désigné
   Trouver un nom (brainstorming), une identité
    visuelle, créer un site d’agence sur le FTP du
    chef
   Vous avez les éléments dans le cours de Michel
    Petit
   Il s’agira, ici, d’un CDC restreint, mais présenté
    professionnellement (page de titre, mise en page
    soignée, sommaire, à l’identité de l’agence…):
      - Origine du projet, contexte
      - Publics cibles
      - A partir de l’analyse de l’existant: problématique, objectifs
      - Contraintes
      - Services et livrables attendus
      - Délais de réalisation (dont validations intermédiaires)
   Rechercher des sites qui correspondent au
    projet
   Les questionner du point de vue:
       Du contenu (rédactionnel)
       De la navigation/de l’interactivité (ergonomie)
       Du design graphique
       Du marketing
   Voir questionnaire distribué
   Un site doit répondre aux besoins des
    utilisateurs.
   Caractériser des public principal/secondaires
   Définir des profils-types/ « personas »:
    http://www.cooper.com/journal/2003/08/th
    e_origin_of_personas.html
   Etablir des scénarios (10 à 30): A veut obtenir
    telle ou telle information; B contacter le
    responsable; C résoudre tel problème…
EX. DE PRÉSENTATION
Act
    Acceptation

Check         Plan


        Do
Validation
•1/10                       •3/10
              •2/10
 Validation                  Validation…
   Choisir les rubriques
   Les nommer
   Les regrouper
   Les hiérarchiser
   Représenter la structure d’information
   Le look and feel
       “In software design, look and feel is a term used in
        respect of a graphical user interface and comprises
        aspects of its design, including elements such as
        colors, shapes, layout, and typefaces (the "look"), as
        well as the behavior of dynamic elements such as
        buttons, boxes, and menus (the "feel")” (Wikipedia).
   Délimiter un périmètre rédactionnel
   Matière première: la recherche d’information
       Fournie par le client
       Autres contacts
       Expérience personnelle
       Sources documentaires, y compris Internet et BD
   Attention aux mauvaises sources, à
    l’inexactitude dans leur reprise
   Trier en fonction du sujet précis et de l’angle
    choisis
   Accueillir: La page d’accueil a la même
    fonction que la « une »: la
    « prise en main », à travers une vision globale
    des contenus et une présentation concise de ce
    qui va être développé « à l’intérieur ».
   Capter l’attention à un premier niveau avec les
    titres, les sous-titres, les illustrations,
    éventuellement les « manchettes »
   Capter l’attention à un second niveau:
-le chapeau
-les intertitres
-d’éventuels encadrés
-l’attaque de l’article
-la chute de l’article
-les légendes des illustrations
   Organiser l’information:
       Faire passer un message essentiel.
       Avant la rédaction, formuler clairement le message
       Souvent un article papier = 1 à 4 feuillets (1 feuillet=1500
        signes), un article électronique = 50% de l’équivalent
        papier.
       Pour un fait d’actualité, la règle:
         « Quis? Quid? Quando? Ubi? Cur? Quomodo? Quibus
          auxiliis? »
         Who? What? Where? When? Why? How?
         Qui? Quoi? Où? Quand? Pour quoi? Comment?
• Organiser les informations
Le plan: la pyramide inversée (information événementielle)
               Du plus au moins important


              1.Le fait
                  2. Les raisons
                     3. Le contexte              Dans les
                     4. Information
                      complémentaire,
                                              premiers 20%,
                       conséquence…               80% de
                                              l’information
   Organiser l’information:
       Le plan: autres choix
         Plan analytique: cause-principaux faits-conséquences
         Plan démonstratif: message essentiel-succession
         d’arguments
         Plan chronologique
         Scénario
         …
   Rédiger un texte lisible, dense,
    concis, accessible:
     -priorité à ce qui est d’intérêt général
     -suppression de tout ce qui sort de l’angle choisi
     -abandon des aspects secondaires
     -retrait des répétitions, des redondances, des
     pléonasmes
     -chasse aux imprécisions
     -utilisation de termes précis
     -renvoi au concret et à l’imagé
     -citation de propos, mise en scène
     -coupe des phrases trop longues
     -phrases s’adressant directement au lecteur
 Rédiger         avec des outils comme
  :
    La cote de lisibilité de Rudolf Flesh:
     206.835-(1.015*moyenne des mots par phrase)-
     (84.66*moyenne de syllabes par mot)
     de 1 à 100 (de très difficile à facile): cf. Word
    Le fog index de Gunning:
     (nb moyen de mots par phrase+pourcentage de mots
     de plus de trois syllabes)*0.4
     bd=6, journaux=10, écrits universitaires=16, cote
     d’alerte=12
   Rédiger avec le souci de la
    langue; respect de:
       l’orthographe
       la grammaire
       la ponctuation
       les règles typographiques
   Titrer:
       Surtitre: situer l’action, moment, lieu, domaine
        d’information (parfois un seul mot-repère)
       Titre: concentration de l’information ou du message;
        mots-clés du sujet
       Sous-titre: complément: comment? Pourquoi?
        Parfois confondu avec le chapeau
       Sommaire: énumération des aspects importants de
        l’article ou du dossier
   Rarement l’ensemble
   Choisir un bon titre:
       clair, facilement compréhensible
       court, nerveux, direct
       proche du lecteur
       précis
       sur mesure
       original
       adapté au genre (informatif, citation)
   Deux choix:
       Titre informatif:
         Qui?
         Quoi?

       Titre incitatif:
         mots chocs
         jeux de mots
         allusion, appel à la curiosité
         jeux sur les contraires
         collisions d’événements
   Habiller:
       le chapeau (compléter le titre, résumer l’information,
        justifier l’article, situer le contexte, annoncer le plan, inviter à
        la lecture): court de 10 à25 mots.
       Des paragraphes courts (3 phrases, env 50 mots)
       l’intertitre (faire respirer le texte, casser le gris, entrée
        possible, baliser la lecture)
       l’attaque (catch phrase: description, citation, histoire,
        formule, sentence, image, paradoxe, bizarrerie,
        dramatisation, prise à partie
       la chute
       les « encadrés » (chiffres, données, exemple, témoignage,
        miniportrait, chronologie, lexique)
Soigner les hypertextes:
   hypertexte horizontal: approfondissement d’une information de
    base: chaque point important traité comme une brève avec un lien
    hypertexte vers un développement
   hypertexte vertical: approfondissement progressif, en cascade,
    vers des sujets de plus en plus pointus
   hypertexte latéral: des compléments (bibliographie, chronologie,
    informations pratiques, lexique, chiffres, infographie, contexte,
    documents de référence: rapport in extenso, sondage, enquête…)

   hypertexte transversal: un autre document du même site ou d’un
    autre site

   hypertexte audiovisuel: proposer un contenu multimédia

Ecr130 cm3 2011

  • 2.
    A partir de l’appel d’offre (un cahier des charges fonctionnel)  Bien cerner les besoins et constituer les équipes en fonction des nécessités
  • 3.
    Dans le cadre des projets de S1, c’est simplifié: il n’existe que des projets de sites web statiques  La constitution des agences sera donc la même: des groupes de 3:  Un développeur HTML/intégrateur/ergonome  Un graphiste  Un concepteur/rédacteur de contenu  Parmi les trois, un chef d’agence désigné  Trouver un nom (brainstorming), une identité visuelle, créer un site d’agence sur le FTP du chef
  • 4.
    Vous avez les éléments dans le cours de Michel Petit  Il s’agira, ici, d’un CDC restreint, mais présenté professionnellement (page de titre, mise en page soignée, sommaire, à l’identité de l’agence…): - Origine du projet, contexte - Publics cibles - A partir de l’analyse de l’existant: problématique, objectifs - Contraintes - Services et livrables attendus - Délais de réalisation (dont validations intermédiaires)
  • 5.
    Rechercher des sites qui correspondent au projet  Les questionner du point de vue:  Du contenu (rédactionnel)  De la navigation/de l’interactivité (ergonomie)  Du design graphique  Du marketing  Voir questionnaire distribué
  • 6.
    Un site doit répondre aux besoins des utilisateurs.  Caractériser des public principal/secondaires  Définir des profils-types/ « personas »: http://www.cooper.com/journal/2003/08/th e_origin_of_personas.html  Etablir des scénarios (10 à 30): A veut obtenir telle ou telle information; B contacter le responsable; C résoudre tel problème…
  • 7.
  • 9.
    Act Acceptation Check Plan Do
  • 10.
    Validation •1/10 •3/10 •2/10 Validation Validation…
  • 12.
    Choisir les rubriques  Les nommer  Les regrouper  Les hiérarchiser  Représenter la structure d’information
  • 14.
    Le look and feel  “In software design, look and feel is a term used in respect of a graphical user interface and comprises aspects of its design, including elements such as colors, shapes, layout, and typefaces (the "look"), as well as the behavior of dynamic elements such as buttons, boxes, and menus (the "feel")” (Wikipedia).
  • 19.
    Délimiter un périmètre rédactionnel  Matière première: la recherche d’information  Fournie par le client  Autres contacts  Expérience personnelle  Sources documentaires, y compris Internet et BD  Attention aux mauvaises sources, à l’inexactitude dans leur reprise  Trier en fonction du sujet précis et de l’angle choisis
  • 20.
    Accueillir: La page d’accueil a la même fonction que la « une »: la « prise en main », à travers une vision globale des contenus et une présentation concise de ce qui va être développé « à l’intérieur ».  Capter l’attention à un premier niveau avec les titres, les sous-titres, les illustrations, éventuellement les « manchettes »
  • 21.
    Capter l’attention à un second niveau: -le chapeau -les intertitres -d’éventuels encadrés -l’attaque de l’article -la chute de l’article -les légendes des illustrations
  • 22.
    Organiser l’information:  Faire passer un message essentiel.  Avant la rédaction, formuler clairement le message  Souvent un article papier = 1 à 4 feuillets (1 feuillet=1500 signes), un article électronique = 50% de l’équivalent papier.  Pour un fait d’actualité, la règle:  « Quis? Quid? Quando? Ubi? Cur? Quomodo? Quibus auxiliis? »  Who? What? Where? When? Why? How?  Qui? Quoi? Où? Quand? Pour quoi? Comment?
  • 23.
    • Organiser lesinformations Le plan: la pyramide inversée (information événementielle) Du plus au moins important 1.Le fait 2. Les raisons 3. Le contexte Dans les 4. Information complémentaire, premiers 20%, conséquence… 80% de l’information
  • 24.
    Organiser l’information:  Le plan: autres choix  Plan analytique: cause-principaux faits-conséquences  Plan démonstratif: message essentiel-succession d’arguments  Plan chronologique  Scénario  …
  • 25.
    Rédiger un texte lisible, dense, concis, accessible: -priorité à ce qui est d’intérêt général -suppression de tout ce qui sort de l’angle choisi -abandon des aspects secondaires -retrait des répétitions, des redondances, des pléonasmes -chasse aux imprécisions -utilisation de termes précis -renvoi au concret et à l’imagé -citation de propos, mise en scène -coupe des phrases trop longues -phrases s’adressant directement au lecteur
  • 26.
     Rédiger avec des outils comme :  La cote de lisibilité de Rudolf Flesh: 206.835-(1.015*moyenne des mots par phrase)- (84.66*moyenne de syllabes par mot) de 1 à 100 (de très difficile à facile): cf. Word  Le fog index de Gunning: (nb moyen de mots par phrase+pourcentage de mots de plus de trois syllabes)*0.4 bd=6, journaux=10, écrits universitaires=16, cote d’alerte=12
  • 28.
    Rédiger avec le souci de la langue; respect de:  l’orthographe  la grammaire  la ponctuation  les règles typographiques
  • 29.
    Titrer:  Surtitre: situer l’action, moment, lieu, domaine d’information (parfois un seul mot-repère)  Titre: concentration de l’information ou du message; mots-clés du sujet  Sous-titre: complément: comment? Pourquoi? Parfois confondu avec le chapeau  Sommaire: énumération des aspects importants de l’article ou du dossier  Rarement l’ensemble
  • 30.
    Choisir un bon titre:  clair, facilement compréhensible  court, nerveux, direct  proche du lecteur  précis  sur mesure  original  adapté au genre (informatif, citation)
  • 31.
    Deux choix:  Titre informatif:  Qui?  Quoi?  Titre incitatif:  mots chocs  jeux de mots  allusion, appel à la curiosité  jeux sur les contraires  collisions d’événements
  • 32.
    Habiller:  le chapeau (compléter le titre, résumer l’information, justifier l’article, situer le contexte, annoncer le plan, inviter à la lecture): court de 10 à25 mots.  Des paragraphes courts (3 phrases, env 50 mots)  l’intertitre (faire respirer le texte, casser le gris, entrée possible, baliser la lecture)  l’attaque (catch phrase: description, citation, histoire, formule, sentence, image, paradoxe, bizarrerie, dramatisation, prise à partie  la chute  les « encadrés » (chiffres, données, exemple, témoignage, miniportrait, chronologie, lexique)
  • 33.
    Soigner les hypertextes:  hypertexte horizontal: approfondissement d’une information de base: chaque point important traité comme une brève avec un lien hypertexte vers un développement  hypertexte vertical: approfondissement progressif, en cascade, vers des sujets de plus en plus pointus  hypertexte latéral: des compléments (bibliographie, chronologie, informations pratiques, lexique, chiffres, infographie, contexte, documents de référence: rapport in extenso, sondage, enquête…)  hypertexte transversal: un autre document du même site ou d’un autre site  hypertexte audiovisuel: proposer un contenu multimédia