Réussir un projet site web -...

N i c o l a s C h u

Réussirun projet

de site web� 6e édition

© Groupe Eyrolles, 2003, 2004, 2005, 2006, 2008 et 2010 pour la présente édition, ISBN : 978-2-212-12742-3

© Eyrolles, 2002

Table des matières

VII

1. MÉTHODOLOGIE DE CONDUITE DE PROJET WEB .....................1Phase 1 : définir un projet 2

Étude préalable 2Les différents types de sites web 3Le cahier des charges fonctionnel 4Le plan projet 5

Les principaux éléments d’un plan projet 5Comment présenter votre estimation budgétaire ? 7

Réunir une équipe de réalisation : panorama des profils 8Contrat de réalisation de sites web : les clauses à vérifier 10

Modalités de réalisation du site web 10Garanties et responsabilité 10Délais 11Cession des droits de propriété intellectuelle (PI) 11

Phase 2 : concevoir le site 11La conception fonctionnelle 12

Déterminer la structure du site et des pages web 12Les spécifications fonctionnelles 14

La conception technique 15L’architecture logicielle 15L’infrastructure matérielle et télécom 17Les spécifications techniques 17

La conception visuelle 18Phase 3 : réalisation technique du site 19

Réaliser l’ossature du site 19Les développements 19

Intégration statique et alimentation du contenu associé 19Programmation dynamique et alimentation du contenu associé 21

Tests et recettes 21Les différents tests 21

Phase 4 : la mise en ligne du site 22Préparer l’exploitation du site 22

Définition des processus d’exploitation 22Documentation et formation 23Mise en œuvre d’un système de mesure d’audience 23

Aspects juridiques et administratifs 23Respect de la législation en vigueur 23La déclaration à la CNIL 24L’information à destination des internautes 26Responsabilité des professionnels de l’Internet 26Quelques démarches pour protéger votre site 27

Le lancement du site et la clôture du projet 27Parole d’expert : comment protéger son site web des contrefaçons ? 28

Que peut-on protéger ? 28Le nom de domaine 28

Le titre, le logo et les éléments graphiques 28La structure du site : 28Le contenu du site : texte, information et base de données 29Le code source des pages 29

Comment protéger ces éléments ? 29Le dépôt de la marque 29Les différents moyens pour prouver la propriété d’une œuvre : texte, logiciel, code source… 29Les mentions légales 30Quels sont les recours en cas de contrefaçon ? 30

Synthèse : le cycle de vie d’un projet web 32Testez vos connaissances 32En résumé… 33

2. RÉUSSIR L’ERGONOMIE DE SON SITE ...................................35Contraintes spécifiques au Web 36

Un site pour tout type de matériel 36Un site accessible à tous les navigateurs et systèmes d’exploitation 36Un site pour tous les utilisateurs 37

Prise en compte des personnes handicapées 38Utilisabilité 38

Parole d’expert : comment réussir ses tests d’utilisabilité ? 39Tester tôt et avec des utilisateurs représentatifs 39Avec combien d’utilisateurs ? 40Les objectifs, les scénarios et la tenue d’un test 40L’oculométrie : la nouvelle panacée ? 42Présenter et exploiter les résultats des tests d’utilisabilité 42Un domaine en pleine explosion 43

Le système de navigation 44Trouver l’information en trois clics 44Une navigation libre 44Une navigation simple et autonome 45

Apparence du site 46Charte graphique 46Choix des couleurs 47Modèle de parcours visuel d’une page par l’internaute 48Utilisation des cadres (frames) 51Dimension des pages 52Les animations 54

Lisibilité du contenu : huit principes à suivre 54Découper l’information 54Pas de « hors sujet » ! 56Titrer l’information 56Hiérarchiser l’information 56Bien utiliser les liens 59Une syntaxe simple 61

Réus

sir u

n pr

ojet

de

site

web

© Eyrolles, 2002VIII

Une sémantique claire 61Intégration de visuels 61

Parole d’expert : 12 règles à utiliser à bon escient 63Règle n° 1 – Un site bien architecturé 63Règle n° 2 – Des pages bien organisées 63Règle n° 3 – Un site cohérent 63Règle n° 4 – Un site qui respecte les conventions 64Règle n° 5 – Un site qui informe l’internaute 64Règle n° 6 – Un site compréhensible 64Règle n° 7 – Un site logique et qui aide l’internaute 64Règle n° 8 – À bas les erreurs 64Règle n° 9 – Rapidité 64Règle n° 10 – Liberté : c’est l’internaute qui commande 65Règle n° 11 – Un site facile d’accès pour tous 65Règle n° 12 – Un site qui satisfait ses internautes 65

Synthèse : les caractéristiques d’un site ergonomique 66Testez vos connaissances 67En résumé… 67

3. L’HÉBERGEMENT ................................................................71Estimation de vos besoins en hébergement 72

Importance du site par rapport à la stratégie et à l’activité de l’association ou de l’entreprise 72Outils et programmes de développement retenus pour créer votre site 72Taille du site 72Fréquentation du site 73

Types d’hébergement 74Hébergement « entrée de gamme » 74

Offre des FAI 74Hébergeurs gratuits 75Hébergeurs « discount » 75

Hébergement professionnel 76Hébergement mutualisé 76Hébergement dédié 76Hébergement d’applications complexes 76

Parole d’expert : quelle formule d’hébergement pour quel site web ? 78L’hébergement mutualisé : standard et peu onéreux 78L’hébergement dédié : autonomie et performance 78Hébergement d’applications complexes : le haut de gamme 79

Comparaison des offres du marché : dix aspects à étudier 80Espace disque 80Bande passante et trafic 81

Un trafic illimité pour votre site 81Une bande passante de plusieurs Mbits/s pour votre site 81Un trafic limité par mois 81

Technologies compatibles 82Messagerie 83Sécurité 84Sauvegarde et restauration de données 85Surveillance 86

Surveillance de la disponibilité et de la qualité du réseau 87Surveillance des systèmes et des applications 88

Support technique 88Équipement et infrastructure de l’hébergeur 90Qualité de service (QoS, GTR, SLA) 90

Nom de domaine : principes et démarches 91

Système des noms de domaine (DNS) 91Résolution de nom de domaine 92Choisir son nom de domaine 93Déposer son nom de domaine 93

Testez vos connaissances 98Synthèse : critères de choix pour choisir son hébergement 99En résumé… 100

4. RÉUSSIR LE RÉFÉRENCEMENT DE SON SITE WEB .................103Étape 1 : l’analyse 104

Être présent sur quels outils de recherche ? 104Bien choisir ses mots-clés 104Auditer le site 106

Étape 2 : l’optimisation du site pour le référencement 107Optimiser ses pages web 107

La balise <title> 107L’indice de densité 107La mise en forme et la structure de la page 108L’attribut alt 108Les balises meta 109L’URL 109Le poids et la fréquence de mise à jour de vos pages 110

La popularité d’un site 110Mon site est-il populaire ? 110Le PageRank 111

La gestion des frames 112Utilisation du JavaScript 113Les pages « Hallway » ou « Annuaires » 113Le référencement des pages dynamiques 114Spamdexing et techniques à éviter 115

Le cas des pages satellites et des pages alias 115Étape 3 : lancer une campagne de référencement externe 116

La soumission auprès des annuaires 116Définir les catégories 116Renseigner l’annuaire 116

La soumission auprès des moteurs 118Le fichier Robots.txt 118Les SiteMaps 119

Le référencement payant (Trusted Feed ou Paid Inclusion) 121Le « linkbaiting » 121

Parole d’expert : l’art du linkbaiting 122Qu’est-ce qu’un linkbait ? 122Comment faire du linkbaiting ? 122Quelques exemples de linkbaiting 123Les liens sponsorisés (SEM) 123

Catégoriser ses mots-clés 124La rédaction de votre annonce 124Bien choisir la page de destination 125

Étape 4 : le suivi 126Analyse de votre référencement naturel 126

Audit de positionnement 126Analyse de statistiques 127

Analyse et optimisation de vos campagnes SEM 128Synthèse : critères d’optimisation pour les moteurs de recherche 129Testez vos connaissances 129En résumé… 130

Tabl

e de

s m

atiè

res

© Eyrolles, 2002 IX

5. STRATÉGIES DE PROMOTION ET D’ANIMATION ..................133La publicité en ligne 134

Définir la publicité 134Le public cible 134Les moyens : message d’appel et présentation visuelle 134

Les formes de publicité 136Les objets publicitaires 136Page interstitielle 138Parrainage en ligne (sponsoring) 138

Les acteurs 138Agents de communication interactive 139Régies publicitaires 139Sites supports 141Agences médias interactives 141

Analyse des résultats 142L’affiliation 142

Affiliation marchande 143Présentation 143Les différentes formes de rémunération de l’affiliation marchande 143

Syndication de contenu 144Le netlinking 146

Choix des sites partenaires 146Prise de contact 147

Bâtir une campagne de marketing direct avec Internet 148Campagne de e-mailing et « permission marketing » 148Push 149

Stratégie de marketing viral 150Mécanismes de recommandation 151Mise à disposition d’un service ou d’un « goodie » 151Microsites et jeux en ligne 152

Le marketing communautaire 153Création d’une communauté en ligne 153Utilisation des réseaux sociaux 155

Fidéliser vos utilisateurs 155Faire connaître votre site 155

Lancer un blog 156Les composantes d’un blog 156Comment créer son blog ? 157

Autres moyens de communication 158Participation à des groupes de discussion 158Communiqués de presse 159Supports « off-line » 161

Promotion interne 161Promotion directe du site 161Promotion indirecte du site 161

Parole d’expert : stratégie Web 2.0 pour votre site 162Trois façons de penser le Web 2.0 162

L’axe utilisateur 162L’axe nouveaux moyens de communication 162L’axe technologique 163

Que peut m’apporter le Web 2.0 ? 163Se concentrer sur l’utilisateur 163Des nouveaux moyens de communication 164Apporter une valeur ajoutée à vos internautes 164

Récapitulatif des stratégies de promotion et d’animation 165Testez vos connaissances 166En résumé… 167

6. ANALYSE ET MESURES D’AUDIENCE ..................................169Panorama des approches de mesure et d’analyse d’audience 170

Mesures côté client (user-centric) 170Mesures côté serveur (site-centric) 171

Outils d’analyse des logs 171Outils d’analyse à distance 172Balayage du trafic de réseau et de serveur 173

Combiner les analyses de logs et les techniques de tags 173Estimations du trafic 174

Nombre de pages vues 174Nombre de visites ou nombre de sessions 174Nombre de visiteurs 175

Identification du profil des internautes 176Pays d’origine 176Configurations et équipements des internautes 176

Analyse du comportement des internautes 177Les indicateurs de comportement 177

Pages d’entrées et de sorties 177Principaux itinéraires et popularité des pages 178Durée moyenne des visites et temps de consultation par page 179Jours et heures de visites 179

Ratios issus des indicateurs de comportement 180Nombre de visites en fonction du nombre de pages vues 180Taux de visites à une page 180Fréquence de visite 181Nombre de pages vues à la minute 181

Connaître la performance d’un site web 182Statistiques techniques 182

Fiabilité du site 182Formulaires utilisés 183Bande passante consommée 184

Performance du travail de promotion et de référencement 184Accès direct 184Accès par liens 184Accès par moteur ou par annuaire 185

Les indicateurs e-commerce 186Lookers, shoppers et buyers 186Les taux de conversion 186

Parole d’expert : objectifs et enjeux de la mesure d’audience 187Objectifs internes de la mesure d’audience 187Objectifs externes de la mesure d’audience 188

Synthèse : comment utiliser les indicateurs de mesure d’audience ? 189Testez vos connaissances 190En résumé… 190

A. MODÈLE DE PLAN PROJET ................................................193

B. MODÈLE DE CHARTE GRAPHIQUE ......................................203

C. MODÈLE DE CONDITIONS GÉNÉRALES D’UTILISATION D’UN SITE WEB 213

D. LES INDICATEURS DE PILOTAGE D’UN PROJET WEB ............219

E. ÉTENDRE SON PROJET À L’INTERNET MOBILE ....................235

INDEX ..............................................................................247

© Groupe Eyrolles, 2004

