Desmitificando Core Web Vitals para WordPress

Publicado: 2023-04-09

Core Web Vitals ahora representa un conjunto de métricas obligatorias para optimizar su sitio, especialmente si el SEO y el rendimiento del sitio son importantes para su estrategia digital. No obstante, puede ser difícil determinar qué herramientas y estrategias de WordPress son las más importantes cuando se trata de mejorar Core Web Vitals en su sitio.

Mire esta sesión para ver en profundidad las mejores prácticas y herramientas para comprender y mejorar sus puntuaciones de Core Web Vitals en su sitio de WordPress.

Video: Desmitificando Core Web Vitals para WordPress

Altavoces:

  • Alex Zuniga, Gerente de Producto en WP Engine
  • Mark Davoli, director de desarrollo web en Amsive Digital
  • Matt Chase, director de desarrollo de Vital Design
  • Sanjucta Ghose, desarrollador web sénior en WP Engine
  • Mike Crantea, Director de Ingeniería Frontend en XWP

Transcripción:

ALEX ZUNIGA: Hola y bienvenidos a Demystifying Core Web Vitals para WordPress. Soy Alex Zuniga, Gerente de Producto aquí en WP Engine. Y hoy, realmente vamos a discutir los entresijos de los principales elementos vitales de la web para su sitio web de WordPress. Core Web Vitals es una métrica obligatoria para optimizar si le importa optimizar su sitio para SEO, para el rendimiento del sitio. Pero puede ser difícil saber qué herramientas y estrategias de WordPress tienen más impacto. Únase a esta sesión para ver en profundidad cómo las mejores prácticas y herramientas pueden ayudarlo a mejorar sus puntajes vitales web para WordPress.

Ahora, sin más preámbulos, vamos a presentar a nuestros panelistas para esta sesión. Y antes que nada, se lo daré a Mike para que haga una breve presentación de sí mismo.

MIKE CRANTEA: Hola, soy Mike Crantea. Estoy ubicado en Islas Canarias España. Soy el Director de Ingeniería Frontend en XWP, donde he trabajado durante los últimos 17 años. Principalmente en el espacio de la tecnología frontend, me encanta el rendimiento web. Y estoy contento de estar aquí. Ey.

ALEX ZÚNIGA: Gracias, Mike. A continuación, tenemos a Matt Chase.

MATT CHASE: Soy el Director de Desarrollo de Vital Design en Portsmouth, New Hampshire. Fuerte enfoque frontal en mi trabajo. Así que hacemos muchas puntuaciones de Lighthouse y Core Web Vital.

ALEX ZÚNIGA: Impresionante. Gracias, Matt. y marca

MARK DAVOLI: Hola, soy Mark Davoli, director de desarrollo web de Amsive Digital. Nos hemos especializado en el espacio Core Web Vital para nuestro equipo, ya que el SEO es muy importante para nuestra empresa. Y por lo tanto, también lo son Core Web Vitals. Feliz de estar aqui.

ALEX ZUNIGA: Feliz de tenerte, hombre. Y por último pero no menos importante, Sanjucta.

SANJUCTA GHOSE: Hola. También soy de WP Engine. Soy parte del equipo responsable de mantener los sitios web de WP Engine. Y esto incluye los sitios que vinieron con Delicious Brains cuando WP Engine los adquirió. Y pasé buena parte del último año optimizando los sitios de Delicious Brain para Core Web Vitals. Así que creo que esta debería ser una conversación muy interesante. Feliz de estar aqui.

ALEX ZÚNIGA: Gracias. Gracias. Bueno, bienvenidos a todos nuestros panelistas. Y no podemos esperar a escuchar lo que tienes que decir. Así que vamos a desglosar estas preguntas por medición, administración, herramientas y expectativas del cliente cuando se trata de Core Web Vitals. Entonces, nuestra primera pregunta que queremos hacerles a todos, ¿por qué debería preocuparme por Core Web Vitals en primer lugar? ¿Y hasta qué punto debo centrarme en la optimización de Core Web Vital?

