Tous les outils et méthodes utilisés lors de la création du site de la médiathèque de Roubaix en 2015 : fiches de cadrage, personas, audit, ateliers ... et les recettes pour reproduire. Première partie : cadrer et définir son site web (définir ce qu'on veut faire). Qui aboutit à la définition du cahier des charges.

1. CREER UN SITE WEB ?
Méthode illustrée par la médiathèque de Roubaix
PARTIE 1 – Définition et
cadrage
Juliane Casier – chef de projet numérique
Médiathèque de Roubaix La Grand-Plage
Retour d’expérience – avril 2018

2. Entre 2015 et 2014, la médiathèque a entièrement refait son
site internet. (Et son SIGB, et son rez de chaussée… mais c’est
une autre histoire).
Des centaines de documents ont été produits, des heures de
réflexion ont été passées… Tout ça pour un tout petit portail
de bibliothèque mis en ligne en septembre 2015
www.mediathequederoubaix.fr
Le site a beau être magnifique, ce document permet de
synthétiser et garder une trace du projet et des réflexions qui
ont été faites. Pour qu’éventuellement cela puisse servir à
d’autres.
 Une équipe issue du monde de la gestion de projet
(donc qui utilise amoureusement quelques outils type
fiche de cadrage, planning ).
 Un intérêt certain mais pas forcément maîtrisé pour les
méthodologies d’UX design => le manque d’expertise
est compensé par des réunions d’équipe pour se poser
les questions existentielles.
 Un outil « à façon avec une totale liberté pour créer les
interfaces graphiques du site web. Cela était imposé
dans notre cahier des charges.
Pourquoi on était convaincus par les méthodologies d’UX
Design ?
Parce qu’on est surs de peu de choses mais qu’on a pris le
parti suivant : un site réussi est un site qui répond aux
besoins des utilisateurs.
L’ambition du projet était élevée (mais quitte à faire autant
viser haut) : Faire un site internet de qualité, qui répond aux
besoins des utilisateurs.
A cela, notre réponse a été… la méthode. On utilise les outils
présentés ci-dessous, on crée un processus de travail (avec
des réunions régulières et courtes où on se pose les
questions), on fait attention à respecter le planning (et pour
ca, la solution c’est souvent de viser moins haut en priorisant
le plus important) … et le reste suit (avec un peu d’énergie).
On n’a pas suffisamment de recul pour savoir si le résultat est
réussi (il est visible ici www.mediathequederoubaix.fr ) mais le
plan du document suit les méthodes et outils principaux
utilisés tout au long du projet.
Des outils réutilisables et les documents les plus importants
construits avant la rédaction du cahier des charges, pour
définir quel site internet on voulait. Une 2è partie sera
produite un jour sur la mise en œuvre
△ C’est quoi ce document ?
Introduction
▲ Les caractéristiques du projet
△ Créer un site internet de qualité, qui
répond aux besoins des utilisateurs, c’est
facile…. ???
△ On trouve quoi dans ce document ?

3. Côté Roubaix
Côté prestataire (W3Line puis Décalog)
▲ L’équipe projet
Qi
stagaire ergonome
Juliane
Chef de projet
François
Chargé de projet
Le comité de pilotage
(l’équipe de direction)
Christian
Chef de projet
Gladys
Ergonome
Samuel
Spécialiste
statitistique web
Thomas
Développeur
Christine
Ingénieur DSI
Laurent
Directeur de projet

4. 2. La définition de l’identité
du futur site internet
1. Travail préparatoire….on
définit ce qu’on veut faire
▼ Outil 1 - La fiche de cadrage
▼ Outil 2- les personas
▼ Outil 3 - Définition de l’utilité du site
internet
▼ Faire une cartographie de l’existant
▲ Réfléchir à ce qu’on aime (ou pas) et se
former collectivement au web
▲ Synthèse des axes forts pour le futur
site internet de la médiathèque de
Roubaix
Créer un site internet de qualité, qui répond aux besoins des utilisateurs
~~~DEFINITION ET CADRAGE~~~
3. Le cahier des charges

5. Première étape, définir et formaliser ce qu’on veut faire et pourquoi on veut le faire. Dans cette partie, chaque outil est présenté
rapidement de manière théorique puis sont détaillées les étapes pour expliquer et donner accès aux documents du projet
Une fiche de cadrage c’est quoi ?
C’est l’élément principal du projet, qui résume tout en une page. S’il ne fallait
garder qu’un seul outil ce serait celui là. Ca résume les éléments essentiels de ce
qu’on est en train de créer
Ça sert à …
Se poser les bonnes questions et prioriser (comme la fiche est synthétique)
Communiquer sur le projet
Faciliter le travail : en la relisant en 5’ n’importe qui doit voir les enjeux
essentiels du projet
Nommer le projet (lui donner un titre, ca permet d’en parler plus
facilement)
Faire valider la fiche de cadrage avant de se lancer, afin que les questions
fondamentales soient discutées avant d’avoir déjà trop avancé
1. Travail préparatoire….on définit ce qu’on veut faire
▲ Outil 1 – La fiche de cadrage

6. ▲ ▼La fiche de cadrage du site internet de la
médiathèque de Roubaix

7. Les personas, c’est quoi ?
C’est un utilisateur cible et fictif qui permet de fixer des priorités et guider les décisions
de conception d’interface & éditoriale.
A quoi ça sert ?
Ça sert à se pencher sur ses utilisateurs. Pour le cas du projet de refonte de la
médiathèque de Roubaix, ceux-ci ont été créés collectivement pour essayer de créer une
dynamique axée utilisateur (mais qui n’a pas tellement perduré, il aurait fallu les faire
vivre au sein des équipes..).
Ils ont ensuite servis régulièrement tout au long du projet
 Pour construire les contenus de la page d’accueil et les éléments qu’on retrouve sur
toutes les pages du site
 Pour se repositionner, quand on se pose des questions importantes (Choisir entre
plusieurs maquettes graphiques, décider d’un principe de fonctionnement ou d’une
fonctionnalité…)
Si c’était à refaire
(Parce que depuis le guide du design thinking est passé par là)
On ajouterait des interviews de réels utilisateurs pour sortir de la médiathèque (là on
était un peu focalisés) – ce qui nous intéresse c’est de comprendre comment les
utilisateurs fonctionnent chez eux et d’avoir des éléments au maximum objectifs.
Les étapes qu’on a utilisées pour produire les personas :
- Définir les typologies d’utilisateur grâce aux statistiques
- Un atelier collaboratif pour que les collègues en contact avec le public fassent part de leur expertise en terme d’usagers
- Un retravail pour rendre les personas utiles au projet – par une ergonome
- Ces personas ont été enrichies par notre stagiaire en ergonomie au fur et à mesure du projet
△▲ Outil 2 - Les personas

8. ▲ ▼Un atelier collaboratif pour définir des personas
NB : voir détail des outils utilisés en Annexe 1

9. Quelques résultats de l’atelier

10. ▲ ▼Le travail de synthèse par une ergonome : les personas de la médiathèque

12. L’utilité c’est quoi ?
C’est une notion en ergonomie informatique, il s’agit de la liste
de ce à quoi sert l’interface. 1
A quoi ça sert ?
 A définir en détails comment et pourquoi va être utilisé le site internet.
Si c’était à refaire :
On aurait ouvert à l’utilisation mobile. On aurait complété avec des entretiens
d’utilisateurs pour être plus proche d’utilisateurs réels (et moins d’utilisation définies
par la bibliothèque et les bibliothécaires) et être plus déconnectés de la médiathèque.
▲ ▼L’utilité du site internet de la médiathèque de
Roubaix
1 http://www.ergolab.net/articles/ergonomie-informatique.php
▼ Outil 3 – Définition de l’utilité du site internet

13. A quoi ça sert ?
A savoir de où on part, ce qui permettra d’avoir une ligne
de route.
Pour la médiathèque de Roubaix, nous avons effectué
deux cartographies :
- Une cartographie des outils web
- Un audit du site internet existant
▲ ▼La cartographie des outils web
de la médiathèque
On cartographie les différents outils web utilisés par la
médiathèque pour définir les mécaniques et les apports
de chaque outils, ainsi que la logique de tous les outils
entre eux.
▼ Faire une cartographie de l’existant

14. ▲ ▼ L’audit du site internet existant.
Comme on part sur une redéfinition complète du site internet, l’audit ne sert que de point de départ pour faire ressortir ce qu’on
souhaite garder, ce qui fait l’identité et les qualités du site existant. Pour cela on a utilisé une grille permettant de mesurer un
certain nombre de critères (page d’accueil, fonctionnalités, navigation…).
Les éléments principaux sont synthétisés dans un rapport.
L’audit ne peut pas être fait par le webmaster, il faut un regard frais et distancié (quand on s’occupe d’un outil quotidiennement il
est impossible d’avoir un réel regard critique dessus). Dans notre cas, c’est un stagiaire en ergonomie qui l’a fait, complété par une
ergonome (prestation demandée en tout début de projet).
Les résultats de l’audit de l’ancien site
1. Manque de cohérence et de visibilité des éléments de navigation
 Le menu principal se distingue mal et est confondu avec le fond
 Plusieurs menus sont à utiliser simultanément pour naviguer et ils
sont souvent redondants
2. Multiplication des accès aux sites et fonctionnalités
 Plusieurs outils sont utilisés : site/blog (typo3), catalogue (Horizon
Dynix), Bnr (w3line). Liés à l’historique du site
3. Une page d’accueil uniquement centrée sur l’agenda
Elle devrait pouvoir mettre en valeur l’ensemble des informations qui « font
la médiathèque ». Par exemple, des informations pratiques pourraient être
utiles dès la page d’accueil, mais la rubrique est isolée tout à droite de
l’écran.
4. Le manque d’accès directs
Il n’y a pas possibilité de s’authentifier sur le site, et pas de filet de recherche
pour le catalogue.
5. Le site évite l’utilisation excessive de scripts, applets etc…
On ne relève pas non plus d’éléments en technologie flash ce qui est positif.
Cependant, le site est trop statique
6. Les pages statiques du site sont particulièrement textuelles
Le site contient des articles plutôt longs et assez peu d’images,
contrairement au blog et à l’agenda plus attractifs, plus directs.
7. Le site a une identité graphique originale
Le site de la médiathèque de Roubaix ne ressemble pas un site de
médiathèque. Il échappe au carcan imposé des portails spécialisés. Son
originalité est un élément important. Même si la charte graphique change, il
faudra conserver cet aspect original et innovant, tout en identifiant bien les
services et fonctionnalités proposés

15. Deuxième étape pour construire un site internet de qualité : déterminer son identité et commencer à avoir une vision de ce qu’on
souhaite en terme de contenus et de graphisme.
En effet, un bon site web est un site qui a une forte identité : identité graphique et identité de service (et donc selon nous –
identité des gens qui composent le service et l’alimentent). Le piège c’est souvent de vouloir tout mettre sur son site et de ne pas
faire de choix.
Pour cela, la solution choisie a été de critiquer des sites internet de manière intensive jusqu’à trouver et définir ce qui nous
intéressait. « Nous » c’était les professionnels de la médiathèque amenés à être impliqués sur le futur site, les volontaires et
l’équipe de direction. Cette démarche n’a pas intégré les utilisateurs finaux.
▲ ▼ Le café numérique
Le café numérique c’est quoi ?
C’est un concept « maison » : il s’agit de moments courts, conviviaux et réguliers durant lequel les personnes présentes critiquent
des sites internet. Le but était :
- D’infuser et diffuser de la culture web
- D’avoir un groupe qui se « forme l’œil » et qui définit au fur et à mesure son identité web en sortant les points qui sont
importants et ceux qui font consensus.
Les sites web sont collectés dans un Skloog
2
au fur et à mesure selon les propositions du groupe et une veille de l’équipe projet.
Les sites internet choisis sont plutôt issus du secteur privé (Les sites internet sont souvent plus à la pointe quand il y a un enjeu
financier et des équipes dédiées à la communication web).
Tous les comptes rendus étaient rédigés sur un blog Wordpress par le chef de projet, formé à l’écriture web – cela permet
également de diffuser la culture web. Les personnes répondaient dans les commentaires
Les cafés numériques ont duré pendant 5 mois, en amont de la rédaction du cahier des charges
2 http://www.skloog.com/user/jcasier/56590
On aurait utilisé maintenant plutôt MyFrama – équivalent libre de framasoft
2. La définition de l’identité du futur site internet
▼ Réfléchir à ce qu’on aime (ou pas) et se former collectivement au web

17. ▲ ▼ Atelier de création de maquettes
Notre manière de clôturer le café numérique : proposer un atelier de création de maquettes de pages d’accueil grâce à du collage
de morceaux de sites internet existants. Le but est de passer de la critique à « faire ». Les résultats ont été utilisés ensuite pour
rédiger le cahier des charges, afin de ressortir des axes forts transmis au prestataire du futur site. Voir détail des outils utilisés en
Annexe 2

18. Maquette de Clotilde
Mission : innover
Concept :
- ne pas mettre de contenus en lien avec les collections depuis la
page d’accueil, utiliser le moteur de recherche pour cela
- Pied de page jouant sur l’humour et le décalage
Maquette de François et Elise
Mission : Attirer les jeunes
Concept :
- Développer le collaboratif (partie « Vous »)
- Image et vidéo au centre
Quelques résultats de l’atelier

19. Ne reste qu’à mettre les résultats de tous les ateliers dans
une grande marmite et les synthétiser (par exemple avec des
cartes mentales puis sous forme d’écrit à destination du futur
prestataire)
▲ ▼ Quel site internet pour la
médiathèque ? 3
OBJECTIF 1 : un Site avec des axes forts et une identité
graphique marquée
► Avoir une véritable création graphique avec un visuel fort
et tranché, qui correspond à l’identité de la médiathèque. Le
graphisme sera créé par un graphiste indépendant.
► Avoir un ou des service(s) et des parti pris marquant
Ce sera les surprises un dispositif participatif qui permet aux
utilisateurs en 15’ de « taguer » un document en fonction de
s’il a +/- aimé (ou pas). Ce concept est apparu au fur et à
mesure et a été inspiré des pochettes surprises (dispositif
physique existant dans les médiathèques).
D’autres idées ont émergé au fur et à mesure (voir Annexe 3)
mais une seule a été développée pour des questions de
faisabilité.
OBJECTIF 2 : un Site de qualité, qui répond aux besoins des
utilisateurs
►Revoir complètement le plan du site:
3 Si la majorité de ce document a été produit à la fin de la phase de cafés
numériques, certains commentaires sont faits avec du recul
 Partir des besoins des usagers uniquement - Démarche
UX décrite en détail dans le CCTP avec d’autres
éléments (voir Annexe 4)
► Avoir un ou deux services qui améliorent notablement le
système actuel
 Les lister et choisir. Les mettre en valeur dans le cahier
des charges
o Modifier son identifiant / mot de passe
o Ne pas avoir à se reconnecter pour accéder à une
ressource payante (Arte VOD, Assimil…)
o Pour les professionnels, créer des sélections de
documents facilement grâce à l’utilisation de
paniers
o N’avoir dans le catalogue que les documents
consultables (on enlève les sortis des collections)
► Trouver une place pour la médiation numérique des
savoirs (autrement dit, tout ce qui permet de mettre en
valeur des documents du catalogue via le web)
 Intégrer aux résultats de la recherche les contenus de
médiation
 Développer des espaces thématiques – médiation
destinée à un public spécifique
► Charte de qualité pour le futur site
 Définir des axes ergonomiques pour la conception du
futur site
o Cf annexe 5
 Définir une charte éditoriale pour le futur site
▼ Synthèse des axes forts pour le futur site internet de la médiathèque de Roubaix

20. Quelques résultats
Le service qui propose à l’utilisateur de personnaliser
son identifiant/ mot de passe (facilite l’accès à
l’espace personnel, au WIFI, aux ordinateurs de la
méd.)
L es résultats du
moteur de
recherche
proposent aussi
les articles du site
internet s’ils sont
pertinents
Espace thématique parent agrégeant tous les
contenus de la médiathèque qui peuvent les
intéresser + de la mise en avant de contenus du web
et de la médiathèque
Si un document a
fait l’objet d’une
surprise, d’une
sélection ou d’une
critique, cela se
retrouve sur la
notice

21. A ce stade, le projet était cadré (on savait ce qu’on voulait
faire), ne restait « plus » qu’à définir un cahier des charges.
Sachant qu’étant établissement public, on est soumis au code
des marchés publics.
L’enjeu de celui-ci est de décrire suffisamment la prestation
pour que le prestataire puisse chiffrer précisément son offre
(et qu’on puisse mettre en concurrence sur les même critères.
Il s’agit également de prévoir et imposer ce qu’il faut lors de la
mise en œuvre, tout en laissant une ouverture au prestataire
pour faire une offre la plus pertinente possible.
Le cctp est disponible à l’adresse :
http://www.mediathequederoubaix.fr/infos/qui-sommes-
nous
Au niveau de la description des prestations, on pense souvent
avant tout à décrire les fonctionnalités (ce qu’on veut que
l’outil fasse). Mais il faut aussi que Google sache qu’il existe,
qu’il corresponde aux habitudes d’utilisation des utilisateurs,
qu’il soit attractif (pas ringard, lisible), etc.. Et il est
important de faire des choix : il vaut en effet mieux 10
fonctionnalités utiles que 1000 moyennement pratiques. Or
ca n’est pas toujours évident de connaitre vraiment les
besoins et pratiques des utilisateurs.
Dans notre cahier des charges, nous avons ainsi intégré la
stratégie suivante :
1) Cadrer et présenter le site
- Présentation du site
o A partir des éléments ci-dessus : fiche de
cadrage, principes définis…
- Définition des grands principes du site internet :
o Mobile first
o Un site accessible, bien référencé (se pense dès la
conception)
o Recherche à la google
o Un site ergonomique et attractif graphiquement
2) Définir le périmètre complet de la prestation pour ne pas
oublier l’essentiel
- Gestion de projet : pour avoir un mode de
fonctionnement efficace et imposer des méthodes
ergonomiques qui permettent de modifier ce qui a été fait de
manière cadrée (on n’aime pas trop en projet défaire ce qu’on
a fait, ca porte un risque de ne jamais terminer le projet).
- Prestations d’ergonomie et de graphisme web
- Fonctionnalités de l’outil détaillées. On a imposé
certains outils pour lesquels on savait qu’ils répondaient aux
besoins (Piwik pour les statistiques par exemple).
- Prestation de référencement : description de ce qui
est imposé comme règles et outils, demande de
prestation de référencement
- Prestation d’accessibilité : description de ce qui est
imposé comme règles et outils, on imposé la
méthode en se basant sur les recommandations sur
l’accessibilité des sites WEB publics proposées par
le Ministère de l’Economie et des Finances (qui doit
dater un peu maintenant)
3. Le cahier des charges
△ Et maintenant… la définition du cahier
des charges
▲ Le périmètre de la prestation

