El nuevo Google PageSpeed ​​Insights: A Perfect 100 ahora es súper fácil

Google PageSpeed ​​Insights acaba de recibir una actualización y obtener un puntaje perfecto de 100 es mucho más fácil. Esta es una excelente noticia para agentes y trabajadores independientes con paquetes de gestión de sitios. Tratar de explicar el sistema de puntaje defectuoso de Google que ve su puntaje de PageSpeed ​​como una facilidad de aprobación siempre ha sido difícil. “¿Por qué estás de acuerdo con un 73? ¿No es un C-? ” Las ventajas del nuevo motor de velocidad de página de Google PageSpeed ​​Insights ahora están utilizando Lighthouse como motor de análisis junto con los datos de campo de Crux. Este cambio no solo le permite a Google mirar el código, sino que les permite considerar los resultados de rendimiento reales.
Esto significa que Google ya no señala su sitio en función de lo que puede hacer para mejorar su sitio, sino evaluar su sitio de acuerdo con su desempeño. Excelente … ¿verdad? Un flashback a la interfaz anterior:

Old PageSpeed ​​Insights con el Ilusor 100 perfecto.
Y la nueva interfaz que ejecuta el faro:

La nueva información de Google PageSpeed ​​Insights tiene 100 perfectos.
Como beneficio adicional, el uso de Google Analytics y Google Fonts ya no penalizan su puntaje (sí, por compatibilidad). Para la velocidad del sitio de TOC, como yo, esta es una gran actualización. Pero PageSpeed ​​Insights nunca ha sido realmente sobre el juego del sistema con cien o te ha hecho sentir mejor contigo mismo. Se trata de mejorar la experiencia del usuario y, a su vez, aumentar las tasas de tráfico y conversión en su sitio.
El sistema de puntuación más nuevo, mejor y no tan perfecto es que su sitio puede tener una puntuación sexy de 100, pero eso no significa que su sitio esté completamente optimizado. Una gran diferencia en las nuevas ideas de Google PageSpeed ​​es que puede tener una velocidad perfecta de 100 páginas y puede haber oportunidades de mejora. Esta actualización cambia el juego y significa que necesitamos ajustar cómo leemos los resultados de PageSpeed ​​Insights. Lo que no ha cambiado: la velocidad sigue siendo importante, mientras que los viejos resultados fueron muy rígidos y difíciles de obtener correctamente, estos nuevos resultados podrían hacer que los usuarios finales pierdan algunas de las ganancias rápidas para mejorar aún más el rendimiento del sitio. 100 ya no significa que haya hecho lo mejor que puede y su sitio está completamente optimizado. Se preocupa por considerar:
¿Usas un host de calidad? – Esto puede afectar su velocidad (más sobre esto más adelante).
¿Ha implementado todas las “oportunidades” para optimizar la posible velocidad humana?
¿Entiende cómo los complementos, los temas u otros servicios de terceros afectan su velocidad?
¿Puede hacer compromisos inteligentes que alcancen los objetivos de su sitio para el rendimiento y la funcionalidad?
El mayor problema es que la mayoría de nosotros aceptamos nuestros puntajes a ciegas, para bien y mal. En esta publicación quiero pasar por las oportunidades disponibles para aterrizar (o superar) los 100 🙂
Si no podemos llegar a 100, al final de esta lectura, tendrá el conocimiento que necesita para solucionar los tiempos de carga lentos y la capacidad de establecer objetivos realistas en términos de experiencia del usuario y velocidad de página de acuerdo con usted o sus clientes necesitan. Obtenga cien, la velocidad de página de Googlehummingbird le brinda todas las herramientas que necesita para obtener 100 perfectos.
Por lo tanto, realizó la primera verificación con PageSpeed ​​Insights de Google y regresó con un 73 y una lista de oportunidades de optimización. ¿Sigo confundido? ¡No corras!

