¿Te ha gustado el artículo?
1
¿Te ha gustado el artículo?
1

Aspectos fundamentales de optimización de páginas web

Una de las principales tareas de los gestores de páginas web es hacer que la experiencia de los visitantes sea lo más agradable posible, algo que comienza con solo abrir una página. Unos tiempos de carga prolongados hacen que muchos de los usuarios pierdan su interés, un tema que, junto al tráfico móvil en aumento, va ganando en importancia. Si observas con atención el rendimiento de tu página web y haces mejoras regularmente, pronto adviertes que los visitantes pasan más tiempo en ella y no desaparecen tras la visita de una sola página, sino que examinan otras. El efecto positivo que se deduce de ello es que la imagen de la página web se verá favorecida en los buscadores, consiguiendo un mejor posicionamiento.

Hoy en día hay herramientas gratuitas para comprobar la velocidad de las páginas web, como, por ejemplo Google PageSpeed Insights, con las cuales es posible medir y evaluar el rendimiento de las mismas a la luz de aspectos independientes de la red, como los contenidos procedentes de los medios o la estructura del código HTML. La herramienta de Google analiza tanto la versión de escritorio como las variantes móviles de las páginas web e incluso propone mejoras.

¿Cuáles son los aspectos que influyen en la velocidad de carga? A continuación te informamos sobre los factores que la entorpecen y te ofrecemos posibles soluciones al respecto.

Alojamiento

La primera pregunta que hay que hacerse es: ¿es suficiente el alojamiento actual para las exigencias del proyecto? A menudo se prefiere ahorrar precisamente en lo que concierne al rendimiento y a las capacidades del servidor y se opta por la oferta más asequible. Como consecuencia, en el momento decisivo, no se dispone del ancho de banda necesario para poder hacer frente a las solicitudes de todos los usuarios. Las soluciones más económicas de alojamiento, en las que varios proyectos comparten el servidor, no pueden hacer frente a los picos repentinos de visitas ni a un crecimiento pronunciado. Otro de los errores más comunes es alojar la propia página web en un servidor situado en el extranjero, a pesar de que la oferta esté limitada, en primer lugar, al mercado nacional. De esta manera también aumenta el tiempo de carga para los visitantes. 

¿Qué puedes hacer?

  • Recurrir a soluciones de alojamiento flexibles con espacio web y tráfico no restringidos
  • Alquilar servidores que solo se encuentren en el centro de datos del país de la mayoría de los usuarios
  • Hacerte cargo del alojamiento por cuenta propia y adaptarlo a tu proyecto

HTML, CSS y JavaScript

Cuando un usuario visita una página web, el navegador solicita el archivo HTML correspondiente alojado en el servidor y la presenta en función de los formatos de CSS que contiene. Lo mismo sucede con elementos JavaScript, como los banners o los marcadores. Cuanto mayor sea el tamaño de los archivos o cuanto más grande sea la cantidad de código que se tiene que leer o convertir, más largo será el proceso. No obstante, las hojas de diseño y los scripts son elementos fundamentales de las páginas web dinámicas, por lo que renunciar a las hojas de estilo CSS y a JavaScript para mejorar la velocidad de la página web no es una opción. Se trata, más bien, de optimizar el código.

