Quiero mejorar el pagespeed de mi sitio Web

[elpetakas]

Vereis, tengo un sitio web Joomla y estoy utilizando google pagespeed para tratar de optimizala http://code.google.com/intl/es-ES/speed/page-speed/

Pues bien, tengo dos dudas al respecto, mi página tiene un pagespeed de 44/100 y me gustaria mejorar en 2 aspectos al menos:

1. Especificar caché de navegador (Mi resultado es parecido al siguiente)

El período de validez de los siguientes recursos que se pueden almacenar en caché es muy breve. En el futuro, especifique un período de caducidad de al menos una semana para los siguientes recursos:
http://www.*******.es/images/f.png (caducidad no especificada)
http://www.*******.es/images/logo.png (caducidad no especificada)
... (y muchos mas)

2. Habilitar compresión (Mi resultado es parecido al siguiente)

Si se comprimen los recursos indicados a continuación con gzip, se puede reducir el tamaño de transferencia en 197.9 KB (lo que supone una reducción del 69%).
Si se comprime http://www.*******.es/plugins/system/mtupgrade/mootools.js, se pueden ahorrar 83.1 KB (lo que supone una reducción del 71%).
Si se comprime http://www.*******.es/modules/mod_xpertscroller/admin/jquery-1.4.4.js, se pueden ahorrar 50.3 KB (lo que supone una reducción del 65%).
... ( y un largo etc)

Bueno pues en la configuración global de mi sitio web tengo activada la compresión gzip y también tengo activada la caché de página y cache de módulo y vista...

¿Pero entiendo que tengo que tratar la caché y la compresión de cada fichero uno por uno o eso como va? ¿Alguien me echa un cable?

EDITO:

Los siguientes recursos que se pueden comprimir y almacenar en caché deben tener una cabecera "Vary" con el valor "Accept-Encoding":

¿Como pongo ese vary?

[reyesoft]

Iniciado por elpetakas

El período de validez de los siguientes recursos que se pueden almacenar en caché es muy breve. En el futuro, especifique un período de caducidad de al menos una semana para los siguientes recursos:
http://www.*******.es/images/f.png (caducidad no especificada)
http://www.*******.es/images/logo.png (caducidad no especificada)
... (y muchos mas)

¿Tienes acceso a configurar el httpd.conf de apache? Si es así coloca:

Código:

  <FilesMatch "\.(jpg|jpeg|png|gif|swf)$">
  # 6 meses
  Header set Cache-Control "max-age=15552000, public"
  </FilesMatch>

Iniciado por elpetakas

Si se comprimen los recursos indicados a continuación con gzip, se puede reducir el tamaño de transferencia en 197.9 KB (lo que supone una reducción del 69%).
Si se comprime http://www.*******.es/plugins/system...de/mootools.js, se pueden ahorrar 83.1 KB (lo que supone una reducción del 71%).
Si se comprime http://www.*******.es/modules/mod_xp...query-1.4.4.js, se pueden ahorrar 50.3 KB (lo que supone una reducción del 65%).
... ( y un largo etc)

Abre los .JS y "minifícalos" en http://fmarcia.info/jsmin/test.html

Iniciado por elpetakas

Los siguientes recursos que se pueden comprimir y almacenar en caché deben tener una cabecera "Vary" con el valor "Accept-Encoding":

Especifica en el index.php de tu sitio:

Código PHP:

  header('Vary: Accept-Encoding');  
   

Chequea si este último es correcto hacerlo, ya que solucionaría el problema pero no se bien que hace la especificación.

Un saludo...

[elpetakas]

Muy util tu información, no conocía el servicio de minificar los js, como no tenía acceso al fichero httpd.conf de apache, he investigado y consegui aumentar de 44 a 66 mi pagespeed añadiendo este codigo en el .htcaccess para aumentar la caché

Código:

<ifmodule mod_expires.c>
 ExpiresActive On
 ExpiresDefault A3600
 <filesmatch ".(jpg|JPG|gif|GIF|png|css|ico|js)$">
  ExpiresDefault "access plus 7 day"
 </filesmatch>
</ifmodule>

estoy minificando mis archivos javascript, muchas gracias a tu direccion ;), después investigaré acerca de la compresión gzip que no he dado todavía con la copla de como hacerlo, lo que la cabecera vary e reporte que me da es similar a los anteriores

Los siguientes recursos que se pueden comprimir y almacenar en caché deben tener una cabecera "Vary" con el valor "Accept-Encoding":
http://www.******.es/includes/js/joomla.javascript.js
http://www.******.es/media/system/js/caption.js
... (y algunos mas)

