First Byte Time. ¿Qué es?¿Cómo se mejora?

manzarinaa · #1 (**permalink**) 26/11/2011, 13:19

Hola a tod@s
He encontrado via twitter esta herramienta http://www.webpagetest.org pinta muy bien. Muy detallada cada llamada que se hace al servidor, además de valorar varios aspectos de la web.

El caso es que una de estas valoraciones "F First Byte Time" me la pone fatal en todas las paginas que toco y es la primera vez que me encuentro esto.

¿podríais por favor marcarme un poco el camino sobre este tema?
Muchas gracias

Bueno voy a auto-responderme un poco, pero espero alguna sugerencia porque estoy viendo que no es un tema de fácil solución.

por definición:
Es el tiempo que le toma a un navegador para iniciar la recepción de información después de que se ha empezado a hacer la petición al servidor. En algunas situaciones, tanto como el 75% del tiempo dedicado a la carga de una página puede ser absorbido por la espera del primer byte de datos para llegar.

las sugerencias que estoy leyendo son basicamente:
-optimizar bases de datos
-cambiar de servidor
-utilizar la nube
Lo de las bases de datos, si que algo se puede mirar y muy seguramente mejorar.
Proximamente voy a empezar a tocar el tema de paralelizar descargas, metiendo imagenes, js, css en subdominios, pero no sé hasta que punto esto va a mejorar el FBT porque los subdominios estarán en principio en el mismo servidor.
pero lo de irme a la nube y cambiar de servidor.... buff

charlyalegret · #2 (**permalink**) 26/11/2011, 14:13

creo que principalmente es cosa del servidor... calidad y localización, por eso es aconsejable que el servidor esté alojado en el país de interés...
Lo de la nube no se, pero sé que google por ejemplo tiene muchos de las librerías comunes de js alojadas y puedes usarlas para liberar un poco tu servidor (motools, prototype etc etc): http://code.google.com/intl/es-ES/apis/libraries/
Sé que existen también cosas por el estilo para imágenes pero no sé que fiabilidad tienen...
Saludos

manzarinaa · #3 (**permalink**) 26/11/2011, 14:48

hola charlyalegret gracias por responder.

El servidor está en mi provincia y el contenido es para españa., no es mala máquina pero si puede ser que esté muy cargado

Estoy mirando el enlace que has puesto, muy bueno, voy a ver que puedo usar, que ya he visto una par de cosillas :P

en tema de las imagenes, pues todos los test saltan con que habría que usar CDN, pero este tema no lo tengo nada controlado, ahora mismo lo único que se hace es optimizarlas antes de subirlas y se comprimen con gzip, si que es verdad que en los tiempos de carga las imagenes dicen mucho y habría que darle más vueltas al tema.

Gracias de nuevo. Seguiré investigando ;)

charlyalegret · #4 (**permalink**) 26/11/2011, 15:12

mmm lo de comprimir en gzip te refieres a las imágenes? Si no me equivoco no es recomendable ya que las imágenes en jpg etc ya no se comprimen más y gastas recursos.
Yo intento ajustarlas a las necesidades, por ejemplo en esta web puedes subirlas y te muestra diferentes compresiones (con su perdida de calidad) pero a menudo puedo reducir bastante el tamaño sin afectar mucho a la calidad: http://www.freshpixels.net/
Lo del cdn, pues yo estoy igual que tu, no lo veo del todo claro, pero no descarto investigar sobre el tema cuando tenga más tiempo...
Saludos

merino_renato · #5 (**permalink**) 26/11/2011, 20:03

Hola a todos:

Lo del CDN (content delivery network) se trata por ejemplo de repartir elemento estatico de nuestra web en subdominios del mismo dominio, para que se cargue más rápido, aunque también he leído de algunas empresas que proveen el servicio, yo en particular no lo he usado, pero en gmetrix:

http://gtmetrix.com/

lo explica un poco, la verdad como ya tengo page speed de 92 pues ya no me preocupo tanto, también se pueden hace css sprites para realizar menos llamadas al servidor, y un largo etc. que explican de manera sencilla...

Saludos

manzarinaa · #6 (**permalink**) 27/11/2011, 09:23

