WebSite X5Help Center

 
CARLOS AMARAL
CARLOS AMARAL
Moderator

Mejorar nivel en Google PageSpeed Insights  es

Auteur : CARLOS AMARAL
Visité 2846, Followers 2, Partagé 0  

Hola como estan.

He encontrado esta herramienta de google que analiza los sitios y nos dice que se puede mejorar para obtener mejor puntuacion frente a google, y por lo tanto mejorar el posicionamiento de nuestras webs.

Google developers - PageSpeed Insights

https://developers.google.com/speed/pagespeed/insights/?url=http://www.carlos-amaral.com

(ahi se puede ver con la direccion de mi sitio personal).

Como veran, se ven varios detalles a optimizar, que mejorarian el posicionamiento en google, pero no se desde donde se pueden hacer esas cosas en website x5.

Por ejemplo:

"Eliminar el JavaScript que bloquea la visualización y el CSS del contenido de la mitad superior de la página".

O definir tiempos de expiracion de cosas.

Posté le
5 RéPONSES
CARLOS AMARAL
CARLOS AMARAL
Moderator
Auteur
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

Alguna sugerencia?  (perdon que lo puse en dos mensajes, es que apreté enviar sin querer cuando estaba creando el texto).

Lire plus
Posté le de CARLOS AMARAL
Diego Z.
Diego Z.
User

Carlos, Desconozco como se hace en Website X5 ya que nunca encontre como hacerlo, te cuento lo que hago yo para ver si te puede ser util.

1) Eliminar el JavaScript que bloquea la visualización y el CSS del contenido de la mitad superior de la página

Con lo de Javascript es un tema, ya que lo que pasa es que JS se carga de forma sincronica, es decir que primero carga el JS y despues el HTML y eso es lo que te esta avisando: Eliminar el JavaScript que bloquea la visualización 

La solucion seria agregarle el atributo html async para que lo carga de forma asyncronica, es decir que carga paralelamente el JS y el HTML a la vez, pero esto trae problemas en algunos js que dependen de otros.

Yo lo que hago es minificarlo, para que sea mas liviana la lectura del JS, y hago lo mismo con el CSS. hay servicios online para eso.

minificar JS: https://jscompress.com/

minificar CSS: https://cssminifier.com/

Para hacerlo tenes que copiar cada css y js, minificarlo y volvelor a subir al servidor.

2) Especificar caché de navegador para definir tiempos de expiracion (ojo)

Aca tenes que modificar el httacces con estas reglas, siempre con cuidado y si podes probralo en otro dominio que tengas de prueba. como asi tambien buscar otras reglas para compararlas:

# Con especificamos cache

<IfModule mod_expires.c>

ExpiresActive On ExpiresDefault "access plus 10 days"

ExpiresByType text/css "access plus 1 week"

ExpiresByType text/plain "access plus 1 week"

ExpiresByType image/gif "access plus 1 month"

ExpiresByType image/png "access plus 1 month"

ExpiresByType image/jpeg "access plus 1 month"

ExpiresByType image/x-icon "access plus 3 months"

ExpiresByType application/x-javascript "access plus 1 month"

ExpiresByType application/javascript "access plus 1 week"

ExpiresByType text/javascript "access plus 1 week"

ExpiresByType application/x-icon "access plus 3 months"

</IfModule>

# FIN

EL PASO 1 Y 2 YO LOS DEJARÍA COMO ULTIMO RECURSO, QUIZAS LO QUE HARIA SERIA MINIFICAR ALGUN CSS GRANDE.

3) optimización de las imagenes:

Creo que el punto mas importante, ya que los dos anteriores pueden seguir existiendo y ser compensados con otras mejoras como esta.

Para optimizar, tendrias que minificarlas como el css y el js.

yo uso 2 softwares:

1) http://luci.criosweb.ro/riot/ (este es simple, elegis la imagen y la compresion que queres darle, un 60/70 % produce buenas optmizaciones)

2) http://www.faststone.org/FSResizerDetail.htm (este es mas completo, puede funcionar en modo bulk tanto para optimizar como para agregar marcas de agua, y otras cosas mas. cuando son cargas grandes de imagenes este soft es muy util)

4) Activar la compresion del sitio a nivel servidor

Si usas Cpanel hay una apartado para activarlo.

Te paso otro test para que veas los tiempos de respuesta de tu web, ordenalos por tamaño (size) y te va a dar las imagenes mas grandes para ver si se pueden optimizar.

https://tools.pingdom.com/#!/brkoSh/http://www.carlos-amaral.com/

Se que no estoy respondiendo a tu pregunta de como hacerlo con website, te cuento como lo hago yo por si necesitas hacerlo y no se puede con website.

Un abrazo

Lire plus
Posté le de Diego Z.
CARLOS AMARAL
CARLOS AMARAL
Moderator
Auteur
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

ahhhh si si...  si te fijas en el link, google es medio magico jajaja...

te dan un link desde donde te podes bajar las imagenes que tenian problema, pero ya optimizadas por google.

y con los css y js. lo mismo, te los baja ya minificados, todo junto en un zip con las imagenes.

lo que pasa es que actualizo mi pagina bastante seguido subiendola desde websiteX5, y luego de cada subida tendria que luego reemplazar estos a mano, o hacer la subida de la actualizacion a mano (no muy recomendable).

Asi que bueno... muchisimas gracias... y me quedare con ese porcentaje nomas a los ojos de google insight, que le vamos a hacer...

Muchisimas gracias por la explicacion...   +1

Lire plus
Posté le de CARLOS AMARAL
Diego Z.
Diego Z.
User

Lo que podes hacer para bajar el tiempo de carga es pasar tu web por un CDN tipo cloudfare. le sacas carga a tu servidor y se lo transferis al cdn y con eso ganas un poco mas de velocidad de carga. algo mas para sumar a los ojos de google jaja

Lire plus
Posté le de Diego Z.
CARLOS AMARAL
CARLOS AMARAL
Moderator
Auteur
Meilleur utilisateur du mois ESMeilleur utilisateur du mois PT

Si habrán piques que uno no conoce ehh!!! jajajaaa...

lamentable esto de tener que quedar bien con google o estamos en el horno jajaa...

muchas gracias por la info, igual en este caso no me importa taaanto el posicionamiento, como para complicar tanto las cosas, ya que la tengo mas bien para cuando me piden referencias sobre lo que hago.

Nuevamente muchas gracias...

(ultimamente estoy siguiendo tus comentarios por aca ya que se aprenden cosas interesantes, un abrazo!)

Lire plus
Posté le de CARLOS AMARAL