MARK DAVOLI: Puedo hablar de eso si quieres. Para mí, es muy importante asegurarse de tener una velocidad de página rápida. Y la razón por la que es importante está en las conversiones de resultados finales. ¿Bien? Entonces, cuando alguien visita un sitio web, cuanto más tarde en cargar, más probable es que abandone. Y si no tiene una velocidad de página rápida, no tendrá suerte y perderá potencialmente muchos negocios. Especialmente en una tienda de comercio electrónico.

SANJUCTA GHOSE: Así que sí. Estoy un poco de acuerdo con lo que dijiste porque si bien es muy importante para el SEO, también debemos recordar que Core Web Vitals es una medida del rendimiento percibido de tu sitio. Cómo percibe el usuario tu sitio. Y creo que es muy importante retener la atención de que el usuario percibe su sitio como receptivo, interactivo y estable. Cuáles son las cosas que mide Core Web Vitals. Así que creo que incluso más que los puntajes de SEO, es importante que la percepción del usuario sobre su desempeño sea importante. Y es por eso que debemos centrarnos en Core Web Vitals.

ALEX ZÚNIGA: Absolutamente. Matt, tuviste-

MATT CHASE: Sí, eso es, básicamente, lo que iba a decir, sí, el aspecto de SEO es excelente. Pero, en última instancia, codificamos estos sitios para las personas. Y queremos que esas personas tengan el sitio más rápido y ágil posible. Pero esto afecta a ambos mundos. ¿Bien? Entonces llegamos a una especie de: cuando sintonizamos estos Core Web Vitals, estamos haciendo una gran experiencia de usuario. Pero de una manera que satisfaga a los equipos de SEO, que a veces no siempre es una batalla fácil de ganar. Así que funciona para todos.

ALEX ZUNIGA: Habiendo dicho todo eso, sabemos que es importante. Pero, ¿cuáles son las mejores formas de medir nuestra puntuación?

MARK DAVOLI: Entonces, una de las formas en que medimos además de usar… bueno, está la herramienta Page Speed ​​Insight de Google, que es fundamental porque es la herramienta que usan para medirla. Correcto, entonces si quieres tener un impacto, usar esa herramienta es vital. También está su Lighthouse en el navegador, justo en Chrome DevTools, que es muy importante. Y Search Console tiene una excelente herramienta de experiencia de usuario de página para monitorear métricas de usuarios reales durante los últimos 28 días, lo cual es fundamental para el monitoreo a largo plazo.

SANJUCTA GHOSE: Sí. Por lo tanto, diría que Page Speed ​​Insights es una muy buena herramienta porque le brinda datos en tiempo real en el sentido de que Core Web Vitals se basa en datos de usuarios reales durante los últimos 28 días. Pero luego también puede ver su Informe Lighthouse, que se basa en datos de laboratorio. Y eso es lo que puede mejorar de inmediato porque toma algún tiempo antes de que pueda ver las mejoras en Core Web Vitals porque se mide en un período de tiempo.

Entonces, si está tratando de mejorar sus puntajes, creo que Lighthouse es una gran herramienta porque le brinda… le dice cuáles son sus oportunidades para mejorar. Por lo tanto, puede intentar implementar esas oportunidades de inmediato y ver cómo mejora su puntaje.

ALEX ZÚNIGA: Impresionante. Suena como un gran saludo para Lighthouse allí. Excelente. Excelente.

MIKE CRANTEA: Me gustaría agregar sobre este tema que el seguimiento de los datos de rendimiento de métricas de usuarios reales ha sido mejor para poder reaccionar más rápido a las degradaciones de rendimiento que han llegado a la producción. Las pruebas de laboratorio ayudan cuando estás en escena. Como decir que hay una degradación que no queremos propagar. Pero siempre va a pasar algo en la producción que podría ser una sorpresa. Y en lugar de esperar varias semanas a que aparezcan Search Console y las métricas de usuarios reales en la base de datos crucial, al realizar un seguimiento de ellas usted mismo con una biblioteca de Web Vitals, puede mantenerse a la vanguardia.

ALEX ZÚNIGA: Impresionante. Sí. Siempre tengo que adelantarme a esas sorpresas de producción que surgen a veces. Está bien. Bueno, gracias por responder a los de la medición. Ahora, analizando la administración, ¿cuáles son una o dos cosas que puede hacer que tengan el mayor impacto en Core Web Vitals?

