Tech Breakout Summit/2021: Mejore su sitio web con una visión básica básica de vistas básicas

Core Web Vitals de Google ofrece orientación unificada para el rendimiento del sitio web relacionado con la experiencia del usuario y redefine cómo se miden los sitios web. Google ya ha comenzado a usar Core Web Vitals como una señal que influye en la clasificación del sitio en busca de Google. En 2021, su propio equipo de marketing web de WP Engine realizó el principal proyecto de comprensión y toque de> 90% de vital web central. Esta sesión proporciona una mirada más cercana a ese proyecto y el uso de un nuevo navegador Relic para obtener información del mundo real sobre elementos que afectan los vitales de la web central.
VIDEO: Mejore su sitio con una vista en tiempo real de las principales diapositivas web de Vitals de esta sesión, WP Engine Ryan Hoover Web Development Manager y el principal gerente de productos New Relic Lindsy Farina Talk:
El impacto que Core Web Vitals tendrá en su negocio en 2021 y más tarde y cómo comprender sus puntajes utilizando herramientas como New Relic Browser.
La importancia de los datos reales de los usuarios para superar las limitaciones de las pruebas sintéticas y tener la tranquilidad de que tiene control sobre cómo Google señala la experiencia de usuario de su sitio.
Hay muchas formas de pivotar, cortar y cortar los datos para descubrir qué es importante para usted. Usted es el maestro de sus datos con una nueva reliquia. Le permitiremos tener acceso a todo esto y queremos poder construir las experiencias que son importantes para usted.
Lindsy Farina, gerente de productos senior New Relic Transcript Text Integral Lindsy Farina: Hola a todos y bienvenido a nuestra discusión hoy sobre cómo mejorar su sitio con Core Web Vitals de Google. Mi nombre es Lindsy Farina y soy de New Relic. Soy un gerente de producto senior allí. Estuve allí un poco más de dos años, centrándome en el rendimiento de la red front-end, y también extendiéndome a otras áreas de nueva reliquia, como nuestra detección de productos genial llamada Lookout. Y hoy me presentaré a Ryan, quien se le presentará. Ryan Hoover: Soy Ryan Hoover. Soy el gerente de motores de WP de nuestro equipo de desarrollo web. Estamos trabajando para garantizar que las propiedades web del motor WP realmente presenten lo que es posible con WordPress y WP Engine Technologies. Lindsy Farina: Genial. Así que hoy pasemos por una agenda rápida de lo que hablaremos. En primer lugar, queremos asegurarnos de comprender qué son los vitales web básicos, porque, para optimizarlos, necesita saber cuáles son. Le daremos información sobre cómo los mide. Y luego, algunas de las cosas interesantes que puede hacer con el nuevo navegador Relic, no solo los vitales de la web central, sino cualquier otra cosa. Y luego echaremos un vistazo a lo que WP Engine ha hecho por su cuenta para hacer este viaje de optimización y llevar su sitio a igualdad de vital web.
Ryan Hoover: Comencemos a hablar sobre cuáles son los elementos web vitales y por qué estamos hablando tanto de ellos hoy.Hemos estado hablando del rendimiento web durante décadas y hemos tratado de descubrir cómo hacer la web rápido, cómo hacer que las experiencias de los usuarios sean buenas al visitar nuestros sitios web.He usado muchas medidas y procesos diferentes a lo largo de los años.Hablamos sobre el tiempo de primer byte, eventos de carga de ventanas, documento listo, todo tipo de métricas diferentes, pero siempre ha sido un poco desagradable y un poco artificial.El año pasado, en el verano de 2020, Google ha lanzado sus estándares centrales de Web Vitals, que son muy claros estándares sobre cómo debemos medir la experiencia de la página.Va más allá de lo rápido que se ha cargado el contenido a lo que siente el usuario.
Con elementos web vitales, Google ha decidido duplicar realmente para asegurarse de que la web sea un lugar útil para todos, que todos tengan una buena experiencia cuando visitan los sitios. Por lo tanto, prácticamente presiona a las empresas y propietarios de sitios web del sitio en todo el mundo para comenzar a promover sus experiencias de página, incluidos esos elementos vitales básicos en los productos diarios de Google. A partir de este mes y lanzándose hasta agosto, Google aumentará lentamente la forma en que Core Web Vitals incluye en su clasificación de búsqueda. Utilizo esto como otra señal del rendimiento de su sitio, con qué frecuencia las personas lo visitan y, por lo tanto, ingresaré su clasificación de búsqueda orgánica. También considerará la efectividad de sus anuncios de búsqueda pagados. Verá posibles cambios en el costo por cllic. Verá cambios en la cantidad que muestran sus comerciales y algo que Google ha entendido es que podría lanzar lo que personalmente apodamos “un lote rápido”.
Básicamente, para los sitios que tienen una buena experiencia de página, Google etiquetará esto en los resultados de búsqueda. No necesariamente lo considerarán lento, pero destacarán aquellos sitios que tienen una muy buena experiencia de búsqueda, lo que les dará más tráfico. Esta es la oportunidad de Google de tratar realmente de llevar a la idea de que la experiencia de la página es esencial y que estos son los valores que uso para definir cómo se ve una buena experiencia de página. Lindsy Farina: Entonces, hablando de estos valores, ¿qué son y qué significan para ti? Lo que siempre me gusta recordar es que todos somos consumidores de sitios web y, por lo tanto, todos queremos una buena experiencia. Y, clásicamente, con el tiempo, a medida que nos adaptamos a Internet, nos volvimos increíblemente impacientes y pedimos la mejor experiencia cuando accedemos a un sitio web. ¿Y cómo se ve y siente la mejor experiencia? Y Google decidió que estos tres valores son las cosas que responden a esta pregunta. Entonces verás LCP, FID y CLS. Entonces, ¿qué significan?
La pintura más grande llena de contenido. Es, en esencia, cuánto tiempo lleva hasta que se carga en mi página de contenido más importante o clave. ¿Qué es lo más importante y cuánto tiempo lleva allí? Primer retraso de entrada, que es mi valor favorito. Es realmente ese tipo de amable, genial, me agradaste. ¿Qué es? ¿Qué está haciendo? ¿Puedo usarlo? Si hago clic en ese botón, ¿sentiré que es rápido? Y si no obtengo una respuesta cuando hago clic en ese botón, ¿qué sucede cuando empiezo a hacer clic correctamente? Entonces, esa experiencia que todos tuvimos cuando recibimos una carga rápida de contenido visual, vamos a hacer clic en ese botón de autenticación y no sucede nada y hacemos clic 75 veces y luego dejamos la página. Por lo tanto, optimizar ese retraso para la primera introducción es realmente en lo que desea centrarse para evitar que los usuarios sientan la frustración de sentir que su sitio web no funciona.
Y luego CLS, así que esto es: se llama cambio de diseño acumulativo y este es el que probablemente sea el nuevo niño. Todavía no se ha considerado tanto en los puntajes del faro, pero es esa debilidad, esa sensación de que su sitio está agitado. Así que vaya a una página, suponga que lee una noticia y de repente aparece un anuncio en el medio de su página. Es una experiencia terrible para el usuario. Como si estuviera en medio de consumir algo en su sitio y ahora ha desaparecido y tengo que marchar y encontrarlo. Entonces, no solo dijeron que está bien, estos son los tres valores que le dirán que usted es visualmente bueno, la capacidad de respuesta es que su estabilidad es buena, sino que le han dado intervalos clave que dicen lo que es bueno. Así que no tienes que adivinar que 3 segundos son lo suficientemente buenos para ello. Dieron momentos discretos en el tiempo y para el CLS, es un poco diferente. Es un puntaje. No es una cantidad de tiempo. Por lo tanto, tiene estos intervalos y también le dijeron que le pregunte a su población con el percentil 75. Por lo tanto, el 75% de su población enfrenta algo en este rango y esto es realmente lo que desea centrarse en levantarse en ese buen lugar verde.
¿Qué es lo siguiente?Enseñando a Ryan a hablar sobre algunas de las formas en que puede verlos hoy.Ryan Hoover: Está bien.Hablemos de algunas de las herramientas que puede usar para descubrir cómo manejar estos tres valores diferentes.Google nos da dos herramientas en el cuadro que podemos usar.Tenga la base de datos de la experiencia del usuario de Chrome, la base de datos de Crux.Este es un conjunto masivo de datos.Todos usan Chrome como navegador web y, cada vez que visita cualquier sitio web, cualquier página web, a través de Chrome, necesita la experiencia que tuvo y envíe de regreso a esta base de datos masiva.Tiene miles de millones de grabaciones en el interior.
Chrome también presentó esto a BigQuery e hizo público que todos nos interrogaran. Por lo tanto, puede ir a ejecutar informes y ver cómo va su sitio y cómo ha evolucionado históricamente. Es increíblemente útil y este es también el conjunto de big data que Google usa para ver cómo lo hace. Esta es su fuente para determinar qué tan bueno es su sitio, desafortunadamente tiene sus limitaciones. En primer lugar, no puedes profundizar más que todo tu dominio. No puede ver cómo está su blog o en esa nueva página de destino que acaba de lanzar. No puedes mirar esos tonos. También lanzan datos mensualmente en la segunda semana del mes. Así que la semana pasada recibí los datos para mayo. Desafortunadamente, eso significa que siempre estás un poco atrasado y eso significa que realmente no puedes olvidar cómo te va ahora. Además, Google nos ofrece, a través de la consola de búsqueda del sitio web, más información más allá de las que obtiene directamente en Core Web Vitals para sus propios campos, cosas que registró en la consola de búsqueda del sitio. Le darán un colapso en los dispositivos móviles y de escritorio y realmente lo calificarán como débil, requerirán mejoras o buenos para diferentes valores. Le permitirán detallar un poco y le mostrarán grupos de URL que pueden tener problemas. Esto le dirá si su blog tiene problemas, pero no necesariamente vinculará problemas a un solo blog que pueda retrasarlo. Ambas son grandes herramientas. También conducen realmente en casa ese percentil 75 que Google enfatiza para tres de cada cuatro visitantes a su sitio.
Para obtener una buena experiencia. Si algunos vagabundos todavía tienen una mala experiencia, tienen un largo tiempo de carga, está bien para Google. Y esto te ayuda a presentarte o mostrarte cómo se ve y cómo lo haces. Desafortunadamente, ninguno de estos te da buenas vistas. Allí las pruebas sintéticas entran en el juego. WebPageTest es algo que los desarrolladores web han estado utilizando durante años para probar cómo están sus sitios, cómo cobrar. De hecho, se ha actualizado recientemente, con una gran actualización para incluir vital de la web central en los valores que muestra. Informan esos datos para usted y también incluyen todas las otras funciones que conocemos y nos gustan para más pruebas de página, como gráficos de cascada, carga de recursos, tipos de contenido, todas las cosas excelentes que amamos en WebPageTests. Google también lanzó Lighthouse. Lighthouse es un software de código abierto que Google ha instalado GitHub, que ejecutará una prueba en su sitio e informará el puntaje del faro. O, si está acostumbrado al rendimiento de la página, el instrumento de rendimiento de la página de Google también está usando Lighthouse. Entonces, esto reduce ese hermoso puntaje pequeño del 1 al 100. Verá en la pantalla, tenemos un ejemplo de una de nuestras páginas con un puntaje de 85. Estamos haciendo bastante bien, no lo mejor que podamos ser, pero estamos haciendo Bastante bien allí. Esto es genial al darle una puntuación holística buena y simple, y también le brinda más detalles sobre lo que ese bot cuando ha hecho una prueba en su sitio.
Puede ver cuál fue el mayor contenido lleno de contenido, que fue el cambio de apariencia acumulativo. De hecho, no verá la demora en la primera entrada. Es un poco extraño, lo que requiere una visión más holística de múltiples visitas, pero le da cosas como el tiempo de bloqueo total y el índice de velocidad que tiene en cuenta ese retraso en la primera entrada. Lamentablemente, ambos tienen un problema. Estas son ambas pruebas sintéticas. Este es un hocico que va a un solo sitio web, una sola página web que dio, a la que dijo que acceder a los rastreadores, cargue esa página una vez y solo informe lo que vio en esa página para esa carga. Eso lleva a muchos problemas. De hecho, las pruebas sintéticas pueden darle una falsa sensación de éxito. Vimos esto nosotros mismos en wpengine.com. Comencé un gran esfuerzo para aumentar los puntajes centrales de la web vital en octubre del año pasado. Nos quedamos abajo. Escuché algunos rumores de que Google podría ir en esta dirección y considerarlo, así que dije que nuestros puntajes no están donde debería estar. Honestamente, estaban en los años 20. No nos vimos muy bien en términos de nuestros puntajes del faro. Así que nos propusimos obtener esos puntajes más grandes. De hecho, bastante rápido, llegué a ese puntaje hasta las 98. Fui genial. Sentí, aplasté esto, lo hicimos muy bien. Luchamos sobre nuestras espaldas, fuimos a nuestro negocio. Revisé un mes después, cruzé la base de datos de Crux, miré lo que dijo Crux y, de hecho, no vi ninguna diferencia. Realmente no moví la aguja a lo que dijo Crux.
Así que comenzamos a cavar un poco más y verá en estos gráficos que tenemos, sé que son desordenados, no cavaremos demasiado en ellos, pero simplemente no son demasiado grandes. números allí. La gente no vio buenas experiencias en nuestros sitios web. Tuvimos que regresar y mirar y, de hecho, lo que descubrimos es que la forma en que el hocico cargó la página y el registro era diferente de cómo lo hicieron los usuarios. Y usamos algunos trucos y técnicas para contenido perezoso que realmente era justo: el hocico nunca lo vería. Entonces, la gente todavía recibía contenido cargado perezosamente, y esta carga perezosa todavía nos lleva al punto en que no vimos las ganancias que queríamos. Así que estaba en un punto difícil. Teníamos estos datos antiguos de Google que simplemente no eran lo suficientemente buenos para nosotros. No estaba actualizado, por lo que podríamos trabajar activos para obtener estos puntajes más altos. No era lo suficientemente receptivo. También tuve estas pruebas sintéticas que simplemente no encajaban, como si supiera que no coincidían con lo que realmente estaba sucediendo. Necesitaba algo mejor. Miramos a su alrededor y, de hecho, algunos de nuestros nuevos socios de reliquias nos han guiado a un nuevo navegador de reliquias, y esto realmente nos ha convertido en la respuesta. Entonces Lindsy explicará un poco sobre cómo funciona el nuevo navegador Relic. Lindsy Farina: Genial. Entonces sí, nuevo navegador de reliquias. No somos solo un reportero de Web Vitals. Queremos echar un vistazo a todos sus datos para sus usuarios, ¿verdad? Todo lo que sucede desde la perspectiva del usuario real.
Cuando hablamos de algunas de las cosas que puede obtener de esas pruebas sintéticas, sobre estos valores de rendimiento percibidos centrados en el usuario que ha escuchado, no solo esos tres. Hay muchos, muchos más. Son delimitados por el usuario real versus el laboratorio. Por lo tanto, algunos de los valores son solo un laboratorio, como el tiempo de bloqueo total o el tiempo de interactiva, y algunos de los valores son solo ron, lo que significa que un usuario debe involucrarse efectivamente con el sitio. Por lo tanto, la primera demora de entrada se basa en el hecho de que debe hacer algo. Por lo tanto, un hocico realmente no hará clic en algunos botones y, por lo tanto, no puede informar esos datos. Pero desde la perspectiva de un usuario real, sabemos cuándo sus usuarios están haciendo clic en los botones. Sabemos cuando sus usuarios toman medidas o cambian la ruta o hacen las cosas y, por lo tanto, podemos informar toda esta información. Entonces, además de los vitales de la web central, que obviamente ponemos al frente y en el centro de la página de resumen de su aplicación, también informamos cosas como sus errores de JavaScript, porque ningún buen producto sería bueno sin decirle si tiene errores. Puede realizar muchas mejoras de rendimiento, pero si no tiene un buen apoyo en sus errores, puede perder algunas cosas clave que lo frustra. Y luego queremos poder echarle un vistazo, ningún buen front-end es compatible con un buen back-end. Así que mire su flujo de datos, su solicitud AJAX, hasta sus servicios.
de back-end. Entonces, si algo no funciona bien, por ejemplo, un trabajador aguas abajo que se comporta de manera anormal, puede seguir esto hasta el final y finalmente puede decidir a quién culpar por ese mal desempeño del cliente, por lo que le damos esto y también con Todos estos datos ricos, le ofrecemos la oportunidad de comprender quiénes son sus clientes. Como si hubiera tantos atributos diferentes asociados con sus datos que le dicen mucho sobre cómo sus clientes piensan y se mueven a través de su sitio, dónde están en el espacio. Y esto es realmente lo que necesitará para comprender el rendimiento y cómo prioriza los datos. Y, finalmente, el objetivo es realmente querer tomar toda esta información, estar armado con toda esta información y moverse de ese estado reactivo en el que recibe una llamada de ayuda y debe ir e intentar romper algo a un estado más proactivo . estado. Use estos elementos vitales básicos para encontrar estos problemas antes de que ocurran y resolverlos para que sepa que está ofreciendo una buena experiencia del cliente. Por lo tanto, suena aterrador, especialmente si nunca se ha dedicado a su propio viaje de rendimiento en su negocio.
¿Dónde empiezas, verdad? Y lo que quiero hacer siempre es una especie de lo que acabo de decir, ya que sería conocer a sus clientes. Descubra qué tipo de sitio administra. Si es un sitio de noticias, debe dar prioridad a la estabilidad y el contenido. Está menos involucrado en hacer clic en los botones y tomar medidas, pero si es un sitio de comercio electrónico en el que realmente necesita que las personas pasen por una experiencia de compra sin problemas, haga clic en ese botón, agregue a una canasta, vaya a completar el ordenar. Entonces, realmente desea concentrarse en asegurarse de que su página esté rápidamente cargada y muy receptiva. Por lo tanto, cosas como mi hilo principal es un uso súper para actividades que evitarán que procese esa acción cuando el usuario haga clic en un botón. Y luego tome toda esta información y luego descubra dónde comienza. Encuentra ese puñado de usuarios que enfrentan esa mala experiencia. Concéntrese en la URL de que conoce a la mayoría de la mayoría, si no a todos, a sus usuarios, como si fuera su página de inicio, desea concentrarse directamente desde la puerta. Tal vez sea tu experiencia de inicio de sesión. Tal vez sea tu experiencia con tu carrito de compras. ¿Qué sabe sobre su propio sitio, como expertos en el campo, lo que lo ayudaría a decidir qué lugar es el más importante? Y con el nuevo navegador Relic, podemos ayudarlo a obtener todos estos datos para definir esa experiencia.
Por lo tanto, hay muchas maneras de pivotar, cortar y cortar los datos para descubrir qué es importante para usted. Tenemos experiencias fuera de la caja, pero lo dejamos y creamos un tablero en su cuenta propia. Si usted, usted es el maestro de sus datos con una nueva reliquia. Le permitiremos tener acceso a todo esto y queremos poder crear experiencias que sean importantes para usted. La otra cosa que recordaría es que si actualmente no es un cliente reliquia nuevo, hay una opción gratuita disponible donde pueda Comience a jugar con él, cargue los datos, consulte qué agente de instalación y que puede tener cada función disponible para usted, lo cual es sorprendente. Pero ahora que tiene una idea de a dónde va, concéntrese en esa experiencia del cliente, porque esto es todo. Mejore la experiencia para sus clientes, por lo que lo que funciona para una empresa puede no ser la misma historia de un viaje de rendimiento a la suya. Por lo tanto, es muy importante no ser atrapado por el hecho de que hay todos estos valores diferentes y que debe ser perfecto. Eso no sucederá. No sucederá directamente desde la puerta, pero puede establecer objetivos. Y sí, veamos lo que hizo un cliente real. Ryan Hoover:

