¿Necesita un puntaje del 100% en Google PageSpeed ​​Insights?

No nos gusta esperar. Si las personas tienen que esperar cuando visiten su sitio web, se cansarán de él e irán a visitar otro. La carga web rápida es un requisito esencial hoy en día. Pero, ¿cómo podemos saber si un sitio web es lento o rápido? Sé que esta pregunta se ve un poco estúpida. Puede saber si una web es rápida o lenta, midiendo el tiempo de carga, no. Lo difícil es saber si el valor resultante de este análisis puede clasificarse como “lento” o “rápido”. Esperar 2 segundos puede no ser un problema, pero si mi sitio está cargando en la mitad del tiempo, sería absolutamente mejor, ¿verdad? Especialmente si considera cosas como su sitio. Solo podría tardar 2 segundos en cargarse en su conexión a Internet, pero ¿qué pasa con aquellos que tienen conexiones lentas?

¿Es su sitio demasiado lento o su velocidad ya es buena?
Todo esto es un problema más complejo de lo que parecería al principio. Para establecer medidas comparables, existen evaluadores del nivel de optimización de sitios web, como Google PageSpeed ​​Insights o Gtmetrix, por mencionar solo unos pocos. Estos evaluadores pueden analizar una página web y darles una nota sobre una escala de 0 a 100 dependiendo de su nivel de optimización. Además, detectan las características web e indican sugerencias que podemos hacer para mejorar su grado y, su supuesto, la velocidad.
Sin embargo, la búsqueda de la perfección puede ser contraproducente. La búsqueda de excelencia en Google PageSpeed ​​Insights puede descuidar otros aspectos de su sitio, que también son importantes, como la experiencia del usuario. Busque la excelencia en Google PageSpeed ​​Insights recientemente reescribió el tema de nuestro sitio desde cero y hemos transformado todas nuestras páginas usando bloques del nuevo editor de bloques de WordPress. Fue un ejercicio para comprender mejor las características del editor de bloques y también ver sus deficiencias, aprender a través de la práctica. Aprovechando esta tarea, analizamos nuestro sitio con Google PageSpeed ​​Insights para tratar de mejorar su nota final y acercarnos a 100 deseados. A continuación, veremos algunos de los puntos que hemos mejorado debido a las instrucciones. Google y nuestras conclusiones al respecto. Use un tamaño adecuado para las imágenes que ya hemos discutido este tema en nuestro blog. Recuerde que debe intentar usar tamaños de imagen compatibles con lo que su tema necesita. No use imágenes gigantescas porque no son necesarias. Si Google PageSpeed ​​Insights se queja de sus imágenes, lo bueno es que le dirá qué imágenes causan problemas, por lo que puede remediarlas. Es un trabajo laborioso, pero cuyos resultados tienen un impacto directo durante su carga web. Retrasar la carga de imágenes que no aparecen en la pantalla para todas esas imágenes de su página que el visitante debe correr hacia abajo para que se ve, se recomienda aplicar la carga perezosa.
Lo que obtienes usando la carga perezosa es que le pregunta al servidor una imagen solo cuando el visitante se ejecuta y tiene que verlo. De esta manera, evitamos sobrecargar el servidor en la demanda inicial y reducir el tiempo, haciendo que la web se cargue más rápido. Recomiendo este artículo al respecto. Si desea usar un complemento para la carga perezosa, puede ayudarlo. En nuestro caso, el complemento de optimización de SiteGround incluye una carga perezosa, por lo que no necesitábamos nada más para activar esta técnica en nuestro sitio. Asegúrese de que el texto permanezca visible mientras se carga la fuente web si usa Google WebFonts, como lo hacemos nosotros, es irónico verificar cómo el script le ofrece Google para cargar las fuentes es detectado por Google PageSpeed ​​Insights como una mejora. Según Google,. Debe usar Font-Display CSS en los usuarios de @Font-Facing para ver el texto mientras carga la fuente web. En particular, debe poner la vida de la fuente: intercambiar la fuente de carga para que el navegador no bloquee el juego de texto hasta que la fuente esté disponible. Puede descargar Google Fonts e importarlos directamente usando la pantalla de fuentes, como se explica aquí.
Con esto, el visitante puede ver el texto desde el principio, incluso si la fuente específica de Google no está cargada. Cuando la fuente esté disponible, el navegador la aplicará al texto, convirtiendo su estilo en el deseado.
Elimine los recursos que bloquean los estilos CSS y los scripts de JavaScript se utilizan cada vez más para cambiar el diseño de contenido y hacerlo dinámico. Si cargamos CSS y JS en el de la web, lo normal es que la representación de contenido se bloquea y la web se carga hasta que se procesan los estilos y archivos de JavaScript. Una opción para evitar esto es mover estos archivos a desde la web. Al hacer esto, todo el contenido que ingrese se cargará y jugará primero, sin ser bloqueado. Además, se recomienda utilizar los atributos Difer y Async en los scripts de JavaScript para que la carga se posponga o se realice. Otro aspecto que ayuda a mejorar la puntuación final de Google PageSpeed ​​Insights es para Minion y comprimir los archivos CSS y JS. en un solo archivo CSS y JS respectivamente. Sin embargo, tenga mucho cuidado con la combinación porque si las combina en un orden incorrecto puede sufrir defectos en los estilos y puede romper la ejecución del código JavaScript. Puede usar este complemento para obtener mejores resultados, pero nuevamente usarlo cuidadosamente. Desventajas de mejorar la velocidad de su sitio después de aplicar soluciones a las sugerencias de Google utilizando Google PageSpeed ​​Insights, el tiempo de carga del sitio se reduce. Sin embargo, tiene un precio que no está claro si queremos pagar.

