Segunda parte de two

Entrevista a un Experto en Temas de Google

En mi último blog, comenté cómo Google actualizó sus datos de velocidad de página y, por tanto, creó un caos en todo el país. Ha habido más de unas cuantas quejas de los diseñadores web sobre las nuevas métricas. Y como sólo soy un diseñador aficionado, me dirigí a nuestro ruso para preguntarle qué puede estar mal con las percepciones, por qué todo el mundo está en pánico y qué deberíamos usar para medir la velocidad de nuestro sitio.

Wendy Lindars: ¿Qué hay de malo con la nueva analítica de velocidad de página de Google?

Kevin Fisher: No hay nada realmente malo en ello. El problema es que Google parece haber elegido el enfoque de auditar todos los métodos de optimización que podría utilizar y que posiblemente mejorarían el tiempo de carga de su sitio. Aunque todo esto está muy bien, no todas las optimizaciones sugeridas son siempre factibles, o incluso aconsejables, por razones que no están relacionadas con la velocidad de la página, como el soporte del navegador. Para cada desarrollador y cada sitio, lo más importante es realmente encontrar el equilibrio perfecto entre velocidad y rendimiento, compatibilidad, experiencia de usuario, creatividad, flexibilidad y escalabilidad. Aunque herramientas como Page Speed Insights pueden ser muy útiles, y puede y debe utilizar las recomendaciones para aspirar a la mejor puntuación de velocidad posible, también es importante recordar que, en última instancia, no vale la pena buscar unos cuantos puntos extra en el análisis de velocidad de página de Google. Esto es especialmente cierto si va a resultar en una experiencia de usuario menos atractiva o en una peor compatibilidad entre navegadores.

Para todos aquellos que han estado optimizando activamente sus sitios y realizando actualizaciones regulares para mejorar el rendimiento, incluso si su sitio estaba alcanzando una puntuación perfecta de 100 tanto en el escritorio como en el móvil antes de la actualización, y ya no lo está, puede haber buenas razones para ignorar las recomendaciones de Google, al menos durante un tiempo. Pero también puede que haya algunas ideas valiosas adicionales que le ayuden a exprimir un poco más el rendimiento de su sitio en el móvil, y cada pequeña ayuda

Como ejemplo, una de las nuevas «Oportunidades» que la evaluación de Google señala, que probablemente será el caso de todos los sitios que existen, es «servir imágenes en formatos de próxima generación». Si se pregunta por qué su puntuación ha bajado, lo más probable es que ésta sea al menos una de las razones. Si profundizamos un poco más, veremos que Google recomienda utilizar JPEG 2000 o JPEG XR para sustituir las imágenes JPEG tradicionales, y WebP para sustituir las imágenes JPEG o PNG:

Los formatos de imagen como JPEG 2000, JPEG XR y WebP suelen ofrecer una mejor compresión que PNG o JPEG, lo que significa descargas más rápidas y un menor consumo de datos.

Sólo hay un problema. La compatibilidad del navegador con JPEG 2000 es prácticamente inexistente, a menos que pienses servir tu sitio web sólo a usuarios de Apple. Así que eso está fuera. La compatibilidad de JPEG XR con los navegadores es posiblemente peor, dado que actualmente sólo está soportado en IE11, Edge y Mobile IE, que en conjunto constituyen alrededor del 5% del uso de navegadores en todo el mundo. WebP, por otro lado, parece mucho más prometedor en lo que respecta al soporte de navegadores, pero todavía carece de soporte de algunos navegadores populares como Firefox y Safari.

En general, la solución ideal sería implementar el soporte de WebP con un retroceso a JPEG/PNG, en preparación para un mejor soporte de navegadores que probablemente se produzca en un futuro próximo. Pero ten en cuenta que no importa cuánto mejore tu puntuación ahora mismo, las mejoras de carga de página en el mundo real, si es que las hay, dependerán principalmente de si tu base de usuarios se inclina fuertemente hacia un navegador u otro. En otras palabras, si simplemente has perdido algunos puntos debido a esta «Oportunidad», no es exactamente una emergencia el dedicarle horas de desarrollo, pero es algo que deberías considerar implementar en interés de una mejora continua.

WL: ¿Existe alguna herramienta de velocidad de página que debamos usar por encima de las demás?

KF: En mi opinión, el mejor enfoque es siempre echar un vistazo a todas las opciones e información, y luego evaluar lo que tiene más sentido y le dará la mayor cantidad de ganancias de rendimiento sin sacrificar ningún otro aspecto importante de su sitio. GTMetrix.com es otra excelente herramienta para que los desarrolladores vean dónde pueden poner más atención para mejorar el rendimiento de su sitio. Utiliza tanto PageSpeed como YSlow (la métrica de velocidad de página de Yahoo) para proporcionar un informe más completo de la optimización de su sitio.

