[WordPress] Utiliser le préchargement HTML5 pour une navigation plus fluide

 

L’internaute moyen est de moins en moins patient. Il veut des sites performants qui se chargent presque instantanément.

HTML5 apporte une fonctionnalité intéressante appelée « Préfetching », qui permet de charger des pages entières avant même que l’internaute ai cliqué sur le lien. Le chargement devient alors immédiat, ce qui apporte une expérience utilisateur incomparable. Pour en savoir plus lisez cet article.

Voici un petit truc simple mais efficace qui permettra à votre blog WordPress de charger les pages suivantes et précédentes en un clin d’oeil (avec les navigateurs compatibles) :

<?php if (is_archive() && ($paged > 1) && ($paged < $wp_query->max_num_pages)) { ?>
<link rel="prefetch" href="<?php echo get_next_posts_page_link(); ?>">
<link rel="prerender" href="<?php echo get_next_posts_page_link(); ?>">
<?php } ?>

Il vous suffit d’ajouter ce code dans le header de votre thème. Bien entendu vous pouvez l’adapter à vos besoins (si vous utilisez une pagination par exemple) mais faites le avec parcimonie, car le prefetching n’est pas gratuit (en bande passante).

via