Pourquoi je m'en fous de PageSpeed
Et vous devriez aussi
Remy Perona
Lead developpeur de WP Rocket chez WP Media
@remyperona
Qui veut un site rapide ?
Qui veut un site rapide ?
TOUT LE MONDE
Comment mesurer la vitesse
de mon site ?
Comment mesurer la vitesse
de mon site ?
Google PageSpeed Insights
Le problème avec PageSpeed
PageSpeed ne mesure pas le
temps de chargement
de votre site
Bon Score PageSpeed
≠
SITE RAPIDE
Score PageSpeed : 85
Temps de chargement :
3,16s
Score PageSpeed : 58
Temps de chargement :
596ms
"La note PageSpeed n'a aucun impact sur votre SEO.
Pour Google, le temps de chargement de votre site est important."
Joost De Valk - Yoast
"Bien que le score soit lié à la vitesse de la page, il n'est pas complètement représentatif de l'expérience utilisateur réelle."
La seule mesure importante pour vos visiteurs est le temps de chargement
de votre site !
Pourquoi utiliser PageSpeed ?
Pourquoi utiliser PageSpeed ?
détecter des optimisations possibles (avec précaution)
Pourquoi utiliser PageSpeed ?
détecter des optimisations possibles (avec précaution)
Complément à un outil de mesure
du temps de chargement (Pingdom Tools)
Recommandations PageSpeed
Recommandations PageSpeed
Autoriser la compression
Activez la compression gzip sur votre serveur (.htaccess, nginx.conf)
Recommandations PageSpeed
Autoriser la compression
Activez la compression gzip sur votre serveur (.htaccess, nginx.conf)
Exploiter la mise en cache du navigateur
Activez les en-têtes d'expiration sur votre serveur (.htaccess, nginx.conf)
Recommandations PageSpeed
Autoriser la compression
Activez la compression gzip sur votre serveur (.htaccess, nginx.conf)
Exploiter la mise en cache du navigateur
Activez les en-têtes d'expiration sur votre serveur (.htaccess, nginx.conf)
Éviter les redirections sur la page de destination
Minimisez/supprimez les redirections pour accéder à la page
Recommandations PageSpeed
Réduire la taille des ressources CSS/JS/HTML
Minifiez vos ressources statiques (Autoptimize, WP Rocket…)
Recommandations PageSpeed
Réduire la taille des ressources CSS/JS/HTML
Minifiez vos ressources statiques (Autoptimize, WP Rocket…)
Réduire le temps de réponse du serveur
Utilisez un système de cache statique (plugin) ou serveur (Varnish)
Recommandations PageSpeed
Réduire la taille des ressources CSS/JS/HTML
Minifiez vos ressources statiques (Autoptimize, WP Rocket…)
Réduire le temps de réponse du serveur
Utilisez un système de cache statique (plugin) ou serveur (Varnish)
Optimiser les images
Utilisez une solution de réduction du poids des images (ImageOptim, Smush, Imagify…)
Suivre ces recommandations
=
meilleur temps
de chargement
Ne s'appliquent pas aux sources externes (Google fonts, analytics, tracking…)
Recommandations PageSpeed
Éliminer les codes JavaScript et CSS qui bloquent l'affichage du contenu au-dessus de la ligne de flottaison
Chargez les fichiers CSS et JS de façon asynchrone/différée
!
Peut causer des problèmes d'affichage
CSS critique différent pour chaque page
Insérez le "CSS critique" directement dans le <head> de vos pages
Recommandations PageSpeed
Afficher en priorité le contenu visible
!
Difficile à mettre en place avec WordPress
Dépendant des thèmes/extensions
Structurez votre code HTML pour charger le contenu au dessus de la ligne de flottaison en premier
Suivre ces recommandations
=
(Possible) amélioration du temps de chargement perçu
"Certaines des recommandations PageSpeed nécessitent des efforts considérables à mettre en place,
vous devez donc évaluer le coût de leur mise en place vs le bénéfice pour votre page."
RECAP
RECAP
Le score PageSpeed n'a pas d'importance
RECAP
Le score PageSpeed n'a pas d'importance
Suivre les recommandations de PageSpeed avec précaution
RECAP
Le score PageSpeed n'a pas d'importance
Focus sur le temps de chargement de votre site
Suivre les recommandations de PageSpeed avec précaution
Q/A
Ressources