pero para mí es más prioritario habilitar la compresión gzip de mi sitio web, muchas gracias por la ayuda prestada, seguiré investigando...

[Tedel]

Si realmente quieres aumentar la velocidad cambia de hosting y usa o VPS o Cloud... claro, si no te alcanza para un servidor propio, que es lo ideal.

Saludos,
Yo

[merino_renato]

Iniciado por elpetakas

Muy util tu información, no conocía el servicio de minificar los js, como no tenía acceso al fichero httpd.conf de apache, he investigado y consegui aumentar de 44 a 66 mi pagespeed añadiendo este codigo en el .htcaccess para aumentar la caché

Código:

<ifmodule mod_expires.c>
 ExpiresActive On
 ExpiresDefault A3600
 <filesmatch ".(jpg|JPG|gif|GIF|png|css|ico|js)$">
  ExpiresDefault "access plus 7 day"
 </filesmatch>
</ifmodule>

estoy minificando mis archivos javascript, muchas gracias a tu direccion ;), después investigaré acerca de la compresión gzip que no he dado todavía con la copla de como hacerlo, lo que la cabecera vary e reporte que me da es similar a los anteriores



pero para mí es más prioritario habilitar la compresión gzip de mi sitio web, muchas gracias por la ayuda prestada, seguiré investigando...

Hola:

Desde que e meti a tu tema yo tambien he buscado como configurar el httpd.conf pero sigo sin encintrar nada...

Y lo de l codigo que posteaste solo lo pegaste en el httaccess?

Como va la page speed de tu web por cierto?

Saludos

[elpetakas]

Iniciado por merino_renato

Hola:

Desde que e meti a tu tema yo tambien he buscado como configurar el httpd.conf pero sigo sin encintrar nada...

Y lo de l codigo que posteaste solo lo pegaste en el httaccess?

Como va la page speed de tu web por cierto?

Saludos

el codigo que puse va en el htaccess

a mi no me sirve configurar el httpd.conf porque no tengo acceso a el, no he conseguido todavia ni la compresion gzip, ni me funcionan las cabeceras vary :S

mi pagespeed ahora mismo es de 51 sin activar la cache, activando la cache colocando el trozo de codigo al .htaccess me sube unos 30 puntos, por las demás recomendaciones me quedan un par de cosejas de poca importancia de color verde, lo que demuestra que en mi web la compresion gzip tiene una importancia alrededor del 20% del total, pero vamos, yo creo que unos 80 esta bastante bien

saludos!

[merino_renato]

Iniciado por elpetakas

el codigo que puse va en el htaccess

a mi no me sirve configurar el httpd.conf porque no tengo acceso a el, no he conseguido todavia ni la compresion gzip, ni me funcionan las cabeceras vary :S

mi pagespeed ahora mismo es de 51 sin activar la cache, activando la cache colocando el trozo de codigo al .htaccess me sube unos 30 puntos, por las demás recomendaciones me quedan un par de cosejas de poca importancia de color verde, lo que demuestra que en mi web la compresion gzip tiene una importancia alrededor del 20% del total, pero vamos, yo creo que unos 80 esta bastante bien

saludos!

Hola:

A mi tambien me da alrededor de 78 - 81% en page speed...

Pero me sale varias cosas que no he resuelto del todo hoy encontre una para los css sprites:

http://spriteme.org/

Y este es parecido al page speed solo que da otra información acerca de alojar el contenido estatico de la web en subdominios:

http://gtmetrix.com/

Ojala y te sirvan de algo...

Entonces solo pego ese codigo en mi httaccess y ya me comprime los js, css, etc?

Oye y tu lograste hacer el "defer parsing de javascipt" para que cargue los css antes?

Si lo lograste podrias explicar como lo lograste?

Saludos

[elpetakas]

no, el codigo que puse es para activar la caché, la compresión gzip no la he conseguido, lo único que hice con los js y css fue minimizarlos (que es básicamente ponerlo todo en una misma línea y quitarle todos los espacios)

lo de aplazar el análisis javascript lo tengo en verde también pendiente, sería interesante hacerlo porque utilizo entre otras cosas mootools y jquery y entre las 2 son 200kb de memoria que no son de perder, no se como hacer para cumplir con ese punto, será lo próximo que investigaré :)

[elpetakas]

por cierto muchas gracias por tu enlace de los sprites, dejo yo un enlace donde viene muy bien explicado http://www.librosweb.es/css_avanzado...y_sprites.html

[merino_renato]

Hola:

Mira yo le puse esto al codigo fuente en la seccion <header>:

<script type="text/javascript">

// Add a script element as a child of the body
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "deferredfunctions.js";
document.body.appendChild(element);
}

