PROJET HAÏTI Cahier des Charges Projet Venus v1.0
Sommaire Présentation...3 Chantier I : Code... 7 Chantier II : référencement... 10 Chantier III : Traitement graphique du site... 13 Chantier IV : pages types... 13 Chantier V : navigation... 14 Chantier VI : textes et visuels... 16 Chantier VII : espace «mon compte»... 17 Chantier VIII : Back office... 18 Chantier IX : marquage statistique des pages... 19 Chantier X : installation des modules de paiement... 20 2
Présentation Objet L'objet de ce document est de définir le cahier des charges pour le développement de la première version (v1) du site []. [Nom du site Internet] [Nom du site Internet] est un site e commerce. Il comporte un espace personnel ("Mon compte"). Il s'y déroule de la vente. Il propose un catalogue de près de [à renseigner] références. Contraintes générales et techniques L'environnement technique de [Nom du site Internet] est le suivant : HTML, xhtml, CSS, Javascript, AJAX et PHP. Il est hébergé sur un serveur dédié (localisé en France) sous base de données MySQL. Objectifs techniques Se doter d une plateforme CMS (Content Management System = Gestionnaire de contenu) pérenne ; en l occurrence MAGENTO. Ce CMS propose des modules permettant la réécriture des URLs à la volée (en natif) ; ces modules sont SEO friendly (CMS optimisé pour les moteurs de recherches). Nature des prestations techniques attendues Assurer la maîtrise d œuvre de l ensemble du projet Concevoir et réaliser le site internet Installer le site internet sur le serveur dédié. Paramétrer le site e commerce Annexe : panel des sites de référence (à compléter) www.haiticouleurs.com Orientations La v1 doit être un site : 1. optimisé pour la vente 2. optimisé pour l'animation marketing 3. capable de répondre aux demandes des partenaires. Un site optimisé pour l'animation marketing Cela signifie la maximisation de deux ratios : 3
Le taux de conversion (rapport entre le trafic et les ventes) Le nombre moyen d'achat. Pour cela, l action à entreprendre : implémentation de nouvelles fonctionnalités. Un site optimisé pour la vente Mise en avant forte du mix promo (offre promo + prime) en Home Page Mise en avant forte de titres en Home Page : plus de titres et plus gros Utilisation de l item de liberté comme élément fort du mix = création Rubriques de mise en avant type «Coups de cœur», «best off», «meilleures ventes» Espace publicitaires (autopromotion, ou espace proposé aux éditeurs outil de négociation), rotation. Possibilité de gérer l ensemble des éléments en Home Page de manière souple Possibilité de créer de page thématique à la volée Landing page, pré home, page intermédiaire ou rubrique temporaire. Offrir un produit Mécanique de recommandation Mécanique de parrainage (incentivé) Inscription newsletter Mécanique anti churn Jeux pour alimentation de la BDD prospect Mail sortant en HTML (prévoir espace pub auto promotion ou partenariat) Un site capable de répondre aux demandes des partenaires Les principales demandes pourraient être les suivantes : Intégration du catalogue Reporting CRM. Intégration du catalogue Un partenaire peut souhaiter intégrer tout ou partie de notre catalogue. C'est le cas des comparateurs (Le Guide, Kelkoo ) ou de certains sites affiliés qui souhaitent relayer notre offre dans une mini boutique mise à jour automatiquement. Dans tous les cas, c'est la technologie XML qui permet cela. Reporting Nous devons être en mesure de fournir un extranet avec accès privatif via un identifiant et un mot de passe. Cet extranet devra permettre au partenaire de : 4
CRM Consulter les statistiques de fréquentation et de vente De récupérer ses documents administratifs (éléments de facturation, contrat ). Il faudra être en mesure de communiquer automatiquement à une fréquence définie les données clients (e mails, noms, etc.) vers un serveur FTP selon des formats standards (CSV, RSS ). Méthode Le projet est découpé en chantiers. Chaque chantier fait l'objet d'un cahier des charges ad hoc. Ces chantiers sont au nombre de 10 : 1. le code 2. le référencement 3. Traitement graphique du site 4. Pages types (story board des pages types du site) 5. la navigation 6. Textes et visuels 7. Espace Mon compte 8. Back Office 9. le marquage statistique (Google Analitycs). 10. Installation des modules de paiement 5
Planning 6
Chantier I : Code Généralités Le code doit être documenté. La mise en forme doit être gérée par des feuilles de style externes. Le type du document et sa langue doivent être déclarés. Les pages ne doivent pas excéder 100 Ko (marge de 10%). Compatibilité Le site doit être compatible tout navigateur : Sur PC : Internet Explorer (+5.5), Firefox, chrome Sur mac : Safari, Firefox Sur Linux : Konqueror, Firefox Performance et robustesse L architecture applicative livrée sera fiable et performante. La fiabilité est mesurée sur la capacité du système à fonctionner en permanence de manière autonome sans intervention humaine et indépendamment des opérations d exploitation et de surveillance courantes. Le taux de disponibilité exigé est de 100% entre 8h00 et 24h00. Le système est conçu et paramétré pour absorber des pics de charges sans tomber. La performance du système offrira des temps de réponse appropriés et convenables pour un internaute. Un affichage en moins de 5 secondes est requis pour les pages les plus lourdes et complexes. La navigation sera fluide au sens des bons usages de l internet dans un esprit de confort de navigation. Informations diverses : L ensemble des contenus du site est géré et modifiable par le backoffice. Il n est pas demandé de prestation concernant : Le référencement Les statistiques du site Conformité et interopérabilité Le code doit être conforme aux standards du W3C (XHTML 1.0 minimum et CSS 2). 7
Le code doit être vierge autant que possible de tout ce qui n'est pas (X)HTML : les java scripts doivent être placés dans un fichier «.js» et la feuille de style dans un fichier «.css» ; ces deux fichiers doivent être placés dans deux dossiers (nommés CSS et JS) situés à la racine du site. Le système doit supporter les échanges de données aux normes suivantes : o Web services o Importation/Exportation de documents EXCEL, XML y compris RSS Accessibilité Tout code qui n'est pas du (X)HTML doit proposer une solution au cas où il ne serait pas lisible par le navigateur de l'internaute. Par exemple : «NOEMBED» pour Flash, «NOSCRIPT» pour java script, etc. En définitive, La navigation sur le site ne doit pas être dépendante de technologies telles que Ajax, JavaScript, Java ou Flash : le site doit pouvoir être consulté même avec ces dernières désactivées ou manquantes sur le poste client. Ergonomie (à revoir avec le prestataire pour plus de précisions) Le format d'affichage est optimisé pour les écrans 1024x768 mais compatible 800x600 et 1280x1024. La largeur des pages est de 100%, ce qui permet l'adaptation en largeur selon la taille de l'écran. Pour assurer la cohérence graphique et faciliter la consultation sur des écrans plus grands, l'extension est limitée à 1024 : au delà, la largeur des pages est fixe. Images La taille des images doit être spécifiée. La balise «Alt» doit être renseignée selon les spécifications définies dans le chantier référencement. Il en va de même pour la nomenclature des fichiers images. Base de données Les formulaires doivent être exportables aux formats XLS, XML et RSS. Variables de session Si le site utilise des variables de session, il faut soit : désactiver leur création lorsque le user agent est celui d un robot. Feuilles de styles Liens Les liens visités doivent se distinguer de ceux qui ne l ont pas été. Si les liens ne sont pas soulignés par défaut, le survol de la souris doit marquer leur existence par l apparition du soulignement. Navigation Les thèmes (sous catégories) sont des titres de niveau trois (H3). 8
Le fil d Ariane est un titre de niveau deux (H2). Pages Toutes les pages ont un titre de niveau un (H1) sauf la page d accueil. Pour les pages catégorie et les pages thématiques (sous catégories), le titre est, respectivement, le nom du thème. Dans tous les cas, la balise H1 n est employée qu une fois par page, pour son titre. Mise en page La mise en page ne doit pas se faire à l aide de tableaux. Elle doit être pilotée par la (les) feuille(s) de style. Formulaires Dans la mesure du possible, s inspirer du formulaire de ce service : Un pictogramme vert valide chaque champ correctement complété Le même pictogramme mais en rouge flanqué d un texte explicatif signale les problèmes. 9
Chantier II : référencement Champ d'indexation Il doit être définit dans un fichier «robot.txt» placé en racine de site. Toutes les pages sont indexées sauf celles de l espace «mon compte». Optimisation de l'indexation Afin d optimiser l indexation du site et de garantir la bonne prise en compte de toutes les pages du site par les principaux moteurs de recherche, il faut générer un fichier XML «Sitemap» dynamique contenant la liste exhaustive et à jour de toutes les pages du site. Page plan du site La page plan du site doit lister l ensemble des pages principales du site, ainsi que les pages qui seraient autrement inaccessibles, comme par exemple des pages accessibles exclusivement à la suite d une recherche. Le site étant dynamique, il faut prévoir une génération dynamique de cette page afin de la maintenir à jour. Hébergement Le site doit être hébergé sur un serveur physiquement présent en France. Le serveur doit être dédié ; nous allons le choisir. Balises meta L ordre des balises meta est systématiquement : Titre, description, mots clés. Toutes les pages en contiennent. Elles changent dynamiquement à chaque page selon le schéma suivant (avec X, les éléments insérés dynamiquement) : Titre : «X : [Nom du site]» Description : «X : [Nom du site]» Mots clés : «X». Liens et urls Il ne faut pas utiliser de liens relatifs. Il faut utiliser la réécriture d'url à la volée (url rewriting). En cas de nom composé, l élément séparateur est le tiret. Par exemple : www. www.nom du site.com/conditions generales de vente. www.nom du site.com/fr/mode de paiement Version française du site Pour l url des pages de catégorie, la nomenclature est la suivante : www.nom du site.com/mot cle/nomcategorie. (À voir : Mot cle= facultatif) Par exemple : www.nom du site.com/barretes colliers Pour l url des pages sous catégories ou pages thématiques, la nomenclature est la suivante : 10
www.nom du site.com/mot cle/nomcategorie/thematique. (À voir : Mot cle= facultatif) Par exemple : www.nom du site.com/paysage/haiti village Pour l url des pages produits, la nomenclature est la suivante : www.nom du site.com/mot cle/nomcategorie/thematique/produit (À voir : Mot cle= facultatif) Par exemple : www.nom du site.com/paysage/haiti village/tableau vert Pour toutes les autres pages, l url sera de la forme : www.nom du site.com/mot clé/titrepage, où TitrePage est le contenu de la balise «H1» de la page. Pages Page d accueil Balises meta Titre «barrettes cheveux, chapeaux, sacs, chouchous en tissu, bébé, enfant et adulte : [Nom Du Site]» Description «barrettes cheveux, chapeaux, sacs, chouchous en tissu, bébé, enfant et adulte : [Nom Du Site].» Mots clés «barrettes cheveux, chapeaux, sacs, chouchous en tissu, bébé, enfant et adulte» Page catégories Balises meta Titre «NomCategorie : [Nom Du Site]» Description «NomCategorie : [Nom Du Site]» Mots clés «barrettes colliers,» Page Le titre («h1») de la page doit être écrit sous la forme : «Mots clés NomCategorie». Page sous catégorie (ou page thématique) Balises meta Page Titre «NomSousCategorie : [Nom Du Site].» Description «Description : [Nom Du Site].» Mots clés «Mots clés». Le titre («h1») de la page doit être écrit sous la forme : «NomSousCategorie». 11
Page produit Balises meta Titre «NomProduit, Vente NomProduit, NomSousCategorie: [Nom Du Site].» Description «NomProduit, Vente NomProduit, NomSousCategorie : [Nom Du Site] propose plus de [à renseigner] tableaux à prix réduits.» Mots clés «NomProduit, Vente NomProduit, NomSousCategorie». Page Le titre («h1») de la page doit être écrit sous la forme : «NomProduit, Vente de NomProduit». Exemple Titre «Tableau vert, Vente Tableau vert, Haïti village : [Nom Du Site].» Description «Tableau vert, Vente Tableau vert, Haïti village : [Nom Du Site] propose plus de [à renseigner] tableaux à prix réduits.» Mots clés «Tableau vert, Vente Tableau vert, Haïti village». Page d erreur 404 Customiser la page d erreur 404 en respectant la charte graphique, les menus de navigation. Images La balise "ALT" doit être systématiquement renseignée. Il faut utiliser un "alt étoile" (alt="*") sur les images de décoration. Lorsqu il s agit des visuels des produits, son contenu s écrit sous la forme (avec Y = produit, selon le cas) : «Achat Y». Les noms des fichiers des images sont explicites. Pour les visuels des produits, ils s écrivent sous la forme : «achat Y». Par exemple : achat produit pois gris clair.jpg. Mesure de l indexation Il faut utiliser Google Sitemaps. 12
Chantier III : Traitement graphique du site La charte graphique générale sera réalisée par le prestataire (ou par nous): à budgétiser Chantier IV : pages types Page d accueil Zoning : Confer Storyboard Page des catégories Zoning : Confer Storyboard Page des sous-catégories ou thématiques Zoning : Confer Storyboard Page produit Zoning : Confer Storyboard Page d information Zoning : Confer Storyboard 13
Chantier V : navigation Le logo Le logo doit être cliquable à toutes les pages sauf la page d'accueil. Il renvoie à la page d'accueil. Le fil d'ariane Le fil d Ariane (ou chemin de fer) permet au prospect de situer la position de la page où il se trouve dans l'organisation du site. Par exemple, sur Amazon : Livres > Livres en anglais > Subjects > Mystery & Thrillers. Toutes les pages du site comprennent un fil d Ariane, sauf la page d accueil. Selon l'usage, tous les liens du fil sont cliquables sauf celui désignant la page active. Les éléments composant le fil d'ariane reprennent les titres (H1) des pages concernées. Le fil d'ariane comprend systématiquement comme premier terme "Page d'accueil", excepté le process de commande. Les catégories Nous avons [à renseigner] catégories Catégories de premier niveau : Lister Sous catégories ou thématiques de deuxième niveau : Lister Le moteur de recherche Graphisme 1. Il est présent et en évidence sur toutes les pages du site. 2. Il ne propose pas de recherche parmi des catégories : c'est une "boîte" comme Google. 3. La taille de la boîte doit être de 20 caractères au minimum 4. Il est présenté par le terme : "Recherche par tableaux" par exemple. La requête est validée par un bouton "OK!" 5. La requête subsiste dans la boîte après recherche. Algorithme Le moteur effectue sa recherche sur les titres des produits (tableaux) 14
Le moteur de recherche ne doit pas seulement effectuer les recherches en requête exacte. Il doit pouvoir renvoyer des résultats même lorsque : la casse diffère (ce qui est le cas actuellement) l'accentuation fait défaut la graphie est fautive mais courante (mispellings). Le pied de page A Prévoir Sinon garder celle du CMS Magento et l optimiser (confer storyboard). 15
Chantier VI : textes et visuels Visuels Les visuels (logos, etc.) seront communiqués ultérieurement. Textes Les pages d information (Qui sommes nous, CGU, sécurité, aide, contact, et CNIL) seront communiqués ultérieurement (à valider). 16
Chantier VII : espace «mon compte» Généralités Toutes les pages sont sécurisées N ont de compte que les clients NB : 1. les clients sont obligés de créer un compte avant tout achat. 2. Est ce qu un client peut régler un achat sans passer par l ouverture d un compte? à voir NB : La fonction existe déjà sur le CMS Magento Page d accueil du compte client Confer storyboard 17
Chantier VIII : Back office Page d accès Nous resterons sur le modèle proposé par Magento [Ou Customiser le back office existant (à voir)] Page d accueil Nous resterons sur le modèle proposé par Magento 18
Chantier IX : marquage statistique des pages Google Analytics Google Analytics est un outil de mesure et d'analyse d'audience Internet. Cette solution de tracking permettra de mesurer l impact des éléments d optimisation actuels et futurs en ligne. Cet outil d'analyse de trafic et d'audience TRES COMPLET est nécessaire pour : suivre l évolution du trafic et de l audience mesurer l impact des éléments d optimisation actuels et futurs en ligne effectuer des mesures correctives développer une stratégie marketing sur le web. 19
Chantier X : installation des modules de paiement Modules de paiement à installer et à paramétrer : (les lister) 20