Categories
Conceptos básicos de SEO

Ganando la carrera de velocidad de la página

Una breve historia de la misión de Google para hacer que la web sea más rápida

en 2009, al emitir una llamada a las armas para “hacer la web más rápido”, Google se establece en una misión para intentar persuadir a los propietarios de sitios web a Haz que sus sitios se cargan más rápidamente.

Para atraer a los propietarios de sitios web en el cuidado de esto, en 2010, Google anunció que la velocidad del sitio se convertiría en un factor en sus algoritmos de clasificación de motores de búsqueda de escritorio (no móviles). Esto significó que los sitios que cargados rápidamente tendrían una ventaja de SEO sobre otros sitios web.

Seis años más tarde, en 2015, Google anunció que El número de búsquedas realizadas en el móvil excedó los que se realizaron en computadoras de escritorio . Ese porcentaje sigue aumentando. La última estadística publicada dice que, a partir de 2019, 61% deLas búsquedas realizadas en Google fueron de dispositivos móviles .

El rol ahora dominante de Mobile en la búsqueda llevó a Google para desarrollar su proyecto “Páginas móviles aceleradas” (AMP). Esta iniciativa está dirigida a alentar a los propietarios del sitio web a crear lo que es esencialmente otro tema móvil, además de su tema móvil receptivo, que cumple con un conjunto muy estricto de desarrollo de desarrollo y desempeño.

Aunque muchos propietarios de sitios y SEOS se quejan de tener que tender a la velocidad y el amplificador en la parte superior de los otros factores de clasificación de 200+ que ya les dan dolores de cabeza, la velocidad de la página es de hecho un esfuerzo digno para que los propietarios del sitio se centren en ellos. En 2017, Google realizó un estudio donde los resultados justificaron mucho su enfoque en hacer la web más rápido. Encontraron que “ comoEl tiempo de carga de la página va de un segundo a 10 segundos, la probabilidad de que un visitante de sitio móvil aumenta un 123%.

En julio de 2018, la velocidad de la página se convirtió en un factor de clasificación para las búsquedas móviles , y hoy en día, Google incorporará aún más factores relacionados con la velocidad (llamados núcleo vitales web

) en sus algoritmos de clasificación.

Con el período promedio de atención humana que disminuye todo el tiempo, y nuestra confianza en nuestros dispositivos móviles que crece constantemente, no hay duda de que la velocidad de la página es, y seguirá siendo, una cosa increíblemente importante para que los propietarios de los sitios web tienden a.

Cómo optimizar un sitio web para la velocidad

Piense como un conductor de automóvil de carreras

Ganando la Página de la carrera de velocidad requiere las mismas cosas que ganando una carrera de automóviles. Para ganar una carrera en un coche, tú mAke seguro que su vehículo sea lo más liviano posible, lo más poderoso posible, y navega por el hipódromo de la manera más eficiente posible.

Usaré esta analogía para tratar de hacer que las técnicas de optimización de la velocidad de página sean un poco más comprensibles.

Hazlo ligero

En estos días, los sitios web son más bellos y funcionales que nunca, pero eso también significa que son más grandes que nunca. La mayoría de los sitios web modernos son equivalentes a un autobús de fiesta o una limusina. Son súper elegantes, cargados con todo tipo de comodidades, y por lo tanto pesadas y lentas. En el motor de búsqueda “Racetrack”, no ganarás con un bus de fiesta o una limusina. Te verás genial, pero perderás.

Fuente de imagen: una página de resultados de prueba GTmetrix

Para ganar la carrera de velocidad de la página, NEED Un vehículo de carreras adecuado, que es ligero. Los autos de carreras no tienen radios, tope, cajas de guantes, o realmente cualquier cosa que no sea absolutamente necesaria. De manera similar, su sitio web no debe cargarse con animaciones elaboradas, fondos de video, imágenes enormes, widgets de lujo, complementos excesivos o cualquier otra cosa que no sea absolutamente necesaria.

Además de declamar su sitio de sutileza innecesaria y complementos excesivos, también puede arrojar al sitio web de peso a:

Reducir el número de scripts de terceros (Snippets de código que envían o reciben datos de Otros sitios web)

Cambio a un tema de peso más ligero (menos pesado) y reduciendo el número de fuentes utilizadas

Implementación de AMP

Optimización de imágenes

Comprimiendo y minificandoCódigo

Realización de optimizaciones de base de datos regulares