// Check for browser support of event handling capability
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;

</script>

Parece que si funciona ya tengo mi web en 90% pero me falta lo de gzip y los sprites...

Mira para gzip tengo estas opciones:

Turn Gzip Compression On
This goes in your root .htaccess file but if you have access to

httpd.conf that is better.

This code uses the FilesMatch directive and the SetOutputFilter DEFLATE

directive to only target files ending in .js or .css

<IfModule mod_deflate.c>
<FilesMatch "\.(js|css)$">
SetOutputFilter DEFLATE
</FilesMatch>
</IfModule>

--------------------------opcion 2

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{HTTP_USER_AGENT} !Konqueror
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule ^(.*)\.(css|js)$ $1.$2.gz [QSA,L]
<FilesMatch \.css\.gz$>
ForceType text/css
</FilesMatch>
<FilesMatch \.js\.gz$>
ForceType application/javascript
</FilesMatch>
</IfModule>
<IfModule mod_mime.c>
AddEncoding gzip .gz
</IfModule>

lo malo es que a mi no me han servido ninguno todavia se pegan en el archivo htaccess en la raiz de tu servidor, casi siempre esta en el public_html ... ojala y alguien nos ayude con lo del gzip... si sabes algo lo posteas aca no?

Saludos y ojala y les sirva a todos

[elpetakas]

mira a ver si te ayuda mi otro post http://www.forosdelweb.com/f64/probl...plorer-942190/, mejor contestame por ahí, ya que es más reciente. Un saludo!

[elpetakas]

ya digo yo para gzip lo unico que me sirvio fue el modulo de joomla gzzipper pero no funciona para IE, lástima porque es buenisimo, voy a probar tu código, lo de los sprites, lo dejo, me parece demasiado complicado conforme tengo estructurada la pagina

[elpetakas]

Iniciado por elpetakas

mira a ver si te ayuda mi otro post http://www.forosdelweb.com/f64/probl...plorer-942190/, mejor contestame por ahí, ya que es más reciente.

a ya he visto que estabas también por ahí, jeje un saludo!

[merino_renato]

Hola a todos:

Este es el codigo de gzip que me funciono a mi en el htaccess, tengo servidor Apache 2.2.17 con cpanel VPS Optimized 3

SetOutputFilter DEFLATE
AddEncoding x-compress .Z
AddEncoding x-gzip .gz .tgz
AddType application/x-compress .Z
AddType application/x-gzip .gz .tgz
AddOutputFilterByType DEFLATE text/php text/hTML text/txt text/xml text/css style/css


Ojala y les sirva a todos, oigan y alguien sabe lo de Aplazar el análisis de JavaScript?

Saludos

[Tedel]

Iniciado por merino_renato

Ojala y les sirva a todos, oigan y alguien sabe lo de Aplazar el análisis de JavaScript?

Sí, hace lo posible para que no sea obligatorio ponerlo en el header y se pone al final de la página web.

[limpiezadirect]

Mi pagespeed anda por el 78%. ¿Que tal está este valor? ¿Es malo o bueno?

¿Es posible lograr un 100% sin morir en el intento?

[jhonhenry009]

Ojala y alguien me pueda ayudar por favor. Lo que pasa es que también estoy optimizando mi web con Page Speed, yo soy es diseñador web no experto en programación o servidores y hace muy poco estoy metido en el cuento del SEO y analizo mi web con la herramienta y me dice unas sugerencias una de ellas es igual como preguntaba elpetakas.

Especificar cache del navegador?

Pero resulta que hice el archivo .htaccess con el codigo y lo subi a mi servidor no me ha funcionado y consultando lei en una web que godaddy donde tengo alojada mi web solo recibe este archivo en el servidor linux y yo tendo servidor windows que puedo hacer ayuda por favor o si alguien sabe el proceso de como hacerlo desde el servidor le agradeceria recibo toda clase de sugerencia y aporte o si estoy equivocado corrinjanme de ante mano se los agradesco.

[merino_renato]

Iniciado por Tedel

Sí, hace lo posible para que no sea obligatorio ponerlo en el header y se pone al final de la página web.

Hola a todos:

Te refieres a este codigo?

<script type="text/javascript">

// Add a script element as a child of the body
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "deferredfunctions.js";
document.body.appendChild(element);
}

// Check for browser support of event handling capability
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;

</script>

O sea este si lo pongo en el head y el resto de los javascripts (google analytics incluido) los pongo casi al cerrar la etiqueta </body> ?

Gracias por tu respuesta

P.D. ya voy en 91% de page speed pero los css sprites estan muy complicados...