Avant-propos

D’aucuns pourraient dire (et le disent, d’ailleurs !) qu’il suffit de « bien » développer unsite pour que ce dernier soit une réussite. C’est une condition essentielle certes, mais nonsuffisante. Le succès d’un tel projet passe en effet par une approche multidisciplinaire.Ainsi est-il nécessaire pour toute personne souhaitant mettre en œuvre un site web dedisposer de connaissances aussi bien dans le domaine de la gestion de projet que dansceux de l’ergonomie, de l’hébergement, du référencement, de la promotion et de l’anima-tion, de l’analyse d’audience et des aspects juridiques.Chaque aspect pourrait à lui seul faire l’objet d’un ouvrage entier. J’ai préféré ici proposerune synthèse complète afin de vous apporter toutes les connaissances nécessaires pouratteindre vos objectifs : • Le chapitre 1 présente la méthodologie à appliquer pour la gestion d’un tel projet en

décrivant précisément chaque étape.• Le chapitre 2 regroupe les aspects fondamentaux à suivre pour rendre votre site facile

d’utilisation et l’information accessible aisément.• Le chapitre 3 donne des indications précises pour bien choisir votre hébergement : les

offres du marché, les « pièges » à éviter, les erreurs à ne pas commettre...• Le chapitre 4 dévoile comment bien référencer votre site auprès des outils de

recherche.• Le chapitre 5 détaille les stratégies à employer pour faire connaître votre site au plus

grand nombre et pour en assurer l’animation.• Enfin, le chapitre 6 explique comment récupérer et interpréter les statistiques

d’audience pour connaître le trafic de votre site ainsi que ses performances.Outre une prise en compte des avancées fonctionnelles, technologiques et juridiques, cettesixième édition comprend une mise à jour des chapitres sur l’ergonomie, le référencement etle marketing en ligne ainsi que des conseils pour l’utilisation des réseaux sociaux et d’exten-sion pour l’Internet mobile.L’approche se veut ici pragmatique en exposant pour chaque thème les principes fonda-mentaux ainsi que des recommandations (pour éviter la plupart des écueils) avec des exem-ples concrets. Vous trouverez également des modèles de document en annexe ainsi que desfiches récapitulatives à la fin de chaque chapitre.

Réus

sir u

n pr

ojet

de

site

web

© Groupe Eyrolles, 2004VI

Cet ouvrage vise donc à introduire auprès des lecteurs ce qu’est « un projet de site web » enabordant l’ensemble des thèmes susmentionnés. On y présente un point de vue pouvantconvenir aussi bien aux personnes en charge de la mise en place d’un portail de grandeenvergure qu’à celles désirant simplement approfondir leurs connaissances dans le domaine.

À qui s’adresse cet ouvrage ?Cet ouvrage se situe à l’interface entre le technique et le fonctionnel. Il s’adresse à toute personneconcernée par la création ou la refonte d’un site web : dirigeants d’entreprise ou d’association,particuliers, chefs de projet, chefs de produit, DSI, webmasters, chargés de communication... Mais aussi les étudiants en informatique et en multimédia, qui y trouveront pour la mise enplace de leur site web un complément aux aspects purement techniques et les étudiants engestion de projet ou écoles de commerce qui disposeront ainsi d’une introduction complètedans le domaine.

RemerciementsAvant de rentrer plus en détail dans la conduite de projet web, je souhaite remercier pourleurs apports essentiels :• tous ceux qui ont bien voulu contribuer à l’ouvrage par leurs éditoriaux :

– Bertrand Bathelot, – Amélie Boucher, – Jean-Philippe Briguet, – Murielle Cahen, – Charles Coxhead,– Armel Cusin-Gogat, – Carl Rakotondrainibe, – Alain Robillard-Bastien,– Stephan Spencer ;

• Kristen, Pierre et Renaud pour les illustrations de têtes de chapitre ;• Nicolas Herzog, avocat au barreau de Paris, qui a relu et commenté avec soin les

aspects juridiques de chaque chapitre ;• Muriel Shan Sei Fan, Sophie Hincelin et toute l’équipe des éditions Eyrolles pour la

confiance qu’elles m’accordent depuis six éditions ;• Séverine pour son perpétuel soutien !• Chiara pour me ravir avec ses sourires.

Enfin, merci à ma mère pour m’avoir offert un Amstrad CPC 6128 dans les années 1980et, ce faisant, d’avoir fait naître ma passion pour les technologies de l’information…Bonne lecture !

Nicolas Chuhttp://www.nicolas-chu.com


annexe A


Modèle de plan projet

Un plan projet est un document qui permet de dégager les orientations structurantes et de fixer le cadre des travaux à venir d’un projet. Initié à partir d’une expression de besoin, puis complété en fonction de l’analyse de cette expression de besoin (faisabilité, définition de la solution, travaux à réaliser, estimation des charges et planning…), il est destiné à faciliter la compréhension du projet pour l’ensemble des acteurs concernés, y compris et surtout à l’équipe de réalisation.

SOMMAIRE

B Présentation générale du projet

B Orientations fonctionnelles

B Travaux et activités

B Acteurs

B Plan d’assurance qualité

B Planning

B Budget

Réus

sir u

n pr

ojet

de

site

web


Le modèle présenté dans cette annexe doit être adapté aux spécificités du projettraité et de l’entreprise ou de l’association concernée.

I. Présentation générale du projetCette partie doit décrire les motivations, les bénéfices attendus et doit permettrede définir les priorités (MSM : Must, Should, May). Voici une description deson contenu :

Estimation

La présentation générale du projet représente enmoyenne 15 % du plan projet.

Titre du paragraphe Description

Les objectifs Les objectifs généraux du site se déduisent des besoins exprimés par le client.

Les enjeux Les enjeux sont les opportunités induites par la création du site. Vous devez ici donner une description exhaustive des enjeux internes et externes (clients, concurrences…).

Le périmètre Il faut indiquer ici ce que vous allez faire de structurant pour la réalisation du projet.

Les limites Préciser ici ce qui n’est pas du ressort de votre projet. Ce point est crucial pour le cadrage du projet et permet decompléter le périmètre.L’objectif de cette section est d’éviter les confusions, les incompréhensions et de lever toute ambiguïté en mention-nant les sujets que certains acteurs pourraient croire inclus dans le périmètre du projet.

Les cibles Cet élément va influencer votre conception. Cette dernière sera différente en fonction du type de public (profession-nels, grand public), de leur attente, du type d’équipement dont ils disposent, de leur connaissance d’Internet et deleur origine géographique.

Les risques Il faut distinguer ici deux types de risques : ceux liés à la mise en place de votre site et ceux liés au fait de ne pasfaire le site.

A –

Mod

èle

de p

lan

proj

et

© Groupe Eyrolles, 2004 195

Mise en place d’un portail pour la société Ivradia

Objectifs

Les objectifs de ce projet sont pour la société Ivradia de :• mettre en œuvre un espace de travail unique pour ses employés ;• proposer à ses clients un accès privilégié et personnalisé à divers services en ligne ;• développer un nouveau moyen de communication vis-à-vis de ses partenaires.

Enjeux

L’étude d’opportunité nous a permis d’identifier les enjeux suivants : • améliorer la productivité des services de l’entreprise ;• fidéliser nos clients ;• conquérir de nouveaux clients ;• se différencier par rapport à la concurrence en proposant un panel des services à valeur ajoutée en ligne ;• gagner en notoriété dans le domaine des nouvelles technologies ;• réduire les temps de commandes en favorisant l’information en temps réel avec nos partenaires.

Périmètre

Le périmètre de ce projet induit :• la rédaction des spécifications fonctionnelles décrivant précisément pour chaque fonctionnalité les acteurs, les divers scénarii pos-

sibles et les résultats voulus ;• la réalisation des templates, d’une maquette et la définition de la charte graphique ;• la réalisation des développements, tests et recettes fonctionnelles ;• la mise en place de l’hébergement (appel d’offre, choix du prestataire, mise en œuvre…) ;• la préparation à l’exploitation : définition des processus, définition des postes, recrutement...

Limites

Le projet n’a pas pour objectif d’effectuer la promotion du futur portail ni son référencement auprès des principaux outils de recher-ches.

Cibles

Pour le marché français, les cibles identifiées sont :1. Nos clients actuels et les prospects intéressés par le secteur d’activité de la société Ivradia (Poste PC standard/Pentium III

800 MHz/256 Mo de RAM/Internet Explorer/Connexion modem 56 K). 2. Nos partenaires, professionnels de la gestion des stocks de matériels informatiques (Poste PC professionnel/Pentium III 1,3 GHz/

512 Mo de RAM/Internet Explorer/Connexion haut débit).

Risques

En mettant en œuvre un portail à destination de ses clients et de ses partenaires, la société Ivradia s’expose aux risques suivants :• copyright : une fois des informations publiées sur Internet, il devient facile de les copier et d’en tirer profit ;• acceptation des clients : possibilité de rejet du nouveau canal par les utilisateurs ;• problèmes légaux : peu de textes encadrant le fonctionnement d’Internet ;• sécurité : réseau ouvert donc accroissement des risques d’intrusions.

Réus

sir u

n pr

ojet

de

site

web


II. Orientations fonctionnellesCette partie doit définir les orientations fonctionnelles qui répondent aux objec-tifs indiqués dans la partie précédente. Il s’agit de décomposer le site en moduleset de présenter les fonctionnalités avec une description détaillée du contenuet/ou du résultat voulu. Un schéma orienté utilisateur de l’architecture fonction-nelle pourra être ajouté ici afin d’illustrer cette partie.

Estimation

La présentation des orientations fonctionnellesreprésente en moyenne 25 % du plan projet.

Orientations fonctionnelles d’un module « emploi »

Fonctionnalité Description Résultats attendus

Les métiers de l’entreprise Présentation des métiers de l’entreprise, les rôles, les réponsabi-lités, les directions…

_

Offre d’emploi Recherche dans la base de données des offres d’emploi parmots-clés et/ou par types de poste

Description des postesProfil requisAvantages et rémunération

Les salons Dates et lieux des salons où sera l’entreprise Nom du salonDate et lieuxPlan d’accès

Déposer son CV Possibilité au candidat de déposer son CV en ligne au formatword

–

Bourse de stages Accès aux stages et contrats de qualification proposés parl’entreprise

Description des stagesProfil requisAvantages et rémunération

A –

Mod

èle

de p

lan

proj

et


III. Estimation des travaux et activités du projetChacune des activités du projet devra être identifiée et pourra être décrite dansun tableau qui se présentera comme suit :

Estimation

L’estimation des travaux et activités peut représen-ter en moyenne 25 % du plan projet.

Élément Description

Responsable Nom et service de l’intervenant projet (normalement membre du comité de pilotage) responsable de l’atteinte desobjectifs et de la production des livrables

Participants Autres services impliqués

Objectifs Objectifs de l’activité

Contenu Travaux à réaliser

Prérequis Éléments nécessaires pour réaliser ces travaux, dépendance par rapport à d’autres activités

Livrables Éléments attendus en résultat, qui concrétisent la fin des travaux

Délais Date de début et date de fin de l’activité

Charges Temps de travail prévu pour effectuer cette activité (en jours/hommes)

Une activité « Réunion de lancement »

Élément Description

Responsable Chef de Projet : M. Intel

Participants Mme Rouge (Service Marketing)M. Vert (Service Commercial)M. Bleu (Service Technique)Mme Jaune (Service Client)

Objectifs Lancer le projet et définir l’organisation de ce dernier

Contenu Organiser la réunion (Invitation, définir l’ordre du jour, salle, matériel, support…)Effectuer la réunionRédiger le compte rendu et le diffuser

Prérequis Salle disponibleParticipants disponibles

Livrables Compte rendu de la réunion avec les points clés et les actions à entreprendre

Délais Début : 15/04/2002 Fin : 30/04/2002

Charges Organiser la réunion (une personne/deux heures)Effectuer la réunion (cinq personnes/deux heures)Rédiger le compte rendu (une personne/deux heures)Soit un total de 14 heures de charges (2 Jours/homme)

Réus

sir u

n pr

ojet

de

site

web