En un sistema de administración de contenido de código abierto como WordPress, los complementos de velocidad están disponibles que pueden hacer que muchas de estas tareas sean mucho más fáciles. WP Rocket e Imagify son dos complementos de WordPress que se pueden usar juntos para aligerar significativamente el peso de su sitio web a través de la optimización de imágenes, la compresión, la minificación y una variedad de mejores prácticas de velocidad de la página.

Dale más poder

No pondría un motor de carrito de golf en un automóvil de carreras, así que ¿por qué pondría su sitio web en un plan de hosting de suciedad barato y compartido? Es posible que le resulte doloroso pagar más de unos pocos dólares por mes en el alojamiento. Si ha estado en uno de esos planes durante mucho tiempo, pero nuevamente, el carro de golf versus Carry Car motor: ¿Quieres ganar esta carrera o no? ?

Planes de alojamiento compartido tradicionales Craman decenas de miles de sitios web en un solo servidor. Esto deja a cada sitio individual de hambre para el poder de la computación.

Si desea correr en las grandes ligas, es hora de obtener un plan de alojamiento adhesivo. Para los sitios de WordPress, las compañías de alojamiento administradas, como el motor WP y el volante, utilizan servidores que son poderosos y específicamente sintonizados para servir a los sitios de WordPress más rápido.

Si se administra el alojamiento de WordPress no es lo tuyo, o si no tiene un sitio de WordPress, la actualización a un VPS (servidor privado virtual) dará lugar a su sitio web que tenga más recursos informáticos disponibles. También tendrá más control sobre su propio entorno de alojamiento, lo que le permitirá “afinar su motor” con cosas como las últimas versiones de pHP, MySQL, Caching de barniz y otras tecnologías modernas del servidor web. Ya no estará a la merced de la codicia de su compañía de alojamiento compartido, ya que son más y más sitios web en su servidor ya gravado.

En resumen, ponga su sitio web en un entorno de alojamiento bien sintonizado, puede ser como poner un supercargador en su automóvil de carreras.

Lo conduce mejor

Último, pero ciertamente no menos importante, un automóvil de raza ligero y potente solo puede ir tan rápido sin un conductor capacitado que sabe cómo navegar por el curso de manera eficiente.

El “Navegue por el curso” parte de esta analogía se refiere al proceso de un navegador web que carga una página web. Cada elemento de un sitio web es otro giro o giro para que el navegador navegue a medida que viaja a través del código y procesa la salida de la página.

Voy a cambiar de analogías momentáneamente para tratar de explicar esto más claramente. Cuando remodelando una casa, pintas las habitaciones primero antes de rehacer los pisos. Si redes de los pisos primero y luego pintaron las habitaciones, los pisos nuevos se pintarían y tendrías que volver atrás y tender a los pisos de nuevo más tarde.

Cuando un navegador carga una página web, pasa por un proceso llamado (casualmente) “Pintura”. Cada página está “pintada”, ya que el navegador recibe bits de datos del código fuente de la página web. Este proceso de pintura puede ser ejecutado de manera eficiente (es decir, paredes de pintar antes de la preparación de pisos), o se puede hacer de una manera más caótica fuera de orden que requiere varios viajes al principio del proceso para rehacer o arreglar o agregar algo. que podría haber sido / debería haber sidoSe realizado anteriormente en el proceso.

Fuente de imagen: WebPagetest.org Resultado de la prueba (Vista de la película)

Aquí es donde las cosas pueden Obtenga técnicas, pero es importante hacer lo que pueda para ayudar a su sitio a conducir la “pista” de manera más eficiente.

El almacenamiento en caché es un concepto de que cada sitio web debe tener en su lugar para que lo cargue una página web más fácil en el navegador. Ya lleva lo suficiente como para que un navegador procese todo el código fuente de una página y lo pinte visualmente al usuario, por lo que también podría tener ese código fuente listo para ir al servidor. Por defecto, sin almacenamiento en caché, ese no es el caso.

Sin almacenamiento en caché, el CMS del sitio web y el servidor aún pueden estar trabajando para generar el código fuente de la página web mientras el navegador está esperando para pintar la página. TSu puede hacer que el navegador tenga que pausar y esperar a que venga más código del servidor. Con el almacenamiento en caché, el código fuente de una página está pre-compilado en el servidor para que esté totalmente listo para ser enviado al navegador en su totalidad en un solo disparo. Piense en ello como una fotocopiadora que tiene muchas copias de un documento ya producido y listo para ser entregado, en lugar de hacer una copia a la demanda cada vez que alguien lo solicite.

