3/03/2010 COFIM site internet Validation de la proposition définitive Frédéric HOPITAL 847 Route de Saint-Vincent 69440 Saint-Laurent-d Agny tél. 04 26 01 71 30 / 06 78 82 46 74 fh@hopitalcom.com siren 410 437 982 847
Maquette et charte graphique La charte graphique est basée sur votre catalogue, la nouvelle documentation apitrio et le site qui l accompagne. On conserve le vert cofim de référence mais lui préférons un beige/marron en accompagnement plutôt que le gris. Arborescence et fonctionnalités Le site est construit autour de 5 rubriques principales (Cofim, actualités, boite à outils et contact) dont une est principale : les produits. Back-office : On peut rajouter - supprimer - modifier les rubriques Rubrique Cofim Elle est constituée de plusieurs sous-rubriques (qui sommes-nous, savoir-faire, qualité, etc.). Contenu : Texte + images - pas de fonctionnalité particulière Back-office : On peut rajouter - supprimer - modifier les sous-rubriques Rubrique Actualités La page est constituée de deux parties, les 3/4 affiche une actualité, un bandeau d 1/4 est un colonne avec les autres actualités. Contenu : Texte + image Back-office : On choisit dans le back-office l actualité qui doit s afficher par défaut lorsque l on arrive dans la rubrique. Dans le bandeau latéral, les actualités sont rangées par date de création, la dernière créée en haut. Pour créer une nouvelle actualité, on dispose d un champ «date», «titre», «photo», «introduction/chapeau» et «texte». Rubrique Boite à outils ou télécharger Elle est constituée de plusieurs rubriques avec texte, image et documents à télécharger (mis en ligne par le back-office). Back-office : On peut rajouter - supprimer - modifier les sous-rubriques Catalogue et Fiches techniques : Les documents à télécharger sont automatiquement mis en ligne à chaque création d un nouveau produit. Ils sont classés par familles de produits et par ordre alphabétique au sein de ces familles. Conseil de mise en oeuvre Une fonctionnalité spécifique est créée. On choisit au moyen d un menu déroulant, dans une liste, le produit que je dois poser. Dans le back-office, je rentre un conseil de mise en oeuvre et j indique à quels produits il s applique
Glossaire Création d une fonctionnalité par back-office. 3 champs à remplir : un mot, une définition et un schéma sont associés. Sur la page, l internaute peut choisir le mot au moyen d un menu déroulant avec rubrique et sous-rubriques. Réglementation Création d une fonctionnalité par back-office. 3 champs à remplir : un thème (typologie du bâtiment, résistances au feu, etc.) un sous-thème (par exemple «les textes réglementaires de la résistance au feu») et le dernier champ : contenu. Sur la page, l internaute peut choisir la rubrique et sous-rubrique au moyen d un menu déroulant. Rubrique Contact Elle est constituée de 3 rubriques. Back-office : On peut rajouter - supprimer - modifier les sous-rubriques Lorsque l on clique sur «Contact» une page s affiche avec les coordonnées complètes de cofim, un lien vers une carte des différentes zones géographiques et un formulaire d une dizaine de champs avec certains obligatoires. Les champs sont définis à la création du site. Une modification simple (modification d un champ ou deux dans l année) sera exécuté gratuitement par le prestataire. Une seconde page propose le plan d accès en illustration sur la page + une fonction «pdf à télécharger» Un menu en bas de page donne accès à la page d accueil, plan du site, contact (toujours bien de le rajouter) aux mentions légales, aux crédits de création, etc. Back-office : On peut rajouter - supprimer - modifier les sous-rubriques La gamme produits Back-office : On peut rajouter - supprimer - modifier les rubriques et sous-rubriques Les produits sont tout d abord présentés par famille. Lorsque l on clique sur la rubrique produits, une partie présente les différentes gammes (attention, le nombre de gammes est évolutif, aujourd hui 6, demain 7, etc.). Le back-office permet de créer une nouvelle famille de produit sur un modèle standard : nom de la famille, intitulés de 5 lignes, possibilités de mettre de 1 à 3 photos en illustration (selon quelles soient horizontales ou verticales). Les fonds de présentation sont d une même couleur.
A droite sur cette page, un bandeau latéral propose un accès direct à un produit. Chaque produit est accompagné d un, deux ou trois pictogrammes (maxi). Le back-office permet de gérer cette présentation. On importe sur le back-office les différents pictogrammes dont on a besoin. Ensuite, lorsque l on crée une fiche produit, on indique les 1, 2 ou 3 pictogrammes qui doivent s afficher. Lorsque l on clique sur une gamme de produits (dans le menu à gauche ou directement sur la famille présentée au milieu de l écran), une page de présentation de la gamme s affiche. Elle est constituée de : Une zone de sélection à 8 critères à choisir par un bouton clic. Plusieurs boutons peuvent être cochés (de 1 à 8), le principe de sélection est le «et». Par exemple sur la maquette, je demande les produits «Avec PV feu 1/2h» et «Cadre sapin». Lorsque je re-clique sur un choix de critère il s efface (bouton aller-retour) Le back-office permet de définir de 1 à 8 critères (maxi) pour chaque familles indépendamment. Si un client choisit deux critères contradictoire (sans PV feu + avec PV feu), le résultat est alors vide. Prévoir la possibilité pour une famille, lorsque je clique d aller directement à une page produit (pas de page intermédiaire avec critères de sélection) La page propose également un accès direct à un produit (partie droite, à côté du choix des critères). Les produits sont alors classés selon un critère que je définis par le back-office. A droite sur cette page, le bandeau latéral propose par ordre alphabétique tous et uniquement les produits de cette famille. La fiche d un produit est constituée de : - d une zone photos (de 1 à 8 photos maxi).une photo s affiche en grand par défaut (que je choisis dans le back-office). Lorsque je passe (sans cliquer) sur une autre vignette du bas, elle s affiche en grand en haut. - d un schéma Précisions : nous pouvons envisager une fonction zoom sur la photo. Nous vous alertons alors sur une triple contrainte. La fonction s applique à toutes les photos. Les photos doivent être d excellente qualité. Le temps de téléchargement de la page sera plus long car la photo haute définition sera téléchargée. - d un tableau de caractéristiques dont les champs sont modifiables - de 5 zones que je fais apparaître/dérouler en cliquant sur un symbole Avantages produits : texte Dimensions : tableaux Options : texte Variante : texte Conseils de pose : texte
Le back-office prévoit de ne pas faire apparaître toutes ces rubriques mais seulement certaines selon le produit. - de deux boutons : imprimer la fiche ou accès au formulaire de contact Eléments vidéos Des vidéos pourront être mises en ligne sur votre site. Nous vous préconisons alors de les télécharger sur Youtube ou Dailymotion puis de les insérer (par un frame) sur votre site, méthode aujourd hui couramment utilisée et qui permet de ne pas surcharger votre hébergement. Le référencement La mise en place des balises est un travail laborieux mais incontournable. Sur toutes les pages du site on ajoute un titre de quelques lignes, une description (200 ou 300 caractères), plus longue et une liste de mots clés (environ 10 à 15). Ce sont ces éléments qui vont permettre aux robots des moteurs de recherche de mieux vous indexer et faire correspondre le contenu d une page avec les mots-clés tapés. Ce sont ces balises qui permettent les réponses de Google à vos recherches. Doivent être considérées comme page les rubriques et non les sous-rubriques (qui ne sont pas véritablement des pages car elles vont chercher différents éléments d une base de données pour les afficher sur une même page). Ainsi vos différentes balises seront à indiquer (par choix dans un menu) sur la page accueil, produit, contact, actualités, etc. Les statistiques Un script html google analytics sera inséré sur le site afin de disposer d un suivi de vos statistiques de fréquentation. Perspectives A moyen terme, le site pourrait évoluer vers un outils de chiffrage permettant à des clients référencés de réaliser eux-mêmes leurs devis et/ou, une vente en ligne de certains produits. Un module de newsletter pourra également être rajouté.
Planning de réalisation 18/02/2010 envoi du cahier des charges définitif (avec options) à Cofim envoi du cahier des charges aux développeurs pour chiffrage semaine suivante Cofim me fait part de ses remarques sur le cahier des charges par email FH adresse une maquette définitive FH adresse un devis définitif 1/03/2010 réunion de validation générale Du 2/3/2010 au 15/04/2010 Construction du site, développement de toutes les fonctions Cofim prépare tout son contenu sous word à partir de modèles 15/04/2010 Mise en ligne du site et du back-office Du 20/04/2010 au 25/04/2010 Test, correctifs et mise en ligne définitive