Antes de la actualización de la herramienta Page Speed Insights de Google, GTMetrix.com ya utilizaba su propia versión personalizada de PageSpeed, que ofrecía un análisis mucho más detallado y era, por lo tanto, más difícil de puntuar altamente por debajo, por no hablar de lograr una puntuación perfecta del 100%. Mientras que era relativamente fácil alcanzar una optimización del 100% de Google, muchas personas en la industria siempre lo consideraron un «unicornio» y dieron muchas excusas para ni siquiera intentarlo. Personalmente creo que ese es el enfoque equivocado. Incluso si es casi imposible alcanzar esa puntuación perfecta, no hay nada malo en intentarlo. Al final, aunque no lo golpees, si lo haces de la manera correcta, todo ese esfuerzo sólo va a conducir a una mejora en el rendimiento, que es algo que siempre debes perseguir manteniendo un buen equilibrio, por supuesto.

Por otra parte, no sé de muchos sitios por ahí que alguna vez golpearon una puntuación perfecta del 100% en GTMetrix.com, especialmente no los sitios con elementos gráficos pesados y de vídeo. El nuestro es uno de ellos, y creo que eso dice mucho sobre la importancia de perseguir tales mejoras de manera regular y agresiva.

Para añadir perspectiva, GTMetrix.com también proporciona una lista de los 1.000 sitios más importantes del mundo y sus estadísticas de rendimiento.

WL: ¿Es posible seguir cada sugerencia que Google da para la velocidad? ¿Por qué sí o por qué no?

KF: Yo diría que no se trata tanto de lo que es «posible», sino más bien de lo que es factible y lo que vale la pena. Una vez más, se trata de equilibrio. Tomaré un sitio que tenga una puntuación del 95% pero que funcione en todos los navegadores y tenga una mejor tasa de conversión que un sitio que tenga una puntuación del 100% pero que falle en algunos navegadores populares y ofrezca una experiencia de usuario más pobre, o que no sea tan agradable estéticamente. Con toda probabilidad, para la mayoría de los usuarios, ambos sitios van a seguir cargando en algún lugar dentro de ese rango de 1 segundo dependiendo de muchos factores externos, y si está comparando una mejora de optimización del 5% con una mejora de conversión del 10%, es una elección fácil cada vez.

Eso no significa que el sitio que está convirtiendo un 10% más no deba aspirar a mejorar su optimización si puede encontrar una manera de hacerlo sin comprometer todo lo que hace que su sitio web sea un mejor convertidor, entonces será mucho mejor que antes.

WL: ¿Hay algo que alguien que no tiene las habilidades de desarrollo web puede hacer para optimizar su sitio?

KF: La cosa más grande que puede tener un gran impacto que la persona promedio puede hacer fácilmente es la optimización de imágenes. Las imágenes representan alrededor del 64% de todo el contenido de un sitio web, eso es enorme. Por lo general, el factor que más contribuye a una puntuación terrible de optimización son las imágenes no optimizadas y/o las imágenes innecesariamente grandes.

Hay tantas herramientas online sencillas y gratuitas que comprimirán sus imágenes de forma impecable para su uso en la web, como TinyPNG y Optimizilla. GTMetrix.com incluso le da un enlace para descargar la versión optimizada de cada imagen que no cumple con su estándar de compresión después de escanear su sitio.

WL: ¿Hay algo que usted siente que Google se ha perdido en su informe de conocimientos? ¿Algún componente importante?

KF: Es algo sorprendente, con su énfasis añadido en los formatos de imagen, que no se haya recomendado el uso de SVG (gráficos vectoriales escalables) en lugar de PNG para la transparencia y otros efectos. Los SVG son enormemente superiores en muchos aspectos y se pueden entregar en línea sin necesidad de una solicitud adicional. También pueden ser más fácilmente manipulados y escalados a cualquier tamaño sin pérdida de calidad sobre la marcha. Un factor que contribuye en gran medida a los tiempos de carga lentos es el número de recursos que el navegador tiene para solicitar y cargar individualmente. Reemplazar una cantidad significativa de sus gráficos con SVGs puede reducir drásticamente ese número y aumentar significativamente la velocidad de su página. Además, como puedes manipular directamente los gráficos a través de CSS y JS, no necesitas cargar múltiples versiones para cosas simples como iconos de diferentes colores, etc.