HTML5 Prefetch

·

Hace un tiempo, cuando comencé a hablar del HTML 5, hice una breve referencia a los distinto «rel-algo» que podemos encontrar en la nueva codificación. Entre estos hay uno que puede ser muy interesante si sabes cómo navegan los usuarios de tu sitio web y, aun no sabiéndolo, crees que puedes acelerar la velocidad de carga de la misma.

El link prefetching básicamente lo que permite es descargar las URL indicadas antes de que se vayan a visitar… y el HTML 5 incluye un sistema para avisarlo, ya de forma estándar (hasta ahora sólo Firefox le daba soporte).

El sistema es tan sencillo como poner en el <head> algo como:

<link rel="prefetch" href="http://sitio.web/url-siguiente/">

o algo como:

<link rel="prefetch" href="http://sitio.web/imagen-siguiente.png">

Otra posibilidad es la de acelerar la carga pero en URL concretas que se vayan cargando dentro del sitio… de forma que cualquier enlace interno quedaría de la siguiente forma:

<a rel="prefetch" href="http://sitio.web/url-siguiente/">

Un ejemplo de uso interesante es el que hace Yahoo! con su página principal. Cuando se carga, a priori no hace nada, pero una vez escribes la primera letra en el cajetín de búsqueda, comienza un proceso para precargar imágenes y CSS de la página de resultados de búsqueda, ya que se plantea que va a ser la siguiente en visitarse.

Comments

2 respuestas a «HTML5 Prefetch»

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *