Avez-vous déjà commencé à lire un article d’actualité passionnant, puis perdu votre ligne parce que tout le texte s’est déplacé vers le bas ? Cela m’arrive souvent, surtout à cause des publicités qui se chargent au-dessus du contenu.
Ce type d’expérience utilisateur peut être frustrant, mais jusqu’à présent, nous avons eu du mal à la mesurer quantitativement. Le Cumulative Layout Shift relève ce défi.

Intégrer des librairies ou services existants de parties tierces permet de gagner en productivité, mais a souvent un coût sur la performance ressentie. Dès lors que vous intégrez du code externe, comment vous assurer que ce code ne viendra pas nuire au rendu et à l’interactivité de votre site ? Explications et propositions pour un code tiers plus performant.

Pour charger une page web complète, il faut un ensemble de ressources qui, collectivement, permettent l’affichage et l’interaction avec la page. Pour que l’utilisateur ait une impression de vitesse, il peut être nécessaire d’influencer l’ordre de récupération et d’exécution de ces ressources. C’est là que preload et les Resource Hints entrent en jeu.

Comment mesurer correctement la vitesse à laquelle une page Web commence à afficher son contenu ? Plusieurs indicateurs de performance Web existent pour répondre à cette question, dont le First Paint, le Start Render et, plus récemment, le First Contentful Paint (FCP). Comment le FCP se démarque-t-il, quelles sont ses limites ? Découvrons ensemble les mesures du début d’affichage des pages Web par le navigateur.

L’objectif de la mesure de la Performance Web est de déterminer le moment à partir duquel une personne visitant la page peut accomplir son objectif efficacement. Cela implique qu’elle puisse consulter le contenu qu’elle cherchait et qu’elle soit en mesure d’interagir avec la page de manière satisfaisante. Certains indicateurs mesurent les étapes du rendu par le navigateur, d’autre la progression de ce rendu par le biais de vidéos. Mais quand il s’agit de mesurer efficacement l’interactivité, le mystère reste entier.

Depuis quelques années maintenant, Google met en avant un indicateur ambigu : le Time To Interactive. De quoi s’agit-il ? C’est ce que nous allons définir, avant d’expliquer comment et quand l’utiliser (ou non).

Les images sont au cœur de votre site web ? Si vous prenez la performance de votre site au sérieux, vous les avez probablement optimisées. Mais avez-vous pensé à les charger en Lazy Load ? Le Lazy Load des images améliore l’expérience utilisateur en libérant de la bande passante pour le contenu important.

Certains rejettent la technique pour des questions de SEO. Mais un Lazy Load de vos images ne les empêche pas d’être indexées. Voyons pourquoi vous devriez implémenter un Lazy Load d’images et comment vous assurer qu’il soit compatible avec votre SEO.

Améliorer la vitesse à laquelle une page Web est affichée implique souvent de rendre la vie du navigateur aussi facile que possible. Lorsque le navigateur reçoit une réponse HTTP, il reçoit en fait du texte encodé en octets, où chaque octet ou séquence d’octets représente un caractère donné. Si le navigateur ne sait pas clairement quel encodage utiliser, il perdra du temps à essayer de le deviner et sera susceptible d’échouer dans certains cas.

Continuer la lecture de Content Encoding: pourquoi utiliser la balise meta charset et l’en-tête Content-Type →

Cet article est une transcription de ma conférence sur les Budgets de Performance tenue lors de l’événement We Love Speed (Bordeaux le 9 octobre 2018). Continuer la lecture de Budgets de performance – We Love Speed 2018 →

L’utilisation d’un tag manager n’est pas sans effet sur la vitesse de chargement de vos pages web. Dans un précédent article, nous avons démontré que cet impact ne se limite pas au chargement asynchrone des scripts qui sont embarqués par cet outil de gestion des balises. Et que les risques de voir le tag manager devenir une source de problèmes – sérieux – pour la performance de votre site web existent bel et bien. Il est donc temps maintenant d’explorer quelques pistes pour gérer au mieux cet outil afin qu’il remplisse ses objectifs marketing sans mettre trop lourdement en péril la vitesse de vos pages. Avec notamment d’intéressantes réflexions délivrées par le Digital Ad Tech Manager de L’Oréal et plusieurs consultants spécialistes du sujet. Continuer la lecture de Tag manager & performance web chapitre 2 : une question de rigueur (et de coopération) →