IV. Acteurs Cette partie doit permettre d’identifier les acteurs du projet et leur principaleresponsabilité : qui gère le projet ? Qui pilote le projet ? Quelle est l’instance dedécision ? Qui doit intervenir ? Sous quelles formes ?

Estimation

L’identification des acteurs peut représenter enmoyenne 8 % du plan projet.

Gestion du projetLa gestion du projet est à la charge de M. Rouge, responsable de projet.

Pilotage du projetLe pilotage du projet est assuré par un comité de pilotage composédes personnes suivantes :

Le comité de pilotage est en charge de :• lancer l’ensemble des activités du projet ;• contrôler leur bon déroulement ;• prendre toute décision nécessaire au bon fonctionnement du projet

et à l’atteinte des objectifs (réalisation, calendrier et budget), dansla mesure où la décision n’implique aucune modification de cesobjectifs.

Comité directeurToute décision ayant pour conséquence la modification d’un desobjectifs du projet est prise par le Comité directeur du projet. Ce der-nier est composé des personnes suivantes :

Intervenants

Équipe de réalisation Équipe cliente

Nom Rôle

M. Rouge Responsable de projet

M. Vert Chef de produit marketing

M. Bleu Responsable technique

Mme Jaune Responsable du service client

Nom Poste

M. Orange Directeur général

Mme Beige Directrice marketing

M. Indigo Directeur informatique

Nom Rôle

M. Noir Concepteur/Webdesigner

Mme Bordeau Ergonome

M. Blanc Directeur artistique (DA)

M. Turquoise Infographiste

M. Crème Rédacteur/Responsable des contenus

Mme Violet Ingénieur/Développeur web

M. Gris Architecte web

Mme Rose Chargée d’étude

Nom Poste

Mme Farine DRH

M. Chocolat Chargé de communication

M. Sucre Ingénieur d’affaires

Mme Framboise Juriste

M. Café Responsable de la documentation

M. Vanille Assistance

A –

Mod

èle

de p

lan

proj

et


V. Plan d’assurance qualité Le plan d’assurance qualité doit résumer les actions ou consignes principales quipermettront de faire un travail de meilleure qualité tout au long du projet, ettraiter en particulier :• de la gestion documentaire (nomenclature utilisée, norme à suivre…) ;• du pilotage du projet (définition du comité de pilotage, organisation, mem-

bres, rôles) ;• du reporting : à qui ? sous quelle forme : présentation, réunion, document ?

à quelle échéance ?• de la communication du projet : processus de validation, accord de confiden-

tialité…

Estimation

Le plan d’assurance qualité peut représenter enmoyenne 8 % du plan projet.

Gestion documentairePour assurer la cohérence des documents, on utilisera si possible la norme documentaire« Ivradia » pour l’écriture des documents (modèles disponibles auprès du chef de projet).

Pilotage du projetUn comité de pilotage se réunira toutes les deux semaines. Chaque participant devra four-nir pour chaque tâche lui étant attribuée les informations permettant de faire évoluer leplanning : avancement, temps passé, temps restant estimé.

Participants

• Membre du comité de pilotage• Tout intervenant additionnel selon l’ordre du jour

Ordre du jour type

• Validation du compte rendu précédent• Réalisations des semaines précédentes• Problèmes rencontrés• Actions en cours• Suivi du planning• Suivi de la qualité• Prochaines étapes

ReportingUn rapport d’activité mensuelle sous forme de FAP (fiche d’avancement projet) sera rédigéet transmis au directeur de la société.

CommunicationLe responsable de projet dispose de la vision globale du projet. Par conséquent, il estgarant de l’homogénéité des informations dispensées ; toute communication (en particu-lier externe) sur le projet doit être soumise à son approbation.

Réus

sir u

n pr

ojet

de

site

web


VI. PlanningIl peut se présenter sous différentes formes : diagramme de Gantt ou réseaux dePERT, et doit être constitué des éléments suivants : nom de l’activité, durée,charge, date début, date fin, ressources associées et liaisons (relationlivrables/prérequis entre chaque tâche). Ce tableau peut s’étendre sur plusieurspages.

T Diagrammes de Gantt et réseaux PERT

Du nom de son inventeur, ce diagramme représente le planning d’un projet sous la forme de barreshorizontales liées à une échelle de temps. Chaque tâche est visualisée d’un trait d’une longueurproportionnelle à sa durée.Le réseau de tâches d’un projet constitue un PERT (Program Evaluation and Review Technical). Cetype de graphique permet de visualiser simplement les dépendances entre tâches (les livrables desuns sont les prérequis des autres).

Figure A–1 Planning d’un projet web sous forme de Gantt

A –

Mod

èle

de p

lan

proj

et


VII. Estimation budgétaireCette partie a pour objectif de présenter vos estimations budgétaires pour la réa-lisation de votre projet. Elle se découpe en plusieurs sections :• les charges internes (j.h), valorisées selon les règles de l’entreprise ;• le coût des achats à prévoir (licences logicielles, machines…) ;• le coût des prestations (expertise externe, formation…) ;• les coûts logistiques (voyages…).

Figure A–2 Représentation du budget d’un projet par poste de travail

Figure A–3 Représentation des coûts d’achat et de prestations d’un projet web

Estimation

L’estimation budgétaire peut représenter enmoyenne 10 % du plan projet.


annexe B


Modèle de charte graphique

Pour donner à l’utilisateur des repères au sein d’un site et faciliter sa visite, il est impératif de développer une cohérence pour l’ensemble de vos pages. Lors de la conception du site web, il faut établir (ou faire établir) une sorte de guide à l’attention des personnes qui vont le réaliser, voire l’alimenter ou le modifier : la charte graphique.

SOMMAIRE

B Dimensions et découpes

B Typographie

B Contenu

B Structure des pages

Réus

sir u

n pr

ojet

de

site

web


I. Dimensions et découpes Cette section présente, pour chaque modèle de page du site, la taille de la fenêtrecible ainsi que les différents objets génériques la composant (logos, menus, titres,images, onglets, barres de défilement, puces…) avec leurs dimensions.

Figure B–1Dimensions : modèle génériquede page pour le portail Netalya

Figure B–2Découpes : modèle générique

de page pour le portail Netalya

B –

Mod

èle

de c

hart

e gr

aphi

que


II. TypographieCette section décrit tous les attributs de caractères et styles appliqués • aux textes des pages web ;• aux liens ;• et aux objets graphiques utilisant du texte.

Tableau B–1 Un tableau récapitulatif pour le format des pages et des objets

Appellation Commentaires Dimensions

Page Type Dimensions globales des pages du site.La hauteur doit pouvoir s’adapter au contenu de la page.

760 × 420 px

Logo Image : logo.gif 65 × 106 px

Bandeau Image : bandeau.gif 65 × 654 px

Objet de Menu Cet objet comprend le titre de la rubrique et des section.La hauteur doit pouvoir s’adapter au contenu (nombre de sections).

? × 140 px

Figure B–3Représentation des principaux éléments typographiques : la rubrique « cours » du portail Netalya

Réus

sir u

n pr

ojet

de

site

web


Attributs de caractères et style applicables pour la rubrique « cours » du portail Netalya

Élément Principales caractéristiques Feuille de style associée

Texte corps de la page Police : Arial, Verdana, HelveticaTaille : 10 pxCouleur : #330033Alignement : gauche

.texte

Texte des Menu Police : Arial, Verdana, HelveticaTaille : 11 pxCouleur : #FFFFFFPoids : grasAlignement : Gauche

.menu

Titre Niveau 1 Police : ArialTaille : 15 ptCouleur : #FFFFFFPoids : grasAlignement : centréCouleur de Fond : #3366FFBordure : type « solide » de couleur #000000Marge du bas : 10 px

.titre1

Titre Niveau 2 Police : ArialTaille : 14 ptCouleur : #0000CCPoids : grasAlignement : gauche

.titre2

Titre Niveau 3 Police : ArialTaille : 12 ptCouleur : #FF6600Poids : grasAlignement : gauche

.titre3

Titre Niveau 4 Police : ArialTaille : 10 ptCouleur : #000080Poids : grasAlignement : gaucheSoulignement : oui

.titre4

Lien Police : ArialCouleur : #0000CCPoids : gras

A:link

Lien actif Police : ArialCouleur : #0000CCPoids : gras

A:active

Lien visité Police : ArialCouleur : #0000CCPoids : gras

A:visited

B –

Mod

èle

de c

hart

e gr

aphi

que


III. Contenu Cette section présente tous les éléments composant le contenu des pages web : • pictogrammes illustratifs, boutons d’actions…• couleurs utilisées : numérotation hexadécimale des couleurs du fond de page,

des en-têtes, des textes, des rubriques, des onglets, du pied de page, des filetsséparateurs…

• attributs des éléments de formulaires.

Pictogrammes : la rubrique « dossiers » du site Netalya

Liste des dossiers du même auteur

Imprimer le dossier

Recommander le dossier à un ami

Passer à la page suivante

Liste des dossiers du même thème

Passer à la page précédente

Figure B–4 Palette de couleurs avec description

Réus

sir u

n pr

ojet

de

site

web


Attributs des éléments de formulaires du portail Netalya

Élément Principales caractéristiques Feuille de style associée Représentation

Champs texte Police : ArialTaille : 12 pxCouleur du texte : #202020Bordure : type « solide » de couleur #000000Hauteur : 18 pxLargeur : 100 px

.inputStyle

Champs texte 2 Police : ArialTaille : 12 pxCouleur du texte : #202020Bordure : type « solide » de couleur #c0c0c0Hauteur : 18 pxLargeur : 200 px

.inputStyle2

Zone de texte Police : ArialTaille : 12 pxCouleur du texte : #202020Bordure : type « solide » de couleur #c0c0c0Hauteur : 60 pxLargeur : 200 px

.inputstyle3

Bouton Envoi Police : ArialTaille : 10 pxPoids : grasCouleur du texte : #FFFFFFCouleur du fond : #000080Hauteur : 18 pxLargeur : 30 px

.inputStyleButton

B –

Mod

èle

de c

hart

e gr

aphi

que


IV. Structure des pagesCette section décrit les différents éléments des pages du site web :• principes de navigation générale et secondaire ;• détail des zones de contenu ;• en-tête et pied de page.

Figure B–5Représentation des principes de navigation et des principaux objets du portail Netalya

N° Élément Description Caractéristiques1 Logo Zone de retour à la page d’accueil par un lien.

La largeur est de 100 px.Image : logo.jpg

2 Menu – Rubrique Navigation de premier niveau – Indication du nom de la rubrique.La largeur est de 140 px

Feuille de style : .titreRubriqueTitle

3 Menu – Section 1 Navigation de second niveau en position Roll Over.Les détails se distinguent visuellement par un changement de couleur,ici le fond devient orange.La largeur est de 140 px.

Feuille de style : .MenuOn

4 Menu – Section 2 Navigation de second niveau en position normale.La largeur est de 140 px.

Feuille de style : .MenuOff

5 Bandeau Bandeau et Nom du site/Toujours justifié à droite.La largeur est de 660 px.

Image : barreTop.jpg

6 Zone de contenu Marge de 5 px.La Hauteur s’adapte au contenu de la page.Le contenu texte est toujours justifié à gauche.La largeur est de 478 px.

-

7 Moteur de recherche Moteur de recherche : phrase + champs texte + bouton Envoyer. Feuille de style Champs texte : .InputStyle2Feuille de style bouton : .InputStyleButton

8 Barre Pied de page La zone doit s’étendre à 100%. Hauteur : 5 pxCouleur : #000080

Réus

sir u

n pr

ojet

de

site

web


Figure B–6Représentation de la zone decontenu du portail Netalya :

Titre 1 – Titre Section 2 et Texte

Figure B–7Représentation de la zone decontenu du portail Netalya :

les encarts

B –

Mod

èle

de c

hart

e gr

aphi

que


Styles applicables : les zones de contenu du portail Netalya

Élément Description Feuille de style associée

Titre Niveau 1 Titre des rubriques, le contenu correspond à la rubrique en cours devisite.Police : ArialTaille : 15 ptCouleur : #FFFFFFPoids : grasAlignement : centréCouleur de Fond : #3366FFBordure : type « solide » de couleur #000000Marge du bas : 10 px

