{"id":22689,"date":"2020-05-27T16:02:22","date_gmt":"2020-05-27T23:02:22","guid":{"rendered":"https:\/\/alejandrorioja.com\/?p=22689"},"modified":"2020-05-29T10:41:58","modified_gmt":"2020-05-29T17:41:58","slug":"mejorar%e2%80%8c-%e2%80%8cmi%e2%80%8c-%e2%80%8csitio%e2%80%8c-%e2%80%8cweb%e2%80%8c-%e2%80%8ccon%e2%80%8c-%e2%80%8cgoogle%e2%80%8c-%e2%80%8cspeed%e2%80%8c-%e2%80%8cinsights%e2%80%8c","status":"publish","type":"post","link":"https:\/\/alejandrorioja.com\/es\/mejorar%e2%80%8c-%e2%80%8cmi%e2%80%8c-%e2%80%8csitio%e2%80%8c-%e2%80%8cweb%e2%80%8c-%e2%80%8ccon%e2%80%8c-%e2%80%8cgoogle%e2%80%8c-%e2%80%8cspeed%e2%80%8c-%e2%80%8cinsights%e2%80%8c\/","title":{"rendered":"Mejorar\u200c \u200cmi\u200c \u200csitio\u200c \u200cweb\u200c \u200ccon\u200c \u200cGoogle\u200c \u200c Speed\u200c \u200cInsights\u200c"},"content":{"rendered":"\n

Si hablamos de SEO para este a\u00f1o 2020, debemos considerar muchas variables como; palabras claves, palabras claves de cola larga, optimizaci\u00f3n en el sitio<\/a> y fuera de \u00e9l, construcci\u00f3n de enlaces entrantes (link building), optimizaci\u00f3n para m\u00f3viles, etc.<\/p>\n\n\n\n

Dentro de ese etc\u00e9tera, ocupa un lugar muy importante la velocidad de nuestro sitio web. Para saber cu\u00e1n veloz es nuestro sitio web en cargar podemos utilizar la herramienta gratuita de Google; Page Speed Insights<\/a> (Estad\u00edsticas de velocidad de p\u00e1ginas web)<\/p>\n\n\n\n

Si bien lo inclu\u00ed dentro de los etc\u00e9tera, la velocidad de carga en 2020 debe considerarse un aspecto fundamental de cualquier sitio web. Google lo cuenta como uno de los detalles importantes a la hora de rankear los sitios en sus resultados de b\u00fasqueda y nos ofrece su herramienta gratuita Google Speed Insights para analizarlos.<\/p>\n\n\n\n

La recomendaci\u00f3n de Google es que cualquier sitio web debe cargar completamente en menos de 3 segundos en un ordenador, en un m\u00f3vil o celular Google no especifica si debe o no ser la misma velocidad. Esto quiz\u00e1s porque las redes m\u00f3viles tiene diferentes anchos de banda lo que pueden hacer demorar la carga de un sitio m\u00f3vil. Tambi\u00e9n afecta la velocidad si se est\u00e1 conectado a un Wifi o por redes 3G. <\/p>\n\n\n\n

Puede parecerte que 3 segundos es un muy corto per\u00edodo de tiempo, y \u00a1s\u00ed lo \u00e9s! pero qu\u00e9date tranquilo ya que hasta 5 segundos de espera es considerado bueno y hasta 8 como aceptable. Ya despu\u00e9s de 9 segundos la velocidad de tu sitio es considerada como mala, pudiendo afectar muy negativamente el posicionamiento del mismo.<\/p>\n\n\n\n

Todo lo que compone tu sitio web, incide en la velocidad del mismo, archivos HTML, CSS, PHP, scripts de todo tipo, im\u00e1genes y dem\u00e1s.<\/p>\n\n\n\n

Google Page Speed Insights en acci\u00f3n<\/h2>\n\n\n\n

<\/p>\n\n\n\n

Lo primero que veremos al ingresar la sitio es el espacio para pegar la url del sitio web a analizar. Pegamos la url, damos click en analizar y esperamos que nos entregue los resultados \u00a1estos segundos de espera no cuentan!<\/p>\n\n\n\n

En la p\u00e1gina de resultados tendremos dos men\u00fas: M\u00f3vil y Ordenador. El resultado del Ordenador siempre ser\u00e1 mejor que el del M\u00f3vil y por varios puntos de diferencia. Por eso nos vamos a centrar en los resultados para Ordenador ya que mejorando los mismos, mejoraremos tambi\u00e9n los de la parte del M\u00f3vil. Despu\u00e9s tendremos tiempo de mejorar los resultados del m\u00f3vil.<\/p>\n\n\n\n

Los intervalos de desempe\u00f1o son los mismos: 0 a 49 lento, 49 a 89 aceptable y 90 a 100 veloz. No considerar\u00e9 los t\u00e9rminos t\u00e9cnicos de la Gu\u00eda de resultados de Lighthouse y me centrar\u00e9 en lo que necesitas, \u00a1mejorar la velocidad de tu sitio!<\/p>\n\n\n\n

<\/p>\n\n\n\n

Datos de Experimentos<\/h2>\n\n\n\n

Los datos de experimentos son lo primero que debemos analizar ya que nos dan una idea general de d\u00f3nde tenemos un problema de velocidad. Los datos de experimentos siguen el c\u00f3digo de colores, rojo – lento, amarillo – aceptable, verde – veloz.<\/p>\n\n\n\n

Tendremos estos 6 valores:<\/p>\n\n\n\n

  1. Primer renderizado con contenido<\/li>
  2. Primer renderizado significativo<\/li>
  3. \u00cdndice de velocidad<\/li>
  4. Primer tiempo inactivo de la CPU<\/li>
  5. Tiempo hasta que est\u00e1 interactiva<\/li>
  6. Latencia potencial m\u00e1xima de la primera interacci\u00f3n<\/li><\/ol>\n\n\n\n
    \"Mejorar\u200c<\/figure>\n\n\n\n

    Debajo tendremos un informe m\u00e1s detallado dividido en:<\/p>\n\n\n\n

    1. Oportunidades<\/li>
    2. Diagn\u00f3sticos<\/li>
    3. Auditor\u00edas aprobadas<\/li><\/ol>\n\n\n\n

      Veamos en detalle cada uno de estos 9 elementos y c\u00f3mo nos van a ayudar a acelerar nuestro sitio.<\/p>\n\n\n\n

      1. Primer renderizado con contenido<\/li><\/ol>\n\n\n\n

        Es cuando el primer byte de nuestra p\u00e1gina entra en acci\u00f3n luego del clic del usuario en el enlace de nuestro sitio<\/p>\n\n\n\n

        1. Primer renderizado significativo<\/li><\/ol>\n\n\n\n

          Es cuando nuestra p\u00e1gina comienza a cargar en su totalidad. Puede coincidir con el punto 1 si nuestro sitio est\u00e1 optimizado.<\/p>\n\n\n\n

          1. Indice de velocidad<\/li><\/ol>\n\n\n\n

            Mide la duraci\u00f3n entre el punto 1 y el momento en que toda nuestra p\u00e1gina est\u00e1 completamente activa<\/p>\n\n\n\n

            1. Primer tiempo inactivo de la CPU<\/li><\/ol>\n\n\n\n

              Es el primer momento en que nuestra p\u00e1gina se encuentra m\u00ednimamente interactiva<\/p>\n\n\n\n

              1. Tiempo hasta que est\u00e1 interactiva<\/li><\/ol>\n\n\n\n

                Similar al punto 4, pero aqu\u00ed la p\u00e1gina est\u00e1 completamente interactiva y el usuario puede hacer \u201calgo\u201d en ella<\/p>\n\n\n\n

                1. Latencia potencial m\u00e1xima de la primera interacci\u00f3n<\/li><\/ol>\n\n\n\n

                  Mide el tiempo en que luego del primer clic, el navegador conecta con tu p\u00e1gina <\/p>\n\n\n\n

                  Vamos al centro del punto de c\u00f3mo mejorar mi sitio web con Google Speed Insights<\/h2>\n\n\n\n

                  Si bien los 6 puntos anteriores son importantes porque nos dan una visi\u00f3n general del desempe\u00f1o en velocidad de nuestro sitio. Son los 3 siguientes los que nos permiten mejorar el puntaje.<\/p>\n\n\n\n

                  1. Oportunidades<\/strong><\/li><\/ol>\n\n\n\n

                    C\u00f3mo su nombre lo indica, son oportunidades de mejora que debemos explorar para acelerar la carga de nuestra web.<\/p>\n\n\n\n

                    \"Mejorar\u200c<\/figure>\n\n\n\n

                    ATENCI\u00d3N: algunas de las mismas se pueden realizar sin problemas, mientras que otras deben ser realizadas por personas que conozcan del tema sino quieres que tu sitio web se caiga o provocar errores fatales en el mismo.<\/em><\/strong><\/p>\n\n\n\n

                    Realizada la advertencia, veamos la principal forma de acelerar nuestra web: la optimizaci\u00f3n de las im\u00e1genes.<\/p>\n\n\n\n

                    Un sitio web sin im\u00e1genes es inimaginable, las mismas le dan un sentido est\u00e9tico, un sentido de belleza y de marca. Pero a la vez son las enemigas n\u00famero uno del SEO. Los motores de b\u00fasqueda indexan mal las im\u00e1genes y estas pueden ser tan pesadas que nuestro sitio cargue a la velocidad de una tortuga.<\/p>\n\n\n\n

                    Antes de subir im\u00e1genes por primera vez debes optimizarlas en tu ordenador, reduce su tama\u00f1o, utiliza formatos de imagen que ocupen menos espacio.<\/p>\n\n\n\n

                    Con tu programa de edici\u00f3n de contenido favorito puedes lograr un excelente resultado reduciendo las im\u00e1genes al 50 % y guardandolas en formato .jpg. Nada de imagenes de 2500×2400 pixeles o de 2 o 3 MB de tama\u00f1o. Im\u00e1genes de menos de 300 kb son las ideales para la velocidad de tu sitio.\u00a0<\/p>\n\n\n\n

                    Si ya tienes las im\u00e1genes en tu sitio, el problema debe ser encarado de otra manera. En WordPress esa soluci\u00f3n llega gracias a los plugins. Te recomiendo instalar Smush<\/a> o Kraken.io<\/a>, ambos excelentes programas de optimizaci\u00f3n de im\u00e1genes.<\/p>\n\n\n\n

                    Estos plugins hacen lo mismo que un editor de pc pero a gran escala ya que podemos marcar; 10, 20, 50 im\u00e1genes y optimizarlas todas juntas.\u00a0<\/p>\n\n\n\n

                    ProTip:<\/strong> Analiza tu sitio en Google Speed Insights antes de optimizar las im\u00e1genes y guarda los resultados, luego de optimizarlas, va a analizarlo nuevamente y compara los resultados. Ver\u00e1s cu\u00e1nto aumenta la velocidad de tu sitio!<\/p>\n\n\n\n

                    1. Diagn\u00f3sticos<\/strong><\/li><\/ol>\n\n\n\n
                      \"\"\/<\/figure>\n\n\n\n

                      Luego de optimizar las im\u00e1genes a\u00fan tienes trabajo que hacer, y para eso tambi\u00e9n usaremos algunos plugins. Google te pedir\u00e1 que optimizes el cach\u00e9 de tu sitio y que elimines recursos que bloquean el renderizado. Para eso te recomiendo el plugin Hummingbird<\/a>, que hace todo esto solo con las opciones que vienen por defecto. Recuerda que solo si sabes lo que haces puedes ver las opciones avanzadas del mismo.\u00a0<\/p>\n\n\n\n

                      ProTip:<\/strong> <\/strong><\/em>Siempre antes de hacer alg\u00fan cambio en tu web, realiza un respaldo. En WordPress nada mejor que usar Updraftplus<\/a>, un plugin que realizar\u00e1 las copias de seguridad de tu sitio autom\u00e1ticamente. Solo debes conectarlo a Google Drive o Dropbox y all\u00ed guardar las copias de seguridad.<\/p>\n\n\n\n

                      1. Auditor\u00edas aprobadas<\/strong><\/li><\/ol>\n\n\n\n

                        Aqu\u00ed se muestra todo lo que hemos realizado bien para conseguir aumentar la velocidad de carga de nuestro sitio. La idea detr\u00e1s de este art\u00edculo, es que una vez que termines de leerlo, la parte de Auditorias aprobadas tenga muchos m\u00e1s elementos que los dos puntos anteriores. <\/p>\n\n\n\n

                        \"Mejorar\u200c<\/figure>\n\n\n\n

                        Recomendaciones finales.<\/h2>\n\n\n\n

                        Si quieres que tu sitio cargue a la velocidad de la luz, selecciona un Tema optimizado, tanto para web como para m\u00f3vil. En ThemeForest<\/a> puedes encontrar uno de tu agrado completamente optimizado y con soporte. Esto te permitir\u00e1 contactar al desarrollador si tienes problemas o dudas sobre el mismo.<\/p>\n\n\n\n

                        Plugins, hay cientos de Plugins de optimizaci\u00f3n para WordPress, los que recomiendo aqu\u00ed est\u00e1n probados por su calidad y caracter\u00edsticas ayud\u00e1ndote con Google Speed Insights. Comenta si conoces otros que tienen estas caracter\u00edsticas.\u00a0<\/p>\n\n\n\n

                        Im\u00e1genes, recuerda optimizarlas si las vas a subir por primera vez, si tienes que subir varias, usa un plugin de optimizaci\u00f3n que lo hace por t\u00ed al subirlas. Usa formatos modernos y que ocupen poco espacio como JPEG 2000, JPEG XR y WebP.<\/p>\n\n\n\n

                        Recuerda, no hacemos esto solo por nuestro orgullo y que nuestro sitio alcance el puntaje 100 dentro de Google Speed Insights, sino que lo hacemos para ayudar a nuestro SEO y poder ocupar los primeros lugares de b\u00fasqueda.<\/p>\n\n\n\n

                        Mejorando la velocidad adem\u00e1s reduciremos nuestro porcentaje de rebote.<\/h3>\n\n\n\n

                        Recuerda que debemos apuntar a lograr 3 segundo en el punto \u00cdndice de velocidad. Cuanto m\u00e1s tiempo demore nuestro sitio en cargar, m\u00e1s usuarios perderemos en ese camino. Sitios con tiempo de carga de 4 segundos tienen una tasa de abandono de 24% y si tardan 5 segundos, dicha tasa aumenta a 38%. Imagina que le suceder\u00eda a tu sitio si tarda 10 segundos en cargar.<\/p>\n\n\n\n

                        Tu esfuerzo se ver\u00e1 recompensado, y no est\u00e1s solo en esto ya que el tiempo promedio de carga de sitios web es de 8 segundos y fracci\u00f3n seg\u00fan un estudio realizado por Machmetrics. <\/p>\n\n\n\n

                        Recuerda que todos los sitios de 8 segundos est\u00e1n buscando lo mismo que t\u00fa, llegar a menos de 3 segundos de carga, as\u00ed que empieza ya!<\/p>\n\n\n\n

                        M\u00e1s art\u00edculos para mejorar tu sitio web.<\/p>\n\n\n\n

                        \n
                        BuzzSumo Revisi\u00f3n: Caracter\u00edsticas, Precios, Pros & Contras<\/a><\/blockquote>