MATT CHASE: Así que supongo que una cosa que me llama la atención es la carga perezosa como todo lo que puedas. Y diferir la carga de todo lo que puedas. Eso para mí es una especie de solución llave en mano que puedes hacer y ver una mejora inmediata. WP Rocket tiene un montón de casillas de verificación realmente muy fáciles que puede activar para habilitar ese tipo de cosas.

MARK DAVOLI: Sí. Y para mí, el enfoque clave es lo que llamamos el renderizado de la parte superior del pliegue. Así que asegúrese de que eso se renderice lo más rápido posible. Y como se mencionó anteriormente, diferir y cargar de forma diferida cualquier otra cosa que esté fuera de la pantalla para asegurarse de obtener la mejor puntuación posible. Dicho esto, WP Rocket es excelente por su función de secuencias de comandos de retraso. Pero tendemos a, como trato de limitar eso a GTM, o secuencias de comandos de anuncios de Google, o cosas por el estilo. Y realmente concéntrese en mejorar la arquitectura central real del tema que impulsa el sitio web para asegurarse de que esté optimizado al máximo. Por lo tanto, no confía en un complemento de terceros para tener ese tipo de impacto en el rendimiento.

MATT CHASE: Oh, absolutamente. Sí. Ambos extremos.

ALEX ZÚNIGA: Te tengo. Entendido. Y solo para aclarar, dijiste WP Rocket. ¿Y esa es la función de secuencias de comandos de retraso?

MARK DAVOLI: Sí.

ALEX ZÚNIGA: Impresionante.

MIKE CRANTEA: Una cosa que no recibe suficiente atención es el almacenamiento en caché. Pero el tiempo de respuesta rápido del servidor no garantiza una experiencia rápida. Pero si su servidor responde lentamente, está garantizando una experiencia lenta. Por lo tanto, hacer uso de todas las capas de almacenamiento en caché disponibles (caché del navegador, almacenamiento en caché de objetos, almacenamiento en caché de páginas) y tenerlas activadas y funcionales es un buen primer paso. Haz lo básico. Y luego puede trabajar hasta las optimizaciones de frontend. Comprobando lo que hay en tu cabeza. Y así sucesivamente y así sucesivamente.

ALEX ZÚNIGA: Excelente

SANJUCTA GHOSE: Sí. Y creo que tampoco debemos olvidarnos de optimizar nuestras imágenes. Creo que es muy importante porque muchos sitios web en estos días tienden a tener muchas imágenes. Así que creo que es importante que comprima sus imágenes, las sirva a través de un CDN y luego, como ya mencionó, cargue sus imágenes de forma diferida. Más importante aún, sirva imágenes receptivas. Entonces, puede usar el atributo de conjunto de fuentes de la etiqueta de imagen o la etiqueta de imagen para mostrar imágenes receptivas. He visto que eso realmente conduce a una gran mejora porque Core Web Vitals son primeras mediciones móviles. Por lo tanto, es muy importante que publiques imágenes receptivas. Es algo que a veces olvidamos.

Así que creo que las imágenes. Y también algunas cosas muy simples como minimizar su JavaScript en su CSS durante los pasos de compilación. Creo que eso también ayuda mucho. Es bastante simple de hacer.

MATT CHASE: Sí. Sobre ese tema, en realidad, ya que mencionas eso, WordPress distribuye una especie de sistema de compilación de paquete web empaquetado. Simplemente lo llaman en WordPress Scripts. Y nuestra agencia luchó durante mucho tiempo para tratar de mantener nuestro propio sistema de paquetes web. Y luego, cada ocho meses más o menos, alguna dependencia de nodo cambiaría y rompería toda nuestra cadena de herramientas. Pero WordPress mantiene esto para nosotros. Y ha sido un gran beneficio.

Y el paquete web que contiene, comenzamos a usar importaciones dinámicas para crear nuestro paquete principal de JavaScript. Así que estamos importando nuestras dependencias de nodo en tiempo de ejecución en lugar de agruparlo todo en un paquete principal de JavaScript, lo que nos ha permitido un control muy preciso sobre ese mismo tipo de carga diferida de secuencias de comandos. Solo en casos puntuales. Como cuando nuestro bloque está en la página.

