Blog

Les coûts cachés liés aux thèmes Magento

Comme toute solution Open-Source populaire, Magento se voit proposer des centaines de thèmes « prêts à l’emploi » sur les plateformes dédiées ou spécialisées. Face à la variété et la richesse fonctionnelle de l’offre, on peut logiquement préférer cette méthode en se disant qu’on « n’aura plus qu’à » personnaliser le thème à la charte du client. Or, après plusieurs expériences avec et sans thèmes achetés, notre conclusion est mitigée.

Les thèmes sur mesure : un coût non négligeable

Avant l’arrivée des thèmes clés en main d’une qualité suffisante, il fallait d’abord penser sa boutique, puis construire et décliner les différents modèles de pages à l’aide un designer web, en enfin réaliser l’intégration du thème.

A l’heure du Responsive Web Design, c’est un procédé toujours plus coûteux, puisqu’il faut en outre  intégrer et tester tous les écrans pour tous les navigateurs, mobiles y compris. C’est aujourd’hui une solution réservée aux budgets le permettant.

On peut donc imaginer faire des économies en achetant un thème qui remplisse les demandes du clients, stylistiques et fonctionnelles, puis de le personnaliser pour réaliser de belles économies.

Des thèmes payants riches en fonctionnalités

Le marché des thèmes clés en main est florissant, sur toutes les plateformes. Dans un marché mondialisé, avec une concurrence importante et parfois dans un univers peu scrupuleux, il y a très clairement une très forte demande. Il suffit de regarder le thème Magento le plus vendu sur ThemeForest : Ultimo. Presque 10.000 ventes ! Vendu 99$, avec un commission vendeur de 70%.  Avec 700 000 $, le développement du thème est largement amorti. :) Si la demande est importante, la concurrence l’est aussi. Les créateurs de thème ne doivent pas seulement proposer des créations graphiques originales et séduisantes, mais aussi intégrer des fonctionnalités pour se démarquer.

Ultimo slogans

Slogans du thème Ultimo

Les créateurs doivent donc créer un thème en Responsive Web Design, si possible flexible, assurer la compatibilité avec les versions de Magento, assurer un support correctif et évolutif de leur travail et inclure la maximum de fonctionnalités qu’on peut attendre (diaporama, mises en avant, méga-menu, panier en AJAX, etc…)

Une fois encore, regardez la page de présentation du thème Ultimo qui comporte plusieurs pages écrans à n’en plus finir !

ultimo css

Options CSS du thème Ultimo

C’est réellement impressionnant de pouvoir modifier tant de paramètres au clicodrome depuis le back-office. À ne pas laisser entre toutes les mains ou gare au désastre :-)

Clé en main n’est pas prêt à l’emploi

Ne vous attendez pas à être totalement satisfait du thème fraîchement installé, même si vous pouvez effectuer facilement pas mal de réglages.

Première chose, prendre le temps de traduire toutes les chaînes de caractères présentes en dur dans le thème, en effet nos chers créateurs de thème ont une fâcheuse tendance à ne penser qu’au marché anglophone.

Ensuite il va falloir enlever toutes les options superflues que vous ne voudrez pas garder (le comparateur de produits, la liste d’envie,  etc…)

Beaucoup de fonctionnalités de ces thèmes ont des scripts moins puissants, optimisés, sécurisés que ceux que vous avez l’habitude d’utiliser. Il faudra donc songer à les remplacer par les vôtres en gardant éventuellement la mise en page déjà en place. Concernant la sécurité, ce n’est pas non plus à prendre à la légère, certains plugins peuvent présenter des failles.

Ces fonctionnalités ont aussi un coût en terme de performances et notamment sur mobile, un critère qu’on ne peut plus ignorer selon les dernières études.

Enfin, si les démos des thèmes sont très alléchantes, il va falloir fournir des visuels de qualité équivalente, personnaliser les blocs,  les liens, les styles, etc.

Au final, il vous faudra prévoir plusieurs jours de travail pour toutes ces modifications.

Corriger et optimiser le thème