¿Cómo se puede proceder?

  • Utilizando HTML solo para los datos que no sean compatibles con CSS
  • Recurriendo a archivos separados para CSS y JavaScript y escribiendo código CSS o JavaScript en la página HTML en casos excepcionales (JavaScript siempre se sitúa al final del documento, antes del elemento body)
  • Agrupar y comprimir archivos de código (para obtener más información, lee la siguiente guía

Imágenes y contenidos externos

Los contenidos multimedia son una parte importante de toda página web de calidad. Al igual que el diseño y la maquetación, estos contenidos resaltan los aspectos más característicos de la página web y se prestan a reflejarlos. En el ámbito del eCommerce, es necesario invertir para presentar productos con imágenes de gran calidad. Cada vez que se integra una imagen, sin embargo, aumenta el tiempo de carga de la página web, en especial cuando esta no está alojada en un servidor propio, sino en uno ajeno. Esto se aplica también a otros archivos, como pueden ser música, vídeos o PDF.

¿Qué medidas puedes adoptar?

  • Cargar la menor cantidad posible de elementos procedentes de páginas externas
  • Evitar imágenes, vídeos, etc., innecesarios
  • No almacenar imágenes en un servidor externo
  • Facilitar los datos sobre la anchura y la altura de las imágenes (si no, las calcula el navegador)
  • Utilizar iconos en formato SVG (gráficos vectoriales escalables)
  • Retrasar la carga de las fotos fuera del sector de visión con ayuda del plugin de jQery-Plug Lazy Load (http://www.appelsiini.net/projects/lazyload), que se cargarán cuando el visitante se vaya desplazando por la página.

Caching

Uno de los problemas de muchas páginas web que funcionan con lentitud es que renuncian a adoptar mecanismos de almacenamiento en caché. Una memoria temporal correctamente configurada contribuye de gran manera a la optimización de páginas web sin mucho esfuerzo, ya que el servidor web no tiene que solicitar al servidor los contenidos cada vez que se accede a una página web, sino, almacenados de forma intermedia, se cargan con mayor rapidez. Además, esto también exime a dicho servidor web de una mayor carga de trabajo debido, consecuentemente, a que este tiene que procesar menos solicitudes. Así, todos los elementos estáticos como los archivos JavaScript o CSS, las imágenes y los documentos pueden guardarse en el caché durante el período de tiempo  que se haya definido.

¿Qué pasos puedes seguir?

  • Usar el navegador del usuario como caché (caché del navegador): en un servidor web Apache, por ejemplo, se puede activar el módulo “mod_expires” para definir durante cuánto tiempo han de permanecer los datos en el caché. El navegador del usuario se encarga del resto del proceso
  • Configurar un servidor proxy inverso y utilizarlo como caché (caché web) o recurrir a los servicios de una Content Delivery Network, para acceder a una red de servidores proxy inversos distribuidos por todo el mundo
  • Utilizar un software de caché como memcached para depositar contenidos dinámicos de forma temporal en la memoria de trabajo y minimizar, así, el acceso a la base de datos

Otros consejos y trucos para optimizar páginas web

Aparte de estos importantes pasos para la optimización de páginas web, también hay muchas otras medidas que pueden ser de utilidad para reducir los tiempos de carga. Entre ellos destacan:

  • Reducir las redirecciones al mínimo
  • Determinar la codificación de caracteres en documentos HTML
  • Eliminar los contenidos erróneos con regularidad
  • Evitar la utilización excesiva de plugins en el CMS
  • Limitar la información almacenada en las cookies
  • Usar iconos de página (favicons), porque los navegadores siempre buscan el archivo favicon.ico en el servidor web

Si hasta ahora has preferido no adoptar medidas para mejorar la velocidad de tu página web, ahora es el momento para hacerlo. En 2015, la empresa israelí de tecnología Radware publicó, una infografía a propósito de la velocidad de las páginas web en el ámbito del eCommerce, con sorprendentes resultados sobre los 100 proveedores de soluciones de eCommerce más importantes. Alrededor de un 50 por cierto de todas las páginas web de las tiendas renuncian a comprimir las imágenes incluidas en ellas, mientras que apenas una docena de los representantes muestran un tiempo de carga inferior a tres segundos, periodo usualmente considerado como el máximo que está dispuesto a esperar un usuario medio.

Si lo que persigues es que tanto tus clientes potenciales como los interesados permanezcan en tu página web, debes actuar a tiempo para poder optimizar tu página y para poderla adaptar a la era móvil.

JavaScript CSS HTML Herramientas Imágenes Tiempo de Carga