{"id":8878,"date":"2022-06-29T07:00:00","date_gmt":"2022-06-29T10:00:00","guid":{"rendered":"https:\/\/www.mdmarketingdigital.com\/blog\/?p=8878"},"modified":"2025-01-27T16:04:47","modified_gmt":"2025-01-27T19:04:47","slug":"google-page-speed-insight-mejora-la-velocidad-de-tu-sitio-web","status":"publish","type":"post","link":"https:\/\/www.mdmarketingdigital.com\/blog\/google-page-speed-insight-mejora-la-velocidad-de-tu-sitio-web\/","title":{"rendered":"Google Page Speed Insight, mejora la velocidad de tu sitio web"},"content":{"rendered":"\n

El Google <\/strong><\/em>Page Speed<\/em> Insight <\/em><\/strong>o la velocidad de carga de sitio web<\/a><\/em><\/strong> es la cantidad de tiempo que tarda en cargar el contenido de una p\u00e1gina web. La velocidad de la p\u00e1gina se puede describir en \u201ctiempo de carga de la p\u00e1gina\u201d (el tiempo que tarda en mostrar completamente el contenido en una p\u00e1gina espec\u00edfica) o \u201ctiempo hasta el primer byte\u201d (el tiempo que tarda tu navegador en recibir el primer byte de informaci\u00f3n del servidor web).<\/p>\n\n\n\n

La velocidad es sumamente importante para un sitio web, de tal manera que se ha convertido en un factor de posicionamiento en los buscadores. Es simple, las p\u00e1ginas que cargan m\u00e1s r\u00e1pido satisfacen mejor las necesidades del usuario.<\/p>\n\n\n\n

\u00bfLa velocidad de la p\u00e1gina afecta al SEO? <\/h3>\n\n\n\n

La respuesta es sencilla: s\u00ed. Y es que como mencionamos, se trata de un factor de posicionamiento directo conocido desde la actualizaci\u00f3n del algoritmo de velocidad de Google. La velocidad tambi\u00e9n puede afectar tu posicionamiento indirectamente ya que aumenta la base de rebote y reduce el tiempo de permanencia.<\/p>\n\n\n\n

Para Google, los usuarios son la prioridad e indican que estos abandonan el sitio luego de 3 segundos. En resumen, si la experiencia del usuario es mala, Google no va a querer posicionar a estos sitios.<\/p>\n\n\n\n

En esta nota te contamos todo sobre Google Speed Insight y c\u00f3mo puedes mejorar la velocidad de tu sitio web. \u00a1Segu\u00ed leyendo!<\/p>\n\n\n\n

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

Si tu negocio necesita un sitio web<\/p>\r\nCONTACTANOS<\/a>\n\n\n\n

\u00bfQu\u00e9 es Google Speed Insight?<\/strong><\/h2>\n\n\n\n

Google Page Speed Insight es una herramienta que se utiliza para comprobar y optimizar el rendimiento de nuestro sitio web y su velocidad de carga. Puedes introducir cualquier URL y analizarla. <\/p>\n\n\n\n

A continuaci\u00f3n, Google te proporcionar\u00e1 una puntuaci\u00f3n global de 100 para el sitio web que has introducido.<\/p>\n\n\n\n

\"Google<\/figure>\n\n\n\n

En el an\u00e1lisis, el sistema arrojar\u00e1 dos tipos generales de resultados:<\/p>\n\n\n\n

    \n
  1. Por un lado, aquellos relacionados a la velocidad de carga y el rendimiento en s\u00ed mismo.<\/li>\n\n\n\n
  2. Por otro lado, junto con el resultado, tambi\u00e9n podr\u00e1s ver algunas de las recomendaciones que Google te proporcionar\u00e1 para mejorar tu rendimiento y, por lo tanto, tu puntuaci\u00f3n de Page Speed Insight. <\/li>\n<\/ol>\n\n\n\n

    Estas recomendaciones son la verdadera esencia del an\u00e1lisis. Por ello, hay que entender la diferencia entre datos de campo y datos de laboratorio. Mientras que el primero compara tu sitio web con otros en el Informe de Experiencia de Usuario de Chrome de los \u00faltimos 30 d\u00edas, el segundo muestra datos espec\u00edficos para una carga de p\u00e1gina simulada.<\/p>\n\n\n\n

    Adem\u00e1s, debes tener en cuenta que es perfectamente normal que los datos de laboratorio y los de campo no coincidan exactamente. En lo que debemos prestar atenci\u00f3n es en la idea de los tiempos de carga reales de nuestro sitio que nos da la combinaci\u00f3n de ambos.<\/p>\n\n\n\n

    Si bien es cierto que deber\u00edas esforzarte para mejorar los tiempos de carga de tu sitio web lo mejor posible, no es realmente tan esencial conseguir un 100\/100 en Google Page Speed Insight. Lo realmente importante es lograr encontrar los problemas en tu sitio para poder optimizarlo y reducir los tiempos de carga reales y percibidos por los usuarios.<\/p>\n\n\n\n

    Por eso te aconsejamos que no te obsesiones con los indicadores ya que solo te frustrar\u00e1s e, ir\u00f3nicamente, tendr\u00e1s una sobre optimizaci\u00f3n de tus recursos que terminaran perjudicando a tu sitio web.<\/p>\n\n\n\n

    Google<\/strong> Page Speed Insight m\u00f3vil y ordenador<\/strong><\/h2>\n\n\n\n

    Page Speed Insight analiza los sitios webs tanto desde la perspectiva de los dispositivos m\u00f3viles como de los ordenadores.<\/p>\n\n\n\n

    El objetivo de esto es que podamos saber cu\u00e1n optimizada est\u00e1 nuestra p\u00e1gina web a nivel mobile first y si la misma es capaz de brindar una buena experiencia a aquellos usuarios que la visitan desde sus celulares.<\/p>\n\n\n\n

    Principales problemas de velocidad en un sitio web<\/strong><\/h2>\n\n\n\n

    A continuaci\u00f3n, te mostraremos cu\u00e1les son los 5 errores m\u00e1s comunes que ralentizan tu p\u00e1gina web y de qu\u00e9 manera puedes solucionarlos.<\/p>\n\n\n\n

    1.<\/em>    Eliminar los recursos que bloqueen el renderizado<\/em><\/h3>\n\n\n\n

    De acuerdo con Google, los recursos que bloquean el renderizado son aquellos scripts y estilos que bloquean el primer renderizado de la p\u00e1gina.<\/p>\n\n\n\n

    El objetivo de solucionar esto es reducir el impacto que tienen estos archivos en la velocidad de la carga. Hay 3 opciones para solucionarlo.<\/p>\n\n\n\n

      \n
    1. Alinear los archivos cr\u00edticos en el HTML: es decir, mover el c\u00f3digo desde esa URL que bloquea el renderizado de la p\u00e1gina a una etiqueta \u201cinline script\u201d dentro de la p\u00e1gina HTML.<\/li>\n\n\n\n
    2.  Eliminar aquellos archivos que no se est\u00e9n utilizando.<\/li>\n\n\n\n
    3. Postergar los archivos que nos son cr\u00edticos para el primer renderizado de la p\u00e1gina<\/strong>: este cambio podemos hacerlo marcando la url en la que se aloja el contenido con las etiquetas \u201casync\u201d o \u201cdefer\u201d en el caso del contenido JavaScript y con la etiqueta \u201cpreload\u201d en el caso del contenido css. Sin embargo, debes tener cuidado al hacer esto ya que si postergas la carga de archivos de los que dependen otros archivos cr\u00edticos que cargues previamente, estos archivos no podr\u00e1n recoger la informaci\u00f3n necesaria y por lo tanto no funcionar\u00e1n.<\/li>\n<\/ol>\n\n\n\n

      2.<\/em>    Usa un tama\u00f1o adecuado para las im\u00e1genes<\/em><\/h3>\n\n\n\n

      La incorporaci\u00f3n de im\u00e1genes muy grandes en la web provocar\u00e1 que la velocidad de carga de esta sea baja. Gracias a las herramientas de compresi\u00f3n y optimizaci\u00f3n de im\u00e1genes, ya no es necesario que las im\u00e1genes tengan un tama\u00f1o gigantesco para verse profesionales.<\/p>\n\n\n\n

      3.<\/em>    Posterga la carga de im\u00e1genes que no aparecen en pantalla<\/em><\/h3>\n\n\n\n

      Esto est\u00e1 directamente relacionado con el punto anterior y es que las im\u00e1genes no solo son de los archivos m\u00e1s pesados que podemos cargar en nuestra web, sino que tambi\u00e9n nos ofrecen mayor oportunidad de optimizaci\u00f3n.<\/p>\n\n\n\n

      De acuerdo con Google, hay im\u00e1genes que no se ver\u00e1n hasta que el usuario no haga scroll en la p\u00e1gina, por lo que no tiene sentido cargarlas con el primer renderizado de esta.<\/p>\n\n\n\n

      Entonces, \u00bfc\u00f3mo logramos que las im\u00e1genes s\u00f3lo se carguen cuando aparezcan en pantalla? La realidad es que es muy f\u00e1cil y se puede hacer de 2 formas:<\/p>\n\n\n\n

        \n
      1. Utilizando WordPress e instalando un plugin que sirva esta funcionalidad a tu sitio web.<\/li>\n\n\n\n
      2. En caso de no utilizar WP, puedes agregar el script Lazysizes a tu p\u00e1gina.<\/li>\n<\/ol>\n\n\n\n
        \"Google<\/figure>\n\n\n\n

        4.<\/em>    Minimizar los archivos CSS y JS<\/em> con Google Page Speed Insight<\/h3>\n\n\n\n

        Para facilitar su lectura a los humanos, los archivos CSS y JS suelen contener espacios y caracteres que no son realmente imprescindibles haci\u00e9ndolos m\u00e1s grandes de lo necesario.<\/p>\n\n\n\n

        Minimizar tu CSS y JS es el proceso por el cual condensas tus archivos eliminando caracteres, espacios y duplicaciones innecesarias. Google recomienda esta pr\u00e1ctica porque reduce el tama\u00f1o de dichos archivos mejorando la velocidad de carga.<\/p>\n\n\n\n

        Autoptimize o WP Rocket tambi\u00e9n pueden manejar esta tarea para su sitio de WordPress.<\/p>\n\n\n\n

        5.<\/em>    Reducir los tiempos de respuesta del servidor (TTFB)<\/em><\/h3>\n\n\n\n

        El Tiempo al Primer Byte (TTFB) es la cantidad de tiempo que necesita el navegador en recibir el primer byte de datos del servidor de su sitio web despu\u00e9s de hacer una solicitud.<\/p>\n\n\n\n

        Hay varios factores que influyen en tu TTFB, pero los m\u00e1s importantes son:<\/p>\n\n\n\n