Mejorar el tiempo de carga de una web

De wikipedia_IndianWebs
Saltar a: navegación, buscar

Velocidad-1.jpg


La velocidad de carga de una web es un factor muy importante, que afecta al posicionamiento de una web y a la experiencia de usuario al navegar por ella, una web lenta puede hacer que se pierdan visitantes la o ventas por este motivo.

Para poder hacer un análisis exhaustivo de la velocidad de carga de una web i poder hacer un seguimiento de la mejora después de su optimización, os recomiendo la herramienta online gtmetrix.com. Esta herramienta unifica dos de los mejores analizadores de la carga de una web: page speed de Google y YSlow. Esta herramienta nos muestra una puntuación de ambos analizadores, nos dice en que puntos hay que mejorar la web y consejos de cómo hacerlo. Además nos permite guardar un historial (hasta 5 webs con la cuenta free) para poder medir la optimización que hacemos de la web. También nos permite generar informes en PDF de los resultados.

Estos son algunos de los puntos a tener en cuenta para optimizar la velocidad de carga de una web:


Factores que afectan a la velocidad de carga

  • Programación de la página web. Es la base de todo buen proyecto web. La programación y diseño debe comenzar sobre el papel. Antes de comenzar a programar hay que estructurar secciones, establecer taxonomías y pensar cuál va a ser la estrategia SEO a seguir. Hay que optimizar el tamaño de las imágenes, incluir el menor número posible de ficheros Javascript y CSS, realizar el mínimo posible de consultas a la base datos, tratar de validar el código HTML y CSS… Además, hay que tratar que la web no sea muy pesada y, en la medida de lo posible, que se adapte a las pantallas de diferentes dispositivos móviles (smartphones, tablets…). En defnitiva, se trata de mejorar el lenguaje de programación y la arquitectura de la página con el fin de que los buscadores puedan rastrearla e indexar de una forma más eficiente.


  • Servidor (hosting). Si la programación de un sitio web es importante, el servidor no es menos. Debemos tener en cuenta cuál es su ubicación (IP), el tiempo de respuesta, su latencia, el espacio y la velocidad del disco duro, el sistema operativo empleado, el número y potencia de los procesadores, la cantidad de memoria RAM… Aunque siempre dependerá del volumen de visitas recibidas, es recomendable apostar por la calidad de los servicios.


  • Conexión a internet. Este es un factor externo sobre el que no podemos interferir. Sin embargo, como es lógico, cuanto más lenta sea la conexión a la red de un usuario, más tiempo llevará la carga de una página web.


¿Cómo mejorar la velocidad de carga?

Una vez hemos analizado y detectado dónde flaquea la velocidad de carga de nuestra web, además de conocer de qué factores depende su mejora, el siguiente paso consiste en realizar dos tareas: optimizar la web y optimizar el servidor.

  • Usar un sistema de caché. Básico, es la primera medida que todo webmaster debería efectuar. El caché evita que se tenga que descargar de nuevo una página. El resultado es una mayor velocidad de carga y un menor consumo de recursos del servidor.
  • Optimizar imágenes. Esta es la tarea más básica pero también la que se suele pasar por alto con mayor frecuencia. Todas las imágenes presentes en un sitio web deben estar reducidas al tamaño que de verdad se necesita y, al mismo tiempo, optimizadas para ocupar menos espacio.
  • Compresión Gzip. Comprimir los archivos favorece un notable ahorro de transferencia del servidor, además de un aumento de la velocidad.
  • Comprimir todo el código HTML (no dejar espacios en blanco ni saltos de línea en el documento).
  • Comprimir todo el código CSS (no dejar espacios en blanco, comentarios ni saltos de línea en el documento).
  • Comprimir todo el código JS (no dejar espacios en blanco, comentarios ni saltos de línea en el documento).
  • Usar CSS sprites. Consiste en unificar todos los botones, iconos y demás elementos decorativos en una única imagen. Con esta modificación reducimos notablemente el número de peticiones a la base de datos. Por ejemplo, si tenemos 15 iconos, en lugar de hacer 15 llamadas realizaríamos solo una.
  • No poner código CSS en el documento HTML, pues, en caso de hacerlo, el navegador tarda tiempo en su procesado.
  • Comprimir todos los ficheros CSS en un solo. Unificar los archivos de estilo en uno solo reduce notablemente el tiempo de carga, ya que todos están en la misma ruta.
  • Comprimir todos los ficheros Javascript en un solo. Igual que con los ficheros CSS.
  • Aplazar el análisis y cargar los archivos Javascript de forma asíncrona.
  • Reducir las peticiones de DNS.
  • Cachear contenido estático. Realizar esta modificación permite que una misma imagen (GIF, PNG, JPG…), un mismo archivo .js o un mismo archivo .css, por poner algunos ejemplos, no se descarguen cada vez que se ven.
  • Evitar errores 404. Si en tu web hay URL que dan errores 404, estás llamando a URL que no existen, lo que hace que el servidor espere y tarde en cargar sin obtener nada a cambio.
  • Reducir al máximo el número de consultas (queries) innecesarias a la base de datos.
  • Desinstalar plugins, complementos y extensiones de terceros que no sean realmente necesarios y se puedan sustituir por simple código.
  • Reducir al máximo el número de widgets o botones para compartir en redes sociales: decídete por los realmente importantes y los que verdaderamente usen tus usuarios para compartir tus contenidos.
  • Contratar un buen servidor de alojamiento web. Como se suele decir, lo barato sale caro. Apuesta por alojar tu sitio web en un servidor que dé confianza y se sitúe en tu país, ya que, entre otros beneficios, favorece al SEO local.
  • Utilizar un CDN. Un CDN hace una copia de tu página web y la distribuye en diferentes partes del mundo. Si, por ejemplo, accede un usuario de Estados Unidos a tu web, se le mostrará una copia almacenada en Estados Unidos, lo que favorece enormemente la velocidad de carga para ese usuario.


Fuente: amplifica.es

--Oscar Sánchez Guiu (discusión) 09:32 23 dic 2013 (CET)

Herramientas personales
Espacios de nombres

Variantes
Acciones
Navegación
Herramientas
Compartir
Categorías
Apps
[×] CSS
[×] Diseño
Google
[×] Joomla
[×] Magento
[×] Mobile
[×] RRHH
[×] YouTube