MARK DAVOLI: Sí. También me parece muy importante asegurarse de ser muy selectivo con los complementos que usa en su sitio web. Puede obtener una gran cantidad de bloatware inesperado al instalar complementos de terceros. Así que trate de limitarlos a complementos de muy buena reputación y bien construidos. Y presta atención a lo que cargan esos complementos. Realmente, realmente puede ayudar a controlar el rendimiento del sitio. Y, lamentablemente, WordPress todavía depende en gran medida de jQuery para el uso de backend y demás. Pero no es realmente necesario para la interfaz. Entonces, si es posible, eliminar el soporte de jQuery de la interfaz del sitio web y apegarse a JavaScript nativo realmente puede ayudar con el rendimiento.

ALEX ZÚNIGA: Impresionante. Creo que ya nos estamos sumergiendo en esta área. Y mencionaste algunos. Pero aprovechemos un poco más eso con las herramientas. ¿Cuáles son algunas de las herramientas preferidas que le gusta usar para la optimización de Core Web Vital? ¿Y para qué tipo de casos de uso son mejores? ¿O hay algunos escenarios en los que no encajan bien?

MATT CHASE: Quiero decir, surgió antes. Pero en realidad, la herramienta Lighthouse en el navegador es algo a lo que realmente recurro porque son resultados inmediatos. Bien. Core Web Vitals es genial, pero su poder está en el hecho de que es un conjunto que se forma con el tiempo. Así que realmente no puedes cambiar algo y ver el cambio de número. En comparación con Lighthouse, en el navegador, realiza una actualización. Ve su entorno de desarrollo local y ejecuta una prueba de Lighthouse. E inmediatamente puedo ver, oh, mi desempeño saltó 15 puntos. Fresco. Era lo que había que hacer. Lleva eso a producción.

ALEX ZÚNIGA: Impresionante. ¿Alguna otra herramienta que te guste usar?

MIKE CRANTEA: Me gustaría dar un gran reconocimiento a la función de anulaciones locales en Chrome. Eso, en combinación con la pestaña Rendimiento, le brinda la capacidad quirúrgica de jugar cambiando incluso el orden de carga de los elementos en su sitio web. Y cuánto o poco eso impacta. Le brinda la supervisión necesaria para saber si vale la pena esforzarse en hacer un cambio determinado, o si simplemente prefiere dejarlo ahí y concentrarse en otras cosas que realmente tienen un impacto.

MARK DAVOLI: Y una cosa que creo que también es crítica es el monitoreo de la arquitectura del servidor. Bien. Por lo tanto, puede tener los mejores Core Web Vitals del mundo, pero si su servidor sufre una carga inusualmente pesada y no se da cuenta, de repente puede descubrir que su primera pintura con contenido cae drásticamente, lo que luego afecta prácticamente todo lo demás. Por lo tanto, esté atento a herramientas como New Relic o lo que sea solo para monitorear el rendimiento. Es fundamental vigilar de cerca solo para asegurarse de que tiene la infraestructura adecuada para renderizar su sitio web lo más rápido posible.

MIKE CRANTEA: Y ahí es donde tener el almacenamiento en caché activado y listo ayuda.

MARK DAVOLI: Y CDN.

MIKE CRANTEA: Sí. Evite algunos desastres potenciales.

ALEX ZÚNIGA: Excelente. Bueno, agradezco esa claridad allí. Entonces una de las preguntas. Hay muchos complementos de optimización para optimizar Core Web Vitals. ¿Cuáles son las limitaciones de los complementos de WordPress para ayudar con eso? ¿O realmente están optimizando el sitio? ¿O simplemente están posiblemente engañando las medidas de Google? Y supongo que tal vez sea una cuestión de, ¿es mejor? ¿Mencionamos que es mejor usar complementos o hacer el trabajo en lugar de confiar en un complemento allí?

SANJUCTA GHOSE: Creo que los complementos son geniales. Como por ejemplo, WP Rocket, por ejemplo, es genial. Usamos mucho EWWW Image Optimizer. Y creo que eso también es genial. Pero como creo que ya se ha dicho. WP Rocket, debe usarlo con cuidado porque si activa la función de diferir JavaScript, he visto casos en los que presenta errores extraños. Errores únicos. Así que preferiría, a veces, lanzar mi propia solución en lugar de usar un complemento. Siempre que tenga la experiencia en desarrollo.