.titre

Titre Niveau 2 (section) Titre des sections, le contenu correspond aux différentes sectiond’une même rubrique.Police : ArialTaille : 10 ptCouleur : #000099Poids : grasAlignement : centréCouleur de Fond : #FFF2E2Bordure : type « solide » de couleur #FF6600Marge du bas : 10 px

.titresection

Encart 1 Est à utiliser pour toutes remarques ou notes de marge.Police : Courier NewTaille : 12 pxCouleur : #000080Alignement : gaucheCouleur de Fond : #CAD5E4Bordure : type « solide » de couleur #003399Marge du bas : 10 pxMarge de gauche : 40 px

.encart1

Encart 2 Est à utiliser pour toutes mises en exergue d’un texte.Police : Courier NewTaille : 12 pxCouleur : #000080Alignement : gaucheCouleur de Fond : #CAD5E4Bordure : Type « solide » de couleur #003399Marge du bas : 10 px

.encart2

Encart 3 Est à utiliser pour toutes mentions légales.Police : Courier NewTaille : 12 pxCouleur : #000080Alignement : gaucheCouleur de Fond : #FF6600Bordure : type « solide » de couleur #003399

.encart3


annexe C


Modèle de Conditions Générales d’Utilisation d’un site web

Cette annexe présente les principaux articles d’une rubrique CGU (conditions générales d’utilisation) d’un site web, à adapter en fonction des caractéristiques du site et du service proposé.

SOMMAIRE

B Objet du site et descriptif du service fourni

B Mentions légales

B Droit applicable/clause attributive de compétence

B Responsabilité et garanties quant à l’utilisation du site

B Propriété intellectuelle

B Livraison des commandes

B Service clientèle et réclamations

B Protection des données personnelles/vie privée

B Limitation de responsabilité

Réus

sir u

n pr

ojet

de

site

web


DéfinitionsCet article a pour objectif de définir tous les termes rencontrés dans les condi-tions générales d’utilisation. Par exemple, « utilisateur », « visiteur », « logiciel », « site web », « contenu »…

Objet du site et descriptif du service fourni« L’objet du site et la description du service fourni » est une présentation géné-rale des prestations offertes par le site. Les éléments « qui », « quand »,« pourquoi », « comment » devront être ici détaillés. Les modalités de fourniturede la prestation de services devront l’être aussi : équipe, formation profession-nelle de l’équipe, moyens mis à leur disposition, délais, garantie...

Mentions légalesPlacez dans les mentions légales les informations exigées par l’article 6.III de laLoi pour la confiance dans l’économie numérique (LCEN) :• s’il s’agit de personnes physiques, leurs nom, prénoms, domicile et numéro de télé-

phone et, si elles sont assujetties aux formalités d’inscription au registre du com-merce et des sociétés ou au répertoire des métiers, le numéro de leur inscription ;

• s’il s’agit de personnes morales, leur dénomination ou leur raison sociale et leursiège social, leur numéro de téléphone et, s’il s’agit d’entreprises assujetties auxformalités d’inscription au registre du commerce et des sociétés ou au réper-toire des métiers, le numéro de leur inscription, leur capital social, l’adresse deleur siège social ;

• le nom du directeur ou du codirecteur de la publication et, le cas échéant,celui du responsable de la rédaction au sens de l’article 93-2 de la loi n° 82-652 du 29 juillet 1982 ;

• le nom, la dénomination ou la raison sociale, l’adresse et le numéro de télé-phone du prestataire d’hébergement.

CapacitésCet article définit les conditions à respecter pour visiter ce site. Par exemple,pour un site de commerce électronique, vous pouvez mentionner que l’utilisa-teur doit être âgé d’au moins 18 ans, qu’il doit être capable juridiquement decontracter et d’utiliser le site en question.

Droit applicable/clause attributive de compétencePrécisez ici que les conditions générales sont soumises au droit français et que toutlitige relatif à leur interprétation et/ou à leur exécution relève des Tribunaux français.

Responsabilité et garanties quant à l’utilisation du siteEn fonction des services proposés, il peut être utile d’informer l’internaute queles éléments suivants ne seront pas garantis :

ATTENTION

Cette annexe ne saurait remplacer un entretienprivé avec un avocat qui, véritablement, sera enmesure de rédiger une CGU spécifique à votrebesoin.

À propos de l’auteur

Nicolas Herzog est avocat au barreau de Parisdepuis 2002.Président de la Commission nationale nouvellestechnologies de l’ACE, Nicolas Herzog est encharge de la rubrique Technologies de l’informa-tion de la revue des Avocats conseils d’entreprises(ACE) et participe également à la chronique Droitde l’informatique de la revue de jurisprudencecommerciale.Son blog est consacré à l’actualité du droit destechnologies de l’information.B www.nicolas-herzog.net

C –

Mod

èle

de C

ondi

tions

Gén

éral

es d

’Util

isatio

n d’

un s

ite w

eb


• les anomalies, erreurs ou bugs des informations, produits, services, logicielsfournis sur le site ;

• les interruptions ou pannes du site ;• la compatibilité du site avec un matériel ou une configuration particulière.

Préciser également qu’en aucun cas, la responsabilité de l’éditeur du site ne peutêtre engagée : • pour les dommages indirects et/ou immatériels, prévisibles ou imprévisibles

(incluant la perte de profits) découlant de la fourniture et/ou de l’utilisation oude l’impossibilité totale ou partielle d’utiliser les services fournis sur le site ;

• quant au contenu des sites sur lesquels vous renvoyez par l’intermédiaire deliens hypertextes ;

• en cas de survenance d’un événement irrésistible, imprévisible et extérieur(tremblement de terre, etc.)

Propriété intellectuelleLes éléments constitutifs d’un site Internet bénéficient, au même titre que lesautres œuvres de l’esprit, de la protection par le droit de la propriété intellec-tuelle. Cet article devra comporter les points suivants :• La société propriétaire du site reste titulaire de tous les droits de propriété

intellectuelle relatifs au site et des droits d’usage y afférant.• L’accès au site ne confère aucun droit sur les droits de propriété intellectuelle

relatifs au site, qui restent la propriété exclusive de la société titulaire du site.• Les éléments accessibles sur le site (textes, photographies, images, icônes,

sons, vidéos, logiciels, bases de données…) sont protégés par des droits depropriété intellectuelle (voire industrielle si dépôt de marque).

• Sauf dispositions explicites, il est interdit de reproduire, modifier, transmet-tre, publier, adapter, sur quelque support que ce soit ou exploiter de quelquemanière que ce soit, tout ou partie du site sans l’autorisation écrite préalablede la société titulaire du site.

• La violation de ces dispositions pourra faire l’objet de toute action en justiceappropriée, notamment d’une action en contrefaçon.

De plus, si le besoin se présente, vous pourrez signaler également que l’insertionde liens hypertextes vers toute partie du site est interdite sans autorisation préa-lable et écrite de la société éditrice du site.

LogicielSi l’utilisation de votre site nécessite le téléchargement d’un logiciel spécifique,expliquez sous cette clause que son utilisation est régie par les termes de lalicence qui l’accompagne. La mention « Le visiteur s’engage à ne pas installer,copier ou utiliser ce logiciel avant d’avoir préalablement acquiescé aux termes deladite licence » peut être également présente à titre d’indication.À noter cependant que les dispositions ci-dessus ne s’appliquent pas pour leslogiciels libres de droits ou « freeware ».

Réus

sir u

n pr

ojet

de

site

web


Livraison des commandesDans le cas d’un site de commerce électronique, les modalités de livraison descommandes devront être clairement exposées : engagement de délai, qui livre,par quels moyens (poste…), sous quelle garantie ? « Pour toute opération de vente à distance, l’acheteur d’un produit dispose d’undélai de sept jours francs à compter de la livraison de sa commande pour faireretour de ce produit au vendeur pour échange ou remboursement, sans pénalitéà l’exception des frais de retour. Si ce délai expire normalement un samedi, undimanche, un férié ou chômé, il est prorogé jusqu’au premier jour ouvrablesuivant. » (code de la Consommation, article L 121-16).« Dans tout contrat ayant pour objet la vente d’un bien meuble ou la fournitured’une prestation de services à un consommateur, le professionnel doit, lorsque lalivraison du bien ou la fourniture de la prestation n’est pas immédiate et si leprix convenu excède des seuils fixés par voie réglementaire » (décret n°92-1156 :seuil = 450 euros), indiquer la date limite à laquelle il s’engage à livrer le bien ouà exécuter la prestation.Le consommateur peut dénoncer le contrat de vente d’un bien meuble ou de four-niture d’une prestation de services par lettre recommandée avec demande d’avis deréception en cas de dépassement de la date de livraison du bien ou d’exécution dela prestation excédant sept jours et non dû à un cas de force majeure.Ce contrat est, le cas échéant, considéré comme rompu à la réception, par levendeur ou par le prestataire de services, de la lettre par laquelle le consomma-teur l’informe de sa décision, si la livraison n’est pas intervenue ou si la presta-tion n’a pas été exécutée entre l’envoi et la réception de cette lettre. Le consom-mateur exerce ce droit dans un délai de soixante jours ouvrés à compter de ladate indiquée pour la livraison du bien ou l’exécution de la prestation.Sauf stipulation contraire du contrat, les sommes versées d’avance sont desarrhes, ce qui a pour effet que chacun des contractants peut revenir sur sonengagement, le consommateur en perdant les arrhes, le professionnel en les res-tituant au double (code de la Consommation, article L 114-1).

Service clientèle et réclamationsPour toute réclamation ou question relative à l’utilisation du service proposé, ilest nécessaire d’indiquer clairement où et qui joindre en cas de difficultés ainsique le type de réponse qui sera apportée en fonction de la difficulté.

Protection des données personnelles/vie privéeLes sites Internet qui collectent des informations nominatives doivent effectuerune déclaration auprès de la CNIL relative au traitement automatisé des données.Ils doivent prévenir les internautes de l’existence de ce traitement de données et deleurs droits (droit d’accès et de rectification aux informations les concernant) :• Les informations communiquées sur le site permettent à la société qui

exploite le site, ainsi qu’à ses partenaires, de traiter et exécuter ses comman-des ou services.

C –

Mod

èle

de C

ondi

tions

Gén

éral

es d

’Util

isatio

n d’

un s

ite w

eb


• Conformément à l’article 27 de la Loi informatique et libertés du6 janvier 1978, les informations indispensables à la société qui exploite lesite, ainsi qu’à ses partenaires, pour traiter et exécuter les commandes ou ser-vices, sont signalées dans les pages du site.

• Les autres informations demandées, dont les réponses sont facultatives, sontdestinées à mieux connaître l’utilisateur afin d’améliorer les services proposés.

• La société qui exploite le site s’engage à se conformer aux législations fran-çaises et européennes sur la protection des données à caractère personnel.

• Sauf avis contraire de l’utilisateur, la société qui exploite le site est susceptible detransmettre les informations qui le concernent à ses partenaires commerciaux.

• Conformément à la Loi Informatique et Libertés, l’utilisateur dispose d’un droitd’accès, de modification, de rectification et de suppression des données qui leconcernent (article 34 de la Loi Informatique et Libertés du 6 janvier 1978).

• L’utilisateur peut exercer ce droit en adressant un courrier au Service clients,à l’adresse suivante : __________.

Limitation de responsabilitéCette clause a pour objet de limiter soit les conditions de la responsabilité de lasociété qui exploite le site, soit le montant de la réparation éventuellementoctroyé par la société qui exploite le site à ses clients.

Clauses relatives aux conditions de responsabilitéVoici un exemple de clause pour une Société qui propose un service d’e-mails :« La Société qui exploite le Site n’est en aucun cas responsable du contenu dese-mails et de leur utilisation par ses clients. »Si ces clauses sont en principe valables, elles connaissent cependant quatrelimites importantes :• Quant à l’obligation éludée : la clause ne peut pas porter sur l’obligation

essentielle du contrat (exemple : le Vendeur ne peut pas se dispenser de four-nir la chose vendue), mais uniquement sur les obligations accessoires(exemple : garantie, délais…).

• Quant à la gravité de la faute : la faute dolosive ou lourde écarte la clause denon-responsabilité.