Saludos

[elpetakas]

Error 330 (net::ERR_CONTENT_DECODING_FAILED): Error desconocido.

eso me salta cuando añado ob_start("ob_gzhandler"); a mi index.php :S Nada, no hay manera de activar la compresion gzip para los js y css... he probado con 1000 codigos en el .htaccess y no me comprime nada mas que los html :S

jhonhenry009, en servidores windows no te va a funcionar nada del .htaccess debido a que es para servidores apache (normalmente linux), supongo que en un servidor windows tendras IIS (internet information server)

Por cierto yo lo de aplazar el analisis javascript no lo entiendo :S

[elpetakas]

Solucionado mi problema GZIP http://www.forosdelweb.com/f64/probl...plorer-942190/

[jhonhenry009]

elpetakas, de verdad muchas gracias por la respuesta me sirvio mucho eso me tenia como loco no sabia si servia o no, y también sigo optimizando mi web con Page Speed tengo que corregir mas errores por esto les pido que sigan subiendo como arreglaron los suyos.

elpekas o alguno sabe como seria entonces el procedimiento para un servidor windows con IIS en godaddy.

Tengo que arreglar:

Especificar caché de navegador
Habilitar compresión

Gracias por su ayuda muy interesante el tema para todos los que queremos y necesitamos optimizar nuestra web

[jhonhenry009]

Bueno al final cambie mi servidor de windows a linux el archivo .htcaccess lo creo en el bloc de notas con la extensión .txt y después lo cambio en el servidor pregunta.

En que carpeta debo guardarlo o hay que guardarlo solo en la carpeta raíz del sitio y cuando lo guardo en el bloc de notas que codificación se debe utilizar ANSI o alguna de las otras?

Gracias espero su colaboración

[RBZ]

El archivo .htaccess es sin extensión, simplemente debes llamarlo .htaccess.

[Tedel]

Iniciado por merino_renato

Hola a todos:

Te refieres a este codigo?

<script type="text/javascript">

// Add a script element as a child of the body
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "deferredfunctions.js";
document.body.appendChild(element);
}

// Check for browser support of event handling capability
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;

</script>

O sea este si lo pongo en el head y el resto de los javascripts (google analytics incluido) los pongo casi al cerrar la etiqueta </body> ?

Gracias por tu respuesta

P.D. ya voy en 91% de page speed pero los css sprites estan muy complicados...

Saludos

Bueno, yo en general recomiendo NO usar Google Analytics, pero por lo demás tienes razón.

Iniciado por jhonhenry009

Bueno al final cambie mi servidor de windows a linux el archivo .htcaccess lo creo en el bloc de notas con la extensión .txt y después lo cambio en el servidor pregunta.

En que carpeta debo guardarlo o hay que guardarlo solo en la carpeta raíz del sitio y cuando lo guardo en el bloc de notas que codificación se debe utilizar ANSI o alguna de las otras?

Gracias espero su colaboración

El archivo se llama en realidad htaccess. El punto adelante indica en Unix y Linux que es un archivo oculto.

Se coloca en la carpeta raíz, por lo general el public_html del servidor donde estás alojando tu sitio.

[jhonhenry009]

El archivo .htaccess. debe llevar dos puntos o solo el primero es que he tratado mucho y no me da alguien puede hacerme el favor y me explica mejor el procedimiento no se que error estoy cometiendo es para:

Especificar la cahe del navegador

[elpetakas]

Iniciado por jhonhenry009

El archivo .htaccess. debe llevar dos puntos o solo el primero es que he tratado mucho y no me da alguien puede hacerme el favor y me explica mejor el procedimiento no se que error estoy cometiendo es para:

Especificar la cahe del navegador

solo el primer punto .htaccess, para especificar la cache del navegador, revisate los mensajes que pusimos anteriormente, aver si te funciona alguna solucion

[jhonhenry009]

Si revise todo el tema y he consultaod y no va la actualización me voy a comunicar más bn con mis proveedores de hosting haber si me dan una solución elpetakas gracias por toda la info se valora.

[merino_renato]

Iniciado por Tedel

Bueno, yo en general recomiendo NO usar Google Analytics, pero por lo demás tienes razón.

Porque NO recomiendas el google analytics Tedel????

Yo soy novato en esto y pues si me das tu punto de vista porque no usarlo pues que mejor, y perdon si te los vuelvo a preguntar pero si pongo el codigo que te mostre en el post anterior:

<header>

<script type="text/javascript">

// Add a script element as a child of the body
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "deferredfunctions.js";
document.body.appendChild(element);
}

// Check for browser support of event handling capability
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;

</script>

</head>

