Aumentar la velocidad de carga del sitio web - Profit Hunter

Desafortunadamente, o afortunadamente, los motores de búsqueda de hoy prestan atención a lo rápido que funciona el sitio. Esto afecta a cómo se clasificará el recurso en la búsqueda. Además, la velocidad de carga determina el comportamiento de los visitantes, lo que los robots también tienen en cuenta.

Aquí hay algunos consejos sobre cómo hacer que su sitio sea más rápido.

Inclusión de CSS al principio

Más precisamente, en la página de encabezado. Por lo tanto, sus elementos se cargarán secuencialmente, desde el título hasta el pie de página. ¿Qué va a dar? Por supuesto, la conveniencia de trabajar con el sitio para el usuario y aumentar su lealtad. Cuando CSS está conectado en la parte inferior, los navegadores se niegan a cargar elementos gradualmente. Por lo tanto, la página debe hacer referencia al archivo CSS que ya está en la etiqueta de cabecera.

Aumentar la velocidad de carga del sitio web - Profit Hunter

JS: al final del código

Gracias a la conexión de los archivos JS al final de la descarga, se cargará primero la página con el contenido principal que el usuario necesita. La regla principal es no hacer que el visitante espere lo que vino a buscar. Y numerosos elementos bellos pueden ser cargados y luego. Por cierto, al cargar el script, otros componentes de la página no se cargan, incluso desde otros hosts.

Uso de subdominios

¿Tiene muchos elementos gráficos en sus sitios? Entonces debería considerar transferirlos a uno o más subdominios, que se consideran servidores diferentes para el navegador. Sin embargo, no use docenas de subdominios: solo perjudica al sitio. En todo lo que necesita saber cuándo parar.

Número de solicitudes HTTP

La mayoría de las veces, se cargan varios scripts, archivos CSS, fotos y flash. Es deseable que los navegadores carguen un máximo de 2 elementos de página desde el primer host. Como resultado, resulta que, cuantos menos, menos solicitudes al servidor.

Sin embargo, no es necesario cambiar la apariencia del sitio debido a esto. Hay otras formas.

  • Gráficos en línea. Al incorporarlo en CSS, y no en la página en sí, obtendrá un número reducido de solicitudes al servidor, y el tamaño de las páginas no aumentará.
  • Aplicando CSS Sprites. Su esencia radica en el hecho de que en lugar de unas pocas imágenes pequeñas cargan una, pero de gran tamaño. Usando el código CSS, se divide en imágenes más pequeñas. Por ejemplo, puede procesar varios botones en una fila, combinándolos en una imagen. Cuantas menos descargas de imágenes, menos solicitudes HTTP.
  • Varios archivos en uno. Si la plantilla usa más de un archivo css o js, ​​es recomendable hacer un archivo de ellos.

Limpie todos los archivos JS y CSS del código innecesario

Elimine las líneas comentadas, los espacios adicionales, las pestañas. Estas pequeñas cosas irrelevantes agregan peso a sus archivos y, por lo tanto, aumentan su volumen. Los servicios especiales se utilizan para comprimir el código, por lo que no es necesario editar todo manualmente.

No reduzca la imagen con el código

Si el tamaño original de la foto no le conviene, es mejor cambiarla inicialmente que ajustarla con la ayuda de un código CSS o atributos de etiqueta img.

Use CDN para marcos

Cuando los marcos participan en un recurso (como jQuery), es recomendable usar un CDN (Red de entrega de contenido) para ellos, un grupo de servidores que están separados geográficamente para garantizar el máximo Velocidad de proporcionar datos al cliente.

El servidor para la transmisión de contenido se selecciona en función de varios criterios, por ejemplo, el tiempo de respuesta. Como CDN, puede utilizar la API de Google y el alojamiento de bibliotecas de JavaScript de Yandex.

Almacenamiento en caché de datos en navegadores

Si está utilizando activamente la conexión JS y los scripts CSS, entonces es vital que conecte el caché. Cuando accede por primera vez al sitio, el navegador del usuario carga todos los códigos de los archivos, así como los componentes gráficos y flash. Si el encabezado HTTP de Expires está configurado, cuando el visitante regrese, su navegador almacenará todos estos datos y las páginas se cargarán más rápido.

Imágenes optimizadas

Seleccione el formato correcto para las imágenes, de lo contrario su tamaño puede aumentar. Por lo tanto, en el formato GIF es mejor guardar imágenes con varios colores y en JPEG: gráficos multicolores complejos (por ejemplo, fotos). PNG se utiliza cuando se necesita una buena calidad de imagen y un fondo transparente.

Para comprimir una imagen en Photoshop, presione "Alt + Shift + CTRL + S" al mismo tiempo (solo no se rompa los dedos) y elija la relación calidad / tamaño óptima.

Aumentar la velocidad de carga del sitio web - Profit Hunter

¿Te gustan los artículos? ¡Suscríbete al boletín!

Buscar

Artículos relacionados