• Quant à la qualité des parties : dans la plupart des contrats conclus entre unconsommateur et un professionnel, la jurisprudence annule les clauses denon-responsabilité.

• Quant à la nature du dommage : les dommages corporels ne peuvent pasfaire l’objet d’une clause de non-responsabilité.

Clauses relatives au montant de la réparationCes clauses ont pour objet de fixer un plafond de responsabilité. Ces clausessont en principe valables, mais soumises aux mêmes limitations que celles rela-tives aux conditions de responsabilité.


annexe D


Les indicateurs de pilotage d’un projet web

La conduite d’une voiture va de pair avec la consultation régulière des indicateurs de pilotages : vitesse, kilométrage, éventuellement voyants de températures… Sans ces derniers, difficile d’évaluer la distance parcourue ou restante, ou simplement de vérifier que tout va bien à bord. Il en va de même pour la conduite d’un projet.

Cette annexe a pour objectif de vous proposer une approche pragmatique en présentant des outils concrets, utiles au quotidien pour le pilotage d’un projet web.

SOMMAIRE

B L’avancement de la production

B Le contrôle des jalons critiques

B L’avancement du budget

B Le contrôle des risques

Réus

sir u

n pr

ojet

de

site

web


Quels indicateurs utiliser ? Les trois premiers indicateurs, avancement de la production, contrôle des jalonscritiques, avancement du budget, sont les plus importants. Sans eux, il n’est paspossible de piloter votre projet. Le quatrième indicateur concerne le contrôledes risques. C’est un complément utile voire indispensable pour piloter des pro-jets très importants par la taille ou par les enjeux.

I. Avancement de la productionL’avancement de la production est mesuré par un tableau de suivi des livrables.Les livrables sont les réalisations (documents, applications, matériels…) ou pres-tations (formations, réunions…) fournies par le projet. Ils matérialisent l’aboutis-sement des tâches, et constituent des points de contrôles indispensables pourjalonner la progression du projet.

ObjectifsCe tableau permet d’une part de mesurer la progression effective du projet encontrôlant les réalisations concrètes, « concrètes » signifiant que vous pouvez lesvoir (exemples : document, code applicatif, plate-forme opérationnelle…) ou lesconstater (utilisateurs formés), d’autre part de détecter d’éventuels retards.

FormatIl s’agit dans la majorité des cas d’un tableau de tableur (Excel de la suite Micro-soft Office, Calc de OpenOffice.org…). Pensez à utiliser des couleurs pour mettreen évidence les informations importantes. La figure F-1 montre un exempleappliqué aux deux premières phases d’un projet web.

ConceptionCet indicateur doit être conçu dès le début de la phase de définition du projet,au moins pour les deux premières phases, puis complété au plus tard lors de larédaction du plan projet pour les phases suivantes.

Données initiales• Liste de tous les livrables indispensables au bon déroulement du projet, et

date d’échéance prévue.• Pour chaque livrable, nom du responsable, qui sera en charge du suivi et du

reporting auprès du chef de projetCes données sont collectées par le chef de projet, en collaboration avec l’ensem-ble des acteurs concernés.

Degré de précisionIl n’y a pas de règle quant au degré de précision de la liste des livrables. Disonssimplement qu’il doit être suffisant pour vous permettre de piloter le projet sansen alourdir le suivi. C’est à vous de vérifier régulièrement la pertinence de cetindicateur, et de le faire évoluer si nécessaire.


Armel Cusin-Gogat exerce depuis plus de 10 ansdes responsabilités de manager de projets et deconsultant dans le domaine des systèmes d’infor-mation, tant sur les aspects maîtrise d’œuvre quemaîtrise d’ouvrage. Il enseigne le managementde projet depuis plusieurs années, et fait partiedu Project Management Institute dont il détientla certification « Project ManagementProfessionnal ».

D –

Les

indi

cate

urs

de p

ilota

ge d

’un

proj

et w

eb


Guide de lecture du tableau présenté à la figure D-1

À noter que le degré de précision est aussi variable selon la taille du projet,l’importance de chaque phase (vous augmenterez le nombre de livrables à con-trôler sur les phases critiques), et le degré d’autonomie de l’équipe projet.

Précision sur le taux d’avancement

La colonne… contient…

Livrable La liste de tous les livrables du projet (documents, applications, prestations)

Responsable Le nom du responsable de la réalisation du livrable

Échéance prévue L’échéance prévue pour la livraison du livrable validé

Échéance revue La nouvelle échéance si avance ou retard

Durée restante Le nombre de jours ouvrés restant d’ici l’échéance prévue (calculé automati-quement par une fonction Excel à partir de la date d’actualisation et del’échéance prévue)

Avancement Le taux d’avancement du livrable

Commentaire Toute précision utile à l’interprétation de la ligne

Le taux d’avancement est estimé par le responsable du livrable, en fonction des informations dontil dispose. À la différence de la mesure de la charge consommée (voir plus loin l’indicateur 3), cetteestimation est plus ou moins objective :• Exemple 1 - livraison d’une plate-forme de formation : il est facile de constater que la plate-

forme est opérationnelle ou non.• Exemple 2 - développement d’un programme logiciel : seul le développeur concerné peut esti-

mer s’il est à 60 ou 80 % d’avancement, avec un degré de précision fonction de sa compétenceet de son expérience (même principe pour la rédaction d’un document).

Figure D–1 Avancement de la production d’un projet web au 15/04/04

Réus

sir u

n pr

ojet

de

site

web


ActualisationFréquence d’actualisationCet indicateur est actualisé lors des réunions de coordination de l’équipe projet.

Données en entréeChaque responsable met à jour sa partie du tableau pour les livrables qui le con-cerne (avancement, et éventuellement échéance revue).

DiffusionElle est assurée par l’équipe projet uniquement, voire le comité de pilotage pourles livrables majeurs.

InterprétationEn rapprochant l’avancement et la durée restante, on peut :

• Identifier les risques de retard, si l’avancement est faible et la durée restantecourte (dans notre exemple, l’estimation budgétaire). Dans ce cas, vous devezsoit revoir l’échéance, soit revoir l’objectif ou mettre davantage de ressourcespour terminer le livrable.

• Identifier les livrables en avance, et donc éventuellement anticiper le démar-rage d’autres livrables (dans notre exemple, le plan projet).

• Vérifier régulièrement la liste des livrables à commencer.Attention, il n’y a pas d’interprétation « mécanique » de ce tableau : un livrablepeut être avancé à 80 % à une semaine de l’échéance, et être quand même enrisque de dépassement car les 20 % à compléter sont les plus difficiles à réaliser.Seule la compétence des acteurs projet permet d’interpréter correctement cesdonnées et de définir les actions appropriées.

Points fortsCet indicateur a le mérite d’être facile à mettre en place et à suivre. Il donne àtoute l’équipe projet une vision partagée de l’avancement de la production, etpermet d’identifier rapidement les problèmes et risques de retard. De plus, leformat Excel présente des avantages notables : tous les acteurs disposent géné-ralement de l’application, et la compatibilité avec d’autres documents bureauti-ques est naturelle.

LimitesCet indicateur donne une vision statique de la production, c’est-à-dire qu’il nemontre pas les impacts potentiels d’un retard sur les autres livrables. Cette limiteimportante (elle restreint la capacité d’anticipation de l’équipe projet) est à rela-tiviser par l’utilisation d’indicateurs complémentaires. La critique peut aussi porter sur la mesure du taux d’avancement (voir plushaut), qui peut passer pour une mesure globalement assez subjective, par oppo-sition à la mesure de la charge consommée pour produire le livrable, beaucoupplus objective. Quelques remarques à ce sujet :

• L’expérience montre que ce principe d’évaluation subjective est en définitiverelativement fiable, voire plus fiable que des méthodes dites rationnelles (parexemple, le comptage du nombre de lignes de code produites, qui revient à

ASTUCE Tableur

Utilisez la fonction de partage du classeur Excelpour permettre la mise à jour simultanée par plu-sieurs acteurs.

D –

Les

indi

cate

urs

de p

ilota

ge d

’un

proj

et w

eb


l’extrême à confondre quantité et qualité). Signalons d’ailleurs que la plupartdes systèmes de pilotage reposent sur la modélisation du fonctionnement sub-jectif d’un individu expert.

• Quel que soit son degré d’imprécision, cette mesure reflète davantage la réa-lité du terrain que la mesure de la charge consommée (qui d’ailleurs présentedes limites décrites pour l’indicateur 3). Pour illustrer le propos, ce n’est pasparce que vous avez consommé 80 % de la charge allouée pour un livrableque vous l’avez réalisé à 80 %.

II. Contrôle des jalons critiquesLe contrôle des jalons critiques est effectué à l’aide d’un tableau.

ObjectifLe contrôle des jalons critiques est un excellent moyen de vérifier la progressiondu projet, et surtout de détecter au plus tôt les risques de dérive. Ce contrôlepeut également s’effectuer à l’aide d’un planning classique, mais la constructiond’un tel planning d’une part n’intervient qu’en fin de phase de définition duprojet, et d’autre part nécessite des outils spécifiques.

FormatIl s’agit généralement d’un tableau Word ou Excel. Pensez à utiliser des couleurspour mettre en évidence les informations importantes. La figure D-2 présenteun exemple appliqué aux trois premières phases d’un projet web.

ConceptionLe tableau de contrôle des jalons critiques doit être conçu dès le début de laphase de définition du projet, au moins pour les deux premières phases, puiscomplété au plus tard lors de la rédaction du plan projet pour les phases suivan-tes.

Données initialesElles comprennent la liste de tous les événements critiques du projet et la dated’échéance prévue (livrables majeurs, début/fin de phase, point de rendez-voussi le projet implique des acteurs externes…). Vous devez normalement retrouver dans cette liste un sous-ensemble du tableaude suivi des livrables. Ces données sont collectées par le chef de projet, en colla-boration avec l’ensemble des acteurs concernés.

Degré de précisionCe contrôle doit s’appliquer uniquement aux jalons critiques, qu’il s’agit donc debien repérer en début de projet (surtout ne pas en oublier !).

T Jalons critiques

Un jalon est une tâche de durée nulle, donc quisignale un événement (début de…, fin de…, livrai-son de…, cahier des charges validé). Les jalonsmarquent les événements clés du projet. Caracté-ristique des jalons dits « critiques » : tout retardsur ces jalons se reporterait mécaniquement sur ladate de fin du projet (exemple : retard sur la fin dela recette).

Réus

sir u

n pr

ojet

de

site

web


ActualisationFréquence d’actualisationElle est à déterminer selon la durée du projet, le nombre et l’espacement entreles jalons. À titre d’exemple, cet indicateur devrait être actualisé en moyenneune fois par mois pour un projet d’une durée d’un an.

Données en entréeIl s’agit de l’appréciation qualitative du statut de chaque jalon, que le chef deprojet formule d’après l’avis des acteurs concernés.

DiffusionComité de pilotage, comité directeur.

InterprétationR : jalon réalisé conformément à l’objectif.Ok (vert) : la date prévue est confirmée, l’avancement est normal.W (pour warning, orange) : risque de dérive sur la date prévue. Actions préventi-ves à mener :

• Analyser ce qui peut encore être fait pour respecter la date.• Si finalement le risque est trop grand, estimer l’ampleur de la dérive poten-

tielle, et étudier les moyens de résorber le retard prévisible sur les jalons sui-vants (par exemple, si dérive prévue sur le jalon J, que faire pour respecterl’échéance du jalon J+1 ou J+2).

Nok (rouge) : la date prévue ne peut plus être respectée. Dans ce cas, voirl’action précédente.

Figure D–2 Tableau de suivi des jalons critiques d’un projet web pour la date du 30/05/04

D –

Les

indi

cate

urs

de p

ilota

ge d

’un

proj

et w

eb


Points fortsS’il est bien conçu, il s’agit d’un indicateur très simple à suivre et à interpréter,donc très parlant pour des décideurs. Le chef de projet peut repérer très tôt lesrisques de dérive, ce qui permet d’une part d’alerter rapidement, et d’autre partde se donner du temps pour essayer de rétablir la situation.

