Nous avons eu le plaisir de travailler pour le groupe Le Duff afin de réaliser le site de son enseigne la Brioche Dorée : www.briochedoree.fr. L’objectif du site est d’une part d’augmenter la notoriété de la marque, de relayer les opérations commerciales en ligne et d’autre part, de donner une information complète sur les produits, les menus et les restaurants. Arrêtons-nous sur les aspects techniques qui caractérisent ce site.
Les aspects graphiques
Nous avons fait avec Tony une adaptation des éléments fournis par le service marketing de Brioche Dorée, issus de la communication papier. Et les animations Flash ont été réalisées avec la collaboration de Stéphane d’Ogham.
Les fondamentaux : XHTML/CSS
Pour commencer, le site a été réalisé en XHTML transitional et en CSS 2. Nous avons validé l’ensemble de ces pages avec le validateur du W3C et avec celui du WDG. En effet, vous pouvez en faire le test vous même :
Tester la conformité du code XHTML avec le validateur du WDG et tester la conformité du code CSS avec le validateur du W3C.
Accessoirement, nous nous sommes assuré du bon fonctionnement de l’affichage dans les navigateurs suivants, Firefox, Opéra, Safari et Internet Explorer (6 et 7 car ils ont un comportement un peu différent).
On notera l’absence de prologue XML dans les pages : en effet son usage fait basculer Internet Explorer dans sa version 6 en modèle de boite Microsoft alors que nous préférions tout traiter avec le modèle de boite standard. La mention du prologue reste aujourd’hui optionnelle pour une interprétation en HTML des pages.
Un framework Javascript célèbre : Prototype
Nous avons utilisé pour la couche animation et interaction le framework prototype.js accompagné de scriptaculous. Pourquoi ce choix ? D’une part pour ne pas réinventer la roue; et d’autre part pour limiter l’usage de Flash à l’animation plus complexe de la page d’accueil et surtout pour se garantir un bon fonctionnement dans la plupart des navigateurs. Du coup l’animation du bandeau en haut est réalisée avec ce framework.
Enfin nous avons utilisé une lightbox pour afficher les photos des restaurants.
Des maps de chez Google
Le service informatique avait déjà un web service capable de nous retourner la liste des restaurants Brioche Dorée par département. Nous avons proposé d’utiliser Google Maps pour les localiser. Nous avons été chargés d’alimenter la base de données interne avec les coordonnées (longitude et latitude) de chaque restaurants. Une fois cela fait, un pins (au look Brioche Dorée) positionne chaque restaurant sur la carte Google, elle même intégrée au sein du site : les restaurants de la Brioche Dorée.
Coté serveur d’application
PHP 5 est utilisé essentiellement dans un objectif de factorisation des éléments composants les pages. Cotés référencement, nous avons mis en place un système centralisé permettant de définir pour chaque url quelles mentions indiquer (title, méta, keywords, tags de statistiques, etc…). Ce qui facilite grandement le travail du “référenceur” sur le site.
Il n’y aucun système de gestion de contenu. Pourquoi ? L’essentiel des actualisations régulières concernent les opérations promotionnelles mis en avant dans les actualités. Or l’exigence et la souplesse requises pour cette communication ne sauraient souffrir d’une grille trop rigide. Bref nous accompagnons la mise en place de chaque opération qui bénéficie pour chacune d’un traitement particulier.
Perspectives
Est-ce que le travail s’arrête ici ? En respectant notre philosophie de réalisation, nous pensons avoir livré :
- un site accessible à la plupart
- et d’une grande souplesse pour le service marketing de Brioche Dorée.
Quelques évolutions ont déjà été évoquées et devrait voir le jour en 2008. Toutefois, il nous faudra voir d’ici un an avec le plan media mis en place pour 2008 si le site a atteint ces objectifs…