![elegir una imagen para ilustrar tu artículo (1)](/download/multimedia.normal.b5b812babadcff94.ZWxlZ2lyIHVuYSBpbWFnZW4gcGFyYSBpbHVzdHJhciBfbm9ybWFsLmF2aWY%3D.avif)
Convierte, redimensiona y comprime imagenes con Squoosh
Asegurar que las imágenes de tu sitio web estén optimizadas es fundamental para mantener una carga rápida y ofrecer una experiencia de usuario impecable.
Si eres el administrador de un sitio, probablemente hayas utilizado herramientas online para medir la velocidad de un sitio. Pero, ¿realmente deberías guiarte por sus indicadores? Creemos que no y te contamos por qué.
Recursos y Herramientas14 de junio de 2016 Redacción Medios CMSComo todo webmaster, quieres que tu sitio sea rápido. Has buscado herramientas online para medir la velocidad de tu sitio, y has dado con herramientas como TestMySite de Google, o Page Speed Insights (también de Google), o tal vez incluso hayas dado con GTMetrix o Monitis. De cualquier manera, te has encontrado con un montón de indicadores amarillos y rojos que te dicen que necesitas optimizar recursos y aspectos de tu sitio. Probablemente hayas terminado preguntándote:
La pura verdad: esos puntajes realmente no importan. A continuación te contamos por qué.
La velocidad de tu sitio está determinada principalmente, por la velocidad del servidor y la rapidez con la cual procesa una petición, genera una respuesta y la entrega al cliente. En el último punto, la velocidad de conexión del cliente juega un papel importante.
Cuando los robots de Google (y demás buscadores) indexan tu sitio, no ven un "puntaje", sólo ven la velocidad (el tiempo en el cual el servidor responde a la petición). Sin embargo, ¿sabías que TestMySite y PageSpeed Insights ni siquiera consideran esa velocidad en el cálculo del puntaje?
Así es. Este tipo de herramientas, sólo analiza el tiempo que le toma a un cliente renderizar la respuesta, es decir, el tiempo que tarda el navegador en mostrar el aspecto final de la página.
Piensa en tus viejos días de escuela: ¿las notas altas significaban que eras inteligente? No necesariamente. Sólo significaba que eras bueno con las pruebas y evaluaciones.
Pero mucha gente inteligente simplemente no sale bien en las pruebas y evaluaciones. Entonces, así como las evaluaciones escolares no son necesariamente un indicador de inteligencia, los puntajes de PageSpeed Insights y similares no son realmente un indicador de velocidad.
Aquí hay 3 sitios con una velocidad similar de carga, pero con puntajes muy diferentes:
Entre esos tres sitios, el tiempo de carga varía entre 456 y 596 milisegundos, pero el puntaje de PageSpeed varía entre 58 y 91.
En contraste, el siguiente sitio tiene una velocidad de carga muy pobre, y sin embargo presenta un buen puntaje en PageSpeed:
Con esto se evidencia que PageSpeed Insights y herramientas similares no son necesariamente un indicador de velocidad.
Ningún sitio obtiene un puntaje perfecto. De hecho, es en práctica casi imposible de lograr, y considerando que no se corresponde con la velocidad del sitio, ¿para qué molestarse?
Si persigues obsesivamente un puntaje alto intentando implementar todas las sugerencias, terminarás perdiendo tu paciencia (y quizás tu cordura) rápidamente.
No puedes tomar al pie de la letra las sugerencias de PageSpeed Insights y herramientas similares, porque a veces son irreales o imposibles. Por ejemplo: podría estar indicándote que minimices (minify) o que agregues información de expiración en el encabezado de archivos CSS o JS que no están hosteados en tu sitio. Esto es imposible.
En el ejemplo siguiente, solo Facebook y Google pueden agregar cacheo de esos archivos:
Además, si tu sitio usa un CDN (un servidor externo para alojar archivos y hacer el sitio más rápido), PageSpeed podría darte un puntaje más bajo, pero en muchos casos la utilización de un CDN mejora significativamente la velocidad de renderizado de tu sitio.
O tal vez si PageSpeed se está quejando porque podrías ahorrar 1kb compromiendo una imagen (ver la imagen debajo), no tiene sentido preocuparse por eso!
Una recomendación bastante común de PageSpeed es “Eliminate render-blocking JavaScript and CSS in above-the-fold content”
Típicamente recomienda dos acciones en relación a esto:
Es preferible para la performance que los archivos javascript sean cargados en el pie del sitio, o asíncronamente, para que no bloqueen la descarga de otros archivos. Pero lo que Google no tiene en cuenta es que, a veces, sencillamente no es posible cargar todo el javascript en el pie, por cuestiones de diseño o funcionalidad.
Esencialmente, lo que Google quiere aquí es que separes el CSS necesario para renderizar la primera parte de la página, y embeberlo directamente en el código de la página (en lugar de en una hoja de estilo CSS ). Si no eres un desarrollador, esto es realmente imposible.
Pero aún si eres desarrollador, notarás que la sugerencia, en muchos casos, es disparatada: en la mayoría de los casos implicaría una complejidad técnica de implementación y mantenimiento que no tendría demasiado sentido.
Este tipo de estrategias son utilizadas por sitios que tiene millones de peticiones por segundo, por lo tanto una diferencia de 10 milisegundos produce un impacto significativo en el total de recursos utilizados. Pero para la gran mayoría de los sitios, esas diferencias son imperceptibles.
Hace algunos meses, nuestro equipo técnico instaló un módulo de Google PageSpeed directamente en nuestro servidor web para realizar algunas pruebas. Se trata de un módulo de código que Google ofrece para instalar directamente en el servidor web, y se encarga de aplicar automáticamente todas las recomendaciones y sugerencias.
Sin embargo, para nuestra sorpresa, tras haber activado el módulo PageSpeed, notamos cómo el sitio tardaba mucho más tiempo en responder. Si bien el puntaje en PageSpeed había aumentado, las páginas tardaban más tiempo en responder, impactando negativamente en la experiencia del visitante.
Fue entonces que nuestro equipo técnico decidió concentrarse en optimizar los recursos del mismo servidor de Medios CMS (implementando técnicas de cacheo y balanceo de carga).
Google PageSpeed puede ser útil siempre y cuando no lo interpretes como una "la" regla a seguir. Simplemente debes considerar esta herramienta como una de muchas herramientas que puedes utilizar para obtener indicadores. Sólo recuerda que tu objetivo es mejorar tu velocidad actual del sitio, y no el puntaje que muestre una herramienta en particular.
Vía: Redacción de Medios.com.ar y WP Rocket
Asegurar que las imágenes de tu sitio web estén optimizadas es fundamental para mantener una carga rápida y ofrecer una experiencia de usuario impecable.
Con Criservis, los medios digitales pueden ofrecer una nueva capa de servicios verificados a sus audiencias, monetizando con facilidad a través de una plataforma intuitiva y segura.
Canva ha lanzado tres herramientas innovadoras impulsadas por IA: el generador de música, de voz y el borrador de IA. Descubre cómo funcionan y cómo aprovecharlas.
FlexClip, una innovadora herramienta ha lanzado recientemente su generador de Imagen a Imagen basado en IA, para transformar tus fotos en arte
Canva ha lanzado tres herramientas innovadoras impulsadas por IA: el generador de música, de voz y el borrador de IA. Descubre cómo funcionan y cómo aprovecharlas.
FlexClip, una innovadora herramienta ha lanzado recientemente su generador de Imagen a Imagen basado en IA, para transformar tus fotos en arte
Asegurar que las imágenes de tu sitio web estén optimizadas es fundamental para mantener una carga rápida y ofrecer una experiencia de usuario impecable.