LimitesLa simplicité a un prix : cet indicateur donne uniquement une vision statique duplanning, il ne fournit pas toutes les informations nécessaires pour étudier lessolutions en cas de dérive (c’est par contre la grande valeur ajoutée des outils deplanification).Par ailleurs, c’est le chef de projet qui donne un statut « subjectif » pour chaquejalon : la pertinence de l’information est donc fonction de sa compétence et desa maîtrise du projet. Ce statut doit en tous les cas être étayé par les données« objectives » fournies notamment par les indicateurs d’avancement des livra-bles et d’avancement du budget.

III. Avancement du budgetL’avancement du budget est mesuré par un tableau et une courbe de suivi bud-gétaire.

ObjectifsCet indicateur vous permet :• de contrôler l’évolution de votre consommation budgétaire (donc de votre

« carburant ») par rapport à votre budget de référence ;• de détecter les avances ou retards de consommation ;

• de simuler les impacts de ces écarts au terme du projet (estimation du point desortie).

FormatIl s’agit dans la majorité des cas d’un tableau Excel, accompagné du graphiquecorrespondant. N’oubliez pas d’utiliser des couleurs pour faire ressortir les infor-mations remarquables du tableau.

ExempleVoici un exemple de tableau de suivi budgétaire trimestriel d’un projet web(figure D-3).

T Précision sur la valorisation financière

La valorisation financière correspond à la valorisation de la charge (1 j.h = X k€), X étant une esti-mation du coût moyen d’une journée de travail (généralement calculé par le contrôle de gestionlorsqu’il s’agit des ressources internes d’une entreprise). La valorisation de la charge est éventuelle-ment augmentée du coût de prestations externes.

T Budget d’un projet

Le budget représente la valorisation financière del’ensemble des moyens nécessaires à l’atteinte desobjectifs (ressources, matériels et logiciels, presta-tions…). En tout état de cause, si vous ne disposezpas de leur valorisation financière, vous devez aumoins effectuer un suivi budgétaire des chargesconsommées.

Réus

sir u

n pr

ojet

de

site

web


Guide de lecture du tableau présenté à la figure D-3

Figure D–3 Exemple d’avancement budgétaire d’un projet web : tableau de suivi trimestriel à la date du 31/08/04


Activité La liste des activités qui font l’objet d’un suivi budégtaire

Tx Les éléments budgétaires pour le trimestre X

B Le budget prévisionnel

R Le budget réalisé (c’est-à-dire consommé)

% réalisé Le ratio B/R (donc la part du consommé par rapport au prévu)

A Le budget actualisé (c’est-à-dire revu par rapport à la prévision initiale)

La ligne… contient…

Total en j.h Le total de la charge

Cumul en j.h Le total de la charge cumulée

Total en k€ Le total équivalent en k€ (qui peut intégrer par un ajout manuel le mon-tant des éventuelles prestations)

D –

Les

indi

cate

urs

de p

ilota

ge d

’un

proj

et w

eb


Voici un exemple de courbe de tendance associée au tableau précédent (figure F-4).

Cette courbe montre l’évolution de la consommation budgétaire cumulée.

ConceptionL’indicateur d’avancement budgétaire doit être opérationnel dès l’entrée enphase de conception du projet, ce qui suppose d’avoir préparé le système de sai-sie des imputations (voir ci-après la partie actualisation), et d’avoir sensibilisétous les acteurs du projet à son importance.Par contre, pendant la phase de définition du projet, un suivi budgétaire assezléger est généralement acceptable (si le nombre d’acteurs est limité), l’objectifétant simplement de vérifier que l’on reste dans l’enveloppe budgétaire initiale-ment prévue pour les études.

Données initialesListe des principales activités du projet :• budget estimatif pour chaque activité (en charge ou en euros), et sa réparti-

tion dans le temps (mensuelle ou trimestrielle) ;• coûts matériels et logiciels, coûts logistiques, montant des prestations externes.Ces données sont collectées par le chef de projet, en collaboration avec l’ensem-ble des acteurs concernés.

Degré de précisionS’il n’y a pas de règle quant au degré de précision de la liste des activités à sui-vre, nous recommandons une approche synthétique, dans la mesure où les don-nées budgétaires sont principalement destinées aux décideurs.

ActualisationFréquence d’actualisationL’avancement budgétaire doit être actualisé sur une base mensuelle ou trimes-trielle, selon la durée du projet et surtout son impact sur le budget de l’entre-prise.

Figure D–4 Exemple d’avancement budgétaire d’un projet web : courbe de tendance à la date du 31/08/04

Réus

sir u

n pr

ojet

de

site

web


Données en entréeLe tableau de suivi budgétaire est automatiquement alimenté par un systèmed’imputation du temps passé. Ce système permet à chaque intervenant du pro-jet de saisir périodiquement les charges qu’il a consommées sur le projet, venti-lées sur les activités qui le concernent. Quelle que soit la fréquence d’actualisation, cette saisie doit être hebdo-madaire : sur une périodicité plus longue, l’expérience montre qu’il est très diffi-cile pour chaque intervenant de se souvenir du montant et de la répartition deses charges.Le système d’imputation du temps passé est généralement intégré dans lesoutils de planification, mais se fait aussi simplement sous Excel. L’exemple ci-après (figure D-5) montre une feuille d’imputation mensuelle.

DiffusionComité de pilotage (tableau et courbe de tendance), comité directeur (courbede tendance).

InterprétationTableauIl vous donne une vision à l’instant T de votre consommation, qui doit être ana-lysée par l’interprétation des ratios B/R (% réalisé) en rapport avec l’indicateurd’avancement de la production. Vous devez analyser les écarts dont l’ampleurest significative dans le contexte du projet.B/R < 100 % : vous consommez moins vite que prévu. Deux facteurs principauxpeuvent expliquer ce retard :

• Les ressources n’ont pas pu consommer la charge prévue (pour caused’absence, de gestion de priorité, ou tout autre problème), et la productionest donc en retard. Ceci implique un report de charges sur le trimestre suivant

ASTUCE Classeur Excel

Il est indispensable d’utiliser la fonction de partagedu classeur Excel pour permettre la saisie simulta-née des imputations, sous peine de décourager lesbonnes volontés qui se casseraient le nez sur unfichier… verrouillé par un autre utilisateur.

La ligne… … contient La colonne… … contient

Acteurs Le nom de tous les acteurs du projet De gauche La liste des principales activités du projet

Semaine Les numéros des semaines qui commencent dans lemois concerné

Total Le total, par activité, des charges consommées pen-dant le mois concerné

Total Le total, par intervenant et par semaine, de la chargeconsommée pendant le mois concerné (en j.h)

Figure D–5Exemple de

tableau de suivid’imputations

du mois de mars2004 (en j.h)

D –

Les

indi

cate

urs

de p

ilota

ge d

’un

proj

et w

eb


(sous réserve que les ressources initialement prévues soient toujoursdisponibles !), qui peut éventuellement provoquer un décalage du planning.

Au final, ceci peut impliquer un glissement de l’investissement d’une année surl’autre, avec parfois des conséquences directes sur le compte de résultat d’uneentreprise.

• La charge initiale a été surestimée, vous avez produit ce qui était prévu, maisen consommant moins que prévu. Vous devez donc actualiser l’estimation à labaisse (colonne A), ce qui dégagera une marge budgétaire éventuellementdisponible pour d’autres activités (si les ressources concernées sontéquivalentes).

B/R > 100 % : vous consommez plus vite que prévu. Deux facteurs principauxpeuvent expliquer ce retard :

• La charge initiale a été sous-estimée, vous avez produit ce qui était prévu,mais en consommant davantage sur le trimestre. Vous devez donc actualiserl’estimation à la hausse (colonne A), ce qui engendre au final un risque dedépassement du budget (l’identification précoce de ce risque vous permetéventuellement d’agir d’ici la fin du projet sur d’autres activités pour essayerde rétablir l’équilibre budgétaire).

• Les ressources ont travaillé davantage mais produit plus que prévu, vous êtesdonc en avance de consommation. Ceci implique une baisse de charges sur letrimestre suivant, qui peut éventuellement signifier une avance sur leplanning.

Courbe de tendanceElle vous donne la vision historique de la consommation cumulée, et vous per-met d’estimer le point de sortie budgétaire du projet. Sur l’exemple précédent,elle montre :• un retard de consommation sur T1, qui a été rattrapé sur T2 ;• un retard significatif sur T3, qui doit porter à investigation.

Estimation du point de sortieLe point de sortie est estimé d’après les hypothèses faites sur le déroulementultérieur du projet. Voici à la figure F-6, par rapport à l’exemple précédent, unesimulation dans le cas où rien ne change. Dans ce cas, le budget consommé parle projet serait au final inférieur de 11 % au budget prévu (mais les objectifsseront-ils atteints ?). Bien entendu, cette estimation serait différente si des res-sources supplémentaires étaient allouées au projet sur le trimestre 4.

Figure D–6 Exemple d’avancement budgétaire d’un projet web : estimation du point de sortie

Réus

sir u

n pr

ojet

de

site

web


Points fortsCet indicateur est le seul à donner la vision budgétaire du projet, très appréciéepar les décideurs. Parce qu’ils sont très visuels, le tableau et la courbe permet-tent d’identifier très vite les écarts. L’équipe projet peut dès lors anticiper les ris-ques à terme et réfléchir à des solutions. De plus, la courbe de tendances permetd’anticiper les impacts des écarts sur l’économie globale du projet (estimationdu point de sortie).

LimitesLa fiabilité de cet indicateur repose entièrement et exclusivement sur la fiabilitédes imputations, et les sources d’erreurs sont multiples (absence ou retardd’imputation, imputation sur une mauvaise activité…). D’autre part, précisé-ment parce qu’il repose sur un système d’imputation des temps passés, la miseen place de cet indicateur peut s’avérer difficile si le nombre d’intervenants surle projet est élevé. Vous devez donc prévoir très tôt une campagne de sensibili-sation, et des actions de relance systématiques pour obtenir les imputations(actions qui normalement s’espacent une fois le système rôdé). Par ailleurs, unecharge de travail récurrente est à prévoir pour préparer chaque mois la grille desaisie des temps passés, et gérer les éventuels mouvements de personnels sur leprojet (arrivée/départ d’intervenants).

IV. Contrôle des risquesLes risques majeurs du projet sont surveillés par un tableau de contrôle des ris-ques.

ObjectifCet indicateur permet d’identifier et de contrôler l’évolution des risques majeursdu projet.

FormatIl s’agit généralement d’un tableau Word ou Excel. Pensez à utiliser des couleurspour mettre en évidence les informations importantes.

T Risques

Dans un cadre projet, un risque est un événementpotentiel susceptible d’empêcher l’atteinte desobjectifs de réalisation, calendaires ou budgétaires.De plus, sont considérés comme risques unique-ment les événements sur lesquels il est possibled’agir a priori (actions préventives) ou a posteriori(actions correctives). Il n’est d’aucune utilité des’intéresser à des risques qui échappent à tout con-trôle.

D –

Les

indi

cate

urs

de p

ilota

ge d

’un

proj

et w

eb


Exemple

ConceptionL’indicateur de contrôle des risques doit être opérationnel dès l’entrée en phasede conception. C’est en effet pendant la phase de définition du projet que sontidentifiés les risques majeurs.

Données initiales• Liste des risques majeurs.• Niveau de probabilité de chaque risque (P), estimé selon les informations du

moment.

Figure D–7 Exemple de contrôle des risques d’un projet web : actualisation au 31/05/04


N° Le numéro de référence du risque

Risques L’intitulé du risque

P Le niveau de probabilité (1 = très élevée, 2 = élevée, 3 = moyenne)

G Le niveau de gravité (1 = très élevée, 2 = élevée, 3 = moyenne)

T La tendance par rapport au dernier point de contrôle (H = à la hausse, S = stable, B = à la baisse, R = réalisé)

Précision Toute précision utile pour étayer les valeurs P/G/T

Projet Les impacts pour les objectifs du projet si le risque se réalise

Clients Les impacts pour les clients si le risque se réalise

Internes Les impacts internes pour le projet et l’entreprise si le risque se réalise

Réus

sir u

n pr

ojet

de

site

web