Entonces, la mayoría de las optimizaciones que hicimos para los sitios de Delicious Brain las implementamos nosotros mismos en lugar de usar un complemento. Pero dicho esto, creo que los complementos son un excelente punto de partida. Entonces, cuando recién comienza, es posible que desee, por ejemplo, implementar la implementación de WP Rocket en su sitio de ensayo, y jugar y ver si rompe las cosas o no. O si trae mejoras reales. Así que creo que los complementos deben usarse con cuidado. Y tienes que saber qué está pasando en segundo plano, qué están haciendo los complementos. Y cómo podría afectar a su sitio.

MATT CHASE: Sí. Afortunadamente, creo que WP Rocket en versiones más recientes al menos ha sido bueno al etiquetar muy claramente los interruptores peligrosos que tienen. Porque también me han quemado muchas veces donde los scripts retrasados, e incluso los que no esperarías, como la optimización de CSS, de alguna manera han roto modelos donde no entendían lo que decía que un nombre de clase los haría visibles. . Así que fue un día emocionante.

Pero sí. WP Rocket es definitivamente mi opción, además de obviamente un buen código de entrada, un buen código de salida. Bien. Hacer el trabajo es siempre la mejor manera de abordarlo. Los complementos pueden automatizar cosas. Pero no hay sustituto para que su código sea simple y eficaz.

MIKE CRANTEA: Hay un complemento más que está marcado como un tipo de complemento de laboratorio. Eso es Performance Lab. Lo hace el equipo principal de rendimiento de WordPress. Y a pesar de que suena como algo aterrador, en todas mis pruebas hasta ahora ha proporcionado una estabilidad total. Y eso fue muy impresionante por lo que se suponía que era y la calidad del trabajo que terminó en ese complemento de Performance Lab. Así que vale la pena probarlo. Un par de casillas de verificación. Y todo lo que hay allí está a salvo. Bueno, no estoy tan seguro sobre el cambio de base de datos. Eso es algo más controvertido cuando lo leo. Sí. Simplemente no toques ese botón. Al igual que agregaron soporte SQLite o algo así dentro del complemento, que definitivamente funciona para algunos sitios web más pequeños.

ALEX ZÚNIGA: Interesante.

MARK DAVOLI: Sí. Y para mí, WP Rocket es fantástico. Limitamos su uso en la mayoría de nuestros sitios porque la mayor parte de lo que hacemos está construido de forma nativa. Pero hay muchas otras características en Core WordPress que, si se usan correctamente, realmente pueden brindarle un sitio bien optimizado. Como usar el Editor de bloques en lugar de un tercero como Elementor o etcétera, puede agregar mucha hinchazón a un sitio. Entonces, si construyes como el nuevo sistema de bloques de tipo nativo de Gutenberg, y realmente cargas archivos según sea necesario en lugar de cargar todo a la vez en cada página, por ejemplo. Ahora se han incorporado funciones de carga diferida en WordPress. Entonces, monitorear cómo se usa y usarlo apropiadamente, etcétera. Y luego agregar una herramienta como WP Rocket para mejorar lo que ya existe. Pero no depender únicamente de ello.

Puede ser beneficioso para llegar allí, especialmente si tiene un sitio que no funciona bien. Pero como se mencionó, al igual que la generación crítica de CSS, esas cosas pueden tener muchos problemas porque hacen muchas suposiciones basadas en lo que ve su bot en su página. Pero no puede predecir cosas que no generarán vistas iniciales. Entonces, si tiene modelos, como se mencionó, esos aparecen, no sabrá que esa es una posibilidad. No generará el CSS para él y lo alineará correctamente. Entonces, como hacer cosas como precargar sus fuentes clave o renderizarlas en la parte superior de la página. De nuevo, esa es la clave. Realmente lo más importante.

SANJUCTA GHOSE: Sobre el tema de CSS crítico, solo quería intervenir y mencionar que Addy Osmani tiene esta increíble herramienta llamada Critical. Puede agregar eso a su proceso de compilación para generar su CSS crítico. Es impresionante. Y es muy confiable. Entonces, como mencionaste CSS crítico, pensé en agregar eso. Lo siento por cortarte.

