La pause adorée de la Brioche Dorée
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
Le CSS (Cascading Style Sheets) est un langage utilisé pour décrire l'apparence et la mise en page des documents HTML, en définissant des styles comme les couleurs, polices, marges, et positionnements des éléments sur une page web.
2. Nous avons validé l’ensemble de ces pages avec le validateur du
W3C
Le World Wide Web Consortium (W3C) est une organisation internationale qui développe des standards ouverts pour assurer la croissance à long terme du web, comme HTML, CSS, et XML.
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 Le HTML (HyperText Markup Language) est le langage standard utilisé pour structurer et afficher le contenu sur le web. Il définit des éléments comme les titres, paragraphes, liens, images, et autres composants d'une page web. des pages.
Un framework Javascript célèbre : Prototype
Nous avons utilisé pour la couche animation et interaction le framework Un framework est un ensemble d'outils et de bibliothèques qui fournit une structure et des fonctionnalités préétablies pour développer des applications, simplifiant ainsi le travail des développeurs en offrant des solutions prêtes à l'emploi. 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 PHP est un langage de programmation côté serveur utilisé pour créer des pages web dynamiques. Il est largement utilisé pour gérer les bases de données, traiter des formulaires, et générer du contenu HTML. 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 Une URL (Uniform Resource Locator) est l'adresse unique d'une ressource sur Internet, comme une page web, une image ou un fichier, permettant de la localiser et d'y accéder via un navigateur. 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…