• Liste des impacts projet, clients et internes.• Niveau de gravité (G), qui résulte des impacts identifiés.

Ces données sont collectées par le chef de projet, en collaboration avec l’ensem-ble des acteurs concernés. À noter qu’un document annexe doit décrire pourchaque risque les actions préventives et correctives associées (qui fait quoi, com-ment, quand, et avec quels moyens).

Degré de précisionSeuls les risques majeurs doivent figurer dans ce tableau. Ils se caractérisent parun niveau de probabilité élevé et/ou un niveau de gravité élevé (c’est-à-dire queles conséquences de la réalisation de ces risques compromettent directement lesobjectifs du projet). Nous recommandons par ailleurs une approche synthétique,dans la mesure où le contrôle des risques est principalement destinés aux déci-deurs.

ActualisationFréquence d’actualisationElle est à déterminer selon la durée du projet, et l’importance des enjeux asso-ciés. À titre d’exemple, cet indicateur devrait être actualisé en moyenne une foistous les deux mois pour un projet d’une durée d’un an.

Données en entrée (pour chaque risque)• Revue des impacts et ajustement du niveau de gravité (G) en conséquence.

• Revue du niveau de probabilité (P), selon les informations du moment.• Calcul de la tendance (T), résultat des variations de P et G.Le chef de projet met à jour le tableau de contrôle d’après sa connaissance duprojet, en collaboration avec les acteurs concernés.

DiffusionComité de pilotage, comité directeur.

InterprétationL’interprétation du tableau de contrôle porte sur la donnée T, qui matérialisel’évolution du risque par rapport au dernier point de contrôle :• T = R : le risque est réalisé, il est urgent de déclencher les actions correctives

(initialement prévues ou non) afin de minimiser ses impacts.

• T = H : le risque est la hausse, ce qui signifie que le niveau P et/ou G a été aug-menté. Dans ce cas, vous devez déclencher les actions préventives appropriées(initialement prévues ou non).

• T = S : le risque reste stable, pas d’évolution notable depuis le dernier point decontrôle. Si le niveau de gravité est très élevé, c’est un risque majeur qui seconfirme, donc à prévenir par les actions appropriées.

• T = B : le risque est à la baisse, ce qui signifie que le niveau de probabilitéet/ou de gravité a été abaissé. La surveillance peut donc être allégée au profitdes autres risques.

D –

Les

indi

cate

urs

de p

ilota

ge d

’un

proj

et w

eb


Points fortsLe contrôle des risques donne une visibilité sur un aspect qui échappe totale-ment aux indicateurs précédents, et qui pourtant peut s’avérer crucial pour laréussite du projet. Il permet de limiter les imprévus en s’assurant régulièrementque l’environnement du projet reste propice à l’atteinte des objectifs. En cas dedégradation de cet environnement, il permet de mieux anticiper les impacts, etdonc de définir le plan d’action approprié pour préserver ces objectifs.

LimitesLa gestion de cet indicateur représente une charge de travail additionnelle quipeut s’avérer non négligeable. De fait, nombre de projets mettent en place uncontrôle des risques, puis le laissent rapidement à l’abandon. Or un indicateurqui n’est plus actualisé devient totalement inefficace. Vous devez donc vousassurer de la pertinence de cet indicateur dans votre contexte, et ne l’utiliserqu’après vous être assuré qu’il est indispensable à la réussite de votre projet.De plus, sa valeur ajoutée repose sur l’identification préalable de l’ensemble desrisques majeurs, or la réalité du terrain montre qu’il est difficile de penser à tout.L’expérience du chef de projet joue ici un grand rôle.


annexe E

xHTML

GPRSUMTS

MPEG4

wap

i-modeTM


Étendre son projet à l’Internet mobile

L’arrivée de l’iPhone d’Apple et le lancement des offres haut débit illimitées par les opérateurs ont fait exploser les usages. Selon l’ARCEP, 23,4 millions d’abonnés français ont déjà été convertis aux services multimédias et l’Internet mobile est bien sûr en tête des usages. Fort de ce constat, l’objectif de cette annexe est de présenter l’Internet mobile ainsi que ses spécificités techniques et ergonomiques. Ce chapitre propose également quelques conseils et bonnes pratiques en matière de conception mobile ainsi qu’une boîte à outils destinés aux lecteurs ayant envie de se lancer dans le projet.

SOMMAIRE

B L’Internet mobile en bref

B Concevoir un site mobile

B Boîte à outils

Réus

sir u

n pr

ojet

de

site

web


L’Internet mobile en brefSi l’Internet mobile a connu des débuts laborieux avec le WAP, aujourd’hui ilconnait un développement sans précédent. La montée en puissance des Smart-phones lui a en effet permis de s’affranchir des opérateurs et portails fermés ousemi-fermés de ses débuts.

À l’occasion du Mobile World Congress 2010, Google déclarait que la crois-sance de l’adoption du web mobile était aujourd’hui huit fois plus rapide quecelle du Web classique il y a 10 ans. À ce rythme, une majorité d’internautes seconnectera à l’Internet au moyen de leur téléphone mobile d’ici à 5 ans.

Cette évolution extrêmement rapide de l’Internet mobile est déjà visible sur leréseau social Facebook : plus d’un quart de ses 400 millions d’utilisateurs se con-nectent depuis le mobile.

Contextuel, simple et personnaliséAvant d’aborder la réalisation de sites web mobiles, il convient tout d’abord des’intéresser aux trois dimensions clés de la conception d’un site mobile : le con-texte d’utilisation, la simplicité, et la personnalisation des contenus. Le contexteest souvent le point de départ de la connexion du mobinaute : chercher unhoraire de bus, consulter le programme télé, consulter l’actualité du jour….L’accès au service est conduit par un besoin précis, à un moment particulier,dans un lieu donné.

Pour répondre à ses entrées contextuelles en termes de recherches, les servicesdoivent proposer un accès simple et rapide aux informations, Pour cela, la con-ception d’un site Internet mobile doit tenir compte de deux contraintesimportantes : la taille réduite de l’écran, et le peu de temps dont dispose l’utili-sateur pour accéder à la bonne information. Un site Internet mobile doit pro-poser une structure de page et une navigation simple.

Enfin, le site mobile peut prendre en compte la propriété et l’usage individueldu mobile pour offrir des contenus personnalisés. En effet, une fois identifié ouinscrit, l’utilisateur peut facilement être reconnu par le site mobile, la mise enavant des services ou des contenus peut donc être réalisée à partir des informa-tions liées à son profil. Sur ce principe, le site de e-commerce Amazon proposeen priorité quatre produits correspondant au profil de l’utilisateur. De son côté,le site Vélib’ (vélos en libre service à Paris) propose au premier niveau l’accès auxstations préférées de l’utilisateur. La reconnaissance de l’utilisateur permet ainsiune personnalisation utile des contenus et des services proposés.

Un environnement hétérogèneLa lenteur du décollage de l’Internet mobile en Europe et aux États-Uniss’explique en partie par l’hétérogénéité du parc et des standards techniques.


Jean-Philippe Briguet est directeur marketing etconseil de la société APOCOPE. Spécialiste del’Internet et du marketing mobile, il accompa-gne de nombreux annonceurs dans la définitionet la mise en œuvre de leur stratégie marketingmobile.B http://www.apocope.fr/

DEFINITIONS

WAP (Wireless Application Protocol) est un proto-cole de communication, sorti en version 1.0 en1998, permettant aux téléphones cellulairesd’accéder à des pages Internet. Le langage associéest le WML.Smartphone Même si plusieurs définitions exis-tent, on s’arrêtera sur celle d’un téléphone mobilemultimédia disposant d’un système d’exploitationouvert. 3G / 3G+ Cette expression désigne la3e génération de réseau téléphonique mobile et apermis de proposer du haut débit mobile. Cettedernière est basée sur les technologies UMTS etHSDPA.Gallery désigne la marque sous laquelle les opé-rateurs français permettent aux utilisateurs d’accé-der à une offre organisée de services multimédiasmobiles produits, édités et exploités par des édi-teurs et des annonceurs. Les sites mobiles référen-ces dans Gallery sont accessibles depuis lesmoteurs de recherche opérateurs et peuvent accé-der a certaines fonctions spécifiques (géolocalisa-tion, micropaiement…).

E –

Éten

dre

son

proj

et à

l’In

tern

et m

obile


Pendant longtemps, les constructeurs de mobiles ont lancé des terminaux dispo-sant le plus souvent :• d’un OS propriétaire et fermé ;• d’un navigateur supportant le WML 1.X et parfois le WML 2.0 ;• de caractéristiques imposées par l’opérateur (par exemple, la home page du

portail opérateur comme page d’accueil du navigateur).

Dans ce contexte, développer des services de qualité tout en proposant un rendusimilaire sur l’ensemble des téléphones mobiles était complexe, fastidieux et sansassurance de retour sur investissement. De leur côté, les mobinautes trouvaientpeu de services qualitatifs, et étaient donc peu enclins à consommer autre choseque des téléchargements de fonds d’écran et de sonneries.

À l’inverse, l’opérateur japonais NTT Docomo a compris l’enjeu de l’homogé-néité très tôt. Avec i-mode, il a imposé un cahier des charges précis aux cons-tructeurs (intégration technique, langage de l’Internet mobile, ergonomie destéléphones et des sites mobiles) obligeant ces derniers à produire des terminauxaux comportements similaires. La simplicité de cet environnement a très rapide-ment permis la multiplication des sites mobiles et le décollage des usages.

La pauvreté des débuts du WAP a finalement laissé place à un Internet mobileplus riche et plus simple d’accès. Le développement du marché des Smart-phones a permis d’apporter des terminaux de meilleure qualité (OS plus puis-sant, grand écran couleur, GPS…) et surtout une utilisation généralisée des lan-gages standards du Web.

Internet mobile ou application embarquée ?Avec plus de 4 milliards de téléchargements dans le monde en 21 mois, le succèsdes applications iPhone reste sans égal aujourd’hui. Cette tendance va se géné-raliser chez les autres constructeurs en 2010 faisant ainsi de l’application un sup-port alternatif à l’Internet mobile.

Fort de ce constat, de plus en plus d’acteurs s’interrogent sur le choix du supportmobile : Internet mobile ou application embarquée ?

Même s’il est impossible de répondre à cette question en quelques lignes, nouspouvons néanmoins présenter les différences entre ces deux supports.

Tableau E–1 Comparatif entre Internet mobile et application embarquée

Application embarquée Internet mobile

Accès L’application est un logiciel que l’utilisateur télécharge surson mobile.

Le site est accessible depuis une URL.

Type de technologie L’application est un logiciel exécuté directement sur lemobile. Elle peut néanmoins parfois nécessiter une inte-raction avec un serveur.

Le site mobile fonctionne côté serveur. Il est affiché dans lenavigateur du mobile.

Réus

sir u

n pr

ojet

de

site

web


Même si l’Internet mobile n’offre pas aujourd’hui une expérience utilisateuraussi qualitative que celle des applications, il demeure un support offrant unetrès grande compatibilité. Il permet ainsi l’accès d’un service au plus grandnombre sans multiplication des développements. De plus, les fonctionnalitésoffertes par l’Internet mobile sont appelées à se développer fortement durant lesprochaines années grâce à l’intégration progressive de :1 HTML 5.2 JavaScript.3 Fonctions constructeurs.

Concevoir un site Internet mobileDécider de concevoir un site mobile est un chantier lourd, nécessitant un inves-tissement fort en termes de temps et beaucoup de remise en question. En effet,l’univers du mobile évolue très vite et les usages sont encore en pleine création.

Dans cette démarche, il est nécessaire de garder en tête cinq règles importantes.

1. Un site mobile n’est pas un site webMême si ceci peut paraître évident, un site mobile n’est pas un site web.Reprendre le contenu et l’architecture d’un site web pour l’adapter au format dumobile est l’assurance d’offrir une mauvaise expérience de navigation à son utili-sateur.

Compatibilité Une application est développée pour un système d’exploi-tation (OS). Il faut donc développer plusieurs fois l’applica-tion pour qu’elle soit compatible avec les principaux OS :iPhone, Windows, Android, Blackberry, Symbian…Les mobiles intégrant un OS fermé nécessite un dévelop-pement spécifique en Java.

