Si les performances d’un site internet peuvent être évaluées avec de nombreux critères, le plus objectif est son temps de chargement. Si pendant longtemps, l’amélioration des performances a été délaissée et même oubliée dans de nombreux cahiers des charges, la majorité des propriétaires de sites internet – soucieux de maximiser l’activité de leur site – sont aujourd’hui prêts à dépenser beaucoup d’énergie pour gagner quelques centièmes de secondes pour afficher leurs pages. Cet intérêt n’est pas seulement motivé par la construction d’un internet plus rapide.
Pourquoi améliorer le temps de chargement des pages d’un site ?
L’impact du temps de chargement est majeur dans le développement d’un site internet. Les boutiques en ligne peuvent par exemple perdre un potentiel client si la page de paiement est trop longue à s’afficher. Dans ce cas, le temps consacré à la promotion d’un produit et l’argent dépensé en publicités s’envolent pour un problème purement technique.
Les sites d’actualité peuvent quant à eux voir leur nombre de visites ne pas décoller ou chuter en raison de performances moyennes. Google, maître de la recherche organique en France, prend en compte dans ses classements la rapidité d’affichage des pages. Si Google communique peu sur ses algorithmes, les experts en référencement estiment que ce critère est pris en compte depuis 2010.
Comment améliorer le temps de chargement d’un site internet ?
Pour optimiser le temps de chargement d’un site internet, il est essentiel d’avoir conscience des contraintes liées au développement d’un site internet moderne. Les visiteurs ne « surfent » plus aujourd’hui seulement avec un ordinateur et un modem 56K. Un même site internet peut être consulté à la fois par un mobinaute – un utilisateur naviguant avec un téléphone – à la connexion limitée que par un « télénaute » disposant d’une télévision reliée au réseau par la puissante fibre optique.
Concevoir un site adaptatif avec le Responsive
S’il est possible de développer une version mobile et une version ordinateur d’un site internet, il est recommandé – notamment par Google – de développer des sites dit « responsive ». Derrière ce terme anglophone se cache très simplement un ensemble de techniques permettant à un site internet de s’adapter à l’appareil de l’utilisateur.
Le dimensionnement en pourcentages – et non en pixels – des éléments constituant la page est la technique la plus connues du responsive. L’utilisation de pourcentages permet très simplement de proposer une mise en page capable de s’adapter à toutes les résolutions de l’écran. Pour les écrans de très petites tailles, cette technique peut-être inefficace. Il faut alors tirer profit des media queries du langage CSS, le langage utilisé pour définir le design des pages. Les medias queries permettent de conditionner des règles de mise en page selon la taille de l’écran du terminal. On peut ainsi afficher sur un ordinateur deux colonnes l’une à côté de l’autre et afficher sur un petit écran ces deux mêmes colonnes l’une en-dessous de l’autre.
Le responsive présente un avantage et pas des moindres comparé à la création de plusieurs versions d’un site : un seul développement est nécessaire. De plus, l’ajout de fonctionnalités ou les opérations de maintenance sont réalisées une seule fois.
Si le « responsive » désigne souvent uniquement la mise en place de règles impactant la mise en page, il peut également englober des techniques d’optimisation du temps de chargement. Il est en effet possible de non seulement modifier l’aspect d’une page selon le terminal de l’utilisateur mais aussi de proposer des ressources adaptées. Avec le HTML5, on peut demander au navigateur de l’internaute de sélectionner une image ou une vidéo en fonction de la résolution de l’écran. Par exemple, sur un ordinateur de plus de 30 pouces une vidéo ultra-HD peut être affichée alors que sur un téléphone, une vidéo de qualité moyenne est utilisée.
La capacité d’un site internet à s’adapter à tous les appareils permet non seulement de ne pas perdre un visiteur pour une raison technique mais aussi d’améliorer son référencement. Google privilégie dans ses classements les pages capables de s’adapter parfaitement à tous les appareils, le mobile étant le juge de paix.
Respecter toutes les bonnes pratiques de l’optimisation
Si les techniques du Responsive sont particulièrement puissantes et adaptées à la création de sites internet modernes, des pratiques plus anciennes d’optimisation ne doivent pas être oubliées ou abandonnées.
L’optimisation du poids des images est par exemple toujours un élément clé dans la réduction du temps de chargement. Choisir un dimensionnement adapté à la résolution de l’écran, un format adapté au web comme le .jpg ou le .png et se résoudre à la compression sont essentiels pour réussir à abaisser le poids des ressources et in fine le temps de chargement.
Une autre pratique cruciale dans l’optimisation des performances est la gestion de la mise en cache. Un site internet peut demander à l’internaute – ou plus exactement à son navigateur – de conserver des fichiers statiques. Ainsi, dès la consultation d’une deuxième page d’un site internet, le temps de chargement est baissé drastiquement puisque le navigateur dispose déjà d’une partie des ressources.
La mise en cache peut également être effectuée côté serveur. De nombreuses pages d’un site internet n’ont pas besoin d’être générées pour chaque utilisateur. L’installation d’un système de cache permet non seulement de réduire le temps de chargement mais aussi de réduire la charge serveur. Un « cercle vertueux » est alors créé: la charge serveur diminuant après chaque page mise en cache, la génération des pages suivantes est de plus en plus rapide.
Le produit SiteLock, par exemple, via son accélérateur de site TrueSpeed, permet de booster naturellement la vitesse de chargement de votre site notamment grâce à la mise en cache et la compression de contenus statiques, l’optimisation des images et l’utilisation d’un Content Delivery Network (CDN).
Pour réduire l’impact des ressources sur le temps de chargement, il est également recommandé d’inclure un minimum de feuilles de style, d’images, de vidéos ou de fichiers javascript dans une page. La compression et la concaténation des ressources peuvent-être effectuées pour réduire le poids et le nombre de fichiers à télécharger.
Comment mesurer les performances d’un site internet ?
Comme indiqué au début de ce billet, les performances de chargement d’un site internet peuvent être facilement mesurées et même notées. De nombreux outils proposent depuis plusieurs années d’évaluer ce critère qualité. Comme souvent, Google fait référence en la matière avec Page Speed Insights. Cet outil permet de mesurer les performances d’une page internet pour un chargement sur mobile et sur ordinateur. Il note également l’adaptabilité de la page aux mobiles. Une fois l’analyse réalisée, PageSpeed Insights affiche une note sur 100 pour chacune de ces trois mesures. Des checklists permettent aussi de connaître les bonnes pratiques mises en place ou celles à implémenter.
Si PageSpeed Insights fait référence ce n’est pas seulement pour la qualité de l’analyse des performances des sites mais aussi – et surtout – pour son créateur. De nombreux spécialistes du SEO estiment même que les notes fournies par l’outil sont les mêmes que celles exploitées par les algorithmes de classement de l’entreprise américaine.
Google Page Speed Insight a été réalisé à l’intention des développeurs ou des propriétaires de site disposant d’un bagage technique. Pour promouvoir un internet rapide (plus rapide et moins cher à indexer), Google a mis en ligne ces dernières semaines une version grand public de cet outil. Cette application répond au nom de Test My Site With Google. Le propriétaire d’un site peut, comme avec Page Speed Insight, entrer une url et obtenir les mêmes notes sur 100 que celles de Page Speed Insights. En plus de ces notes, le propriétaire peut demander l’envoi d’un rapport plus complet par email. Ce dernier contient une checklist avec les optimisations déjà réalisées ou celles à mettre en place. A la différence de Page Speed Ingsight, Test My Site With Google n’indique pas comment optimiser techniquement la page.
Avant de tester votre site internet avec les outils de Google ou de ses concurrents (GTMetrix ou Pingdom), il est important de noter que les tests réalisés sont effectués sur une page « individuelle ». Si une majorité d’optimisation s’appliquent à l’ensemble d’un site, il est vivement recommandé de tester l’ensemble des pages d’un site ou du moins des différents types de page.
Si Google conseille de concevoir des sites internet responsive au détriment du multi-versions, l’entreprise promeut tout de même le format AMP (Accelerated Mobile Pages). Les propriétaires de sites internet peuvent réaliser une version AMP de leur site. Le point fort d’AMP est d’imposer l’utilisation de techniques et de ressources privilégiant la rapidité de chargement. L’autre point fort d’AMP est la possibilité d’héberger les pages du site sur les serveurs de Google. L’internaute peut alors consulter ces dernières via le puissant réseau du géant de Mountain View.
