Alexander Griffioen, directeur du design chez thenextweb.com nous parle des challenges d’une refonte

Faire la refonte du site d’une société dont c’est le gagne-pain est parfois effrayant. Pour nous (société média technologique utilisant les publicités et ayant environ dix millions de vues par mois), un déclin suffisamment prononcé du taux de conversion pourrait être catastrophique. C’est le genre de chose qui vous fait réfléchir à deux fois à ce que vous changez et pourquoi vous le faites.

Certains disent que l’évolution vaut mieux que la révolution, mais des années de modifications de design accumulées peuvent donner un mélange incohérent ayant besoin d’être consolidé. C’était une des raisons principales pour laquelle nous avons commencé à faire la refonte de notre plateforme d’actualités fin 2014. Les autres raisons sont une nouvelle stratégie de contenu, notre désir d’avoir un dispositif publicitaire en plein écran, et notre réalisation qu’une société couvrant la technologie de pointe doit elle aussi avoir une apparence à la pointe. Une bonne partie des décisions prises en matière de design ont pour base l’expérience et les bonnes pratiques, mais pour introduire de nouvelles choses telles que nos « publicités canvas« , nous n’avions que notre instinct pour nous guider. Je peux dire sincèrement que nous n’avons pas tout réussi du premier coup. Certaines des nouvelles fonctionnalités étaient en effet à la pointe de la technologie, mais elles déroutaient et frustraient nos lecteurs. La vitesse des pages en a également souffert. Les aspects invisibles du site tels que la vitesse des pages ont eu tendance à être délaissés, peut-être parce que nous faisions une refonte complète et ambitieuse en une petite équipe. Pour résumer, notre site était plus beau que jamais, mais mettait plus longtemps à charger et repoussait certains habitués, ce qui nous a obligés à repartir de zéro.

En mars 2016, près d’un an après notre refonte d’avril 2015, nous avons sorti une grosse mise à jour du design et corrigé ce que nous avions mal fait la première fois. Comment avons-nous abordé cette refonte du design ? Nous avons écouté, et nous avons mesuré. Nous avons fait des tests A/B poussés et avons suivi de près les réseaux sociaux et nos boîtes mail pour savoir ce qui posait problème à notre public. Les tests A/B effectués avec Optimizely nous ont aidés à optimiser les éléments existants (par exemple l’ajout de numéros dans une liste des choses les « plus populaires » a augmenté le nombre de clics de 34%, et celui d’un horodatage sous le titre d’un billet de la page d’accueil a augmenté le nombre de clics de 18%). Notre boîte mail nous a aussi aidés à repérer les éléments problématiques desquels se plaignaient nos lecteurs. Nous tenons d’ailleurs ces critiques à cœur.

Les plus grosses modifications concernaient la façon dont nous présentions les catégories sur notre page d’accueil. Alors qu’auparavant nous avions neuf « étagères » défilant horizontalement et affichant deux articles chacune, nous avons maintenant neuf blocs simples (dans une grille de trois sur trois) qui montrent cinq articles, dont seuls les deux premiers ont une image. Nous nous sommes inspirés de USA Today et du site d’actualités le plus populaire des Pays-Bas, NU.nl. Cela nous a fait économiser plusieurs fenêtres de défilement, et a aussi réduit le nombre d’images, qui de 108 sont passées à 18. D’autres améliorations ont consisté à rendre l’UX de nos publicités canvas plus intuitive et, avec un trafic venant à parts égales d’ordinateurs et de mobiles, de revoir notre stratégie mobile. Avec à la refonte le contenu s’affichait bien sur mobile ; dans la mise à jour nous nous sommes carrément demandés s’il était nécessaire que nous montrions une partie de ce contenu sur mobile.

Avec le recul, il est facile de dire que nous aurions pu mieux faire dès le départ, mais toute refonte est un acte de foi, surtout quand il y a beaucoup de parties prenantes. Chaque service a ses exigences : la rédaction veut de beaux articles, le commercial veut plus de publicités et de sponsors, et le social veut des boutons pour suivre et partager partout. Très vite vous vous retrouvez en train de jongler avec six balles et perdez de vue la partie prenante la plus importante de toutes : votre public.

Au passage, j’ai appris l’importance d’avoir des objectifs mesurables. Nous voulions que nos articles se chargent plus vite. C’est bien. Plus vite de combien ? Sur quel type de connexion ? En ayant des objectifs absolus, nous pouvons donner des ordres de priorité, prendre des décisions difficiles et expliquer ces décisions aux parties prenantes.

Avoir de nombreuses parties prenantes est également un bon argument pour avoir un chef de produits. Cela vous évitera de devenir un guichet où chaque service fait pression pour que vous répondiez à leurs besoins, ce qui vous pousse à essayer de plaire à tout le monde et vous avez du coup du mal à défendre le produit du point de vue de l’utilisateur. Par contre, si vous renvoyez ces services vers un chef de produits, vous parlerez alors à une seule personne au lieu de six.

Un an après notre refonte je suis très satisfait de l’apparence et de la performance de notre site. Notre nouveau design a diminué le temps de chargement des pages de 45% et nous n’avons pas fini d’optimiser. En ayant cinq développeurs internes sur le même canal Slack que des rédacteurs et des designers cela nous a également aidé à corriger des bugs et à implémenter des fonctionnalités demandées de manière incroyablement efficace. Le nouveau site (dont le nom de code est Cyberdelia, petit hommage à mon film préféré, Hackers), est aujourd’hui une base solide vers une évolution future de notre produit et de notre design, et il est doté d’une base de code plus gérable que jamais. Nous avons progressé à tâtons, mais avons accompli tout ce que nous voulions avec cette refonte. Cela ne garantit cependant pas que dans le futur nous ne ferons pas de nouvelles erreurs.