Un site mobile réalisé à l’aide d’un outil de rendering (voirplus loin la section « Boîte à outils ») est compatible avecl’ensemble du parc de mobiles.

Accessibilité du contenu Le contenu peut être embarqué dans l’application. Sa con-sultation peut donc se faire hors connexion.

Le contenu est hébergé sur le serveur. Sa consultation nepeut donc pas se faire hors connexion. HTML 5 permet de conserver du contenu déjà consultédans le navigateur et donc hors connexion.

Appels des fonctionsnatives du mobile

GPS : oui.Carnet d’adresses : oui.Calendrier : oui.Appareil photo : oui.

GPS : N.S.Carnet d’adresses : N.S.Calendrier : N.S.Appareil photo : nonN.S : non standardisé. Quelques mobiles le permettent.Actuellement rare mais amené à se développer.

Tableau E–1 Comparatif entre Internet mobile et application embarquée (suite)

Application embarquée Internet mobile

E –

Éten

dre

son

proj

et à

l’In

tern

et m

obile


On associe souvent à tort la mobilité à l’extérieur du foyer. Pourtant le mobileest très utilisé pour accéder à l’Internet depuis le domicile. Consulter le pro-gramme télé, jeter un œil sur ses e-mails, écrire un post sur son profil Facebook,consulter une information après la diffusion d’une publicité… sont autantd’usages mobiles domestiques.

2. Le contexte est le point de départ de l’usageLe contexte reste le dénominateur commun à l’ensemble des usages mobiles. Lemobinaute ne surfe pas sans but sur son téléphone ; il recherche généralementune information liée au contexte dans lequel il se situe (géographique, per-sonnel, temporel, média).

Cette information est souvent chaude, pratique ou personnalisée. Quant auxservices, ils sont de plus en plus transactionnels (achat, réservation…).

3. Un site mobile = un serviceLe contenu du site mobile doit être recentré sur le service le plus utile à l’inter-naute en situation de mobilité. Les autres contenus ou fonctions seront passésen second plan ou non repris.

Les figures E-2 à E-4 illustrent les sites Internet mobiles.

4. Un parcours utilisateur simplifiéSi la règle des trois clics a toujours été une priorité sur le Web, l’application decette dernière est encore plus critique sur le mobile. En effet, le manque de rapi-dité du réseau peut rendre le surf laborieux. En conséquence, l’accès à la bonneinformation doit se faire avec un minimum d’écrans.

Figure E–1Exemples d’usages contextuels

Réus

sir u

n pr

ojet

de

site

web


Figure E–2Amazon.com– Moteur de recherche

et mises en avant personnalisées

Figure E–3LeFigaro.fr – Fil d’actualité en temps réel

Figure E–4Voyages-Sncf.com – Horaires et réservations

E –

Éten

dre

son

proj

et à

l’In

tern

et m

obile


Le concepteur doit donc tenir compte en amont des points suivants :1 une arborescence simple ne dépassant pas trois niveaux ;2 un moteur de recherche en tête de page pour tous les sites possédant des

catalogues de contenu ou de produits importants ;3 une structure de page compréhensible et régulière ;4 une navigation intégrant des repères simples et permanents (boutons de

navigation – accueil , retour - toujours au même endroit…).

5. Un seul site mobile pour plus de 800 terminaux multimédias différentsIl est conseillé de faire le travail de conception en se basant sur les terminauxpossédant les meilleurs navigateurs Internet. L’iPhone, les mobiles sousAndroid, et quelques nouveaux modèles intègrent maintenant le moteur Webkitqui reste une référence en matière de support des standards W3C.

Figure E–5Adaptation du site Internet mobile 118000.mobi

Réus

sir u

n pr

ojet

de

site

web


Au-delà des capacités du navigateur, cette conception doit également prendre encompte l’écran tactile du mobile qui permet une navigation différente de cellesur les terminaux plus classiques.

Une fois la conception pour ces terminaux haut de gamme finalisée, il est néces-saire de penser l’adaptation de cette dernière aux autres terminaux XHTML.Cette étape de déclinaison doit tenir compte de la solution de rendering qui gèretechniquement l’adaptation du site à l’ensemble des terminaux.

Cet exercice peut être abandonné pour les terminaux WML ou CHTML tantleur part de trafic a baissé ; il convient alors d’afficher un message d’alerte àl’utilisateur pour lui préciser que son mobile n’est pas compatible avec le service.

L’illustration ci-après montre la déclinaison de la home page du site mobile118000.fr en fonction des différents types de terminaux.

Enfin, la conception doit prendre en compte la compatibilité des téléphonesmobiles avec les contenus diffusés par le site. Tous les terminaux ne sont pascompatibles avec la vidéo, le streaming ou encore les vCard. L’accès à ses con-tenus doit donc être uniquement proposé aux mobiles compatibles. En résumé,le processus de conception d’un site mobile peut être défini comme indiqué à lafigure E-6.

Boîte à outilsCette dernière partie est composée comme une boîte à outils pour la créationd’un site Internet mobile. Même si chaque sujet pourrait faire l’objet d’un cha-pitre entier, l’objectif de ces questions/réponses est d’avoir une approche prag-matique de la création d’un site mobile.

Quelles différences entre un projet web fixe et un projet web mobile ?Il existe quatre différences importantes entre un projet web fixe et un projet webmobile.1 La conception mobile nécessite d’aller à l’essentiel et de limiter le contenu

du site.2 Une réflexion doit être faite en amont sur le choix des solutions techniques

liées au mobile : rendering, redirection, vidéo…

Figure E–6Rappel du processus de conception

d’un site Internet mobiles

E –

Éten

dre

son

proj

et à

l’In

tern

et m

obile


3 Les sessions de tests sont renforcées et demandent souvent plus d’itérations.4 Des tests réguliers doivent être réalisés pour s’assurer que le site reste compa-

tible avec les nouveaux mobiles du marché.

Ces quatre différences nécessitent une connaissance spécifique dans le domaine.Il est plus simple d’être accompagné par un prestataire technique ou une agencespécialisée.

Comment choisir son nom de domaine mobile ?En premier lieu, l’URL principale d’un site mobile doit être courte. Elle doit eneffet pouvoir être saisie très rapidement par un mobinaute.

De plus en plus, les déclinaisons mobiles de sites web se font par le biais d’unsous-domaine du type m.nomdedomaine.com ou mobile.nomdedomaine.com.C’est le choix opéré par de grands acteurs : m.ebay.com, m.yahoo.com,mobile.lemonde.fr, m.TF1.fr, m.expedia.com.

Une marque préférera en effet capitaliser sur un seul domaine (en .fr ou .com) eteffectuer une redirection vers un sous-domaine dédié au mobile.

Dans le cas d’un site 100 % mobile ou n’ayant pas d’existence sur le Web, le.mobi peut être un choix pertinent.

Dans tous les cas, il est nécessaire de réserver le .mobi pour éviter tout cybers-quatting.

Comment gérer la redirection fixe – mobile ?Dès qu’un site web dispose de deux versions, il devient crucial de gérer la redi-rection automatique des utilisateurs vers la version la plus adaptée.

Un utilisateur web fixe se connectant sur le nom de domaine mobile doit êtreredirigé vers le site web fixe. Inversement, l’utilisateur mobile se connectant surle nom de domaine web fixe doit être redirigé vers le site web mobile.

Pour cela, il est nécessaire de mettre en place un script de redirection sur la paged’accueil. Ce script analyse le user agent et/ou le navigateur du terminal con-necté avant de l’orienter vers la bonne version du site.

Ce type de script peut-être fourni par des prestataires spécialisés proposant éga-lement des bases de terminaux mobiles. Il est également intégré par défaut surles plates-formes techniques des agences mobiles.

Où héberger son site mobile ?Un site mobile ne nécessite pas d’hébergement spécifique puisqu’il utilise lesmêmes technologies que le Web fixe.

Toutefois la question peut se poser si vous faites le choix de passer par un presta-taire technique ou une agence spécialisée disposant d’une plate-forme de rende-

Réus

sir u

n pr

ojet

de

site

web


ring. Cette plate-forme gère l’adaptation automatique du site mobile en fonc-tion du modèle de terminal.

Quelle solution de rendering ?On appelle « rendering » la capacité à optimiser le rendu d’un site mobile pourl’ensemble des terminaux multimédias du marché. Si cette discipline s’est sim-plifiée ces dernières années avec la disparation progressive des langagesCHTML et WML, elle n’en reste pas moins complexe à maîtriser et en perpé-tuelle évolution.

Comme nous l’avons vu dans le premier chapitre, les tailles d’écrans, la naviga-tion tactile, le support de certains contenus, du JavaScript ou des API construc-teurs restent autant de questions pouvant avoir un impact sur l’affichage et lefonctionnement d’un site mobile.

Ainsi, la plate-forme opérant le site mobile doit bénéficier d’une base de con-naissances terminaux mobiles intégrant l’ensemble de ces informations et d’uncanevas de règles et de comportements permettant d’adapter à la volée le sitemobile en fonction des capacités du téléphone.

De plus en plus de plug-ins plus ou moins performants sont développés pour lesCMS du marché :• Joomla : http://joomla.mobileplugin.net/

• Drupal : http://drupal.org/project/mobileplugin

• Wordpress : http://www.bravenewcode.com/products/wptouch/

Dans le cas de sites d’annonceurs ou de médias s’adressant au grand public etnécessitant un rendering parfait, il est fortement conseillé de passer par uneagence spécialisée dans le mobile.

Comment tester son site mobile ?Cette étape est vraisemblablement la plus fastidieuse puisqu’elle est très répéti-tive, source de mauvaises surprises et consommatrice en temps. L’objectif estvraiment de tester le comportement de son site sur les principaux mobiles dumarché.

Pour commencer, il convient de définir des cas d’utilisation et des parcours asso-ciés. Les tests seront toujours réalisés sur la base de ces parcours.

Les tests se font en trois étapes.1 Niveau fonctionnel : il est possible de tester directement depuis son naviga-

teur web avec l’aide d’un composant du type User Agent Switcher permettantde simuler l’appel des pages par un mobile.

2 Niveau rendering théorique : différents émulateurs proposés par des cons-tructeurs ou des organismes du type Dotmobi proposent ce type d’émula-teurs. Ces derniers permettent de tester le service en situation quasi réelle.

E –

Éten

dre

son

proj

et à

l’In

tern

et m

obile


3 Niveau rendering réel : l’idéal est d’avoir plusieurs terminaux de gamme etde constructeurs différents pour tester le site.

Comment promouvoir son site mobile ?Comme pour un site web, il existe de multiples façons de promouvoir son sitemobile.

Paradoxalement, les basiques ne sont pas toujours les plus utilisées. Elles consti-tuent pourtant une excellente base de travail :1 optimisation du site pour le référencement naturel (URL, meta, title, des-

cription, map…) ;2 référencement du service auprès de Google, en cohérence avec le site web ;3 référencement du site auprès d’annuaires spécialisés ;4 gestion de la redirection web fixe vers web mobile ;5 référencement du service sur les portails opérateurs (via l’annuaire Gallery).

L’accès au site mobile depuis un support papier ou de l’affichage peut être faci-lité par l’utilisation d’un code 2D (Datamatrix, QR code ou Flashcode). Mêmesi les usages sont restés timides en France, ils commencent à se développerdepuis quelques mois et sont totalement rentrés dans les mœurs dans un payscomme le Japon. Des acteurs comme YouTube et Facebook proposent mainte-nant de générer les QR codes associés à leurs pages.

Si vous disposez déjà d’une base de contacts opt-in avec numéro de mobile, vouspouvez réaliser vos propres campagnes de SMS afin de générer du trafic sur lesite. Si vous ne disposez pas de base, une agence spécialisée pourra vous faireune recommandation sur la location de fichiers qualifiés et opt-in.

Enfin, il existe une offre publicitaire de plus en plus riche sur le mobile.L’ensemble des grands médias disposant maintenant de leurs propres applica-tions et/ou sites mobiles. Là encore, les agences spécialisées sont à même defaire des recommandations mixant volume et performance.

Réussir un projet site web -...

Documents

Transcript of Réussir un projet site web -...