Problématique
Approché par Mr Cup Studio, le mandat initial était de réaliser le développement du site WordPress d’un de leurs clients : un studio d’animation et d’effets spéciaux Parisien nommé The Yard VFX. Avec des contributions à des films tels que “La Loi de la Jungle”, “Transporter”, “X-MEN” et “Twilight”, on peut dire que ce studio joue dans la cour des grands !
Très rapidement, la mission de développement s’est un peu étendue pour inclure du conseil en expérience utilisateur afin de challenger le design du site et développer ainsi ensemble un site WordPress original tout en restant facile d’utilisation.
L’idée développée par Jef Millote, le web designer du projet, était de créer un véritable univers et donc d’opter pour un site très animé avec quelques interfaces sortant du lot de la plupart des autres sites (navigation horizontale, système de pré-chargement, écran d’introduction, page d’accueil / menu, deux systèmes de visionnage des films…).
Mais comment développer un tel site WordPress sans impacter la performance et tout en respectant les délais et l’utilisateur ?
Solution
La solution développée se base sur l’utilisation des animations CSS et sur un codage en JavaScript natif sans intégration de jQuery (ou équivalent) afin de ne pas surcharger le site.
De plus, la cible pouvant être considérée comme utilisant les dernières versions des navigateurs les plus populaires, nous avons pu grandement diminuer le code nécessaire.
C’est ainsi que, dès que possible, le JavaScript va servir à ajouter des classes CSS qui déclencheront les animations, toujours en CSS, puisque ce langage est très bien optimisé par les navigateurs.
Enfin, une utilisation exemplaire de HTTP/2 nous permet de charger les ressources nécessaires (préalablement optimisées) au moment le plus opportun, et ce, afin de ne pas retarder le délai perçu de chargement de la page.
Bien sûr, le site est sécurisé et suit les bonnes pratiques de WordPress dans le but de réduire au maximum les risques de piratage.