22. 3) Décrire ce qui permet de dimensionner l’outil
C’est souvent là qu’il ne faut pas tout décrire trop
précisément si on veut laisser un peu de marges aux solutions
qu’on n’envisage peut être pas. On peut ainsi décrire :
- Les grandes fonctionnalités attendues du CMS
- Les types de contenus du CMS pour pouvoir budgéter le
nombre d’interfaces à développer
- Les fonctionnalités du moteur de recherche (mais
attention à « maitriser » les demandes en ayant une
solution technique en tête sinon ca peut chiffrer)
- Développements spécifiques (dans notre cas, un module
de gestion de malles lecture développé à façon)
- Description de la manière dont le portail intéropère avec
les autres outils de la médiathèque (annuaire lecteur,
SIGB, ressources numériques payantes…)
- Description des besoins en authentification unique.
- Intégration des contenus du site internet (géré par le
CMS) et des notices bibliographiques (souvent géré par
la brique moteur de recherche)
On sait toujours mieux après coup ce qu’il aurait mieux valu
faire autrement. Dans notre cas, quelques idées :
- Prévoir la rémunération du prestataire segmenté sur
chaque release (à chaque livraison) – on a du faire
des avenants
- Prévoir la prestation d’ergonomie et de graphisme
dans un lot à part
o On souhaitait avoir une prestation d’un
ergonome pour nous aider à trouver des solutions
aux problèmes soulevés en tests utilisateurs. Et
on s’est rendus compte qu’un graphiste web avec
une formation en ergonomie c’est beaucoup
mieux mais ca ne se trouve pas toujours
facilement.
o Et dans l’idéal (parce que depuis on a testé la
méthode et que c’est vraiment efficace), on
aurait fait un focus group en amont du projet
(piloté par un prestataire ergonome web) plutôt
que pleins de tests utilisateurs
- Services + : on aurait réfléchi nous même à un
service de newsletter adapté. On a fini par utiliser
Mailjet (service externe) sans que cela soit cohérent
avec notre politique de maitrise des données
utilisateurs)
- Pour le référencement, on avait imposé des règles et
outils dans le cahier des charges (qui avaient été
défini grâce au cours sur le référencement d’Open
Classroom), mais la demande de prestation de
référencement n’a pas vraiment été suivie de faits.
- Idem pour la prestation d’accessibilité. On aurait dû
imposer la labellisation (souvent payante mais dont
le cout peut être intégré au projet) dans la foulée.
▲ Un retour d’expérience