Quels sont, parmi les nombreux conseils délivrés nos rapports d’analyse, ceux qui interpellent le plus celles et ceux qui ont testé leurs pages web ? Nous avons examiné les résultats de plus de 270.000 audits sur Dareboost et la manière dont les rapports générés par notre outil ont été consultés. Pour en ressortir un focus sur les bonnes pratiques les plus “cliquées” du moment. Continuer la lecture de Optimisation de vos pages web : le Top 2018 des conseils Dareboost →

Bien que nous soyons des spécialistes de la performance Web, cela ne nous donne aucun super-pouvoir. Nous avons, nous aussi, besoin d’outils pour analyser nos sites et applications. Alors quand nous avons finalisé notre nouvelle fonctionnalité de Custom Timings, nous nous sommes bien sûr empressés de la tester sur Dareboost.com… Pour y trouver un intérêt immédiat. Continuer la lecture de [Use Case] Quand Dareboost utilise les Custom Timings pour son propre site web →

L’utilisation d’un système de Tag Management – comme Google Tag Manager ou TagCommander – pour gérer des fonctionnalités/scripts externes présents sur vos pages web revêt de multiples intérêts, notamment pour les services marketing. Côté performance web, l’impact de ces outils n’est pas neutre. Explications. Continuer la lecture de Tag managers : quelle incidence sur la performance web ? →

Peut-être avez-vous vu ce conseil chez Dareboost vous encourageant à mettre en place une politique de sécurité sur la provenance de vos ressources. Mais peut-être n’avez-vous pas encore franchi le cap. Pour vous aider à sauter le pas, je vous propose quelques conseils sur son déploiement, tirés de mon expérience.

Continuer la lecture de Déployer CSP : une approche en 5 étapes →

Vous en avez peut-être rêvé : pouvoir mesurer exactement à quel instant une image s’affiche ou à quel moment un script en particulier s’exécute, et suivre cette mesure avec vos outils favoris. C’est possible, grâce à l’API User Timing, en positionnant des marqueurs partout où vous en avez besoin sur vos pages web ! Une fonctionnalité supportée par tous les navigateurs récents, et que Dareboost vous permettra bientôt d’exploiter à une tout autre échelle. Continuer la lecture de API User Timing : la mesure de la performance plus pertinente que jamais avec les Custom Timings →

Générateurs de sites statiques, CMS « headless », plateformes d’intégration continue et de déploiement… depuis plusieurs années, une nouvelle gamme de solutions émerge dans le paysage des technologies web. Ces solutions contribuent à une tendance globale qui ressemble à un retour aux sources du Web. On parle de « La mouvance statique » ou de la « JAMStack » mais aucun de ces noms ne caractérise vraiment ce qui n’est pas moins qu’une nouvelle façon d’architecturer des applications web.

Continuer la lecture de Meilleure UX et performances : JAMStack, la nouvelle donne du web statique →

C’est un credo chez Dareboost : pour rendre compte de la performance globale de vos pages web, il est nécessaire de s’appuyer sur plusieurs indicateurs. Toutefois, certains se montrent plus synthétiques et révélateurs que d’autres. Et à ce jour, nous considérons le Speed Index comme l’un des indicateurs les plus importants à analyser. Revenons sur les raisons qui font du Speed Index une mesure essentielle : que retranscrit cet indice ? Comment le calcule-t-on ? Comment interpréter correctement les valeurs obtenues ? Continuer la lecture de Speed Index : tout savoir sur cet indicateur majeur de la performance web →

Le format MP4 représente plus de 75 % des vidéos diffusées sur Internet aujourd’hui. Cependant, il est souvent mal utilisé, ce qui peut dégrader l’expérience utilisateur. Voyons ensemble comment améliorer ça. Continuer la lecture de Vidéo : optimisez vos MP4 pour de meilleures performances →