Podre poner el resto de mis java <script> casi al final del </body> ?
Si o No?

Gracias por tus comentarios

Saludos

[jhonhenry009]

No nada que soy capaz y me dijeron los de soporte godaddy que mirara las instrucciones de apache pero creo que he hecho todo bn guarde el archivo en el bloc de notas con .txt con codificación ANSI y lo cambie en el servidor le quite el .txt. Con el codigo:

<ifmodule mod_expires.c>
ExpiresActive On
ExpiresDefault A3600
<filesmatch ".(jpg|JPG|gif|GIF|png|css|ico|js)$">
ExpiresDefault "access plus 7 day"
</filesmatch>
</ifmodule>

[Tedel]

Iniciado por merino_renato

Porque NO recomiendas el google analytics Tedel????

Porque Google ha demostrado varias veces ser una empresa no del todo ética.

Algunos detalles:

1. Adsense analiza tu comportamiento en la Internet mediante cookies y utiliza la información que va obteniendo de ti para mostrarte anuncios "más relevantes". O sea que, si en algún momento haces clic en un anuncio sobre, digamos, la enfermedad de Parkinson, Google toma el dato y crea un registro "el usuario de la computadora identificada con el ID mapamundi-cualquiercosa-alfa-dos-cuatro tiene interés en la enfermedad de Parkinson".

Google dice que respeta la privacidad de los usuarios y que no recopila información "personalmente identificable", pero eso no significa que no recopile información. Lo hace. Simplemente la relaciona con "el usuario de la computadora identificada con el ID mapamundi-cualquiercosa-alfa-dos-cuatro" y no con, por ejemplo, Pedro Pérez.

Quien vista páginas web con Adsense seguido notará en poco tiempo que le aparecen más avisos relacionados con la enfermedad de Parkinson que antes. Es simplemente Google haciendo uso de la información que obtuvo sobre ti anteriormente.

...Y teniendo en cuenta que la mayoría no sabe borrar sus cookies, ya te imaginas el negociazo.

Para muestra un botón, hace menos de un mes di una consultoría en SEO a una pareja de administradores de un hostal. Ella me dijo que estaba harta de ver publicidad de otros hostales cada vez que navega por la Internet, y me preguntó si no había manera de terminar con eso. Era Google haciendo uso del cookie nuevamente. "La persona en la computadora identificada en la computadora escuadron-alfa-loba-nueve visita páginas de turismo con frecuencia. Está interesado en el turismo, así que enviémosle publicidad relacionada con el tema".

2. Eso de que usan la información es aparentemente difícil de probar, pero mi jefe me ha dicho en mi cara que alguna vez compró información a Google. No necesito saber más.

3. Instalar Analytics en tu sitio lentifica la velocidad de carga de tu página. Un comando script detiene por completo la carga de tu web hasta que el script haya terminado de cargar o ejecutar sus instrucciones, o sea, hasta que Google está listo para tomar toda la información posible de esa visita. No te conviene.

4. Instalando Analytics, Google tendrá información de primera mano de la actividad en tu web: número de visitas, origen de las visitas, porcentaje de rebote, páginas más visitadas, etc. y, lo principal, es que como administradores, tendrán acceso a toda esa información cuando quieran. Pregúntale al dueño de este foro si no tienen acceso a todo lo que hacemos aquí, por ejemplo. Lo tienen, porque son los dueños. Bien, con Google es lo mismo, pero es una empresa que utiliza la información.

Por eso recomiendo mantenerse lo más lejos de los productos de Google que te sea posible.

Ahora, en defensa de Google, diré que tiene productos realmente buenos y un marketing realmente espectacular. La invención del PageRank hace algunos años fue una movida maestra para terminar con Yahoo! como buscador competencia. El pago por clic fue una manera magistral de tomar por asalto todo el sistema de publicidad por la Internet y volverlo casi un monopolio; especialmente cuando antes de eso un aviso en Yahoo! podía costar sus 50 o 100 mil dólares mensuales...

Pero Google no es el Jesucristo de la Internet que vino al mundo para salvarnos a todos del desorden con su buscador. Todo lo contrario, Google es un negocio que ve por sus intereses... y yo, personalmente, estoy en contra de darle todavía más poder.

Algunas alternativas que deberías considerar:

Piwik, analíticas desde tu propio servidor.
Statcounter y Hit-Meter. Contadores independientes de altisima calidad, aunque Statcounter es mas bonito, Hit-Meter es mas completo, creo yo.

DuckDuckGo, buscador alternativo que elimina es spam de sus índices y mantiene niveles de resultados de una calidad más que aceptable, buena.

Espero ayude.