Awwwards

Michaël Villeneuve

Développeur web à Bordeaux

Menu hover Clavier hover Clavier hover

Retourner à la liste des réalisations →

Boutique sur mesure


La création d'un site e-commerce pour le client N*** fût le fil rouge de mon alternance dans l'agence Awam.
Ce projet aux grandes ambitions, m'a été confié en mars 2015.

Les conditions de réalisation étaient claires : le client souhaitait un site E-commerce totalement sur mesure, sans CMS, et avec une interface d'administration personnalisée dans les moindres détails à l'image de l'entreprise. Au delà de la vente en ligne, le site web se devait également d'être la plaque tournante des activités de l'entreprise, en proposant un système d'information, capable de gérer les activités logistiques, la facturation, et la centralisation des commandes depuis les différents canaux de vente de l'entreprise.

La phase de réflexion

Un site e-commerce, peu importe sa taille, impose en amont une importante phase de réflexion, de définition des objectifs.
Dans un projet sur mesure, cette réflexion est d'autant plus cruciale du fait que toute la base données du client doit être créée de zéro. Cela impose énormément de rigueur dans le nommage des champs, la compréhension des attentes du client, la liaison entre les éléments de la base de données.
Cette partie est aussi importante que les fondations dans la construction d'un bâtiment.




Créer la structure m'a demandé de mobiliser beaucoup de connaissances apprises durant mon DUT, notamment sur la gestion de projet informatique, en effet, j'ai souhaité effectuer toute la modélisation de la base de données à l'aide de diagrammes UML ce qui m'a permis de conserver une très bonne vision de l'ensemble de la base.

Design & UX

L'ensemble du site fût réfléchi dans le but de fournir au client une navigation totalement fluide et instantanée. J'ai ainsi choisi de privilégier le chargement asynchrone, qui est devenu depuis quelques années suffisamment mûr pour être accessible à la grande majorité des utilisateurs (et de leur navigateur), tout en étant visible par les moteurs de recherche, et donc indexable.

Élément aujourd'hui essentiel à un site e-commerce, le site se devait d'être parfaitement accessible sur mobile, et offrir une expérience de navigation d'une qualité au moins équivalente à celle sur PC.

Penser le site d'abord dans une vision mobile, m'a ainsi permis de répondre à cette problématique en évitant de perdre du temps à optimiser le site en aval, et sans le surcharger.



Développement

Le choix d'utilisation du Framework CakePHP a été pris par Jérémy, le directeur technique de l'agence. En effet, il connaissait déjà ce framework et souhaitait pouvoir garder la main sur le site après la fin de mon alternance.

Ne connaissant pas celui-ci, j'ai dû me former dessus en quelques semaines. Le temps d'apprentissage fût relativement rapide, celui-ci étant assez facile à prendre en main.

Concevoir un système d'informations complexe de bout en bout m'a demandé un niveau de rigueur que je n'avais jamais atteint auparavant. Beaucoup d'éléments critiques entrent en jeu et doivent impérativement être pris en compte au départ du projet. Les problématiques de sécurité liées à un site E-commerce, aux modes de paiement, etc, ont été profondément réfléchies et j'ai dû, à de nombreuses reprises, prendre un regard détaché du projet pour pouvoir anticiper toutes les failles et les corriger.

Concernant la partie front-end, j'ai travaillé essentiellement avec Jquery, notamment pour toute la partie Ajax, mais également avec divers framework qui m'ont permis de réaliser des modules spécifiques (vue en 3D des découpes, animations de graphiques sur le backoffice, gestion des périphériques liés à la logistique (tablettes) etc).

Réferencement

L'optimisation d'un site E-commerce pour les moteurs de recherche est l'une des clés de sa réussite. Aujourd'hui, nous constatons de plus en plus à quel point Google s'efforce de privilégier l'utilisateur dans son algorithme.
Partant de ce constat, j'ai décidé dès le départ du projet de travailler en profondeur la sémantique, à la fois dans le code source du site web (en privilégiant les balises Html5, un code propre et valide, et en offrant un grand nombre de micro-données aux moteurs de recherche) mais également dans le contenu proposé aux utilisateurs.

Mes collègues ont ainsi mis en place une stratégie de rédaction de contenu, avec un fil d'actualité, régulièrement mis à jour, proposant un contenu important et recherché par l'utilisateur. Les descriptions produits sont évidemment toutes différentes et soigneusement rédigées.

En parallèle, j'ai travaillé sur d'autres éléments impactant le SEO : la rapidité du site web, l'ajout d'un certificat SSL



swipe
Accueil - Contact - Mentions légales