Hola
charlyalegret, me hiciste dudar y lo he mirado, tienes razón. No estoy comprimiendo imagenes, me estaba liando con el caché, que lo tengo escrito justo debajo :P. lo estoy haciendo con el css y el js.
las imagenes están optimizadas hasta donde se puede, el css sprites como dice merino se usa en alguna cosilla, pero si que se puede usar más.
lo del cdn yo pensaba que era poner en otros servidores los archivos estáticos; que lo de los subdominios era una alternativa a esto.

Ante esto me encuentro, con que:
dado que el servidor lo tengo geográficamente bien localizado, si me llevo los estáticos a otro servidor, y este otro está por ejemplo en los USA, puedo estar haciendo más mal que bien a la página, pero por otro lado si lo monto en subdominios y el problema me viene porque el servidor está saturado quizá es buena idea llevarse los estáticos fuera.
Voy a documentarme un poquito mejor, voy a añadir a la web lo del code google y os cuento.

Gracias ^^

charlyalegret · #7 (**permalink**) 27/11/2011, 10:13

Yo también pensaba que lo del cdn era usar otros servidores, y sobre lo de los subdominios no tenía ni idea... será cosa de estudiar el tema!
Gracias también a los dos!

merino_renato · #8 (**permalink**) 27/11/2011, 20:52

Cita:

Iniciado por charlyalegret

Yo también pensaba que lo del cdn era usar otros servidores, y sobre lo de los subdominios no tenía ni idea... será cosa de estudiar el tema!
Gracias también a los dos!

Se debe crear un subdomino virtual sin cookies, la verdad es que yo no se configurar esto pero me he estado documentando un poco, además de que ultimamente no he tenido tiempo de hacer mejoras de velocidad a mi web...

http://www.go2linux.org/linux/2010/0...-hostnames-719

http://spritegen.website-performance.org/

http://shibashake.com/wordpress-them...llel-downloads

Y de pilón un nuevo formato que a mi me más bien me suena a que será a fuerzas y no si quieres:

http://code.google.com/intl/es-ES/speed/webp/index.html

Si alguien puede publicar algo mas de como hacer esto de los parallel downloads, pues ojala y lo postee aquí para que todos lo podamos lograr...

P.D. no se se algun moderador quiera combinar el tema para que se haga una tipo mini guia de page speed que nos permita a todos llegar al 100

http://www.forosdelweb.com/f64/quier...io-web-939699/

Saludos

manzarinaa · #9 (**permalink**) 15/12/2011, 12:07

Bueno, que hice pruebillas! se me había olvidado deciros algo.

-optimicé imagenes que faltaban
-puse los js en un subdominio
-las imágenes estáticas en otro subdominio
-probé lo del google code y lo quité (tarda más en cargar, que teniéndolo en el servidor)

Me he quitado un tiempo de carga (significativo), pero el First Byte Time va igual de mal.

Ahora lo que voy a hacer es que en lugar de hacer las consultas para por ejemplo: un menú de categorías cada vez que alguien entra a una pantalla, es meter un cronjob que se ejecute una vez al día y me genere un html con el resultado de esas consultas. Así tiro menos de las bases de datos.
Vamos a ver que tal ;)

charlyalegret · #10 (**permalink**) 15/12/2011, 12:42

Gracias por tus impresiones!!

Cita:

probé lo del google code y lo quité (tarda más en cargar, que teniéndolo en el servidor)

Qué bueno, la verdad es que una de las cosas que más me tarda en cargar en una de mis páginas es el boton de google+, por eso nunca me atreví a usar sus apis...

Se me ocurre una cosa: crea una página sencilla, que sólo contenga algo como "Hola mundo" (para ser originales), y pásale el webpagetest. Si el first byte time sigue igual, pues supongo que es cosa del servidor que no vas a poder mejorar, a no ser que cambies :S!