MIKE CRANTEA: Eso está bien. Sobre el mismo tema del CSS crítico, el equipo de Jetpack se ha esforzado por hacer algo con el complemento Jetpack Boost. Eso hace una forma muy, muy interesante de generar el CSS crítico al representar las páginas en iframes o algo así. Eso proporciona cuando funciona, es una gran solución. Cuando no es así, te dice, oye, aquí no funciona. Solo muévete. Necesitas algo más. No siempre es fácil llegar al CSS crítico. Por otro lado, hace 4 o 5 años, el CSS crítico era súper grande. Ayudó mucho.

En los últimos dos o tres años con los avances de HTTP/3, tener un CSS crítico que se bloquea tiene un impacto muy pequeño para tener 100 kilobytes o algo de CSS en línea. Es hacer que un sitio web funcione tan rápido como un sitio web que solía tener CSS crítico hace cuatro o cinco años. Así que no tengas miedo de tener un CSS de tamaño decente dentro de tu sitio. No tienes que deshacerte de él. Y he visto sitios web que estaban súper optimizados.

Tenemos en CSS crítico como 100 kilobytes de CSS en línea. Y render blocking, jQuery y otros dos scripts que no se usaron. Es como, yay. Estás frustrando el propósito con eso. Nos puede ayudar a durar un 5% tipo de acercamiento. Pero si empiezas por eso, mira lo primero.

ALEX ZÚNIGA: Impresionante. Impresionante. Creo que todas esas herramientas. Es genial escuchar esos gritos. Y genial escuchar esas sugerencias y recomendaciones. Y mucho de eso gira en torno a nuestra próxima pregunta. ¿Cuáles son los aspectos únicos de trabajar en WordPress específicamente con Core Web Vitals? ¿Es que tiene que hacer esto a través de complementos en lugar de hacerlo con cualquier otra pila tecnológica? ¿Es más fácil con WordPress? ¿Hay más herramientas disponibles? Como acabamos de mencionar, todos ustedes acaban de disparar muchas herramientas. ¿Es más fácil con WordPress? ¿Es más difícil con WordPress? ¿Qué toman?

MATT CHASE: Creo que es muy fácil con WordPress. Así que hablamos un poco sobre, o mencioné el paquete de nodos de scripts de WordPress que distribuyen, que es simplemente un gran tipo de sistema de compilación de paquete web en una caja. También tienen el bloque Crear de WordPress, que es una forma realmente rápida y fácil de iniciar un bloque personalizado para su sitio basado en WordPress. Pero está construido de tal manera que gran parte del código adhesivo, por así decirlo, está escrito para ti. Así que ya es inteligente acerca de... Mark, solo mencionaste esos guiones cuando se suponía que debías hacerlo. Entonces sabe si su bloque está haciendo eso desde el principio. Ni siquiera tienes que pensar en ello. Así que WordPress hace que ese tipo de cosas sea realmente fácil.

MARK DAVOLI: Sí, absolutamente. Y es de código abierto. ¿Bien? Así que puedes cambiar casi cualquier cosa. Es mucho más difícil cuando trabajas con un sistema cerrado para optimizar Core Web Vitals versus WordPress debido a eso. Y cuando Core Web Vitals se anunció por primera vez, aún no había llegado. Fue mucho más desafiante. Realmente han recorrido un largo camino al agregar muchas de estas características, especialmente con el editor de bloques y la construcción basada en bloques, etcétera, para optimizar realmente esa capacidad de cargar activos, archivos CSS, archivos de fuentes, etcétera de manera selectiva. Así que sí. Ha sido genial.

ALEX ZUNIGA: Esa es probablemente la llamada de sistema cerrado versus fuente abierta. Adelante, Sanjucta.

SANJUCTA GHOSE: Sí. Sí. Y creo que porque hay muchos proveedores de hosting dedicados a WordPress. Y como dijiste. WordPress es de código abierto. Entonces, hay muchas optimizaciones en torno al alojamiento de sitios de WordPress. Y creo que ya hay mucho soporte disponible si estás construyendo sobre WordPress, lo que significa que no tienes que reinventar la rueda. Así que creo que definitivamente es más fácil si está construyendo sobre WordPress para optimizar su Core Web Vitals.

