Re: [Ovillo] Organizar CSS
Gracias por la aclaración. El día 15/10/07, NetVicious [EMAIL PROTECTED] escribió: El jueves, 11 oct 2007 a las 22:29, Fernando escribió: Eso pensaba yo, una petición segureo que ralentiza más que el continuar descargando un archivo más pesado. Por lo menos vía FTP cuando subimos archivos lo podemos comprobar, yo creo que tarda bastante menos en subir/bajar un archivo pongamos de 30Kb que 6 archivos de 5Kb, no? Quizás alguien de SISTEMAS pueda comentarnos en qué momento de peso puede ser óptimo partir la hoja de estilos en 2 o 3 archivos distintos. En todo esto dependen muchas cosas, por una parte la conexión del cliente y por otra el rendimiento del servidor así como de los intermediarios de la conexión. En casi todas las conexiones suele haber al principio un pico de velocidad que incluso puede superar lo contratado si estamos hablando de cable, no así en las ADSL o hijas. Por lo que a partir de este dato CSS pequeños son mejores que las enormes. Por otra parte casi todos los navegadores hoy en día suelen inyectar varias peticiones a la vez, y como hoy en día se suelen tener conexiones muy rápidas para descargar texto que es lo que estamos hablando el problema podrá estar en el servidor o intermediarios. Muchos ficheros implican muchos accesos a disco y en servidor con muchas páginas web o saturados esto puede hacer que la web se cargue un poco más lenta. Además de todo ello los ficheros CSS se cachean y no suelen descargarse varias veces a no ser que se le exija al navegador una recarga completa, por lo que un fichero CSS enorme no sería del todo malo. Sin hacer ningún tipo de análisis yo propondría bajo mi punto de vista CSS no mucho más grandes de 30-50kbs y no más de 3-5 ficheros CSS. De todas formas como bien he dicho antes esto depende sobre todo del servidor y del número de visitas que tenga nuestra web. También tendríamos que tener en cuenta que no es bueno llamar en todas nuestras páginas a todos nuestros CSSs ya que seguramente no sean necesarios todos los estilos, por lo que tendríamos que trocear un poco nuestros CSS, dejando por un sitio la parte común y por otro la más específica y según en la zona de la web donde nos encontremos cargar su estilo especifico además del común. Que quede claro que todo esto es una opinión mía como las puede haber otras mejores o peores. Un saludo -- /\/ / \ / \ / /\/ e t \/ i c i o u s ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Organizar CSS
muchas gracias para vuestros respuestas.
voy a ver como funcionan blueprint y YAML...
a parte de eso estaba buscando en la web y he encontrado un link que trata
el mismo tema (como mejorar tu css). vienen varios cositas que me parecen
interesantes (está escrito en inglés)...
http://www.smashingmagazine.com/2007/05/10/70-expert-ideas-for-better-css-co
ding/
saludos a todos.
daniela
-Mensaje original-
De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
En nombre de Rodrigo Álvarez Virgós
Enviado el: jueves, 11 de octubre de 2007 16:13
Para: Ovillo, la lista de CSS en castellano
Asunto: Re: [Ovillo] Organizar CSS
Hola, Daniela
Tengo un proyecto muy amplio que ya está hecho en tablas
pero poco a poco
hace falta pensar en el presente, es decir que vamos a rediseñar todo y
por
supuesto maquetar en capas.
Bien hecho ;-)
el problema es por ejemplo que hago la maquetación de una
ventanita pEj. mandar un correo
llamo el contenedor #correo y lo demás
está incluido allí
. si ahora resulta que la página de aviso legal
tendrá
un diseño parecido tendría que cambiar el nombre del #correo
eso me ha
pasado varias veces
Tienes que documentarte bien. Para dar estilos comunes a varios
elementos, una posibilidad es utilizar clases, es decir:
div id=correo class=xxx...
...
/div
div id=aviso_legal class=xxx ...
...
/div
, donde xxx es el nombre de la clase (el mismo para las dos capas). De
esta manera, en el css podrías poner algo parecido a:
.xxx {
[estilos para los elementos con clase xxx]
}
por otro lado he empezado partir la hoja de estilo en varios documentos.
tengo una hoja de estilo general donde puedo incluir varios documentos,
poniendo por ej.:
Yo hago lo mismo, hago una hoja con los estilos comunes a todos los
documentos, y luego hojas de estilo aparte, aplicables sólo a cierto/s
documento/s. De esta manera evitas que tdos los documentos lean
todos los estilos para tdo el sitio web ^^
Mi único consejo adicional es que documentes muy mucho, antes de hacer
preguntas tan simples como lo del correo y el aviso legal.
Un saludo
Rodrigo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Organizar CSS
El jueves, 11 oct 2007 a las 22:29, Fernando escribió: Eso pensaba yo, una petición segureo que ralentiza más que el continuar descargando un archivo más pesado. Por lo menos vía FTP cuando subimos archivos lo podemos comprobar, yo creo que tarda bastante menos en subir/bajar un archivo pongamos de 30Kb que 6 archivos de 5Kb, no? Quizás alguien de SISTEMAS pueda comentarnos en qué momento de peso puede ser óptimo partir la hoja de estilos en 2 o 3 archivos distintos. En todo esto dependen muchas cosas, por una parte la conexión del cliente y por otra el rendimiento del servidor así como de los intermediarios de la conexión. En casi todas las conexiones suele haber al principio un pico de velocidad que incluso puede superar lo contratado si estamos hablando de cable, no así en las ADSL o hijas. Por lo que a partir de este dato CSS pequeños son mejores que las enormes. Por otra parte casi todos los navegadores hoy en día suelen inyectar varias peticiones a la vez, y como hoy en día se suelen tener conexiones muy rápidas para descargar texto que es lo que estamos hablando el problema podrá estar en el servidor o intermediarios. Muchos ficheros implican muchos accesos a disco y en servidor con muchas páginas web o saturados esto puede hacer que la web se cargue un poco más lenta. Además de todo ello los ficheros CSS se cachean y no suelen descargarse varias veces a no ser que se le exija al navegador una recarga completa, por lo que un fichero CSS enorme no sería del todo malo. Sin hacer ningún tipo de análisis yo propondría bajo mi punto de vista CSS no mucho más grandes de 30-50kbs y no más de 3-5 ficheros CSS. De todas formas como bien he dicho antes esto depende sobre todo del servidor y del número de visitas que tenga nuestra web. También tendríamos que tener en cuenta que no es bueno llamar en todas nuestras páginas a todos nuestros CSSs ya que seguramente no sean necesarios todos los estilos, por lo que tendríamos que trocear un poco nuestros CSS, dejando por un sitio la parte común y por otro la más específica y según en la zona de la web donde nos encontremos cargar su estilo especifico además del común. Que quede claro que todo esto es una opinión mía como las puede haber otras mejores o peores. Un saludo -- /\/ / \ / \ / /\/ e t \/ i c i o u s ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Organizar CSS
Daniela yo revisaría como tratan el asunto YAML y Blueprint, más o menos de la misma forma que dices tu, yo ahora mismo utilizo blueprint y me va bastante bien para los proyectos grandes, para los pequeños los hago a pelo. saludos El día 11/10/07, Daniela Kerschbaumer [EMAIL PROTECTED] escribió: buenas tardes a todos, tengo un proyecto muy amplio que ya está hecho en tablas… pero poco a poco hace falta pensar en el presente, es decir que vamos a rediseñar todo y por supuesto maquetar en capas. algunas páginas ya están maquetadas y aquí empieza mi problema: como todavía no hemos podido realizar el diseño nuevo para el proyecto entero (como es tan amplio) el tema de la maquetación me causa algunas problemas. por supuesto hemos creado un styleguide para enlaces, titulos, etc. para mantener siempre la misma linea de diseño. también hemos preparado varios modelos como quedarían los contenedores para distintos tipos de páginas. pero el problema es por ejemplo que hago la maquetación de una ventanita pEj. mandar un correo… llamo el contenedor #correo y lo demás está incluido allí…. si ahora resulta que la página de aviso legal tendrá un diseño parecido tendría que cambiar el nombre del #correo… eso me ha pasado varias veces… por otro lado he empezado partir la hoja de estilo en varios documentos. tengo una hoja de estilo general donde puedo incluir varios documentos, poniendo por ej.: @import url(noticias.css); asi puedo evitar que al final me quedo con una hoja de estilo muy largo donde no se encuentra nada. pues, yo si… pero si alguien más tiene que trabajar en este proyecto…. estaría totalmente perdido… no sé si me he explicado bien. lo que me realmente interesa es saber si ¿tenéis una idea como se puede facilitar la organización de css de proyectos muy amplios para que la estructura del css quede clara? ¿podríais decirme algunos trucos que estáis utilizando? muchas gracias. daniela ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo -- saludos Andrés Karp blog_ http://www.akelarreweb.com work_http://www.novotecno.com book_http://www.akelarreweb.com/andreskarp cool_http://www.lechooga.org group_http://groups.google.es/group/lechooga?hl=es ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Organizar CSS
Hola, Daniela
Tengo un proyecto muy amplio que ya está hecho en tablas… pero poco a poco
hace falta pensar en el presente, es decir que vamos a rediseñar todo y por
supuesto maquetar en capas.
Bien hecho ;-)
el problema es por ejemplo que hago la maquetación de una
ventanita pEj. “mandar un correo”… llamo el contenedor #correo y lo demás
está incluido allí…. si ahora resulta que la página de “aviso legal” tendrá
un diseño parecido tendría que cambiar el nombre del #correo… eso me ha
pasado varias veces…
Tienes que documentarte bien. Para dar estilos comunes a varios
elementos, una posibilidad es utilizar clases, es decir:
div id=correo class=xxx...
...
/div
div id=aviso_legal class=xxx ...
...
/div
, donde xxx es el nombre de la clase (el mismo para las dos capas). De
esta manera, en el css podrías poner algo parecido a:
.xxx {
[estilos para los elementos con clase xxx]
}
por otro lado he empezado partir la hoja de estilo en varios documentos.
tengo una hoja de estilo general donde puedo incluir varios documentos,
poniendo por ej.:
Yo hago lo mismo, hago una hoja con los estilos comunes a todos los
documentos, y luego hojas de estilo aparte, aplicables sólo a cierto/s
documento/s. De esta manera evitas que tdos los documentos lean
todos los estilos para tdo el sitio web ^^
Mi único consejo adicional es que documentes muy mucho, antes de hacer
preguntas tan simples como lo del correo y el aviso legal.
Un saludo
Rodrigo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
[Ovillo] Organizar CSS
buenas tardes a todos, tengo un proyecto muy amplio que ya está hecho en tablas pero poco a poco hace falta pensar en el presente, es decir que vamos a rediseñar todo y por supuesto maquetar en capas. algunas páginas ya están maquetadas y aquí empieza mi problema: como todavía no hemos podido realizar el diseño nuevo para el proyecto entero (como es tan amplio) el tema de la maquetación me causa algunas problemas. por supuesto hemos creado un styleguide para enlaces, titulos, etc. para mantener siempre la misma linea de diseño. también hemos preparado varios modelos como quedarían los contenedores para distintos tipos de páginas. pero el problema es por ejemplo que hago la maquetación de una ventanita pEj. mandar un correo llamo el contenedor #correo y lo demás está incluido allí . si ahora resulta que la página de aviso legal tendrá un diseño parecido tendría que cambiar el nombre del #correo eso me ha pasado varias veces por otro lado he empezado partir la hoja de estilo en varios documentos. tengo una hoja de estilo general donde puedo incluir varios documentos, poniendo por ej.: @import url(noticias.css); asi puedo evitar que al final me quedo con una hoja de estilo muy largo donde no se encuentra nada. pues, yo si pero si alguien más tiene que trabajar en este proyecto . estaría totalmente perdido no sé si me he explicado bien. lo que me realmente interesa es saber si ¿tenéis una idea como se puede facilitar la organización de css de proyectos muy amplios para que la estructura del css quede clara? ¿podríais decirme algunos trucos que estáis utilizando? muchas gracias. daniela ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Organizar CSS
Hola:
Yo hago mi pequeño aporte en que, en cuestiones de rendimiento, siempre
tengas en cuenta que mientras menos archivos utilices..., mejor. Esto es
por la cantidad de peticiones que debe hacer el explorador.
Saludos!
Rodrigo Álvarez Virgós escribió:
Hola, Daniela
Tengo un proyecto muy amplio que ya está hecho en tablas… pero poco a poco
hace falta pensar en el presente, es decir que vamos a rediseñar todo y por
supuesto maquetar en capas.
Bien hecho ;-)
el problema es por ejemplo que hago la maquetación de una
ventanita pEj. “mandar un correo”… llamo el contenedor #correo y lo demás
está incluido allí…. si ahora resulta que la página de “aviso legal” tendrá
un diseño parecido tendría que cambiar el nombre del #correo… eso me ha
pasado varias veces…
Tienes que documentarte bien. Para dar estilos comunes a varios
elementos, una posibilidad es utilizar clases, es decir:
div id=correo class=xxx...
...
/div
div id=aviso_legal class=xxx ...
...
/div
, donde xxx es el nombre de la clase (el mismo para las dos capas). De
esta manera, en el css podrías poner algo parecido a:
.xxx {
[estilos para los elementos con clase xxx]
}
por otro lado he empezado partir la hoja de estilo en varios documentos.
tengo una hoja de estilo general donde puedo incluir varios documentos,
poniendo por ej.:
Yo hago lo mismo, hago una hoja con los estilos comunes a todos los
documentos, y luego hojas de estilo aparte, aplicables sólo a cierto/s
documento/s. De esta manera evitas que tdos los documentos lean
todos los estilos para tdo el sitio web ^^
Mi único consejo adicional es que documentes muy mucho, antes de hacer
preguntas tan simples como lo del correo y el aviso legal.
Un saludo
Rodrigo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Organizar CSS
Eso pensaba yo, una petición segureo que ralentiza más que el continuar
descargando un archivo más pesado.
Por lo menos vía FTP cuando subimos archivos lo podemos comprobar, yo creo
que tarda bastante menos en subir/bajar un archivo pongamos de 30Kb que 6
archivos de 5Kb, no?
Quizás alguien de SISTEMAS pueda comentarnos en qué momento de peso puede
ser óptimo partir la hoja de estilos en 2 o 3 archivos distintos.
El día 11/10/07, Sergio Flores [EMAIL PROTECTED] escribió:
Hola:
Yo hago mi pequeño aporte en que, en cuestiones de rendimiento, siempre
tengas en cuenta que mientras menos archivos utilices..., mejor. Esto es
por la cantidad de peticiones que debe hacer el explorador.
Saludos!
Rodrigo Álvarez Virgós escribió:
Hola, Daniela
Tengo un proyecto muy amplio que ya está hecho en tablas… pero poco a
poco
hace falta pensar en el presente, es decir que vamos a rediseñar todo y
por
supuesto maquetar en capas.
Bien hecho ;-)
el problema es por ejemplo que hago la maquetación de una
ventanita pEj. mandar un correo… llamo el contenedor #correo y lo
demás
está incluido allí…. si ahora resulta que la página de aviso legal
tendrá
un diseño parecido tendría que cambiar el nombre del #correo… eso me ha
pasado varias veces…
Tienes que documentarte bien. Para dar estilos comunes a varios
elementos, una posibilidad es utilizar clases, es decir:
div id=correo class=xxx...
...
/div
div id=aviso_legal class=xxx ...
...
/div
, donde xxx es el nombre de la clase (el mismo para las dos capas). De
esta manera, en el css podrías poner algo parecido a:
.xxx {
[estilos para los elementos con clase xxx]
}
por otro lado he empezado partir la hoja de estilo en varios
documentos.
tengo una hoja de estilo general donde puedo incluir varios documentos,
poniendo por ej.:
Yo hago lo mismo, hago una hoja con los estilos comunes a todos los
documentos, y luego hojas de estilo aparte, aplicables sólo a cierto/s
documento/s. De esta manera evitas que tdos los documentos lean
todos los estilos para tdo el sitio web ^^
Mi único consejo adicional es que documentes muy mucho, antes de hacer
preguntas tan simples como lo del correo y el aviso legal.
Un saludo
Rodrigo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Organizar CSS
Recomiendo el plugin YSlow de Firefox para optimizar (y conocer)
aspectos de rendimiento.
Saludos!
Fernando escribió:
Eso pensaba yo, una petición segureo que ralentiza más que el continuar
descargando un archivo más pesado.
Por lo menos vía FTP cuando subimos archivos lo podemos comprobar, yo creo
que tarda bastante menos en subir/bajar un archivo pongamos de 30Kb que 6
archivos de 5Kb, no?
Quizás alguien de SISTEMAS pueda comentarnos en qué momento de peso puede
ser óptimo partir la hoja de estilos en 2 o 3 archivos distintos.
El día 11/10/07, Sergio Flores [EMAIL PROTECTED] escribió:
Hola:
Yo hago mi pequeño aporte en que, en cuestiones de rendimiento, siempre
tengas en cuenta que mientras menos archivos utilices..., mejor. Esto es
por la cantidad de peticiones que debe hacer el explorador.
Saludos!
Rodrigo Álvarez Virgós escribió:
Hola, Daniela
Tengo un proyecto muy amplio que ya está hecho en tablas… pero poco a
poco
hace falta pensar en el presente, es decir que vamos a rediseñar todo y
por
supuesto maquetar en capas.
Bien hecho ;-)
el problema es por ejemplo que hago la maquetación de una
ventanita pEj. mandar un correo… llamo el contenedor #correo y lo
demás
está incluido allí…. si ahora resulta que la página de aviso legal
tendrá
un diseño parecido tendría que cambiar el nombre del #correo… eso me ha
pasado varias veces…
Tienes que documentarte bien. Para dar estilos comunes a varios
elementos, una posibilidad es utilizar clases, es decir:
div id=correo class=xxx...
...
/div
div id=aviso_legal class=xxx ...
...
/div
, donde xxx es el nombre de la clase (el mismo para las dos capas). De
esta manera, en el css podrías poner algo parecido a:
.xxx {
[estilos para los elementos con clase xxx]
}
por otro lado he empezado partir la hoja de estilo en varios
documentos.
tengo una hoja de estilo general donde puedo incluir varios documentos,
poniendo por ej.:
Yo hago lo mismo, hago una hoja con los estilos comunes a todos los
documentos, y luego hojas de estilo aparte, aplicables sólo a cierto/s
documento/s. De esta manera evitas que tdos los documentos lean
todos los estilos para tdo el sitio web ^^
Mi único consejo adicional es que documentes muy mucho, antes de hacer
preguntas tan simples como lo del correo y el aviso legal.
Un saludo
Rodrigo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