Uno de los efectos secundarios de la luz de nuestro sitio web es que la experiencia del usuario que recibe un visitante puede no ser tan bueno como lo ha sido. Permíteme detallar más … Para que el contenido de nuestro sitio se reproduzca lo antes posible en el navegador de nuestros visitantes, posponí la carga de los estilos JavaScripts y CSS en nuestra base web (han pasado desde el encabezado del sótano). Y también permití que el texto se cargara antes de tener la fuente web. Todo esto hace que el visitante vea el contenido web rápidamente. Lo que significa que ven todo bastante plano y feo. Además, notarán cómo cambia la fuente de texto cuando ya está disponible. Los visitantes también verán un parpadeo cuando se aplican y ejecutan los estilos CSS y JavaScript. Anteriormente, en una instalación común de WordPress, el visitante vio la carga web sin ningún problema. Ahora verá que está cargando un poco más rápido, pero todo este parpadeo que experimenta reduce la experiencia del usuario y que el visitante cree que la web es extraña. O incluso que algo se rompa en la web porque cada vez que navegas en una página, el parpadeo aparece por un momento. ¿Vale la pena darle esta extraña sensación a los visitantes solo para ganar unos pocos milisegundos durante la carga y algunos puntos adicionales en Google PageSpeed ​​Insights? No creemos. Y por esta razón, volví a la forma habitual de cargar los estilos y scripts que WordPress hace predeterminado.
Ya sea que esto tenga o no un efecto negativo en otros aspectos, como el SEO, la verdad es que no sabemos (y no creemos que alguien sea definitivamente).No está claro si la evaluación de Google PageSpeed ​​Insights es tanto peso como algunas personas piensan. Google PageSpeed ​​Insights.Está claro que hay aspectos que deben mejorarse, como el tamaño de imagen correcto, utilizando archivos minificados para reducir su peso o evitar cargar todo lo que no se utilizará en la página.No se vuelva loco con los evaluadores de optimizar su sitio y obtener la puntuación máxima.Después de todo, su visitante objetivo está hecho de carne y huesos, incapaz de apreciar las diferencias mínimas en décimas de un segundo.Una vez que su nota sea correcta, concéntrese en otra cosa.Imagen presentada desde Taun Stewart en Unsplash.