ALEX ZÚNIGA: Hermoso. Entonces, hemos hablado sobre cómo medimos esas herramientas, qué usamos para mejorar realmente nuestros Core Web Vitals, algunas de las herramientas. Ahora, cuando hablamos de las expectativas del cliente, ¿en qué etapa de un nuevo proyecto comienza a considerar Core Web Vitals como parte de su desarrollo o estrategia? ¿Es así cuando comienzas como tu plantilla básica repetitiva? ¿O es algo que optimizas un poco más adelante en la historia? Que hacen todos ustedes?

MATT CHASE: Sí. Creo que para mí es más una forma de construir cosas para empezar que algo que le haces a un sitio web no optimizado. Es desde el principio. Y está ahí en cada línea de código que escribes idealmente. Intento no hacerlo, no quiero construir un gran sitio optimizado y luego volver más tarde y arreglarlo. Quiero tratar de escribir tan limpiamente como pueda desde el principio. Y luego, por lo general, encuentro que hacerlo de esa manera, exprimir ese último jugo de optimización al final es un poco más fácil.

MARK DAVOLI: Sí. Tiene toda la razón. Comenzamos a construirlo desde el primer momento. Quiero decir, hay componentes que no suceden más cerca del final. No vamos a ejecutar imágenes a través de una optimización de imagen hasta que esté más cerca del lanzamiento. Pero realmente no tiene que hacerlo ni siquiera en la construcción en sí, sino incluso en el proceso de diseño a veces, es importante pensar en cómo se está diseñando el sitio si está tomando en cuenta Core Web Vitals. Porque arquitectónicamente, es más desafiante implementar ciertos diseños para que sean rápidos en comparación con otros. Por lo tanto, es muy útil comprender eso y educar a los diseñadores sobre lo que podría hacer que una implementación sea más difícil en comparación con lo que no.

MIKE CRANTEA: Y dictar los límites. Oye, solo puedes tener hasta x teléfonos. No deberías traer 25 a la mesa con todas sus variaciones. Eso ayuda desde la fase de diseño. Además, sin tener algunos puntos de contacto que suceden durante la duración del proyecto, a veces es fácil lograr algunas cosas. Como un sprint siete solicitudes para agregar un complemento de prueba a la mezcla. Si eso no se controla, lo encuentras un poco al final. Así que mis recomendaciones son procesar esto cada par de sprints. Verificamos nuestras mediciones automatizadas de la puesta en escena de cómo evolucionan las cosas. ¿Qué pasó con las últimas cosas que se empujaron para ir? ¿Las cosas se ralentizaron? ¿Necesitamos tomar alguna medida correctiva antes de tiempo en lugar de ser reactivos al final de un proyecto?

SANJUCTA GHOSE: Sí. Estoy de acuerdo. Es muy importante que comience desde la fase de diseño porque le gustan las cosas simples, como si debe haber una ventana emergente, un banner publicitario o algo así. A veces hace una gran diferencia en su puntaje de diseño acumulativo. Así que es bueno saber por adelantado lo que va a pasar. Ya sea que tenga una ventana emergente o un banner entrante. Y no quiere sorpresas hacia el final de su proyecto. Así que creo que es muy importante involucrar al cliente oa las partes interesadas desde la fase de diseño y decirles que esto podría tener un impacto en su Core Web Vitals para que puedan tomar una decisión informada.

MARK DAVOLI: Eso también es muy útil después del lanzamiento porque tan pronto como su sitio está fuera de la puerta, a veces puede ser como, lancemos un widget de chat o lo que sea más adelante. Entonces, de repente, hay un problema. Y luego tienes que pensar en cómo logramos que esto se integre y optimice. Por lo tanto, la función de secuencias de comandos de demora puede impulsar la mayoría de los píxeles publicitarios, que son notoriamente malos para matar su puntaje Core Web Vitals. Pero a veces no se puede retrasar algo porque es importante para lo que el cliente realmente quiere. Así que equilibrarlo lo mejor que pueda y asegurarse de comunicar los impactos potenciales. Y el resultado final es conseguirlo lo más rápido posible. A veces hay que hacer sacrificios por la funcionalidad. A veces no lo haces. Pero consíguelo lo más rápido que puedas para aumentar esas conversiones.