Bien. Sí, así que comenzando por lo que Lindsy solo estaba diciendo, que a veces obtienes demasiados valores y tienes que encontrar los valores de trabajo. Entonces, New Relic nos ayudó a crear una gran base de datos. Desafortunadamente, se volvió demasiado honesto. Lo miramos y estábamos abrumados por todas las diferentes cosas que estábamos tratando de seguir. Así que regresamos y trabajamos con esto y luego se les ocurrió lo que ves aquí, un tablero muy simple y directo. Lo que hice es que hemos restringido nuestros grandes objetivos de rendimiento para los dos sitios web, wpengine.com y getflywheel.com, nuestros dos sitios principales. Los hemos dividido en el tráfico móvil y el escritorio, en parte porque tenemos experiencias muy diferentes para ellos y en parte porque sabemos que Google los está observando por separado. Y observamos los tres elementos vitales web diferentes para las cuatro experiencias diferentes. Entonces tenemos un total de 12 valores que seguimos. Así que tenemos este gran tablero que creamos, que nos muestra muy rápidamente, de un vistazo, como lo hacemos. Tenemos esos puntajes holísticos en una columna grande que dice muy rápidamente. ¿Cómo fue nuestro promedio en la última semana? ¿Cuál es nuestro puntaje promedio? ¿Estamos en la buena zona negra? Estamos en esa área amarilla o estamos realmente en rojo?
Nos vemos saltas arriba y abajo un poco allí. Verá ahora mismo, sinceramente, lo hemos hecho bien. Todavía tenemos que resolver algunos problemas con la pintura de contenido más grande, especialmente en los dispositivos móviles, por lo que los resolvemos en este momento, pero esto fue muy útil. Este es en realidad el tablero que compartimos todo el tiempo tanto con nuestro propio equipo como con nuestra gestión superior. Esto es algo que mostramos constantemente, porque, oye, esta es nuestra visión del rendimiento de nuestro sitio. Incluso nos permite, con estos gráficos, ver algunas pequeñas tendencias interesantes. Verá allí mismo, en el medio, la pintura de contenido más grande de wpengine.com tiene un comportamiento cíclico en el que se vuelve más lento, más rápido, más lento, más rápido. Se vuelve más lento cuando el tráfico de EE. UU. Se duerme y comenzamos a obtener más tráfico internacional. El tráfico tiene más difícil obtener nuestro contenido en el oeste de Virginia y, por lo tanto, tiende a ver períodos más lentos. Todavía tenemos que resolver esto, mientras nos esforzamos por eliminar los puntajes sobre cómo obtenemos ese tráfico internacional más rápido. Por lo tanto, este fue uno de estos aspectos de este tablero que realmente nos ayudó a profundizar, a centrarnos solo en lo que nos importa. Y realmente nos ayudó a mejorar los valores específicos que seguimos. Lindsy Farina:
Entonces, además de todo esto, pueda entender dónde necesita comenzar su viaje. Es posible que haya elegido un valor. Es posible que haya decidido que LCP es lo que desea optimizar, pero lo que hace. Y de nuevo, esta es: es una de esas cosas en las que el viaje no siempre será el mismo, y Google ha publicado mucho contenido sorprendente para cada uno de estos valores sobre consejos y trucos para la optimización, lugares para ir y mirar Para que las cosas exploren cuando se trata de LCP, cosas como asegurarse de cargar un anuncio, han creado espacio para él de antemano y que no saltará y tomará una pantalla. Todas sus imágenes y videos, asegúrese de que esas cosas estén optimizadas antes de enviarlas a la naturaleza, prestando atención a las cosas que se ejecutan en su hilo principal. ¿Tiene muchas tareas largas que usan esas herramientas como Lighthouse para averiguar cuál es su tiempo total de bloqueo?
Esto realmente lo ayudará a comprender que está bien, estas son las áreas en las que puedo tener ciertas áreas de fricción y lo ayudarán. No será necesariamente una guía de plantilla para este paso, el primer paso, el paso dos y es posible que tenga que ir y venir con las cosas que intenta. Pero lo bueno de tener algo como una mezcla de pruebas sintéticas y reales es que puede probar estas cosas antes de lanzarlas en producción y ver si tuvo un impacto. Por lo tanto, pruebe su entorno de organización, explore diferentes oportunidades. No tenga miedo de que lo que cambie no ha tenido el efecto que pensó que tendría. Este es un viaje. Definitivamente es un maratón y no un sprint. Y si logras hacerlo en un sprint, me gustaría saberlo porque aún no lo he experimentado. Y también, como dije, Google ha lanzado algunos videos excelentes: hay algunos videos de YouTube con presentaciones en los que han tomado un caso muy específico para los clientes y le presentan el final con fragmentos de código y lo que hicieron para optimizar Consíguelos al otro lado. Por lo tanto, hay muchos ejemplos excelentes sobre cómo comenzar. Y hablando solo de ejemplos del mundo real. Hablemos de lo que WP Engine hizo por su cuenta para explorar alguna forma de mejorar las cosas. Ryan Hoover:
Bien, gracias. Así que solo cava un poco, quiero tomarme un poco de tiempo y hablar contigo sobre algunas de las cosas que aprendí. No entraré en detalles sobre cómo hicimos nuestro sitio rápidamente. Me alegra hacer esto en otros foros. Pero creo que muchos sitios son tan idiosincrásicos que una vez que pasas por las recomendaciones generales de Google, necesariamente debes mirar lo que haces. Entonces, por otro lado, solo quiero hablar sobre algunas cosas que hice en el camino y eso hizo que este proyecto de rendimiento fuera mejor, las lecciones que aprendí de la manera difícil. En primer lugar, promueva un idioma común. Una cosa que descubrí es que, dependiendo de cuánto tiempo trabaje con la web, tiene una definición diferente de lo que significa un sitio rápido. Cuando hablamos con nuestros ingenieros que lideran la plataforma de alojamiento, se centran en el tiempo de primer byte, porque esto es lo que tienen en primer lugar. Realmente no pueden controlar cuál es el cambio de apariencia. Este es más el contenido de la página. Cuando hablamos con las personas de SEO que han estado, cargando las ventanas, porque es algo que hemos estado viendo. Incluso en nuestro propio equipo entre desarrolladores, tuvimos diferentes experiencias y diferentes entendimientos. Entonces, algo que aprendimos es crear realmente esas definiciones claras, estos términos claros de lo que está buscando. Cómo definir qué es rápido y cómo lo mides. Había tan bueno el nuevo tablero de reliquias para nosotros. Usamos esto constantemente. Nuestro equipo la plantea varias veces al día para revisarnos solos.
Esto es lo que usamos cuando tenemos una reunión de equipo y hablamos de ello, dibujamos el tablero. Cuando hablamos con la administración, abrimos ese tablero y compartimos cómo se ve. Esta es nuestra definición común tal como se ve y realmente nos ayudó a asegurarnos de que todos estén en la misma página. Y honestamente, nos hizo pasar ese comentario temiendo que lo intenté, tratamos de cargar el sitio en casa y fue muy lento. ¿Tenemos un problema de rendimiento? Esos pequeños comentarios únicos que a veces podrías recibir y son muy molestos porque no puedes recrearlos y no sabes lo que sucedió. Lindsy Farina: Siempre tenemos esa cosa común: si no sucede en mi dispositivo … Ryan Hoover: [risas] funciona bien en la mía. Lindsy Farina: No puedes esconderte de él cuando tienes datos de usuario reales. Ryan Hoover: Sí. Así que hablar de ello funciona bien en mi auto, el rendimiento es un juego de llamadas. Hombre, luchamos con él. A menudo, cuando resuelva los problemas de rendimiento en su sitio, solucionará uno, pero resolver ese problema causará otro. Lindsy mencionó un poco sobre las fuentes web y cómo puede trabajar con ellas, como una de las recomendaciones de Google. Honestamente, luchamos de un lado a otro con eso. Inicialmente optimizamos nuestras fuentes web. Renuncié a la pintura de contenido más grande, pero realmente retrasé cómo se cobran nuestras fuentes web. Pero esto hace que nuestros CL se levanten. Por lo tanto, es uno de estos juegos en los que remedias un problema y otro aparece.
Entonces, el gráfico que ve a continuación, donde se golpean los pobres lunares en la cabeza, esta es nuestra corriente: este es el puntaje del faro en la página principal de wpengine.com para el año pasado. Entonces verá dónde durante el verano y el otoño no lo hicimos bien allí. Sabía que había un problema. Es solo una de esas cosas que alcanzaremos, lo alcanzaremos y finalmente haremos ese esfuerzo concertado. Y vea esos grandes saltos cuando comenzamos a hacer esos grandes impulsos de rendimiento. Puedes ver ese pequeño pico verde donde llegué a ese 98 y pensé que había terminado. Una vez que pasamos esto y entré en la realidad cómo funciona realmente nuestro sitio y no solo para los robots. Comencé este problema y verás esos picos hacia arriba y hacia abajo y hacia arriba y hacia abajo. Y esto es lo que debemos probar las funciones, para implementar algo que creemos que lo mejorará y solo hará algo peor o de espalda, atrás y de regreso. Así que esto es algo que tendrás que enfrentar. Habrá momentos en los que notará que tuvimos una pequeña disminución de aproximadamente 3/4 de la carretera a través de ese gráfico. Lo que sucedió fue honesto, no implementé el código una semana completa antes de eso. Lo que sucedió es que Google acaba de cambiar la forma en que calculan sus algoritmos, lo cual es excelente e hizo un trabajo mucho mejor. El algoritmo mejoró, pero hizo que nuestro puntaje disminuyó en 10-15 puntos y luchamos por regresar a ese puntaje que tuvimos por un corto tiempo. Lo último que diré es estar abierto al cambio.
Yendo junto con la idea de golpear al topo y buscar un problema: resuelva un problema, desafíe a otro. Una cosa que descubriremos mientras trabajamos en el rendimiento es que lo que funcionó el mes pasado no volverá a funcionar. Por la actitud de cómo administra las fuentes web y es posible que tenga que posponerlas. Tal vez no. ¿Cómo te va con las fotos? Hemos luchado, en wpengine.com tenemos muchas ilustraciones. Inicialmente, nos movimos para que muchos de ellos fueran SVG en línea. Llegamos a un punto en el que esto nos hizo mejor, pero de hecho llegó a un punto en el que no estaba y tuvo que regresar a las colas de la web cargadas desde fuera de los archivos estáticos. Getflywheel.com tiene muchos videos. Jugamos con videos HTML5 allí. Esto redujo nuestra velocidad en algunas páginas, lo que nos llevó a una puntuación mucho mejor. Algunas páginas, de hecho, incorporando cosas en YouTube o Wistia fueron más rápidas. Y es algo en lo que tenemos que continuar intentando, y realmente no había nada que coincidir y trabajar, incluso en el mismo sitio. ¿Esto se refiere a cualquier cosa, desde el retraso de JavaScript o cargarlo tan pronto como pueda? ¿Puses CSS como archivos externos? ¿Lo pones en fila? Hay muchos compromisos y solo tienes que trabajar en ello para encontrar cuál podría ser ese equilibrio. Y luego Google podría venir y darse cuenta, ya sabes, de hecho, que hay una mejor manera de medir eso. Hacen esto ahora mismo con el cambio de diseño acumulativo. Están pensando que hay una mejor manera de medir el cambio de diseño y Sor reelabora esas definiciones.
Y podríamos tener que cambiar un poco nuestra estrategia para responder a eso. Y eso es justificado que tendrá que seguir adelante. Lindsy Farina: Sí, y lo único que señala es que Google también es: estas tienen recomendaciones que van a salir anualmente. Por lo tanto, la web vital de Core Web va a estar casando que están investigando continuamente. Si ha estado en el viaje de rendimiento centrado en el usuario desde sus inces, sabrá que ha pasado por muchos cambios. Hemos tenido métricas que han ido y venido. Tenemos nuevas métricas que han saltado y han sido pesadas en los puntajes del faro, pero de repente han sido degradados. Y a muchas personas se les ha gustado una métrica en particular y han decidido ‘este es el indicado’, y la realidad es que ya no es ese espacio donde una métrica los gobierna a todos. Será constantemente que tengamos que ver múltiples cosas para definir la experiencia del usuario. Y a medida que obtenemos más fecha y a medida que continuamos investigando, es simplemente una ciencia. Esta es la ciencia de las citas y, a medida que entra más, en la evaluación de Google, van a cambiar la forma en que les gusta las cosas, la forma en que los algoritmos tienen que definirlos, y el tipo también deprimió también una métrica. Pueden decidir que esta no es la cosa y que necesitamos tener una diferente. Así que la pintura y CL de contenido más grande aún tienen algo nuevo. Tenemos el primer dolor. Primero tenemos el contenido. Tenemos tiempo para interactivos en un laboratorio métrico. Todas estas cosas giran, así que tuvo mucha confusión. Así que esté atento a las recomendaciones de 2021.
Pueden cambiar un poco, por lo que solo, este es un concepto de un maratón, no un sprint. No entrar en pánico. Estar abierto al cambio. Todas estas cosas son parte de su viaje de rendimiento. Entonces, ¿dónde terminamos? Sabes que esto es algo de lo que nos apasionamos a New Reel. Amo este espacio. Lo encuentro muy emocionante y algo egoístamente también. Como si quiero que las experiencias de mi sitio web sean buenas y quiero que mis sitios web de gestión de aduanas sientan que tienen la fecha que necesitan para hacer que ese sombrero que venda pisamente utilice su sitio web es una buena experiencia. Y eso te lleva a realmente conocer a tus clientes. Invierta esa hora por adelantado para mirar su cita, obtener sus líneas de base, establecer objetivos. Tiene que ser de pobre a bueno el fin de semana. Puede ser ese viaje con el tiempo, y conocer el rendimiento de sus usuarios y saber cómo se ve eso y cómo se siente que eso es real va a ayudarlo a descubrir dónde priorizar ese viaje. Ryan Hoover: Lo tengo. Y en eso, a medida que avanzas en ese viaje, será un viaje. Puede ser como nosotros y querer asumir un gran proyecto para obtener los puntajes a un buen lugar saludable, pero una vez que lo consigas allí, solo, y dices, Genial, ya terminamos a las otras cosas. Hemos estado trabajando. Tiene rendimiento para tener en cuenta cómo trabaja y cómo cree su sitio web. Debe ser parte de su estilo de vida. Esas métricas en ese tablero que creas para tu gran proyecto, que deben ser algo que mantienes en el frente y que mantienes regresar a una y otra vez para que los puntajes suban.
Porque, francamente, si dejas que tu configuración se quede, tus puntajes disminuirán lentamente con el tiempo. He visto una y otra vez con sitios web que con el tiempo, las pequeñas cosas se arrastran, pequeñas pepitas, pequeños cambios de guión o imágenes, lo que sea, podría entrar y comenzar a arrastrar su puntaje de nuevo. Esto va a ser algo en lo que debes seguir trabajando. Hornee a sus flujos de trabajo diarios. Horéelo en su prueba de garantía de calidad que pueda ejecutar en su sitio web. Lo que sea que eso signifique para usted, hacer un rendimiento es alguien con quien se quede y que haga parte de cómo cree que está trabajando con su sitio web. Final, con cualquier buen maratón, puedes enfrentarte todo a la vez. Tienes que establecer objetivos claros, simples y directos que puedes lograr. No abrume a su equipo pensando que tenemos que obtener todo hasta un 90% de excelente puntaje de inmediato. Hay demasiada complejidad, demasiados datos para consumir, demasiado para procesar. En cambio, asume el proyecto, obtenga un sentido general de lo que quiere que sea su ángulo. Pero luego mire los objetivos a corto plazo que puede lograr y establecerlos y trabajar para ellos. Date algunos descansos entre. Nuestro equipo, nos encanta el rendimiento, muchos de nosotros. Solo es lo que más disfrutamos del desarrollo web. Es uno de los proyectos más agradables que tenemos, pero incluso después de un mes o seis semanas de enchufarlo con fuerza, maltratar para tomar un descanso y trabajar en otra cosa. Volveremos con ojos frescos.