Se pueden lograr varios tipos y niveles de almacenamiento en caché a través de complementos, su compañía de alojamiento y / o a través de un CDN (red de entrega de contenido). Los CDN no solo proporcionan almacenamiento en caché, sino que también organizan copias del código de sitio web pre-generado en una variedad de servidores en todo el mundo, lo que reduce el impacto de la distancia física entre el servidor y el usuario en el tiempo de carga. (Y sí, elInternet está compuesto por servidores físicos que tienen que hablar entre sí sobre distancias físicas. La Web no es en realidad una “nube” en ese sentido).

Volviendo a nuestra analogía de carreras, utilizando el almacenamiento en caché y un CDN equivale a un viaje mucho más rápido alrededor del hipódromo.

Esos son dos de los bloques básicos de construcción de pintura de páginas eficientes, pero también hay más técnicas que también pueden emplearse. En WordPress, lo siguiente se puede implementar a través de un complemento o complementos (nuevamente, WP Rocket e IMPAGIFIC son un combo particularmente bueno para lograr una gran cantidad de esto):

Carga asíncrona y / o diferida de carga de scripts .

Esto es básicamente una forma elegante de referirse a cargar varias cosas al mismo tiempo o esperar hasta más tarde para cargar las cosas.El sombrero no se necesita de inmediato.

Precarga y prefijada.

Básicamente, recuperar datos sobre los enlaces de antemano en lugar de esperar a que el usuario haga clic en ellos.

Carga perezosa. El término irónico es que este concepto existe para fines de la velocidad de la página, pero de forma predeterminada, la mayoría de los navegadores cargan todas las imágenes en una página, incluso aquellas que están fuera de la vista hasta que un usuario se desplaza hacia ellos. Implementación de medios de carga perezosa que le dice al navegador que sea perezoso y espere en la carga de las imágenes fuera de la vista hasta que el usuario se desplaza allí.

Servir imágenes en formatos de próxima generación. Los nuevos formatos de imagen, como WEBP, se pueden cargar mucho más rápido por los navegadores que los formatos de JPEG y PNG antiguos. Pero es importante tener en cuenta que no todos los navegadores pueden apoyar estos nuevos formatos jUST sin embargo – así que asegúrese de usar un plugin que puede servir hasta las versiones de nueva generación a los navegadores que las soportan, pero proporcionan las versiones antiguas de los navegadores que no lo hacen. WP Rocket, cuando se combina con Imagify, puede lograr esto

Fuente de la imagen:. WP Rocket plugin de configuración

Optimizar para el núcleo de banda vitales por último, la optimización de la nueva

Core web Vital

métricas (pintura más grande Contentful, primer retardo de entrada y el desplazamiento de diseño acumulativo) puede hacer de una manera mucho más eficiente viaje alrededor de la pista de carreras también.


Fuente de la imagen

Estos son conceptos muy técnicos, pero aquí hay una descripción rápida para conseguir que familiarizarse con lo que significan:

más grande de pintura Contentful (LCP)

se refiere a la pintura deEl elemento más grande de la página. La herramienta PageSpeed ​​Insights de Google le dirá qué elemento se considera que es el elemento LCP de una página. Muchas veces, esta es una imagen de héroe o un área de deslizamiento grande, pero varía de la página a otra, así que ejecute la herramienta para identificar el LCP en su página y luego piense en lo que puede hacer para que ese elemento en particular sea más rápido.

Primer retardo de entrada (FID) es el retardo entre la primera acción del usuario y la capacidad del navegador para responderle. Un ejemplo de un problema de FID sería un botón que sea visible para un usuario antes de lo que se hace clic. La demora sería causada por la funcionalidad de clics que se carga notablemente más tarde que el botón en sí. Cambio de diseño acumulativo (CLS) es un conjunto de tres grandes palabras que se refieren a uno.Concepto simple. Sabe cuándo está cargando una página web en su teléfono y vaya a hacer clic en algo o leer algo, pero luego salta hacia arriba o hacia abajo porque algo más cargado por encima de él o debajo de él. Ese movimiento es CLS, es muy molesto, y es un subproducto de pintura ineficiente de la página. En conclusión, Carry Car> Carrito de golf La optimización de la velocidad de la página es ciertamente compleja y confusa, pero es una Componente esencial para lograr mejores clasificaciones. Como propietario de un sitio web, usted está en esta carrera, ya sea que le guste o no, ¡así que también puede hacer lo que pueda para hacer de su sitio web un automóvil de carreras en lugar de un carrito de golf!

Leave a Reply

Your email address will not be published. Required fields are marked *