ALEX ZÚNIGA: Excelente. Excelente. Así que escucho algo así como mejores ingredientes hacen mejores sitios web desde el principio. No es que vayamos a aplicar algunos Core Web Vitals al final. Es algo que realmente es una forma de vida si quieres pensarlo de esa manera primero. Bueno, genial. Así que solo nuestra última pregunta. ¿Alguna vez ha tenido problemas para transmitir a sus clientes el valor del tiempo que dedica a trabajar en Core Web Vitals? ¿Es eso algo que alguna vez rechazaron? ¿Alguna vez no entienden por qué estás haciendo ese trabajo?

MATT CHASE: En realidad, no creo que haya recibido ningún tipo de rechazo. En todo caso, es algo así como lo contrario. Por lo general, es lo que queremos el rendimiento. Queremos Core Web Vitals. Hagamos que suceda. Diré que no siempre reflexionamos sobre: ​​hablamos sobre el seguimiento de píxeles y cómo son notorios por reducir ese puntaje. Pero a nadie le importa Somos como píxeles, píxeles, píxeles, píxeles. Por lo tanto, las personas deben pensar en sopesar realmente ese costo-beneficio cuando agregan el seguimiento porque no es tan simple como simplemente lanzarlo y obtener resultados. Porque hay un costo.

ALEX ZÚNIGA: Impresionante.

MIKE CRANTEA: Creo que con el rendimiento hay falta de paciencia. Entonces, si estás pensando, oh, hagamos un trabajo de rendimiento que dure un par de sprints, después del primero. ¿Cuándo lo veo? ¿Cuándo lo veo? La planificación para lanzarlo de forma iterativa, como aumentar una función, una función, una función aumenta la confianza del impacto que tiene este trabajo. Y cuanto más vea que esto se traduce en conversiones y cambios, más rápidamente se percibe el valor sin tener que dedicar mucho tiempo al trabajo educativo.

MARK DAVOLI: Sí. Y creo que una cosa que podría ser difícil de entender para los clientes es la diferencia entre las métricas de los usuarios reales y los datos de laboratorio. Porque muchos de ellos pueden ejecutar sus propias pruebas y demás. Y no entiendo completamente. Entonces, ayudarlos a comprender que la parte del resumen de origen de la página es la información es realmente la que Google usa para efectuar la clasificación SEO y cosas así. Porque muchos de ellos vienen buscando ese puntaje y optimizándolo. Y ayudarlos a comprender que se necesitan 28 días para medir cualquier cambio realizado en la producción antes de tener la gama completa de cómo su cambio afectó las cosas.

ALEX ZUNIGA: Esa es una gran llamada. Gran convocatoria.

MIKE CRANTEA: Y debería mencionar una de las métricas que es la más confusa de todas. Las métricas de interactividad. Esos han sido notoriamente volátiles. Y para algunos tipos de personas a las que les asustan más las variaciones en la puntuación, es como si esa nueva función que construimos ralentizara significativamente el sitio web. Y luego vuelve a pasar la prueba y es como subir 10 puntos y luego bajar 10 puntos. Explicar esta variación lleva mucho tiempo. ¿Por qué no es solo un número el que es consistente? Bueno, eso es algo tan difícil como nombrar cosas y almacenar en caché.

ALEX ZÚNIGA: Bueno, increíble. Parece que realmente apreciamos todos sus aportes, todos sus comentarios sobre Core Web Vitals. Cómo usarlos, qué usar para medirlos, cómo establecer las expectativas del cliente para todo eso. Realmente ha sido una lección de aprendizaje. Esperamos que nuestros panelistas hayan disfrutado de su tiempo aquí. Definitivamente disfrutamos escuchar todos sus comentarios. Y esperamos que los asistentes aquí también hayan recibido buenos comentarios.

Así que a todos ustedes, muchas gracias por su tiempo. Bueno, ese fue nuestro panel. Realmente queremos agradecer a todos nuestros panelistas. Queremos agradecerle por asistir a este panel. Y esperamos que lo paséis en grande viendo el resto de nuestras sesiones a DE{CODE}.