Pour vous guider dans le monde de la webperf, nous partageons ici nos propres définitions du jargon technique en français. Elles diffèrent de ce que l’on trouve dans la plupart des lexiques et glossaires en ligne pour une bonne raison : nous avons cherché à les rendre les plus compréhensibles possible par les néophytes. Bonne lecture !
A
A/B Testing
Outil permettant de comparer l’efficacité de plusieurs versions d’une même page web sur des utilisateurs réels, sur les taux de conversion notamment. Sa complexité technique a fait émerger des acteurs spécialisés dont les solutions sont payantes : AB Tasty, Kameleoon…
Accessibilité
Désigne la capacité d’un site web à être utilisable de façon optimale par tous les utilisateurs quel que soit leur navigateur, leur localisation ou encore leurs capacités physiques et psychologiques. Les règles WCAG, qui font référence, mettent le focus sur les personnes handicapées et les séniors, qui éprouvent souvent des difficultés à naviguer sur Internet.
Ajax
Acronyme de « Asynchronous JavaScript and XML », il s’agit d’une technologie permettant à un navigateur web d’échanger avec un serveur sans avoir à recharger la page courante. Elle est à la base d’outils comme l’Infinite Scroll, mais aussi des SPA qui fonctionnent comme une application.
API
Acronyme de « Application Programming Interface », désigne la possibilité pour une application de donner accès à tout ou partie de ses fonctionnalités à une application tierce. L’objectif est d’en faciliter l’usage et l’intégration au sein d’un workflow existant. Vous regardez par exemple des séries sur votre smart TV grâce à l’API de Netflix.
APM
Acronyme de « Application Performance Management », désigne un outil installé sur un serveur web afin d’en monitorer la performance. Il se connecte pour cela aux composants clés du système d’exploitation (processeur, mémoire vive, noyau système…) et aux applications spécifiques (bases de données SQL, serveur web, exécutable PHP, système de cache…).
Aria
Acronyme de « Accessible Rich Internet Applications », désigne un balisage destiné à ajouter un niveau sémantique supplémentaire aux pages web. En complétant les balises html avec des attributs spécifiques, Aria informer les navigateurs sur le rôle et le comportement attendu de chaque élément d’interface.
Asynchrone
Par opposition à synchrone, un chargement asynchrone s’exécute en arrière-plan, permettant au reste de la page de poursuivre son chargement sans être interrompue.
B
Back-end
Partie d’un site accessible uniquement aux propriétaires et gestionnaires d’un site, par opposition au front-end qui est accessible par l’ensemble des internautes. Cela concerne l’administration et l’ensemble des scripts et outils exécutés par le serveur web.
Base64
Système d’encodage de chaînes de texte sous la forme de caractères et chiffres. Les contenus ainsi encodés sont en moyenne 33% plus lourds. Dans le web, on l’utilise principalement pour intégrer des ressources en inline (images, fontes…).
Blocking Time
Période durant laquelle une page web n’est plus interactive en raison d’une trop forte sollicitation des ressources de l’appareil par JavaScript. Cela se traduit par des freezes et/ou une latence excessive.
Brotli
Algorithme de compression moderne utilisé par les serveurs web pour réduire le poids des ressources encodées en texte (html, CSS, JavaScript…), et donc leur temps de téléchargement par les navigateurs. Plus récent que Gzip, il offre un meilleur ratio de compression.
C
CDN
Acronyme de « Content Delivery Network », cet outil s’interface entre l’hébergement et le navigateur des visiteurs afin d’améliorer les temps de chargement d’un site. Il repose notamment sur la copie des ressources statiques du serveur d’origine dans chaque centre de données du prestataire à travers le monde. Cloudflare est le plus populaire. Plus d’infos.
CLS
Acronyme de « Cumulative Layout Shift », cet indicateur de performance mesure la capacité d’une page à proposer une interface dont les éléments restent stables visuellement dans le temps. Il fait partie des 3 Core Web Vitals. Un bon CLS est sous 0.1, un mauvais au-delà de 0.25.
CMP
Acronyme de « Consent Management Platform », qui se traduit en français par « plateforme de gestion du consentement ». Il s’agit de l’outil qui permet de récolter le consentement des visiteurs lors de leur première visite concernant le tracking et le dépôt de cookies. C’est un outil incontournable pour être en conformité avec le RDPD sur tout site qui traite des données personnelles. N’hésitez pas à consulter notre comparatif de performance des CMP.
CMS
Acronyme de « Content Management System », il s’agit d’un outil permettent de faire vivre un site web et ses contenus à travers une interface de gestion en ligne. Le plus connu est WordPress mais il en existe des centaines, parfois spécialisés dans certains types de contenus, comme Prestashop et Magento pour l’e-commerce.
Concaténation
Technique d’optimisation des temps de chargement visant à regrouper plusieurs fichiers CSS ou JavaScript en un seul. C’est une technique courante pour réduire le nombre de requêtes http d’une page. Synonyme : combinaison.
Core Web Vitals
Les Core Web Vitals, ou Signaux Web Essentiels en français, regroupent 3 métriques destinées à mesurer la performance d’une page en termes de vitesse et de réactivité : LCP, FID et CLS. Ils font partie des Web Vitals, qui intègrent 3 autres mesures. Il s’agit des indicateurs de performance pris en compte par Google dans son algorithme et ses outils : Page Speed Insights, Lighthouse, etc.
CrUX
Acronyme de « Chrome User Experience Report », cet outil développé par Google permet de connaître le niveau de performance réel d’une page ou d’un site. Pour ce faire, il récolte des indicateurs de performance, dont les Core Web Vitals, durant la navigation des visiteurs sur les navigateurs qui le supportent. Les données terrain ainsi récoltées sont accessibles via la Search Console et dans la section « Découvrez l’expérience de vos utilisateurs » des rapports PageSpeed Insights.
CSP
Acronyme de « Content Security Policy », qui se traduit en français par « politique de sécurité des contenus ». Il s’agit d’une en-tête http qui vise à fournir au navigateur des informations sur l’origine possible des différents types de ressources : CSS, JavaScript, images, iframes, etc. Mettre en place une CSP améliore la sécurité d’un site mais permet aussi de réaliser un état des lieux qui s’avère très utile en matière de web performance.
CSS
Acronyme de « Cascading Style Sheet », qui se traduit en français par « feuilles de style en cascade ». Il s’agit du langage utilisé par les navigateurs web pour mettre en forme les pages en html et xml : affichage des textes, position et couleur des éléments, animations… Il est encadré par le W3C.
D
DNS
Acronyme de « Domain Name System », ce protocole est utilisé par les navigateurs pour diriger les visiteurs d’une page vers le serveur approprié. Il associe chaque nom de domaine à une adresse IP grâce aux données renseignées par leur propriétaire (champs DNS). Une infrastructure de cache mondiale garantit sa réactivité, mais génère en contrepartie des délais de propagation en cas de changement de serveur.
DOM
Le DOM (Document Object Model) est la représentation par le navigateur de la structure d’une page, chaque balise html devenant un « noeud ». Il évolue de façon dynamique en fonction des ajouts, suppressions et modifications de noeuds effectuées en JavaScript.
E
Embed
Se traduit en français par « contenu embarqué », et se matérialise au sein d’une page web par l’inclusion d’un contenu provenant d’un site tiers. Les réseaux sociaux comme Instagram, Twitter ou YouTube proposent tous ce type d’intégrations.
F
Fallback
Un fallback peut se traduire en français par « solution de repli » ou encore « à défaut de ». Dans le web, cela consiste à proposer une alternative dans le cas où une fonctionnalité ou un format de ressource ne serait pas supporté par le navigateur.
FCP
Acronyme de « First Contentful Paint », cet indicateur de performance mesure le temps nécessaire au premier élément visible de la page pour s’afficher (image, texte…). Il est très fortement impacté par les éventuelles ressources qui bloquent le rendu des pages (scripts et feuilles de styles).
FID
Acronyme de « First Input Delay », cet indicateur de performance mesure le temps nécessaire à une page pour être interactive de façon fluide. Il fait partie des 3 Core Web Vitals. Un bon FID est sous les 100ms, un mauvais au-delà de 300 ms.
Fil d’ariane
Représentation visuelle de la position de la page courante dans un site. Chaque élément de l’arborescence est cliquable afin de permettre un retour rapide vers la page d’accueil et les pages parentes (catégorie(s) pour un article par exemple). En anglais, on parle de « breadcrumb ».
Front-end
Partie d’un site accessible par l’ensemble des internautes, par opposition au back-end qui n’est accessible qu’aux propriétaires et gestionnaires du site.
FTP
Acronyme de « File Transfer Protocol », ce protocole permet de transférer des données sur l’espace de stockage d’un serveur web : images, fichiers php… Il n’est accessible qu’au propriétaire du site grâce à des identifiants de connexion.
Full stack
Se dit d’un développeur qui maîtrise les environnements techniques côté serveur (langage php, syntaxe SQL, administration système…) et côté navigateur (html, CSS, JavaScript…). Ces profils sont rares et recherchés par de nombreuses sociétés pour leur grande polyvalence et leur capacité à intervenir à la fois sur le front-end et le back-end.
G
Gzip
Algorithme de compression utilisé historiquement par les serveurs web pour réduire le poids des ressources encodées en texte (html, CSS, JavaScript…), et donc leur temps de téléchargement par les navigateurs.
H
.htaccess
Fichier système consulté par le serveur web Apache avant de servir une page ou ressource. Il est couramment utilisé pour mettre en place une réécriture d’url, pour gérer des redirections 301, pour ajouter des en-têtes de sécurité ou encore pour optimiser la mise en cache des ressources par le navigateur.
HTML
Acronyme de « Hypertext Markup Language », il s’agit du langage à la base de toute page web. Il est constitué de multiples balises, chacune ayant son propre rôle à jouer : paragraphes, images, tableaux, sections… Des attributs permettent aux développeurs de modifier leur comportement en fonction des besoins.
I
Icon Font
Ensemble d’icônes regroupées au sein d’une Webfont sous la forme de caractères. Le format est très répandu car il offre un rendu vectoriel et est facile à utiliser, mais il nécessite en contrepartie un important volume de CSS et de Webfonts. La plus populaire est Font Awesome.
Iframe
Élément html permettant d’afficher une page web au sein d’une autre page web dans un espace aux dimensions définies. C’est la solution privilégiée pour afficher la plupart des bandeaux publicitaires et des Embeds de réseaux sociaux.
Infinite Scrolling
Élément d’UI alternatif à la traditionnelle pagination multi-pages. Avec le « scroll infini », les contenus suivants de la liste sont chargés dynamiquement dans la page courante lorsqu’elle défile. On utilise pour cela la technologie Ajax.
Inline
Du code dit « inline » est inséré directement au sein de la page d’origine, par opposition à un appel dans un fichier externe. Dans html, les balises inline les plus courantes sont <style></style> pour le CSS, <script></script> pour le JavaScript ou encore <svg></svg> pour les images. Il est également possible d’utiliser un encodage base64 pour intégrer n’importe quelle ressource en inline.
INP
Acronyme de « Interaction to Next Paint », cet indicateur de performance mesure la réactivité d’une page suite à une action utilisateur de type sélection au clic, au doigt ou saisie au clavier. Il va intégrer les Core Web Vitals en mars 2024 afin d’apporter un éclairage plus exhaustif sur les latences, notamment liées à JavaScript. Un bon INP doit être inférieur à 200 millisecondes, et on le considère mauvais au-delà de 500 millisecondes.
J
JavaScript
Langage de programmation utilisé par les éditeurs de sites web pour rendre leurs pages plus dynamiques, ajouter une surcouche d’interactivité, afficher des publicités ou encore assurer le suivi de leur fréquentation. L’interprétation du code est coûteuse pour les navigateurs : elle génère souvent du « Blocking Time » et du FID.
Json
Acronyme de « JavaScript Object Notation », désigne une syntaxe permettant d’échanger des données entre plusieurs outils. Sa grande simplicité en facilite la génération et la lecture par les langages informatiques, dont PHP et JavaScript. Sur Internet, il est très largement utilisé par les API et outils destinés aux éditeurs de sites web.
L
Lazy-loading
Le lazy-loading désigne le fait de ne déclencher le chargement de certaines ressources d’une page (images, vidéos, contenus embarqués…) que lorsque les visiteurs sont susceptibles de les voir. On le met en place via des outils JavaScript ou grâce à l’attribut html natif « loading=lazy ».
Lazy-rendering
Technique permettant d’exclure du rendu initial d’une page une partie du DOM grâce à la propriété CSS « content-visibility ». Les temps de rendu sont ainsi réduits, assurant un gain en matière de vitesse (FCP, LCP…) et potentiellement d’interactivité (réduction du Blocking Time). Seule contrainte : être en mesure d’anticiper la hauteur des éléments ainsi exclus.
LCP
Acronyme de « Largest Contentful Paint », cet indicateur de performance mesure le temps nécessaire au principal élément visible de la page pour s’afficher. Il fait partie des 3 Core Web Vitals. Un bon LCP est sous les 2.5 secondes, un mauvais au-delà de 4 secondes.
Lighthouse
Outil d’audit web développé par les équipes de Google et qui propose un focus sur 5 volets : Performance, Bonnes pratiques, Accessibilité, SEO et Progressive Web Apps. On peut y tester n’importe quelle page, sur Desktop et mobile, afin d’en connaître le score (de 0 à 100).
M
Media Queries
Les Media Queries sont un outil CSS permettant de cibler certains appareils et navigateurs en fonction de leurs caractéristiques. On les utilise notamment pour créer des sites « Responsive Web Design » en se basant sur les tailles d’écrans, mais aussi pour détecter le type de pointeur (souris, écran tactile…) ou encore pour afficher une interface spécifique lorsque le mode sombre est activé.
Microdonnées
Désigne un balisage destiné à présenter de façon structurée les données d’une page. Il peut être intégré directement au code html ou bien au format Json+ld. Google se repose en grande partie sur les microdonnées pour générer les « Rich Snippets » affichés dans ses pages de résultats (notation avec étoiles, recettes de cuisine, guides pas-à-pas…). Synonymes : données structurées, microdata.
Minification
Technique d’optimisation visant à réduire le poids des fichiers CSS, JavaScript et html en supprimant tout caractère non essentiel : espaces, sauts de lignes, commentaires, éléments de syntaxe optionnels…
O
Obfuscation de lien
Technique d’optimisation SEO visant à masquer un lien hypertexte aux robots d’indexation tout en assurant un fonctionnement transparent dans les navigateurs. Cela se fait généralement à l’aide de JavaScript et d’un encodage en base64.
P
Page Speed Insights
Outil de mesure de la performance développé par les équipes de Google et centré sur les Core Web Vitals. On peut y lancer des tests synthétiques et accéder aux données terrain (CrUX) de n’importe quelle page, sur Desktop et mobile.
PHP
Acronyme de « Hypertext Preprocessor », désigne un langage de programmation utilisé pour faire fonctionner une majorité de sites web. Gratuit et Open-Source, on le retrouve au coeur de la plupart des CMS actuels : WordPress, Prestashop, Magento, Drupal… Il évolue régulièrement afin de gagner en performance.
Polyfill
Outil JavaScript permettant de supporter des fonctionnalités navigateur natives sous d’anciens navigateurs qui ne les supportent pas. Cette famille d’outils a un impact négatif non négligeable sur la performance des pages.
Proxy
Outil qui s’interface entre un navigateur web et un serveur web pour y apporter de nouvelles fonctionnalités. La plupart des proxy améliorent le niveau de performance et/ou la sécurité. Les cdn comme Cloudflare sont techniquement des proxy.
PWA
Acronyme de « Progressive Web App », désigne un type de site web dont le premier affichage génère le téléchargement en arrière plan d’une « application web ». Les fonctionnalités et l’interface sont en conséquence plus proches de ce que proposent nativement les appareils mobiles.
R
Ressource
Une ressource est un fichier appelé par le navigateur (via ce que l’on appelle une requête http) afin d’afficher une page web. Tout fichier JavaScript, CSS, fonte ou image est ainsi une ressource du point de vue d’une page web.
Ressource tierce
Ressource appelée par une page depuis un nom de domaine différent. Il s’agit bien souvent de JavaScript et de fontes, mais aussi parfois de CSS ou d’images.
Robots.txt
Ce fichier texte, qui se place à la racine d’un site, vise à en faciliter le crawl par les moteurs de recherche. Il guide pour cela les robots d’indexation en autorisant et en bloquant certaines sections, mais aussi en fournissant des liens vers les sitemaps xml.
RUM
Acronyme de « Real User Monitoring », qui correspond en français à ce que l’on appelle les « données terrain ». Cela consiste à collecter les métriques de performance auprès des utilisateurs réels pour générer des rapports au sein de tableaux de bord. L’outil de RUM le plus populaire est le CrUX, basé sur les données des utilisateurs du navigateur Google Chrome. Mais il existe des dizaines d’outils payants qui collectent les données via des tags JavaScript, dont les APM historiques.
S
SEO
Acronyme de « Search Engine Optimization », le terme désigne la discipline visant à améliorer la visibilité d’un site dans les moteurs de recherche. Historiquement très centré sur les positions dans les pages de résultats de recherche, le SEO s’est complexifié au fil des évolutions de l’algorithme de Google. Synonyme : référencement naturel.
Serveur web
Ordinateur sur lequel sont hébergées les données d’un site web, et accessible à tous via une connexion Internet. Des logiciels spécifiques assurent son fonctionnement : Apache, Nginx ou LiteSpeed pour servir les fichiers, MySQL pour gérer les bases de données, PHP pour exécuter les scripts… Son propriétaire peut, lui, s’y connecter en FTP ou SSL pour en assurer la gestion. Pour plus d’informations, consultez notre article sur les hébergements web performants.
SPA
Acronyme de « Single Page App », désigne un type de site web conçu en JavaScript comme une application mobile. Les composants affichés sur la page courante sont mis à jour dynamiquement via des appels en Ajax en fonction des interactions de l’utilisateur.
Speed Index
Indicateur de performance synthétique qui mesure la durée nécessaire à l’affichage des éléments au sein du viewport. L’information étant visuelle et non technique, les outils d’analyse se reposent sur des enregistrements vidéo. En raison de sa complexité, les notations varient selon l’outil utilisé.
Stack
Une stack désigne un ensemble de technologies complémentaires qui permettent de faire fonctionner une application web. On distingue généralement la stack front-end (frameworks, outils et langages…) de la stack back-end (serveur web, outils de SSR…).
SVG
Format d’image vectoriel particulièrement adapté pour les logos, icônes et pictogrammes. Il s’affiche de façon nette quelle que soit la densité de pixels des écrans.
Synchrone
Le chargement synchrone d’une ressource s’exécute dès son appel en interrompant le rendu de la page par le navigateur.
T
TBT
Acronyme de « Total Blocking Time », cette métrique de performance mesure la somme des périodes de Blocking Time qui interviennent au chargement d’une page web. Elle est souvent utilisée comme alternative au FID, qui n’est disponible que via les données terrain.
Template
Un template est un ensemble de fichiers html destinés à gérer la mise en page d’un site web. Certaines parties sont communes à l’ensemble d’un site (en-tête, menus, footer…) alors que d’autre sont spécifiques à chaque typologie de page : page d’accueil, archives de contenus, articles, fiches produits, page de contact…
TCP
Acronyme de « Transmission Control Protocol », désigne le protocole d’échange de données à la base du fonctionnement d’Internet. C’est lui qui permet aux navigateurs web de télécharger les ressources d’un serveur lorsque vous consultez une page web. Il se repose pour cela sur les adresses IP.
TLS
Acronyme de « Transport Layer Security », ce protocole est chargé d’assurer les échanges sécurisés entre un navigateur et un serveur. Il sécurise les pages en « https » en vérifiant l’authenticité du certificat numérique fourni par le serveur.
TTFB
Acronyme de « Time To First Byte », cet indicateur de performance mesure le temps nécessaire à un serveur pour répondre à la première requête du navigateur. Il dépend de la configuration du serveur, de la présence ou non de cache mais aussi de la connexion du visiteur (débit, latence).
Tofu
En typographie, désigne un caractère qui ne peut pas être affiché car le glyphe utilisé n’est pas disponible dans le fichier de fonte, conduisant à un rendu de type □ ou ☒. La dénomination « Tofu » est utilisée car ce carré ressemble à un bloc de tofu (le fromage de soja asiatique).
U
UI
Acronyme de « User Interface », que l’on traduit par « Interface Utilisateur » en français. Désigne l’ensemble des éléments graphiques d’une page web. La structure, la typographie, les images ou encore les couleurs constituent ainsi des éléments de l’UI.
UX
Acronyme de « User eXperience », que l’on traduit par « Expérience Utilisateur » en français. Désigne la façon dont un utilisateur interagit avec une page web. Une UX de qualité passe par des choix pertinents en matière d’ergonomie, d’accessibilité et de respect des conventions et bonnes pratiques.
V
Viewport
Zone de la page courante visible dans un navigateur web. Au chargement, le viewport correspond à la zone située au-dessus de la ligne de flottaison.
VOC
Acronyme de « Voice Of Customer », qui se traduit en français par « voix du client ». Il s’agit d’une famille d’outils qui visent à recueillir les avis des utilisateurs d’un site et à anticiper leurs éventuelles frustrations. Ils se matérialisent généralement par la présence d’un bouton affiché en position fixe et donnant accès à une fenêtre de conversation. Par extension, on a tendance à y inclure les Chatbot et robots conversationnels.
VPS
Acronyme de « Virtual Private Server », qui se traduit en français par « serveur privé virtuel ». C’est un type d’hébergement entre le serveur mutualisé, peu performant, et le serveur dédié, très performant mais aussi très coûteux. Un VPS offre un compromis intéressant entre performance, coût, sécurité et évolutivité : comme il ne s’agit pas d’une machine physique, on peut en réaliser des sauvegardes instantanées ou encore faire évoluer la configuration à la volée.
W
W3C
Le W3C, ou « World Wide Web Consortium », est l’organisme international chargé d’encadrer les technologies propres au web. Il est à l’origine des standards HTML, XML, CSS ou encore SVG qu’il fait régulièrement évoluer.
WCAG
Acronyme de « Web Content Accessibility Guidelines », ces directives vient à définir les critères d’accessibilité d’un site web aux personnes handicapées et aux séniors. Elles sont définies par le W3C.
Webfont
Police d’écriture téléchargée par une page web pour en afficher tout ou partie des textes. La bonne pratique est de la proposer en Woff2, le format le plus léger, avec un fallback en Woff. On recommande également la mise en place d’un font-display Swap afin de permettre un affichage des textes avant le téléchargement de la webfont. Pour plus d’informations, consultez notre article sur l’optimisation des polices d’écriture web.
Web performance
Discipline technique visant à assurer un affichage rapide et une bonne fluidité des page web dans les navigateurs, durant leur chargement et tout au long de leur utilisation. Pour une définition complète, consultez notre article « Qu’est-ce que la web performance ? ».
