COMO OBTENER UN 100 EN PAGESPEED INSIGHTS

Fecha actualización: 2016-2-16. Fecha publicación: . Categoría: Web, Google. Autor:

La herramienta de google pagespeed insights se utiliza para comprobar que la velocidad de carga sea lo mas rapido posible.

Disponde de dos pestañas movil y ordenador en el que se nos da pistas para mejorar el rendimiento de la pagina.

En este articulo veremos los diferentes errores y avisos y como solucionarlos.

Lo primero que hay que decir de que dependiendo de como esta hecha una web, sera mas o menos costoso llega al 100 del pagespeed insights.

1 ESPECIFICAR CACHÉ DE NAVEGADOR

En una pagina web utilizamos archivos con extension .css .html .jpg .gif .png .js los cuales tenemos que especificarles el tiempo que deseamos que esten en el cache del navegador del usuario.

En la practica esto se soluciona, modificando o añadiendo lineas en el archivo .htaccess

Si desea mas información visite algunas de estas paginas

Archivo htaccess valido para cualquier tipo de web

Cache web de los navegadores

A TENER EN CUENTA: Si el archivo no esta alojado en tu alojamiento no puedes hacer nada para modificar el cache de ese archivo, la solución consiste en descargar ese archivo y subirlo al alojamiento nuestro.

Esta solución no es posible en todos los casos ya que depende del archivo sobre todo los .js, los cuales suelen hacer referencia a otros archivos .js

2 ELIMINAR EL JAVASCRIPT QUE BLOQUEA LA VISUALIZACIÓN Y EL CSS DEL CONTENIDO DE LA MITAD SUPERIOR DE LA PÁGINA

Si su pagina esta diseñada con un gestor de contenidos Wordpress, Joomla, Pretashop...desactive y elimine todos los plugins, modulos o componentes innecesarios y luego siga los pasos que le describo a continuación.

Este error suele ser el mas problematico de solucionar y consta de dos partes:

¿Como eliminar el javascript que bloquea la visualización?: Mueva todas las lineas que hacen referencia a un script al final de la página una linea antes del /body y añada el parametro async o refer al script.

¿Como eliminar el css que bloquea la visualización?:

Compruebe todos los css que tiene en su web, probablemente tenga uno en la que se carga todo el aspecto de la página y seguramente sera el de mas tamaño.

Edite el contenido de ese archivo y mueva algunas de esas lineas a la propia pagina html, debera insertar esas lineas entre estas dos etiquetas style.../style e insertarlas antes del /header.

La referencia del archivo css sin las lineas anteriores que quedan, muevalo al final del /body.

La cantidad de lineas css a insertar en el html, hacen que aumente el tamaño de la pagina html, intente no sobrepasar los 30K de pagina html.

3 HABILITAR COMPRESIÓN

Activa el modulo Gzip en el htaccess el cual comprime los archivos. Para poder utilizarlo debera estar instalado en su alojamiento o servidor. Si no sabe si lo tiene, debera de preguntar a su proveedor de hosting.

4 OPTIMIZAR IMAGENES

Las imagenes que utiliza debera de editarlas y prepararlas para ser utilizadas dentro de una pagina web. Basicamente lo que hay que hacer es eliminar los metadatos de una imagen, ademas, hacer que el tamaño de la imagen sea el adecuado a la pagina web.

Como norma basica, contra menos bytes ocupe una imagen antes se cargara.

5 REDUCIR EL TIEMPO DE RESPUESTA DEL SERVIDOR

Cuando se produce este aviso es debido a que hacemos demasiadas referencias a archivos externos fuera de nuestro alojamiento, como js, css o imagenes alojados en terceros.

6 MINIFICAR JAVASCRIPT

El contenido de los archivos JS, se puede hacer que ocupen menos espacio eliminando comentarios y espacios en blanco.

7 MINIFICAR HTML

El contenido de los archivos HTML, se puede hacer que ocupen menos espacio eliminando espacios en blanco y lineas vacias.

8 MINIFICAR CSS

El contenido de los archivos CSS, se puede hacer que ocupen menos espacio eliminando comentarios y espacios en blanco.

9 EVITA LOS REDIRECCIONAMIENTOS A PAGINAS DE DESTINO

A google no les gusta que dentro de la pagina exista un redireccionamiento o un frame

10 PRIORIZA EL CONTENIDO VISIBLE

Cuando se produce este aviso normalmente hay que rediseñar la web y en concreto el 25 por ciento de la parte superior de la pagina.

11 APLICAR EL TAMAÑO ADECUADO A LOS BOTONES TÁCTILES

Este aviso se suele producir en la pestaña de movil y suele ser debido a que hay dos hipervinculos uno debajo del otro, como por ejemplo dos botones de redes sociales o dos imagenes muy pequelas con un hipervinculo cada imagen.

Estos son los avisos mas comunes que no da el pagespeed insights, al final del informe hay una opción para descargarse los archivos optimizados de nuestra web, algo muy util que nos ahorra mucho tiempo.

COMO RECOMENDACIÓN GENERAL, SI SU PAGINA WEB ESTA CREADA CON WORDPRESS O SIMILARES REVISE SU PANEL DE ADMINISTRACION Y ELIMINE TODO LO QUE NO SEA NECESARIO UTILIZAR, ANTES DE APLICAR LO QUE SE INDICA EN ESTE ARTICULO.

¿QUE HACER CUANDO SU WEB ES HACKEADA?: Cuando eres el webmaster de una web, el hecho de ser hackeado es una circunstancia que puede ocurrir, y no es el fin del mundo, solamente hay que saber como reaccionar.

ATAQUES MASIVOS A PAGINAS CON WORDPRESS: Desde principios de Septiembre se estan produciendo ataques masivos a paginas con Wordpress, a niveles de estar siendo infectadas 5000 paginas al dia.

COMO ANALIZAR LAS ESTADISTICAS ANALYTIC Y WEBMASTER DE GOOGLE: Como sacar conclusiones que le sirvan al webmaster, y conseguir mejorar el posicionamiento de su web en los buscadores.

VISITAS INDESEADAS DE GOOGLE ANALYTIC: Como evitar el spam de referidos. Analisis del tipo de visitas de referidos que son contabilizadas por las estadisticas de Google Analytic.

Comenta y comparte en Compartir en Google+
Web