Aquí hay una presentación general de lo que significan y cómo remediarlos. Consejo profesional: Recuerde, al verificar su puntaje, cambie entre resultados móviles y de escritorio. Por defecto, Google muestra resultados móviles. Cariño, he reducido el código (minimiza su código) mientras que la minería suena como el producto secundario de una invención en una película SF de principios de los 90, en realidad es solo el proceso de hacer que el código fuente sea más compacto. La idea básica es que todo el código que no es necesario se elimina (es decir, espacios blancos, nuevas líneas, comentarios, etc.) y todo cae en una línea grande.
Ejemplo de CSS inequin: cuerpo {fondo: #fff; Color: #333; Familia rápida: Lato, Sans-Serif; } Ejemplo CSS Minimizado: Body {Background: #fff; Color: #333; Font-Family: Lato, Sans-Serif} prácticamente, todo lo que hacemos para que el código sea fácil de leer por el ojo humano es inútil. La minificación crea una versión de su archivo que es más pequeña y, a su vez, más rápido para que los servidores lo entreguen. La buena noticia es que no tienes que hacer esto manualmente. Un complemento como Hummingbird automatizará este proceso para usted. Y no se preocupe, la versión innecesaria estará allí si la necesita para ediciones y legibilidad humana. Tienes los recursos para bloquear la reacción … ¡Oh, Dios!
Priorice el contenido para que las páginas se carguen más rápido.
Esto significa que tiene recursos CSS o JS que se cobran antes del contenido. Estos se consideran “bloqueo de renderizado” porque deben cargarse antes de que un usuario pueda ver el contenido de la página. Hay algunas opciones para resolver esto. Puede hacer el código CSS y JavaScript en línea en lugar de usar archivos .css y .js. Otra opción es que los archivos críticos de CSS y JavaScript se cargan asíncronos o se pospongan para cargar después de que la página ya se analiza.
¿Suena complicado? Si no es un ninja con códigos, esta puede ser la sugerencia más difícil de funcionar manualmente o hacerlo bien con un complemento. Afortunadamente, con una buena herramienta de optimización, esto puede ser tan simple como el proceso de conmutación, prueba y eliminación. Optimice sus imágenes ya hay muchas publicaciones dedicadas a la optimización de la imagen de WordPress, por lo que no pasaré mucho tiempo aquí. Principalmente, debido a que incluso los especialistas calificados para optimizar la velocidad automatizan una gran parte de este proceso con herramientas como Smush.smush le permite automatizar la optimización de imágenes para mantener sus sitios para que funcionen rápidamente y sin problemas.

Por supuesto, todo esto se puede hacer manualmente y debe escalar y comprimir las imágenes antes de cargarlas (especialmente si está en una misión para 100 perfecto).
Estos son los factores clave para levantar la bandera roja y perder puntos a su prueba de estadísticas.
Cambie las imágenes para que coincida con el ancho del contenedor en el que se utilizará.


Las imágenes deben comprimirse en un formato de pérdidas (JPEG) o sin pérdidas (PNG/GIF) para reducir el tamaño de su archivo.
Pero, ¿qué pasa con esas grandes imágenes 2x para pantallas de retina? Cree imágenes personalizadas y familiarícese con el etiquetado . Se necesita un poco de tiempo extra para que la imagen se optimice correctamente. Pero es por eso que sus clientes le pagan mucho dinero … ¿Estoy en lo cierto?
Priorice el contenido visible Esto es exactamente como suena. El “contenido principal” debe cargarse antes que cualquier otra cosa. Esto brinda a sus visitantes una experiencia de usuario más rápida. Aquí hay un ejemplo clásico de WordPress. Si su código HTML tiene antes de , entonces el usuario debe esperar a que la barra lateral se cargue primero, lo que lo convierte en un elemento de “bloqueo”. El HTML debe reorganizarse para que se encuentre antes de . Nota: Esto no cambia necesariamente cómo se verá su sitio si se agregan las reglas CSS correctas. Si no conoce el código, asegúrese de elegir un tema optimizado o puede usar la instalación de Hummingbird para reorganizar los archivos. No es nada, pero un colibrí de Gzip Baby (activa compresión) facilita el servicio de archivos comprimidos con GZIP.
La compresión permite que su servidor envíe archivos más pequeños por “compresión” automática antes de la entrega. Piénselo exactamente como un .zip que crea cuando intenta enviar un archivo o carpeta grande a un amigo. Si esto aún no está configurado en su sitio, la compresión GZIP se puede agregar y activarse fácilmente. Esta es otra ganancia rápida, generalmente activada por un simple control del interruptor. La memorización de caché del navegador Cache le dice a los usuarios el navegador que almacene archivos temporales localmente para que cargue la próxima vez cuando visiten la página. De nuevo, nada especial aquí. Su host puede proporcionar una herramienta de almacenamiento del navegador, puede usar un complemento o implementarlo manualmente.
Haga que su sitio funcione con un rayo con una configuración completa de caché. Profesional: tenga en cuenta cualquier caché cuando realice cambios o actualizaciones de su sitio. Si no vacía el caché durante las pruebas, es posible que el contenido anterior de no entregarse para ser entregado. Puede estar un poco confundido, al menos. La limpieza manual de los archivos de caché resolverá este problema. Limpié todos mis errores … ¿ahora qué? Ha viajado paso a paso y ha resuelto cualquier posible oportunidad de optimización sin destruir su sitio, realizó una nueva prueba de PageSpeed ​​y ejecuta el tambor, por favor … tenga un 87. O peor, tiene 100, ha cambiado sus servidores y su sitio ha caído a 87. ¿Qué demonios? Bienvenido a mi mundo. Eso realmente me pasó a mí. Pero ahora estás en un nuevo territorio, porque sabes que la velocidad de página lenta no es el problema. Esto ya no ignora los tiempos de carga lenta. Ahora está listo para tomar decisiones educadas basadas en lo que ralentiza su sitio.
Alojamiento barato o de baja calidad: si tiene un cliente que paga y esto es lo que causa el problema, colabore con el host para ver si se puede resolver. Si no resuelven el problema, puede ser hora de actualizar a un host dedicado o una opción administrada … o ambos.
Tema o marco temático: este puede ser su problema. Nunca es fácil pasar a un nuevo tema, pero si es difícil hacer ajustes sin interrumpir el estilo, podría ser hora de decir adiós. Puede probar su tema activando un tema implícito y ejecutando una nueva prueba de PageSpeed. *Recuerde borrar su caché antes de ejecutar su prueba.

Los complementos me ralentizan: se aplica aquí un tema lento.Es una prueba fácil.Deshabilite el complemento y ejecute una nueva prueba de PageSpeed.Si esto lo lleva a sus cien, colabora con el desarrollador para resolver el problema o buscar una opción más efectiva.
Tenga en cuenta que PageSpeed ​​Insights de Google no verifica la velocidad de su sitio, sino que pruebe la velocidad de una página en particular. Si ingresa la URL, el análisis será su página inicial. Si tiene otras páginas importantes en su sitio, asegúrese de verificarlas todas y optimizar cada página según sea necesario. Para completar todo para construir un sitio de WordPress con 100 Google PageSpeed ​​es un ejercicio valioso para averiguar lo que puede controlar y dónde necesita comprometerse … cada desarrollador debe intentar al menos una vez. Pero al final, un sitio rápido es solo una parte de un objetivo mucho más grande, lo que brinda a sus visitantes una increíble experiencia de usuario. Al final del día, pasar por alto y más le permitirá resaltar en un espacio lleno de gente donde todos puedan obtener un 100 y probablemente ya no hará mejoras. Al hacer tiempo para optimizar sus imágenes, desencadenar su código y brindar la mejor experiencia de usuario que pueda, podrá dar sus sitios. Obtenga todas las herramientas de optimización de desarrollo de WPMU en wordpress.org o aproveche la muestra de miembro libre WPMU Dev para probar nuestro conjunto de complementos PRO completos, incluidos los escaneos automáticos ordinarios. ¿No estás seguro de aprovechar al máximo tu sitio? Nuestros miembros se benefician del acceso 24/7 a la asistencia. ¿Tiene la actualización de Google PageSpeed ​​en caso de que mejore el tiempo de carga? Cuéntanos en comentarios sobre tu estrategia de optimización de rendimiento.

Etiquetas:
Google
Optimización de la velocidad del sitio
El rendimiento del sitio web