Le mois dernier, YATEO participait au Hackathon, un événement signé Google. 5h durant lesquelles deux de nos développeurs, Alexandre et Miloud, ont pu mettre au défi leurs connaissances au sujet de l’optimisation de la vitesse de chargement des pages d’un site mobile. Retour sur ce meeting qui nous en apprend plus sur l’optimisation SEO d’un site sur mobile.

Présentation Hackathon

Le chargement des pages d’un site mobile : tout un art !

Afin de booster le référencement de son site depuis une connexion mobile, certains éléments méritent d’y prêter une attention particulière.

La vitesse de chargement sur mobile.

Le sujet avait été évoqué dans l’un de nos article précédent (« SEO : optimiser le chargement de ses pages »), il est aujourd’hui primordial de proposer aux internautes des sites aux temps de chargement les plus courts possibles.  En effet, les retombées peuvent être très négatives pour les entreprises qui n’y accordent pas d’attention :

  • 46% des gens estiment que l’attente lors du chargement des pages est ce qu’ils détestent le plus sur le web lorsqu’ils naviguent depuis un mobile (en deuxième place, les interstitiels remportent seulement 16%).
  • Plus de 50% des visiteurs changent de site lorsque les pages mettent plus de 3s à charger.
  • La vitesse de chargement mobile est corrélée à vos performances SEO.

On comprend vite l’intérêt d’améliorer le temps de chargement de ses pages : moins votre site est performant, plus vous privez de visiteurs potentiellement intéressés par votre activité.

Cependant, avant de s’intéresser aux recommandations, il faut tout d’abord analyser les performances de votre site actuel. Pour ce faire, vous devrez prendre en compte le Speed Index. Cet outil correspond au temps de chargement de votre page au dessus de la ligne de flottaison. Afin de mesurer votre Speed Index, vous pouvez-vous rendre sur le site https://www.webpagetest.org/ .

Afin d’apprécier les résultats de votre test  Speed Index, voici une échelle de notation proposée par Google :

Speed  Estimation
4500 Passable
4000 Ok
3500 C’est bien
3000 C’est très bien
2500 Excellent

La gestion des images sur votre site mobile.

Trop souvent, les performances d’affichage d’un site sont intimement liées aux images qui y sont intégrées. Des images lourdes entrainent des ralentissements de la vitesse de chargement. Ainsi, Google nous a fait part de quelques recommandations durant ce Hackathon :

La méthode du Download & Shrink / Hide : il s’agit de prévoir des images différentes adaptées à chaque format d’écran afin que le chargement des images soit optimisé lors de l’affichage de la page, quelque soit le l’appareil utilisé pour se connecter.

L’encodage Base 64 : afin d’optimiser davantage le poids de vos photos, Google incite les entreprises à avoir recours à l’encodage Base 64. Il permet de compresser les images en les transformant les images en chaîne de caractères. C’est un moyen efficace de gagner en légèreté et donc en rapidité de chargement.

Le Lazy Loading : ce dispositif permet le chargement de vos visuels avant même que les internautes en aient besoin. Il s’agit d’anticiper la visite de l’internaute pour lui offrir une expérience utilisateur irréprochable.

La suppression des sliders sur mobile : de nombreux éléments agissent au détriment de votre site web lorsque vous utilisez des sliders sur votre site mobile. Par exemple, les sliders sont souvent perçus comme des bannières publicitaires de la part des visiteurs et leurs rotations sont synonymes de distraction pour les internautes. Par ailleurs, utiliser des sliders, c’est demander à vos visiteurs de charger d’autant plus d’images tout en ayant recours au JS. Autant dire qu’on est loin de l’optimisation de l’affichage de votre page ! En fin de compte, les performances des sliders sont bien souvent dérisoires vis-à-vis des bénéfices que l’on en tire.

Les développeurs YATEO en pleine écoute

L’optimisation du chemin critique.

Tout d’abord, accordons-nous sur ce que désigne le chemin critique. Le chemin critique permet de charger uniquement le style qui se trouve au dessus de la ligne de flottaison. Google recommande ainsi de valoriser les éléments relatifs au chemin critique, au dépit des informations que l’on retrouve en-dessous, qui chargeront dans un second temps. Optimiser le chargement du chemin critique de son site permet donc de donner un aperçu de la page plus rapidement aux visiteurs.

 

Le Hackathon : un concours entre développeurs !

Suite à ce brief des nouveautés SEO, Google a défié les développeurs présents au meeting : quoi de mieux qu’appliquer aussitôt les recommandations proposées ? C’est l’occasion idéale pour les développeurs présents à l’événement de tester et de vérifier qu’ils ont bien intégré les nouveautés présentées par Google.

Le but : améliorer le speed index de votre site, c’est-à-dire obtenir un speed index de 4000 ou plus bas (le + bas gagne).

L’objectif : atteindre les 3000 en speed index.

L’enjeu : remporter un drone et la satisfaction d’être le meilleur !

C’est donc durant 4h que notre développeur en alternance Miloud et son tuteur Alexandre ont travaillé pour atteindre les meilleurs résultats possibles. En appliquant les recommandations issues du brief, et à l’aide de leur connaissances personnelles, ils ont réussi à obtenir les meilleurs résultats du concours, face à une dizaine d’autres équipes. C’est donc avec une fierté non dissimulée que nos deux développeurs sont revenus victorieux, drone à la main.

Miloud remporte le premier prix du Hackethon !

Miloud, notre développeur en alternance, prend la parole au sujet de cet événement signé Google :

Son profil : Séduit par la programmation dès le lycée, Miloud a ensuite orienté ses études sur le développement en langage C (langage proche de celui de la machine) mais aussi sur les technologies de développement web et traitement de données.

Ses domaines de compétences : Programmation développement et analyse de code, modélisation de bases de données, gestion de serveurs et environnement linux, outils de versionning de projets.

 

« Premier événement professionnel auquel je suis convié, je ne savais pas vraiment à quoi m’attendre lors de ce meeting. Ce fut une expérience extrêmement enrichissante, non seulement parce qu’elle m’a permis de mettre à jour mes connaissances, mais également parce que j’ai pu tester mon savoir-faire et les notions que j’ai intégré durant ce meeting. 

D’ailleurs, c’est un nouveau type de challenge que d’affronter en direct d’autres équipes de développeurs !

L’optimisation pagespeed est une des offres de l’agence. J’avais donc un bagage de savoir-faire peut être plus important que d’autres développeurs à ce sujet, et cela m’a sans doute permis de prendre l’avantage pour remporter la première place de ce concours !

Ce meeting m’a conforté dans l’idée qu’il ne faut jamais rester sur ses acquis dans le domaine du digital. C’est un environnement en constante évolution, et une veille quotidienne ainsi qu’une mise en pratique régulière sont essentielles afin de rester compétitif ! « 

 

Les ateliers organisés par Google pour ses partenaires (les « Google Partner Premiers« ) sont donc une opportunité pour YATEO de rester à l’affût de toutes les nouveautés concernant le référencement sur ce moteur de recherche. Il permet aussi à notre agence de vous proposer des services de haute qualité et fortement concurrentiels.

 

Si vous souhaitez avoir des informations sur nos prestations, contactez-nous au 01 58 89 27 36 ou via le formulaire de contact disponible ici https://www.yateo.com/contact.html.