Eso del cronjob no lo había oido nunca y parece interesante (sobretodo para quienes no modificamos el contenido muy a menudo)... otra cosa más que apunto a la lista (lástima que no se de donde voy a sacar el tiempo!! :_( )

Saludos

merino_renato · #11 (**permalink**) 15/12/2011, 16:42

Cita:

Iniciado por manzarinaa

Bueno, que hice pruebillas! se me había olvidado deciros algo.

-optimicé imagenes que faltaban
-puse los js en un subdominio
-las imágenes estáticas en otro subdominio
-probé lo del google code y lo quité (tarda más en cargar, que teniéndolo en el servidor)

Hola a todos:

Manzarinaa podrias por favorr explicar aquí en el foro como crear subdominios para ponerle imagenes estaticas y los js en otro subdominio?

No se, si pusiste alguna orden en tu htaccess, movsite algo en tu cpanel...

Y la pagina de donde pegaste el google code.

Para que terminemos este tema del page speed y aprendamos todos?

http://www.forosdelweb.com/f64/quier...io-web-939699/

Saludos y gracias por la ayuda

manzarinaa · #12 (**permalink**) 16/12/2011, 03:10

hola!
merino los hice desde el cpanel dominios>subdominios
Le das un nombre al subdominio, a la carpeta carpeta que va a contener los archivos y ya está. En el ftp aparece en public_html esa carpeta, les metí un .htacces con la compresión, el caché, las redirecciones para evitar duplicidades y andando.
en los en los src de las <img rutas absolutas y en los css lo mismo
Ahora voy a mirar el hilo que me dices.

charly no solo quité el google code, también el botón +1, el me gusta de FB y muy a mi pesar el addthis. que lo del addthis es impresionante.
No tienen ni las imagenes optimizadas, ni caché ...veo una imagen que tarda una vida en cargar, miro a ver que es eso y me encuentro con 506k de imagen!!
Si que las páginas html cargan más rápido y el first byte time mejora algo,tampoco nada para tirar cohetes, pero bueno. algo es algo :P

merino_renato · #13 (**permalink**) 16/12/2011, 03:58

Cita:

Iniciado por manzarinaa

hola!
merino los hice desde el cpanel dominios>subdominios
Le das un nombre al subdominio, a la carpeta carpeta que va a contener los archivos y ya está. En el ftp aparece en public_html esa carpeta, les metí un .htacces con la compresión, el caché, las redirecciones para evitar duplicidades y andando.
en los en los src de las <img rutas absolutas y en los css lo mismo
Ahora voy a mirar el hilo que me dices.

Muchas gracias por el aporte amigo, lo voy a probar y despues comento por aqui cuanto subió mi pagespeed.

Ya solo faltaria terminar el tema con los css sprites, y despues voy a tratar de juntar todo en un solo tema para que el que quiera llegue a 100 de pagespeed o lo más cerca...

Gracias de nuevo y suerte con tus proyectos

keriosp · #14 (**permalink**) 16/12/2011, 04:03

Hola, he seguido vuestro hilo sobre como mejorar el first byte time. Sólo decir que entiendo que el uso de subdominios es a causa de la posibilidad que da el protocolo http de poder abrir, dependiendo que actualización del navegador tengas, varios canales para distintos dominios/subdpminos, entonces para cada subdominio que crees podrá bajarse contenido en paralelo. El cdn es situar contenidos en servidores repartidos geograficamente de manera que a cada usuario le sirva el que este más próximo. Por ejemplo uno gratuito es cloudfare.com
Saludos!

manzarinaa · #15 (**permalink**) 16/12/2011, 04:31

merino no te obsesiones con el pagespeed XDD
yo lo tengo a 90 y la pagina me tarda (voy a confesar mis mierdas :P)
+/- 5 segundos con la pagina en limpio
+/- 8 con el addthis, el +1, el comparte, el me gusta, las analitics, etc
y con todo eso y además la publicidad he llegado a ver un 13 segundos que es una burrada

Ahora mismo lo tengo a 8 con la pagina en limpio, más la publicidad

¿cuantos visitantes nuevos se me van de la pagina por lo que tarda? Cuanto me crece el rebote únicamente por el tiempo?? a mi es esto lo que me preocupa

merino_renato · #16 (**permalink**) 16/12/2011, 04:32

Cita:

Iniciado por keriosp

Hola, he seguido vuestro hilo sobre como mejorar el first byte time. Sólo decir que entiendo que el uso de subdominios es a causa de la posibilidad que da el protocolo http de poder abrir, dependiendo que actualización del navegador tengas, varios canales para distintos dominios/subdpminos, entonces para cada subdominio que crees podrá bajarse contenido en paralelo. El cdn es situar contenidos en servidores repartidos geograficamente de manera que a cada usuario le sirva el que este más próximo. Por ejemplo uno gratuito es cloudfare.com
Saludos!

Gracias por el aporte amigo, pero cloudfare paso a mejor vida

pero gracias por tratar de ayudar.

Aqui hay otra herramienta para checar el first bite:

http://www.bytecheck.com/

Saludos

manzarinaa · #17 (**permalink**) 16/12/2011, 04:43

iba a editar pero no veo el botón XD

añado que de los 8 segundos 2.499s son el primer byte

keriops hasta donde he podio leer se pueden hacer dos descargas simultaneas desde cada sitio
por lo que teniendo dos subdominios estoy haciendo 6 y viendo como tengo el patio, no descarto hacer un 3º y dividir las imagenes entre 2

merino_renato · #18 (**permalink**) 16/12/2011, 05:20

Cita:

Iniciado por manzarinaa

iba a editar pero no veo el botón XD

añado que de los 8 segundos 2.499s son el primer byte

keriops hasta donde he podio leer se pueden hacer dos descargas simultaneas desde cada sitio
por lo que teniendo dos subdominios estoy haciendo 6 y viendo como tengo el patio, no descarto hacer un 3º y dividir las imagenes entre 2

Cuanto te da de resultado en la herramienta bytecheck que puse?

A mi me dio 0.446 de score...

Y mi web tiene varias imagenes...

A lo mejor es el servidor o la compresión gzip...

Despues de guardar en cache me dio:

Your Time To First Byte is: 0.155 seconds

Si ya hiciste lo de separar en subdominios el contenido estatico como java, imagenes y css

creo que te falta la cache, gzip, bajar todo el javascript que se pueda de tu pagina hasta antes del /body y ... pues creo es todo.

Saludos

manzarinaa · #19 (**permalink**) 16/12/2011, 05:31

Your Time To First Byte is: 2.626 seconds :(
miraré lo delas cabeceras que puse en el otro hilo, estoy con lo de generar html para ahorrar consultas a la BD y seguramente meter un subdominio más.
todo lo demás ya está mirado y tocado (creo)

charlyalegret · #20 (**permalink**) 16/12/2011, 06:25

Cita:

Iniciado por manzarinaa

¿cuantos visitantes nuevos se me van de la pagina por lo que tarda? Cuanto me crece el rebote únicamente por el tiempo?? a mi es esto lo que me preocupa

Yo creo que lo más importante es ver en webpagetest el "start render". Es decir, si la página comienza a verse a los 4 segundos, pero no se acaba de cargar (por imágenes o js o los dichosos botones de redes sociales) hasta los 10, pues no es lo mismo que no se vea nada hasta los 10 segundos.

Por eso la importancia de cargar los botones, el js y todo lo que sea menos importante, al final (justo antes de la etiqueta </body>,) y yo, la verdad, evito al máximo los js.

Lo primero, los css y el contenido.

Saludos.

Edito: manzarinaa, no puedes editar el mensaje cuando alguien ya ha respondido !!
merino_renato: yo no creo que sea tan importante llegar a pagespeed de 100 como tener una buena velocidad... es decir, el pagespeed se basa en unas cosas, pero no quiere decir que haya una buena optimización. El ejemplo más claro: a lo mejor tienes unas imágenes con una supercalidad que ocupan mucho, pero estan bien comprimidas y ajustadas al tamaño que muestras ---> pagespeed te dirá 100, pero quizá puedas reducir la calidad de la imágen (muchas veces no es tan importante) y reducir considerablemente la velocidad de carga. Por otro lado, el pagespeed te va a decir qeu no es bueno que tengas cosas sin un tiempo de caché inferior a 1 semana (o más), pero quizá lo hagas porque estás actualizando dicho elemento a diario... no porque te diga que no estás al 100% va a significar que tengas la web poco optimizada!!

Saludos

merino_renato · #21 (**permalink**) 16/12/2011, 07:37

Cita:

Iniciado por charlyalegret

merino_renato: yo no creo que sea tan importante llegar a pagespeed de 100 como tener una buena velocidad... es decir, el pagespeed se basa en unas cosas, pero no quiere decir que haya una buena optimización. El ejemplo más claro: a lo mejor tienes unas imágenes con una supercalidad que ocupan mucho, pero estan bien comprimidas y ajustadas al tamaño que muestras ---> pagespeed te dirá 100, pero quizá puedas reducir la calidad de la imágen (muchas veces no es tan importante) y reducir considerablemente la velocidad de carga. Por otro lado, el pagespeed te va a decir qeu no es bueno que tengas cosas sin un tiempo de caché inferior a 1 semana (o más), pero quizá lo hagas porque estás actualizando dicho elemento a diario... no porque te diga que no estás al 100% va a significar que tengas la web poco optimizada!!

Saludos

Hola charlyalegret:

Pues el pagespeed no solo califica imagenes, ni cache... para mi el pagespeed de 100 es solo un reto personal en realidad, aunque te diré que yo si considero que esto ayuda al SEO indirectamente, hay webs muy lentas y sin ir lejos cuando yo me topo con una pues sencillamente me salgo, y eso que yo uso chrome y firefox, que se supone son rapidas.

Imaginate si usara internet explorer como el 60% de los usuarios en el mundo...
segun he leido, la mayoria de las webs lentas tienen una tasa de rebote mucho más alta, claro si tu visitante se quiere chupar 10 segundos pues allá el pero la mayoría busca cada día todo más rapido, por eso hay fast food, internet de alta velocidad, etc.

además de que no todos tienen conexiones rápidas a internet, y encima si el usuario promedio no actualiza sus navegadores pues a te imaginaras...

Yo creo que un error muy común cuando se aprende un poco de SEO, programación, etc. nos olvidamos de los miles o millones de personas que no entienden mucho de computadoras y con trabajos usan internet explorer, pues bien ese es el mercado que me interesa a mi , porque?

porque para mi nicho esa gente ronda los 48+ años de edad, son personas que tienen solvencia económica y los que no saben que si el click que dan es orgánico o no si en chrome se ve más rápido, etc. al menos en mi país así es, si uno les da el plus de una web rápida a esas personas, aumenta mi posibilidad de ganar un cliente.

y en cuanto a optimización, pues yo uso la validación del WC3 para html, css y internacionalización, y no es para otra cosa que si pasas la validación html WC3 quiere decir que tu web se ve bien en casi todos los navegadores, el htaccess para urls amigable y cache control, pagina 404 personalizada, redirección 301,
y el robots.txt para bloquear lo que no quiero que aparezca.

Yo voy a empezar a usar cbwebp encoder para mis imagenes:

http://code.google.com/intl/es/speed...ocs/using.html

Y tambien CSS sprites

http://spritegen.website-performance.org/

Que otra optimización web recomiendas o usas tu?

Saludos

charlyalegret · #22 (**permalink**) 16/12/2011, 08:42

Pues lo mismo pienso yo! sólo quería decirte que el pagespeed ayuda pero hay que tener claro lo importante y lo no tan importante, y que se puede lograr velocidades superiores con pagespeed del 90 que con el pagespeed 100 si tienes en cuenta todo lo posible en cuanto optimización!

Lo que yo uso de momento:
- para las imágenes, muchas que las tomo yo con cámara, luego de reducirles el tamaño, si veo que se puede bajar el peso sin bajar mucho la calidad, pues lo hago, uso por ejemplo http://www.freshpixels.net/
- para las imágenes, como uso miniaturas y un slideshow, uso timthumb para cargar las miniaturas más rápido, y dejo la carga de las imágenes más grandes al clicar sobre la imágen.
- para las imágenes de botones, logo y más, uso un sólo archivo y luego con css cargo el trozo que me interesa (CSS sprites)
- el js siempre que puedo en el propio html para evitar llamar a más archivos.
- el js siempre al final antes de </body>
- todo el texto comprimido con gzip
- todos los css (el mio y el del slideshow) los he juntado en un solo archivo.

lo que me falta por mirar:
- usar subdominios para la carga de imágenes o otras cosas
- estudiar esto del cronjob para minimizar todos los accessos a la bd y otras funciones
- repasar el código para optimizar llamadas inútiles, funciones inútiles etc etc. Ya que soy muy novato en php, a medida que voy aprendiendo me he dado cuenta de cosas qeu podría mejorar, como cuando llamas a la bd, crear arrays con lo justo y necesario y no hacer un SELEC * from table cuando sólo quieres sacar 1 campo... interesante también ver por ejemplo: http://www.phpbench.com/

Sería interesante ampliar este tipo de listas al máximo!

Saludos

merino_renato · #23 (**permalink**) 16/12/2011, 10:31

Cita:

Iniciado por charlyalegret

Pues lo mismo pienso yo! sólo quería decirte que el pagespeed ayuda pero hay que tener claro lo importante y lo no tan importante, y que se puede lograr velocidades superiores con pagespeed del 90 que con el pagespeed 100 si tienes en cuenta todo lo posible en cuanto optimización!

Lo que yo uso de momento:
- para las imágenes, muchas que las tomo yo con cámara, luego de reducirles el tamaño, si veo que se puede bajar el peso sin bajar mucho la calidad, pues lo hago, uso por ejemplo http://www.freshpixels.net/
- para las imágenes, como uso miniaturas y un slideshow, uso timthumb para cargar las miniaturas más rápido, y dejo la carga de las imágenes más grandes al clicar sobre la imágen.
- para las imágenes de botones, logo y más, uso un sólo archivo y luego con css cargo el trozo que me interesa (CSS sprites)
- el js siempre que puedo en el propio html para evitar llamar a más archivos.
- el js siempre al final antes de </body>
- todo el texto comprimido con gzip
- todos los css (el mio y el del slideshow) los he juntado en un solo archivo.

lo que me falta por mirar:
- usar subdominios para la carga de imágenes o otras cosas
- estudiar esto del cronjob para minimizar todos los accessos a la bd y otras funciones
- repasar el código para optimizar llamadas inútiles, funciones inútiles etc etc. Ya que soy muy novato en php, a medida que voy aprendiendo me he dado cuenta de cosas qeu podría mejorar, como cuando llamas a la bd, crear arrays con lo justo y necesario y no hacer un SELEC * from table cuando sólo quieres sacar 1 campo... interesante también ver por ejemplo: http://www.phpbench.com/

Sería interesante ampliar este tipo de listas al máximo!

Saludos

Te refieres a las listas de este foro o a las de la web de php que pusiste de ejemplo?

Eso de los css sprites no he tenido tiempo de entenderlo, pero es algo asi como que lo que me recomienda poner pagespeed de google en un solo archivo, despues lo meto a un software que me genera una sola imagen grande,no?

Y luego lo llamas con css para que aparesca la foto de las coordenadas que le señalas en el css, es más o menos asi?

Y lo de poner javascript en el codigo directamente no lo habia probado, a ver si lo hago.

A ver si alguien más contribuye con alguna tecnica de optimización...

Saludos

charlyalegret · #24 (**permalink**) 16/12/2011, 11:13

Cita:

Iniciado por merino_renato

Te refieres a las listas de este foro o a las de la web de php que pusiste de ejemplo?

Me refiero a la lista de cosas que puedes hacer para mejorar el tiempo de carga!

Lo de Css sprits es simple (aunque algo tedioso de hacer...)

Tu pones todas las imágenes que típicamente aparecen en todas tus páginas (botones, cabecera...) en un sólo archivo (puedes usar el paint de windows o algún programa más complejo como photoshop o gimp). Con cualquiera de los programas, puedes ver las coordenadas donde comienza cada una de las imágenes en tu archivo (que tbien es una imágen).

Luego, en donde va la imágen en el código html, pones un div (ejemplo: <div id="menuimg"></div>, y en sus propiedades:

#menuimg {
height: 86px;
width: 980px;
background: url(imatges.jpeg) no-repeat;
background-position: 0px 0px;}

definiendo el tamaño de la imágen global (height y width) y la posicion donde empieza tu imágen específica dentro de la imágen global (en background-position). A tener en cuenta que la posición tienes que ponerla con número negativos!

saludos

merino_renato · #25 (**permalink**) 16/12/2011, 11:31

Cita:

Iniciado por charlyalegret

Me refiero a la lista de cosas que puedes hacer para mejorar el tiempo de carga!

Lo de Css sprits es simple (aunque algo tedioso de hacer...)

Tu pones todas las imágenes que típicamente aparecen en todas tus páginas (botones, cabecera...) en un sólo archivo (puedes usar el paint de windows o algún programa más complejo como photoshop o gimp). Con cualquiera de los programas, puedes ver las coordenadas donde comienza cada una de las imágenes en tu archivo (que tbien es una imágen).

Luego, en donde va la imágen en el código html, pones un div (ejemplo: <div id="menuimg"></div>, y en sus propiedades:

#menuimg {
height: 86px;
width: 980px;
background: url(imatges.jpeg) no-repeat;
background-position: 0px 0px;}

definiendo el tamaño de la imágen global (height y width) y la posicion donde empieza tu imágen específica dentro de la imágen global (en background-position). A tener en cuenta que la posición tienes que ponerla con número negativos!

saludos

Muchas gracias por el aporte charlyalegret, en cuanto termine mis linkk rel author de mi web regreso a esto de la optimizacion y con este tip del css sprite seguro que ahora si llego al 100

además de que lo voy a comprimir con esto caundo termine (guardando una version sin comprimir de emergencia):

http://fmarcia.info/jsmin/test.html

http://www.textfixer.com/html/compre...ompression.php

http://tools.dynamicdrive.com/imageoptimizer/

Saludos

keriosp · #26 (**permalink**) 16/12/2011, 14:58

Confundi la url, es www.cloudflare.com. Que susto teniendo una web configurada y que desapareciera sin avisarme!

Cita:

Gracias por el aporte amigo, pero cloudfare paso a mejor vida

pero gracias por tratar de ayudar.

El inconveniente de usar demasiados subdominios es que hace falta accesos dns también, por ello las utilidades de testeo para mejorar carga de páginas aconsejan máximo 2, 3 subdominios

Cita:

keriops hasta donde he podio leer se pueden hacer dos descargas simultaneas desde cada sitio por lo que teniendo dos subdominios estoy haciendo 6 y viendo como tengo el patio, no descarto hacer un 3º y dividir las imagenes entre 2

Habría que tener en cuenta, usar le menor número posible de ficheros css y javascript, poner los css en cabecera los javscript al final de la página. A la lista de mejoras a tener en cuenta agregaría suprimir envío de cookies para elementos estáticos como imágenes, que ya se ha comentado pero no está.

Espero que os sirva

merino_renato · #27 (**permalink**) 16/12/2011, 22:57

Cita:

Iniciado por keriosp

Confundi la url, es www.cloudflare.com. Que susto teniendo una web configurada y que desapareciera sin avisarme!

El inconveniente de usar demasiados subdominios es que hace falta accesos dns también, por ello las utilidades de testeo para mejorar carga de páginas aconsejan máximo 2, 3 subdominios

Habría que tener en cuenta, usar le menor número posible de ficheros css y javascript, poner los css en cabecera los javscript al final de la página. A la lista de mejoras a tener en cuenta agregaría suprimir envío de cookies para elementos estáticos como imágenes, que ya se ha comentado pero no está.

Espero que os sirva

Hola keriosp:

Gracias por las sugerencias, pero poner el css en la cabecera si usamos muchos estilos distintos no aumentaria mucho el peso del codigo?

Y me llamó la atención lo de suprimir el evnio de cookies, esto lo haces en el .htaccess?

Saludos

charlyalegret · #28 (**permalink**) 17/12/2011, 03:15

Cita:

Iniciado por merino_renato

pero poner el css en la cabecera si usamos muchos estilos distintos no aumentaria mucho el peso del codigo?

El css es un documento de texto, muchos muchos muchos estilos tienes que tener para que pese!! y más si luego lo comprimes!!
Lo interesante es tener sólo 1 css, ya que consumen mucho más las llamadas para descargar varios archivos que el peso que pueda tener uno.

Y sí, estos siempre al principio, si no comenzarás a cargar la página sin estilos y eso no sería una buena experiencia para el usuario!

Saludos!

keriosp · #29 (**permalink**) 17/12/2011, 05:24

Bueno sobre css me refería a que es aconsejable poner los css al inicio de la página, los elementos link que los cargan, al igual que los javascript al final de la página.
Sobre el no envío de cookies en apache no se decirte como hacerlo ya que trabajo con iis. El primer paso es tener los subdominios donde colocar el contenido para el que no quieres que se envén cookies. El segundo paso en iis es imlementar bien un módulo para iis o bien en código, para que en este subdominio se suprima el envío de cookies. Dejo un enlace por si puede dar ideas de como pasarlo a apache. http://omaralzabir.com/prevent-asp-net-cookies-from-being-sent-on-every-css-js-image-request/
Saludos

Cita:

Iniciado por merino_renato

Hola keriosp:

Gracias por las sugerencias, pero poner el css en la cabecera si usamos muchos estilos distintos no aumentaria mucho el peso del codigo?

Y me llamó la atención lo de suprimir el evnio de cookies, esto lo haces en el .htaccess?

Saludos

keriosp · #30 (**permalink**) 17/12/2011, 05:45

Bueno y la herramienta yslow la conoceís? necesita firebug también, pero es muy interesante los resultados que muestra analizando la página y con enlaces a como poder mejorar la carga de la página. Enlace al addons, https://addons.mozilla.org/es-es/firefox/addon/yslow/