Nous avons remarqué que les boutiques avec des thèmes achetés étaient souvent moins performantes que les boutiques pour lesquelles nous avions intégré entièrement le thème. J’entends par performante le délai de réception du premier octet (TTFB) donc les performances serveur, et le temps d’affichage dans le navigateur.

Pour le temps d’affichage navigateur, il s’agit tout simplement du nombre de fichiers CSS et JS qui auront été apportés par le thème. Si vous avez gardé certaines de ces fonctionnalités, veillez bien à minifier et compresser vos assets, comme avec l’excellente et réputée extension Fooman Speedster. Attention, cette étape peut apporter des surprises en terme de mise en page et nécessitera parfois plusieurs heures de correction des fichiers sources pour qu’ils fusionnent bien. Ne vous attendez pas à un résultat rapide sans effort  l’optimisation des thèmes responsive Magento se fait en plusieurs étapes.

Pour les performances serveur, le piège à éviter est de vouloir appliquer des extensions qui boostent les performances (Full Page Cache, Varnish, etc…), avant d’avoir vérifié ce qui pouvait ralentir initialement Magento. Aujourd’hui, sur un hébergement optimisé Magento, on peut largement attendre de Magento des TTFB inférieurs à 2s voire à 1s. Mais les créateurs de thèmes sont rarement experts sur la technologie pour laquelle ils fabriquent leurs thèmes. D’ailleurs ils proposent souvent des thèmes pour plusieurs solutions.

Il faudra donc penser à intégrer au cache Magento les nouveaux blocs apportés par le thème (ou par vous même d’ailleurs) et installer un cache d’opcode (APC).
Si possible installez le patch qui permet de passer en PHP 5.4, les gains en performances sont visibles bien que ténus (Magento 1.6+).

Ensuite il faut vérifier que les créateurs n’aient pas commis d’erreur technique. La plus probable aux effets dévastateurs est de charger à la volée des attributs manquants dans la collection produits :

$model = Mage::getModel('catalog/product');
$collection = $model->getCollection();
$collection->addAttributeToSelect('short_description');
$collection->load();

Et si c’est dans un boucle pour chaque produit, c’est le jackpot ! Des dizaines de requêtes SQL supplémentaires seront exécutées, au lieu d’une seule déjà mise en cache.

Alors que la solution consiste tout simplement dans les options de l’attribut à le rendre visible dans la collection, soit « la liste de produits » :

attribut collection

Le simple réglage à faire en back-office

Un bon compromis : des thèmes simples et bien faits, à personnaliser

Finalement, les thèmes qui nous ont réservé le moins de mauvaises surprises sont les thèmes plutôt simples mais conçus par des gens qui connaissent bien Magento. On bénéficie déjà de toute l’architecture Responsive Web Design qui nous fera gagner du temps mais sans fioriture à corriger ou à supprimer. La partie traduction française reste quand même à faire.

Quels sont ces thèmes ?

Premièrement celui proposé dans la dernière version de Magento 1.9, qui est responsive par défaut. De plus avec la notion d’héritage de thème à l’infini et une version Sass et Compass, cette base permet un travail soigné et maintenable.

Nous avons aussi testé un thème de AddonBakery. Leur thèmes sont bâtis sur le framework Foundation et proposent en option (pour 300$ tout de même) l’option Sass. Tout comme le nouveau thème par défaut de Magento 1.9, ils sont très épurés graphiquement et ouvrent donc facilement la voie à la personnalisation. En revanche nous avons été assez déçus de leur support inexistant lorsque nous avons voulu leur signaler un bug de compatibilité sur IE9 : nous avons testé tous les canaux mis à disposition et reçu absolument aucune réponse.

Il y a surement d’autres prestataires qui proposent des thèmes bien conçus en respectant les bonnes pratiques de Magento, n’hésitez pas à en proposer dans les commentaires de ce billet.

Par contre, vous l’aurez compris, il faudra personnaliser de façon plus prononcée le thème de base et donc certainement faire appel à un web designer. On retourne donc presque à la case départ mais avec une ossature saine et fonctionnelle du point de vue responsive.

Comments are closed, but trackbacks and pingbacks are open.