Restez organisé à l'aide des collections Enregistrez et classez les contenus selon vos préférences.
Corriger le contenu au chargement différé
Le report du chargement de contenu non critique ou non visible au premier abord, également appelé "chargement différé", est une technique courante destinée à optimiser l'expérience utilisateur. Pour en savoir plus, consultez les ressources de web.dev sur le chargement différé des images et des vidéos. Toutefois, si cette technique est mal appliquée, elle risque d'empêcher indirectement Google de voir un contenu. Cet article explique comment s'assurer que Google peut explorer et indexer le contenu au chargement différé.
Charger le contenu lorsqu'il est visible dans la fenêtre d'affichage
Pour être sûr que Google voit tout le contenu de votre page, vérifiez que la mise en place du chargement différé entraîne bien le chargement de l'ensemble du contenu pertinent chaque fois qu'il est visible dans la fenêtre d'affichage. Voici quelques méthodes pour implémenter le chargement différé:
Ces méthodes ne reposent pas sur des actions de l'utilisateur, comme le défilement ou le clic, pour charger le contenu. C'est important, car la recherche Google n'interagit pas avec votre page.
N'ajoutez pas de chargement différé à du contenu qui est susceptible d'être immédiatement visible lorsqu'un utilisateur ouvre une page. Le chargement et l'affichage du contenu dans le navigateur pourraient prendre plus de temps, ce que l'utilisateur remarquerait immanquablement.
Assurez-vous de tester votre implémentation.
De manière générale, le défilement infini est une technique qui permet de charger plus de contenu et plus de pages distinctes à mesure que l'utilisateur fait défiler une longue page. Il peut s'agir d'un long article divisé en plusieurs segments ou d'une collection d'éléments également divisés en segments. Pour implémenter le défilement infini de manière indexable, assurez-vous que votre site Web prend en charge le chargement paginé de ces segments en procédant comme suit :
- Attribuez à chaque segment sa propre URL persistante et unique.
- Assurez-vous que le contenu affiché sur chaque URL reste le même chaque fois qu'il est chargé dans un navigateur. Pour ce faire, vous pouvez utiliser des numéros de page absolus dans l'URL, par exemple en utilisant
?page=12 comme paramètre de requête. - Évitez d'utiliser des éléments relatifs tels que
?date=yesterday dans ces URL. Cela permet aux moteurs de recherche et aux utilisateurs de trouver systématiquement le même contenu sous une URL donnée, ce qui facilite l'indexation correcte du contenu par les moteurs de recherche et permet aux utilisateurs de réinteragir avec cette partie de votre contenu et de le partager. - Créez des liens séquentiels vers les URL individuelles afin que les moteurs de recherche puissent découvrir les URL d'un ensemble paginé. Découvrez les bonnes pratiques à suivre lors de l'implémentation de la pagination.
- Lorsqu'un nouveau segment de page est chargé en réponse au défilement de l'utilisateur et qu'il devient l'élément visible principal pour celui-ci, mettez à jour l'URL affichée à l'aide de l'API History. Cela permet à l'utilisateur de créer un lien vers l'URL actuelle affichée dans le navigateur, de l'actualiser et de la partager.
Tester
Une fois que vous avez configuré le chargement paginé, assurez-vous qu'il fonctionne correctement. Vous pouvez utiliser l'outil d'inspection d'URL de la Search Console pour déterminer si tout le contenu a été chargé. Vérifiez le code HTML affiché pour vous assurer que votre contenu s'y trouve en le recherchant dans l'outil d'inspection d'URL. Si les URL de vos images ou vidéos apparaissent dans l'attribut src des éléments <img> ou <video> dans le code HTML affiché, votre configuration fonctionne correctement.
Sauf indication contraire, le contenu de cette page est régi par une licence Creative Commons Attribution 4.0, et les échantillons de code sont régis par une licence Apache 2.0. Pour en savoir plus, consultez les Règles du site Google Developers. Java est une marque déposée d'Oracle et/ou de ses sociétés affiliées.
Dernière mise à jour le 2025/08/04 (UTC).
[null,null,["Dernière mise à jour le 2025/08/04 (UTC)."],[[["\u003cp\u003eEnsure lazy-loaded content is loaded when visible in the viewport, using methods like browser-level lazy-loading or the IntersectionObserver API, so Google can see all content.\u003c/p\u003e\n"],["\u003cp\u003eSupport paginated loading for infinite scroll by giving each content chunk a unique URL, using absolute page numbers, linking sequentially, and updating the URL with the History API.\u003c/p\u003e\n"],["\u003cp\u003eTest your implementation using the URL Inspection Tool in Search Console to verify all content is loaded and appears in the rendered HTML.\u003c/p\u003e\n"]]],["Lazy-loading should load content when visible in the viewport using methods like browser built-in loading, IntersectionObserver API, or JavaScript libraries, avoiding reliance on user actions. For infinite scroll, each content chunk needs a unique, persistent URL (e.g., `?page=12`), and avoid relative elements, also link sequentially to these URL. Update the URL with the History API. Finally, verify implementation with the URL Inspection Tool in Search Console to check if content is present in rendered HTML.\n"],null,["# Fix Lazy-Loaded Website Content | Google Search Central\n\nFix lazy-loaded content\n=======================\n\n\nDeferring loading of non-critical or non-visible content, also commonly known as \"lazy-loading\", is a common performance and UX best practice. For more information, see [web.dev's resources on lazy-loading images and video](https://web.dev/fast#lazy-load-images-and-video).\nHowever, if not implemented correctly, this technique can inadvertently hide content from Google. This document explains how to make sure Google can crawl and index lazy-loaded content.\n\nLoad content when it's visible in the viewport\n----------------------------------------------\n\nTo ensure that Google sees all content on your page, make sure that your lazy-loading implementation loads all relevant content whenever it is visible in the viewport. Here are a few methods to implement lazy-loading:\n\n- [Browser built-in lazy-loading](https://web.dev/articles/browser-level-image-lazy-loading) for images and iframes\n- [IntersectionObserver API](https://web.dev/articles/intersectionobserver) and [a polyfill](https://github.com/GoogleChromeLabs/intersection-observer)\n- A JavaScript library that supports loading data when it enters the viewport\n\nThe methods mentioned don't rely on user actions, such as scrolling or clicking, to load content, which is important as Google Search does not interact with your page.\n\nDon't add lazy-loading to content that is likely to be immediately visible when a user opens a page. That might cause content to take longer to load and show up in the browser, which will be very noticeable to the user.\n\nMake sure to [test your implementation](#test).\n\nSupport paginated loading for infinite scroll\n---------------------------------------------\n\n\nAt a high level, infinite scroll is a technique that loads more content, more distinct pages,\nas the user scrolls down a long page. This could be one long article that's split into multiple\nchunks, or a collection of items that's similarly split into chunks. To implement infinite scroll\nin an indexable way, make sure your website supports paginated loading of these chunks by doing\nthe following:\n\n- Give each chunk its own persistent, unique URL.\n- Ensure that the content shown on each URL remains the same every time it's loaded in a browser. One way this can be done is to use absolute page numbers in the URL, for example by using `?page=12` as a query parameter.\n- Avoid using relative elements like `?date=yesterday` in these URLs. This allows search engines and users to consistently find the same content under a given URL, making it easier for search engines to properly index the content, and allowing users to share and reengage with that part of your content.\n- Link sequentially to the individual URLs so that search engines can discover the URLs in a paginated set. Find out more about [best\n practices when implementing pagination](/search/docs/specialty/ecommerce/pagination-and-incremental-page-loading#best-practices-when-implementing-pagination).\n- When a new page chunk is loaded in response to the user scrolling, and it becomes the primary visible element for the user, update the displayed URL using the [History API](https://developer.mozilla.org/en-US/docs/Web/API/History_API). This allows the user to refresh, share, and link to the current URL displayed in the browser.\n\nTest\n----\n\n\nAfter you set up your implementation, make sure it works correctly.\nYou can use the [URL Inspection Tool](https://support.google.com/webmasters/answer/9012289) in Search Console to see if all content was loaded.\nCheck the rendered HTML to make sure your content is in the rendered HTML by looking for it in URL Inspection Tool. If your image or video URLs appear in the `src` attribute on the `\u003cimg\u003e` or `\u003cvideo\u003e` elements in the rendered HTML, your setup works correctly."]]