23. A ce stade, le projet était défini, le prestataire choisi (Décalog
dans notre cas).
La mise en œuvre pouvait se dérouler…
A suivre dans une prochaine partie (quand on aura le temps
de développer la documentation), la mise en œuvre du projet
et du site internet, notamment la conduite des tests
utilisateurs.
Cette œuvre est rédigée en avril 2018 par la ville de Roubaix.
Elle est mise à disposition selon les termes de la Licence
Creative Commons Attribution – Partage dans les même
conditions
Conclusion
Mentions légales et condition de
réutilisation de ce document

24. Annexe 1 : Atelier de définition de personas – Déroulé et
outils
Déroulé :
A – Présentation
9h10-9h20
Qui : personnes en contact avec le public. Amené à cotoyer
des types d’usagers différents (2 par type d’usager)
 Définition d’un persona - Animateur
Personnage virtuel créé artificiellement, usager cible du
futur portail.
Partir du réél commun. Puis dans un deuxième temps,
spécifier / imaginer (par exemple, rapport à
l’informatique)
Les + rééls = + efficaces.
A quoi vont servir les personas :
Outil qui seront utilisés pendant la conception des
interfaces
> Interface fonctionnelle
> Graphisme
> Parcours d’usage
> Complémentaires des tests utilisateurs
B- Présentation du déroulé de l’atelier
PHASE 1 – présentation de l’atelier - 9h20-9h30
PHASE 2 – Se mettent au travail par groupe de deux –
9h30-10h30
Prendre une des catégories d’utilisateur distribué (groupe
par espace – on donne à l’oral les types d’usager que les
participants côtoient dans le cadre de leur service au
public)
Choisir un usager typique d’un espace que vous connaissez
et décrire leurs usages de la médiathèque et du numérique
Consignes : (données au fur et à mesure en tournant dans
les groupes)
- Plutôt quelqu’un qui utilise internet, le numérique…
(pas une personne qui ne l’utilisera JAMAIS ).
- un mot clef que je vais distribuer (voir ci-dessous les
types d’utilisateur) => un espace ou un type d’usager
pour chacun
- Personne représentative d’un espace que vous
connaissez
- Plutôt monsieur tout le monde (pas usagers qui
râlent et qu’on remarque +): quelqu’un représentatif
d’un groupe
- Rapport à la médiathèque : utilise quel(s) espace(s)
en priorité, pour faire quoi ?
- Décrire ses usages
- Contexte sans intérêt, usages surtout: numérique
(informatique, ressources num’, site internet depuis
chez lui, catalogue ici)
Remplir le modèle distribué (cf ci-dessous)
PHASE 3 – Présentation, discussion, commentaire – 10h30-
11h30
Annexes