Les artistes ne sont pas les seul·e·s à redouter les pages blanches, les internautes aussi. Leur frustration peut les pousser à abandonner votre site plus tôt qu’ils ou elles ne l’auraient voulu. Pour éviter ça, plusieurs techniques d’optimisation du rendu existent. Comme différer l’analyse et l’exécution des fichiers JavaScript. Continuer la lecture de Différer les scripts pour accélérer le rendu →

La vitesse de chargement est un critère essentiel au succès global de tout site web. À ce titre, le sujet concerne tous ses acteurs et a fortiori vous qui êtes en charge du webmarketing. Dans le 2e volet de ce billet, voilà 3 nouveaux arguments démontrant ce que Dareboost peut vous apporter sur la question. Continuer la lecture de Webmarketing & vitesse de chargement : (re)prenez le contrôle avec Dareboost →

Trop souvent le temps de chargement est source de discussions et de débats entre clients et prestataires, entre décideurs et équipes techniques.
S’il ne fait aucun doute de la nécessité de faire de la vitesse de chargement un sujet stratégique et d’y impliquer tous les acteurs de la chaîne de valeur d’un projet web, il est absolument nécessaire de choisir des indicateurs pertinents et stables. On ne peut améliorer que ce que l’on mesure, et cette mesure doit être fiable. Continuer la lecture de Le temps de chargement est mort ! →

« Réduisez le poids de la page » : voici l’un des conseils les plus couramment délivrés dans les rapports Dareboost. Selon les tendances mesurées par HTTP Archive, les images représentent 53 % du poids moyen des pages web, qu’elles soient consultées sur ordinateurs de bureau ou périphériques mobiles. Lorsque vous cherchez à réduire le poids de votre page Web, l’optimisation des images remonte donc logiquement dans le top de vos priorités.

Continuer la lecture de Optimiser les images et réduire leur poids : formats, outils et RWD →

La vitesse de chargement est un critère essentiel au succès global de tout site web. Le sujet concerne tous ses acteurs et a fortiori vous qui êtes en charge du webmarketing. En quoi la solution Dareboost peut-elle vous aider dans votre quête de meilleurs résultats ? Réponse en six points essentiels et en deux épisodes. Voici le premier.

Continuer la lecture de Webmarketing : (re)prendre le contrôle sur la vitesse de votre site web avec Dareboost →

Si vous fréquentez notre blog, il ne vous aura pas échappé qu’il est urgent de passer au HTTPS. L’échéance est d’autant plus forte que les géants du Web ont déjà tiré leurs coups de semonce en affichant des alertes sur certaines pages en HTTP dans Google Chrome et Mozilla Firefox. Bientôt, ce seront tous les formulaires qui seront concernés.

Cela étant dit, avoir un site accessible en HTTPS ne suffit pas à basculer l’ensemble de son trafic automatiquement vers cette nouvelle version. Continuer la lecture de Fiabiliser les connexions sécurisées avec HSTS (HTTP Strict Transport Security) →

Après avoir lu notre précédent billet dédié à la sécurisation des cookies, vous utilisez peut-être déjà les instructions Secure et HttpOnly. Pour rappel, la première permet d’empêcher l’envoi d’un cookie sur une page non sécurisée (http simple) alors que la seconde empêche l’utilisation du cookie côté client (eg: Javascript).
Passons maintenant à l’étape supérieure de la sécurisation de vos cookies avec une nouvelle instruction : SameSite, qui permet de mitiger les risques liés aux attaques de type CSRF (Cross-Site Request Forgery) et XSSI (Cross-Site Script Inclusion). Continuer la lecture de Sécurisation des cookies : passez au niveau supérieur avec l’attribut SameSite →

Il y a un an presque jour pour jour, nous annoncions une mise à jour du référentiel de bonnes pratiques de notre service d’analyse de sites web. Cette mise à jour intégrait un point de contrôle sur les attributs des liens hypertextes visant à provoquer l’ouverture du lien dans une nouvelle fenêtre ou onglet (target="_blank").

La dernière version de Firefox a désormais rejoint Google Chrome en supportant l’attribut rel="noopener", l’une des solutions que nous fournissions. Prenons donc le temps de revenir sur cette recommandation, que nous avons apportée pour des objectifs de sécurité mais qui répond également à des enjeux de performance. Continuer la lecture de Sécurité et performance de vos liens target=_blank avec rel=noopener →