Optimisation site web en 2019

Le 27/08/2019 Par Philippe AUBERTIN site webdéveloppementcmsperformanceseo

A quoi penser pour optimiser son site web ?

La performance et vitesse du site web

Un des facteurs des plus important concernant le référencement du site ou application web est sa performance. Qu’entend t-on par performance ? C’est un sujet assez vaste et complexe mais pour faire simple, on peut dire que c’est la rapidité avec lequel le site va répondre. Il existe de nombreuses métrics à ce sujet, personnement, je considère que c’est le ressenti utilisateur qui est le plus important et donc le temps minimum avant lequel l’utilisateur peut interagir avec le site.

Comment mesurer cette performance ?

Un audit assez complet est offert par Google directement depuis votre navigateur Chrome. C’est déjà un bon élément de travail. Par exemple, voici le résultat de l’audit sur notre blog.

audit_performance_site_web.jpg

Ici nous pouvons voir que nous avons bien optimiser la performance de notre site car nous obtenons un note de 100%. Il convient de dire ici que c’est très compliqué à atteindre et souvent cela nécessite de faire de nombreux compromis pour attendre ce niveau d’exigences.

En particulier on notera les points suivants :

  • Utiliser le moins possible le JS (voir par du tout... si c’est possible)
  • Utiliser des caches
  • Redimensionner les images
  • Simplifier le HTML et le CSS
  • Ne pas utiliser d’iframe
  • etc...

Toutes ses modifications doivent être pris en compte pendant la phase de développement car ce n’est pas possible de les rajouter après ou alors aec un effort très substantiel.

L’audit de Chrome vous donnera les bons conseil. Pour information cet audit est souvent mis à jour donc il convient de le refaire plusieurs fois dans l’année pour s’assurer que on est toujours au top.

Plus d’information sur la performance du site web

On vous conseil les sites suivants pour aller plus loin :

Pour tester les performances de son site web

Pour en savoir plus sur les performances et pourquoi c’est important

Le référencement

Qu’est-ce que le référencement ?

Pour faire au plus vite, on peut dire que c’est la capacité à être trouvable sur google. :) Pas besoin d’en dire plus ! Alors à quoi penser quand on souhaite se faire bien référencer ?

Content is king

Premièrement, la qualité du contenu est la principal clé de référencement. En effet, si le contenu est pertinent, bien écrit compréhensible alors google le lira correctement. Le moteur de recherche à faire de gros progrès ces dernières années et il est plutôt efficace pour juger la qualité de votre contenu. Donc il n’est pas nécessaire d’en faire des tonnes pour que votre site soit bien référencé. Néanmoins, on peut aider le moteur de recherche avec quelques petits trucs techniques.

Respect du balise HTML

L’étape une est la plus simple mais souvent oublié, c’est de concevoir une page en respectant la philosophie du HTML, ce qui implique utiliser les balises HTML avec la bonne sémantique. Par exemple, utiliser le balise {{< highlight html >}}

{{< /highlight >}} pour des paragraphe, la balise {{< highlight html >}}

{{< /highlight >}} pour délimiter le contenu etc... Ca peut paraitre basique mais c’est très souvent pas le cas et les développeurs par flemme ou par méconnaissance utilise la balise
comme fourre tout. Ce qui peut ne pas se voir visuellement mais à un effet perver et négatif sur les performances et le référencement.

Petite note aux développeurs, même si ça parait simple c’est super compliqué d’utiliser le bon découpage avec les nouvelles balaises HTML 5 (article, section...). Prennez le temps de lire plusieurs articles sur le sujet avant de vous lancer car c’est pas forcément intuitif !

Les microdatas et la sémantique

Il est possible de simplifier en plus la parsing par google des sites web. Les microdatas sont des balisages non visible à l’écran mais compréhensible pour la machine qui permette de rajouter une couche d’information à Google dans sa compréhension de la page.

On peut utiliser plusieurs solutions, personnellement j’aime bien la formule en JSON-LD. Par exemple, ici un exemple tiré de la documentation google qui permet de baliser les informations de votre société. Ce sont ces informations qui sont utilisées pour créer les encarts à droites quand vous faite une recherche Google. {{< highlight javascript >}}

{{< /highlight >}}

On comprend vite pourquoi Google aime bien ce formalisme car ça simplifie la vie pour lui. Il a déjà l’intégralité de l’information baliser comme il le souhaite. On ne s’imagine pas mais c’est assez compliqué pour un ordinateur de comprendre une page HTML alors si vous lui maché le travail, il va adorer !

Presque tout ce que vous pouvez produire de contenu peut être balisé avec des microdata, n’hésitez donc pas à en abuser !

L’accessibilité de votre site web

Qu’est-ce que l’accessibilité ?

Concrètement ce sont les moyens que vous allez mettre en place pour faire en sorte que votre site soit accessible pour un public possédant une déficience. On peut par exemple pensée aux personnes déficientes visuelles ou encore les déficites cognitifs.

Vous pourriez vous dire que ce n’est pas important, détrompez-vous, la population qui comportent un handicap est très importante ! et pour rajouter un arguement, je vous rajouterai la chose suivante. Si votre site web est accessible au plus grand nombre, même les personnes en pleine possession de leur moyen y gagneront.

Concrètement qu’est-ce qu’on peut faire ?

Il existe de nombreuses normes et formats WAII, accessiWeb... qui se proposent chacune d’aider l’accessibilité de votre site web.

Loin de faire chaque fois, l’unanimité, ils sont de bon repères pour améliorer les choses. Par exemple, mettre des attributs Alt sur les images permet à la fois d’améliorer l’accessiblité pour les personnes qui utilisent de recopie d’écran mais aussi pour Google et la compréhension des images.

Il convient donc de se rajouter ça dans sa check list !

Le mobile

Mobile first

On ne le dira jamais assez mais la navigation mobile est la majorité des lecteurs. Etant le périphérique le plus limitant, il est plus facile de créer le contenu pour ce périphérique et après l’adapter en desktop que de faire l’inverse.

Penser à la connexion

Un des principals problèmes du mobile est la performance de la connexion internet, en effet même si la 4G (bientôt 5G) sont performantes, c’est toujours souvent beaucoup plus lent que le poste fixe. Alors les grosses images et les pages lourdes pénalisent beaucoup plus le mobile.

Pour cela, faire des pages simples est la clé ! Et oui ceci demande des compromis.

À voir aussi

Tous les articles