25.  1 par un, présentation des personas en temps limité (10
personnes, 40 minutes) / 9h45 – 10h30
 Discussion, commentaires
PHASE 4 – Mise au propre, envoi
NB : analyse a posteriori :
Piège = être dans le cliché ou être « à côté ». On aurait
privilégié une séance d’entretien avec des utilsateurs rééls
Types d’utilisateurs (effectué en amont à partir des
statistiques sur les inscrits)
Jeune Utilisate
ur du
pole
réussir
(emploi)
Nouvel
usager
(creuser
ce qu’il
va
chercher)
Utilise
régulièreme
nt le site
internet
depuis chez
lui
Famille -
> mère
de
famille ;
adolesce
nt qui
vient
pour
toute sa
famille
Empr
unte
ur,
carte
médi
athè
que
Adolesce
nt
Usager
occasion
nel
Utilise
régulièreme
nt le
catalogue à
la
médiathèq
ue
Usager
du
patrimoi
ne qui
vient en
salle
d’étude
Empr
unte
ur,
carte
biblio
thèq
ue
1 enfant ?
(utilise le
site
internet /
catalogue
?)
Usager
régulier
Non
empr
unte
ur
(pas
trop)
Guides pour remplir les modèles

27. Annexe 2 : Atelier de création de pages d’accueil - Déroulé et
outils
Le principe de l'atelier :
Construire la maquette fonctionnelle de la page d'accueil du futur site
internet de la médiathèque d’une ville du Canada qui ressemble en tous
point à la médiathèque de Roubaix. Maquette construite à partir de
copier/coller d'autres sites + dessins + tout outil utile
Outils proposés : accès à internet ciseaux, colle, papier…
Avec une mission spécifique pour chaque groupe. Les missions proposées :
- Augmenter l’attractivité pour les jeunes.
- Fidélisation des internautes en leur proposant un contenu
interactif, attractif et mis à jour régulièrement.
- Pour orienter les différents types d’usager du portail au sein des
ressources quels que soient leurs besoins (recherche précise en
tête ou recherche d’idées de lecture)
- Innover : créer un site de Médiathèque différent de ce qui existe,
- Faciliter l’accès aux services par type de public
Et une fiche de cadrage imposant ... le cadre (comme son nom l'indique) .
1/ présentation du cadre, des outils, lecture collective et appropriation de
la fiche de cadrage
- Chacun choisit puis colle la mission sur la fiche de cadrage (cf
missions listées ci-dessus)
- Chacun choisit puis colle un nom de ville (utilisation de noms de
ville québécois rigolos)
2/Par deux, chacun a 1h pour faire sa page internet à l’aide de colle et de
ciseaux. Ils doivent la commenter et l’analyser à la fin
3/ Présentation devant tous : des difficultés rencontrées + partis pris
pour répondre aux missions et lever les difficultés.
+ fiche de cadrage réajustée et redéfinie
Fiche de cadrage
Donnée à chaque binôme

28. Annexe 3 : Idées évoquées pour avoir des services et partis
pris marquants – Synthèse complète à l’issue des cafés
numériques
 Créer un service de « drive » de document
inspiré des supermarchés drive
 Créer un service d’inscription complet en
ligne
 Transparence sur la gestion des collections
o rendre humain, visible les opérations
de création de fonds.
o Montrer les coulisses de la
médiathèque au sein du
« catalogue »: office, pilons,
acquisitions...?
o Donner des éléments de choix issus
de l’expérience des bibliothécaires :
choisir un bouquin ? etc… ?
 Les musées et bibliothèques sont des
endroits protégés que le publique vient
chercher => expérience du lieu + légitimité
de l’institution => jouer cette carte ?
 Aborder le contiinuum (avant, pendant,
après)
 Avoir un ton ?
 Service : pour le conseil => on flashe un livre qu’on a aimé, ça
nous en conseille un autre
 Travailler sur le local et la convivialité ?
 Faire une vraie page outil pour les profs ? (type espace
thématique)
 Utiliser des choses existantes et qui fonctionnent et
fédèrent : vente ?Café ?
 Utiliser la refonte architecturale du bâtiment pour la
traduire dans l'espace numérique. Appliquer les concepts liés
aux réflexions de la bibliothèque 3è lieu ou au zoning à
l'architecture numérique du site internet.
 Faire de l’humour (réflexion café numérique de l’été inspiré
« même ta bibliothèque » et « ciel ma bibliothèque »)
o Risque de tourner à vide : capacité de
renouvellement ?
o L’humour permet de casser le côté institutionnel.
Les bibliothécaires de l’ENSSIB (qui parlent en leur
nom propre et pas en temps que professionnel sur
« ciel ma bibliothèque ») sont drôles sur ce tumblr.
o Faire rire ? Problématique : comment faire rire
sans être cheap
o Mises à jour régulière
o Dans un coin de la page d’accueil ?
o Photographies de scènes à la bibliothèque
o Superpositions : chez soi/ à la bibliothèque (sur le
modèle de « on pense bien à vous »)
o Superpositions temporelle (sur le modèle de la
photo de famille reproduite 20 ans plus tard)
o Intégrer des chats : un livre/un chat ; le chat de la
directrice chaque jour ; mise en scène d’un chat à
la bibliothèque…
o Ce n’est pas le parti pris sur le Facebook plutôt ?
Médiation :
 Favoriser la longue traîne=> jouer sur un décalage (les –
empruntés…)… Peut vite virer ringard ou « moqueur »
 « exporter » la médiation sur : des pages consacrées =>
espace thématique, blog, etc… et sinon ne plus en faire du
tout ?
 Utiliser les pôles de compétences : 1 ou 2 thèmes vitrine ?
(espace thématique - Le décliner ?)
 Coups de cœur qui apparaissent aléatoirement et changent
au chargement de la page – cf citations de Nanarland qui
changent à chaque rechargement
 La bibliothèque idéale ( cf Qobuz) au lieu de « sélection de
bibliothécaires »

29.  Éventuellement sur des thématiques ciblées, avec un travail
sur les accès à faire : exemple de la sélection thématique de
la médiathèque de Marcq-en-Baroeul qui propose une liste
par lieu, avec des thèmes pouvant intéresser les parents (ou
les enfants?)
o Dans le grenier... sorcières, fantômes / Pirates et trésors,
etc...
Avec toutefois un bémol : est-ce que ces thématiques vont être
choisies par les parents ou par les enfants ? (est-ce qu'un livre
sur le pot va être choisi spontanément par un enfant? Est-ce
vraiment une thématique qui l'intéresse ?)
Annexe 4 : Eléments pour le cahier des charges – synthèse
suite aux cafés numériques
Des éléments techniques
- Adapter aux tablettes et supports mobiles
- Concevoir selon une démarche ergonomique
o Définir objectifs – cf annexe
- Cadre = fiche de cadrage
Des éléments imposés
Page d’accueil
- Un logo ou bandeau pour indiquer qu’on est à la
médiathèque/archives de Roubaix
- Une barre de recherche dans la partie haute du site,
de taille moyenne à grande
- Encart « se connecter »
- Une barre de navigation / plan
- Un bas de page
Autres pages
- pour chaque page contenant de l’information, il doit
être possible d’imprimer cette page, d’agrandir le texte
et éventuellement de télécharger la fiche ou le dossier
en pdf,
- Sharebare
- Pour la recherche sur le catalogue, attention aux
articles. Bien tester des exemples de recherche concrets
par des utilisateurs
- Travailler sur la page pour les professeurs qui agrège
tout ce qui concerne ce public spécifique
Des besoins
- permettre de répondre à tous les besoins potentiels
des utilisateurs de la Médiathèque, qu’ils viennent pour
la première fois sur le site ou qu’ils soient des usagers
réguliers.
- Des accès rapides aux pages de médiation
documentaire (a minima les pages thématiques) et à la
page facebook
- Des réponses rapides et concrètes aux principaux
besoins des usagers
- Mise en valeur d’éléments et services marquants
Des principes
- une distinction entre des contenus « volatiles » - qui ont
une durée de vie courte (annonce d’évènements) - et
contenus à durée de vie pérenne
- proposer plusieurs accès à un même type d’information
(mots clef, auteur, date)
- des icônes et un maximum de repères visuels

30. Annexe 5 : Premiers éléments pour la charte éditoriale pour le
futur site internet de la médiathèque et archives de Roubaix –
suite aux cafés numériques
Intégration web :
 PAS DE PDF (sauf en support de téléchargement
éventuel)
 Pas de musique ou de film sans lien vers de l’écoute en
ligne
 Pas de référence documentaire sans image et sans lien
vers la notice complète
 Pas de conseil sans un auteur identifié et nommé, et
une date
Gestion de la une et mises à jour
 Pas de contenu sans mise en valeur sur la page
d’accueil
 Ne prévoir que des contenus qui peuvent être mis à jour
au minimum 1 fois par semaine
Qualité des contenus
 Utiliser des images de qualité
 Travailler sur les accroches et les titres
 Intégrer des liens hypertextes
 Ecrire web
 Avoir des outils communs de rédaction (veille, etc..)
 Travailler sur l’intégration web avec le catalogue
Aspects éditoriaux techniques
 Intégrer l’accessibilité
 Gestion et choix des images : libre de droits, de qualité,
mettre les copyrights
 Proposer des métadonnées pour les contenus
(référencement)
 Mobile first : développer un design d’abord et surtout
adapté pour les supports mobiles.

31. Annexe 6 : Axes d’amélioration à plus long terme – réflexion
suite à la phase de définition
(synthèse d’idées venues à Juliane suite à la journée BNF, à la
journée sur le web sémantique + idées évoquées lors de réunions de
travail par des collègues)
Produire du contenu
 Capitaliser les productions existantes de la
médiathèque :
S'assurer que toute action de médiation culturelle a son
équivalent numérique produit sur le site et facilement
accessible. Par exemple : les productions des ateliers
(création d’affiche, ateliers de Bruno, journée Rascal, etc…)
=> peut servir de porte d’entrée pour faire du collaboratif
avec les classes par exemple, et comme « journal de bord de
la médiathèque ». Permet de concentrer (c’est le besoin pour
le blog actuel exprimé par Clotilde entre autre lors de la
réunion des correspondants POUC de décembre 2013)
Penser à l’alimentation => nécessite un rôle de « journaliste
interne » qui prend des photos, récupère, anime les réseaux
de contributeurs internes.
Puis envisager d’aller plus loin, pour en garder une trace plus
pérenne en inscrivant ces actions dans les collections et donc
dans le catalogue ou son équivalent futur. Pour cela, un
système de tag ou de lien hypertexte vers la bibliographie
présente sur le site et depuis le catalogue (dans une
métadonnée par exemple) pourrait être envisagé comme
base minimum.
 Récolter plus d’information sur les activités de la
médiathèque (ateliers avec les classes ou heures du conte
par exemple), tenir un journal de bord pour les actions
passées.
Comment : mettre en place un système technique de
prise de photo,etc…
 Intégrer en amont le numérique pour chaque projet (ex :
projet de chaine youtube des petits pouces
 Faire vivre : veille, création de lieux d’échange d’idées et
d’expression pour tous les contributeurs ET tous les
professionnels de la médiathèque.
Faire du collaboratif
 Espace pour les profs ?
 S’associer à la politique de démocratie participative
de Roubaix (La fabrique, etc..)
 Appliquer l’expérience d’éducation à la science du
projet Inmédiat pour les adolescents : utiliser le
numérique pour favoriser des formes de travail
collaboratives avec les usagers, pour produire des
services innovants / rester en contact / distribuer des
capacités à s’informer / favoriser l’expression
autonome. => L’appliquer à la bibliothèque et
construire le futur site / les futurs ateliers là-dessus ?
Avoir une identité éditoriale définie entre tous les outils de
la méd.
 Penser global web => intégrer aussi outils externes,
stratégie éditoriale globale
Les actus de la médiathèque sur l'action
culturelle certainement, mais peut être aussi par des

32. outils pour choisir leurs produits culturels, les aider à
s'orienter dans les collections ? L'idée serait de voir plus
large pour cibler des services adaptés aux utilisateurs
sur les réseaux sociaux. Créer une identité numérique
réfléchie et ciblée.
Pour un rayonnement régional, il pourrait être
intéressant de s'intégrer aux outils existants (site
internet des associations par exemple), en axant vers
des fonds phares (régionaux notamment) et des axes
qui entrent en résonance avec des actions faites par ces
institutions. En quelque sorte en créant des « profils »
pour lesquels on propose une communication ciblée. Une
idée par exemple pour illustrer ce propos serait d'inciter
à la réutilisation des fonds de la BN-R pour produire
différents objets à des institutions ou entreprises
locales, comme l'a fait le Rijkmuseum.
Autre développements
 Faire une application pour aider
l’utilisateur à localiser un livre et se
repérer dans la médiathèque (cf ce
qui a été fait au château de
Fontainebleau => l’application
permet de se localiser en prenant des
photographies)
 Ouverture des données (en lien avec
géolocalisation)
Annexe 7 : Détail des releases du site internet de la
médiathèque de Roubaix