Comment éviter de rendre votre site lent et incompatible

Le HTML, le CSS, le Javascript sont des langages qui s’exécutent côté client. 

Ca signifie donc, comme on a vu précédemment, que c’est votre ordinateur, et non pas le serveur, qui effectue les calculs pour afficher la page, pour produire les effets.

Ca implique que moins l’ordinateur sur lequel s’affiche votre site est performant, plus il aura tendance à ne pas être fluide, à "ramer" un peu. 

Par exemple, un énorme diaporama avec des transitions gourmandes, un peu farfelues et délirantes, et le site sera amené à saccader sur une machine obsolète. 

De même sur une machine où il y aurait déjà quelques programmes gourmands qui seraient en cours d’exécution.

Cette vidéo ci-dessus est un extrait du guide complet "Créer un vrai site pour le Business avec WordPress" -

Donc il y a plusieurs facteurs qui peuvent alourdir l’affichage d’un site :

• le poids des images ou des autres médias (vidéos…) : plus les images sont grandes et mal optimisées, c’est-à-dire exportées au mauvais format, plus le site va être long à charger.
• le nombre de fichiers externes à charger : vous avez vu précédemment qu’on peut appeler des feuilles de style CSS, on peut aussi appeler des scripts avec Javascript et des images, des médias, plus il y a de connexions à faire vers l’extérieur de la page, plus la page va être longue à charger.
• le poids du fichier en lui-même : si c’est un script, ça peut être le nombre de lignes (plus il y a de lignes et plus le fichier est lourd et est long à télécharger et donc plus la page sera longue à afficher).
• la mauvaise optimisation du code : faire du code c’est une vraie discipline, si ça a été fait comme un amateur, il y a des fonctions qui ne sont pas du tout optimisées et qui sont beaucoup plus gourmandes que si elles avaient été faites par un web développeur expérimenté.

Un autre aspect important à prendre en considération, c’est l’évolutivité de ces langages. 

Il y a eu le HTML 1, 2, 3, 4 et aujourd’hui la version avancée, évoluée du HTML, c’est la version 5. Il y a eu le CSS1, 2, on en est au CCS3. Donc il y a toujours une version d’avance le HTML6 est en cours, le CSS4 aussi.

Pour que ces langages prennent vie, que ces nouvelles versions, que les nouvelles fonctionnalités que ces langages apportent prennent vie, il faut que les navigateurs soient équipés pour comprendre ces nouvelles fonctions. 

C’est pour ça qu’il est important de mettre à jour vos navigateurs. Un site ne s’affichera pas de la même façon, ça dépend des sites, il y a des sites hyper basiques  pour lesquels il y a de fortes chances qu’il s’affiche à peu près pareil sur tous les navigateurs, mais un site un petit peu avancé risque de ne pas s’afficher de la même manière sur Google Chrome et FireFox.

Ce que je voulais juste vous expliquer, c’est simplement un tableau comparatif qui vous montre la quantité d’objets (c’est-à-dire de fonctions du langage HTML5), la quantité de fonctions prises en charge par le navigateur. 

Dans mon exemple (sur la vidéo) on constate que Google Chrome prend en considération 526 fonctions du HTML5, la dernière version de Fire Fox, elle, en prend 467, Internet Explorer loin derrière avec 336 (et une prochaine version annoncée qui en prendrait 402), Opéra 519 et Safari 396. Chrome a donc une longueur d’avance et ça fait déjà quelques temps qu’il a cette position de leader. 

C’est aussi un business, plus un navigateur est amélioré, plus les gens le choisissent et donc plus c’est facile pour les entreprises qui le développent d’obtenir des cookies de votre part, de prendre des analyses de vos comportements, etc.

C’était un point qui me paraissait aussi important d’être abordé : un site va utiliser des aspects précis d’un langage et si ce sont des aspects trop modernes il se peut que les navigateurs de vos utilisateurs ne les prennent pas encore en charge. 

Donc vous, en tant qu’utilisateur, il faut faire les mises à jour pour être sûr de toujours avoir toutes les fonctionnalités qu’un site offre. 

Et de l’autre côté, quand on fait un site, il faut essayer de ne pas être trop avant-gardiste sur les fonctionnalités utilisées.