Projet Web Collaboratif
Partie 2 – La stratégie éditoriale
Eric GIRAUDIN
Département Information-Communication,
option Inf...
Plan du cours
1. Démarrer
2. L’image de de la marque : ligne
éditoriale et identité visuelle
3. Organiser l’éditorial
4. A...
Démarrer
• Quelle thématique?
• A quelle problématique globale mon projet
doit répondre?
• Situation dans la stratégie de ...
L’image de l’organisation :
la ligne éditoriale
Définir les périmètres du territoire éditorial
(publics, langues, contribu...
Exemple
de
stratégie
de
présence
en ligne
L’image de l’organisation :
L’identité visuelle
• L’identité visuelle :
– Ensemble des éléments visuels qui permettent la ...
Ressources et exemples
app.mockflow.com
Wireframing
dafont.org
Exemple charte
graphique
Flaticon
Trouver sa typo
Icônes gr...
Organiser l’éditorial
« La bible du projet éditorial qui précise la
stratégie éditoriale, le design, le concept, la
straté...
Organiser l’éditorial… au quotidien
• Créer les contenus : rédacteurs web
• Editer des contenus : éditeurs web
• Enrichir ...
Pensez à l’accessibilité web
• Créer les contenus : rédacteurs web
• Editer des contenus : éditeurs web
• Enrichir les con...
Architecture de l’information
« Chaque chose doit être à la bonne place! »
• Travailler avec en co-design avec des usagers...
Ressources
Pour mettre en place une architecture ne pas hésiter
à utiliser des outils de mindmapping (ex : framindmap)
Votre projet
• Rendu de la fiche projet pour le 27 février 2015
• Aujourd’hui : continuer le travail de groupe :
stratégie...
Prochain SlideShare
Chargement dans…5
×

2015 cours-projet web-infonum-part2

579 vues

Publié le

Support de la deuxième partie du cours Projet Web Collaboratif au département Information-Communication de l'IUT2 Grenoble, DUT 2ème année, option Information Numérique dans les Organisation

Publié dans : Internet
0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
579
Sur SlideShare
0
Issues des intégrations
0
Intégrations
142
Actions
Partages
0
Téléchargements
8
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

2015 cours-projet web-infonum-part2

  1. 1. Projet Web Collaboratif Partie 2 – La stratégie éditoriale Eric GIRAUDIN Département Information-Communication, option Information Numérique dans les Organisations - IUT2 Grenoble
  2. 2. Plan du cours 1. Démarrer 2. L’image de de la marque : ligne éditoriale et identité visuelle 3. Organiser l’éditorial 4. Architecture de l’information
  3. 3. Démarrer • Quelle thématique? • A quelle problématique globale mon projet doit répondre? • Situation dans la stratégie de l’organisation? • Analyser l’existant! • Se différencier de la concurrence!
  4. 4. L’image de l’organisation : la ligne éditoriale Définir les périmètres du territoire éditorial (publics, langues, contributeurs, informations…) Définir les objectifs éditoriaux à atteindre Définir les formats éditoriaux (blogs, newsletter, flux RSS, articles, pages, catalogues…) >> Rédiger une charte éditoriale
  5. 5. Exemple de stratégie de présence en ligne
  6. 6. L’image de l’organisation : L’identité visuelle • L’identité visuelle : – Ensemble des éléments visuels qui permettent la reconnaissance d’une organisation • La charte graphique – Document qui formalise les éléments de l’identité visuelle • Le Wireframing – Travail sur les gabarits de page (maquette non réaliste). • La maquette visuelle réaliste – Epreuves graphiques donnant un aperçu réaliste de la future apparence du site • Le thème graphique – Découpage de la maquette visuelle du design du portail en fichiers (XHTML, CSS…) permettant son intégration de manière cohérente.
  7. 7. Ressources et exemples app.mockflow.com Wireframing dafont.org Exemple charte graphique Flaticon Trouver sa typo Icônes gratuits
  8. 8. Organiser l’éditorial « La bible du projet éditorial qui précise la stratégie éditoriale, le design, le concept, la stratégie de référencement, la planification des étapes, les fonctionnalités attendues, les attentes techniques, etc. ». Exemple sur le site IMPALAWEBSTUDIO LE CAHIER DES CHARGES
  9. 9. Organiser l’éditorial… au quotidien • Créer les contenus : rédacteurs web • Editer des contenus : éditeurs web • Enrichir les contenus : graphistes, photographes, illustrateurs, communicants, vidéastes, iconographes… • Publier et rendre trouvable ses contenus : documentalistes, spécialistes de l’information numériques… >> Et surtout, mettre en place un Workflow! • Créer les contenus : rédacteurs web • Editer des contenus : éditeurs web • Enrichir les contenus : graphistes, photographes, illustrateurs, communicants, vidéastes, iconographes… • Publier et rendre trouvables ses contenus : documentalistes, spécialistes de l’information numériques… >> Et surtout, mettre en place un Workflow!
  10. 10. Pensez à l’accessibilité web • Créer les contenus : rédacteurs web • Editer des contenus : éditeurs web • Enrichir les contenus : graphistes, photographes, illustrateurs, communicants, vidéastes, iconographes… • Publier et rendre trouvable ses contenus : documentalistes, spécialistes de l’information numériques… >> Et surtout, mettre en place un Workflow! Extrait du site w3qc.org « L’accessibilité web signifie que les personnes handicapées peuvent utiliser le web » • Ce n’est pas à la personne handicapée de s’adapter à votre site mais à vous de le rendre accessible. • Il faut l’intégrer dans vos pratiques de rédaction web ou dans votre cahier des charges Exemples de bonnes pratiques : • Chaque image intégrée dans vos contenues, utile à la compréhension de vos informations, doit être renseignée en version alternative textuelle; • Les liens hypertextes doivent être sémantiques. « Cliquer ici » ne permet pas à un aveugle de savoir ce qu’il va trouver en cliquant sur ce lien. Par contre « Afficher la suite de l’article Partir en vacances » sera beaucoup plus explicite.
  11. 11. Architecture de l’information « Chaque chose doit être à la bonne place! » • Travailler avec en co-design avec des usagers finaux, se mettre à la place des visiteurs, collaborer avec des ergonomes; • Définir : – L’architecture des contenus : plus utile à votre équipe de contributeurs – L’architecture fonctionnelle : plus utile à vos visiteurs (plan du site) – La (les) navigation(s)
  12. 12. Ressources Pour mettre en place une architecture ne pas hésiter à utiliser des outils de mindmapping (ex : framindmap)
  13. 13. Votre projet • Rendu de la fiche projet pour le 27 février 2015 • Aujourd’hui : continuer le travail de groupe : stratégie, ligne éditoriale et visuelle (début de cahier des charges) • Pour le 6 mars : mini charte graphique + avancer la maquette • Pour le 20 mars : mini cahier des charges • Pour le 31 mars : préparer sa présentation PPT et oral de jury

×