[Ovillo] OFFTOPIC, alguien de sevilla o malaga???
Hola, estoy interesado en entablar conversaciones con algún diseñador web de la provincia de Sevilla o Málaga. ¿Hay alguien por la lista? Gracias ___ 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] Centrar contenedor de elementos absolutos y an cho dinámico
Saludos a todos:
He diseñado el wireframe de un sitio de la siguiente manera:
--
| | |
| A | |
|---| B |
| | |
| C | |
| | |
| | |
--
El contenido del elemento B tiene más importancia que el de C, por
ello y pensando en que las páginas podrían llegar a mostrarse sin los
archivos CSS, he escrito el HTML de la siguiente manera:
body
div id=content
div id=A/div
div id=B/div
div id=C/div
/div
/body
Ahora, la idea es que ese esquema permanezca centrado independiente de
la resolución de la pantalla, pero el asunto se complica debido a que
hay páginas en las que B no aparece, y además, en las que lo hace, no
siempre tiene el mismo ancho. Resolví el asunto de forma parcial
utilizando posicionamiento:
#content {
margin-left: auto;
margin-right: auto;
position: relative;
width: 35em; }
#A {
width: 35em; }
#B {
left: 35em;
margin: 0;
position: absolute;
top: 0; }
#C {
width: 35em;
position: relative;
top: 12em; }
Pero, al estar B posicionado de forma absoluta, se ubica con respecto
a content, ¡fuera de él!. Sí content tiene una propiedad min-width en
lugar de width, contiene a B, pero usa el ancho total del lienzo y
todo se va a la izquierda en lugar de ocupar el centro. Y he ahí la
cuestión.
He pensado en usar float, pero ello condicionaría la ubicación de los
elementos en el HTML, así que la opción que me queda es usar un CSS
extra especificando el ancho de content según el propio de B y si
existe o no y de sus dimensiones, pero si pudiera ahorrarmelo con un
par de instrucciones
en CSS, mejor que mejor :)
¿Alguna idea? Gracias de antemano.
___
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] Centrar contenedor de elementos absolutos y ancho dinámico
Tae Sandoval Murgan escribió: Saludos a todos: He diseñado el wireframe de un sitio de la siguiente manera: -- | || | A|| |---| B | | || | C|| | || | || -- El contenido del elemento B tiene más importancia que el de C, por ello y pensando en que las páginas podrían llegar a mostrarse sin los archivos CSS, he escrito el HTML de la siguiente manera: body div id=content div id=A/div div id=B/div div id=C/div /div /body Ahora, la idea es que ese esquema permanezca centrado independiente de la resolución de la pantalla, pero el asunto se complica debido a que hay páginas en las que B no aparece, y además, en las que lo hace, no siempre tiene el mismo ancho. Resolví el asunto de forma parcial He pensado en usar float, pero ello condicionaría la ubicación de los elementos en el HTML, así que la opción que me queda es usar un CSS extra especificando el ancho de content según el propio de B y si existe o no y de sus dimensiones, pero si pudiera ahorrarmelo con un par de instrucciones en CSS, mejor que mejor :) ¿Alguna idea? Gracias de antemano. Yo no me comería mucho la cabeza y tendría un par de modelos de página, se puede simplificar haciendo que sólamente uno de los modelos incluya los cambios, pero a modo didáctico sería algo así: body class=incluyeB div id=content div id=A/div div id=B/div div id=C/div /div /body body class=noIncluyeB div id=content div id=A/div div id=C/div /div /body -- Saludos -=stripTM=- ___ 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] OFFTOPIC, alguien de sevilla o malaga???
Hola Manuel: Aquí tienes un diseñador de Sevilla capital... trabajo acualmente en el departamento de diseño de Sadiel haciendo de todo un poco... logos, ofertas y propuestas para Junta de Andalucía, de Extremadura, etc..., usabilidad, accesibilidad web, etc... Saludos, El 29 de marzo de 2009 16:25, Manuel Castillo - www.nodos.ws - mcasti...@nodos.ws escribió: Hola, estoy interesado en entablar conversaciones con algún diseñador web de la provincia de Sevilla o Málaga. ¿Hay alguien por la lista? Gracias ___ 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] Es malo importar muchas hojas de estilos CSS
Hola, Mauricio. Gracias por la prueba. Has usado Safari, que usa cuatro conexiones simultáneas. Deduzco que en los navegadores como IE7 que usan sólo dos (lo recomendado por la especificación HTTP1.1), la diferencia de tiempos será mayor. No sé si alguna vez aplicaré esta técnica, pero me parece interesante. Saludos. El 27 de marzo de 2009 5:44, Mauricio Dulce mauricio.du...@gmail.comescribió: Hola Daniel y Choan, aca muestro un ejemplo de tiempos de carga en una aplicación rails 1 ejemplo aplicando subdominios a carga de imagenes, hojas de estilos, javascript, 3 subdominios http://img49.imageshack.us/img49/5553/imagen3.png 2 ejemplo, mismo sitio con configuracion normal http://img520.imageshack.us/img520/3788/imagen3212931.png tanto el cache del browser como el de la aplicación fueron borrados y el vps reiniciado. El 26/03/2009, a las 21:27, Daniel Navarro escribió: Hola, Choan. Celebro que estemos de acuerdo en mantener las css separadas, al menos en la fase de desarrollo. Para acortar el tiempo de carga de las css, como ya habéis comentado, se puede adoptar la estrategia de unirlas en una sóla (una única petición al servidor) o usar el método de los alias que plantea Mauricio y cargarlas en paralelo. En principio, el segundo método debería de ser más rápido (lo siento, no es lo que dije en el anterior mensaje). Pero da igual... el tiempo que se gana por cualquiera de los dos métodos no es significativo. Lo que sí puede ser efectivo es aplicar el método de los dominios que cuenta Mauricio pero A TODOS LOS RECURSOS (en especial a las imágenes si hay muchas). En la dirección que te dejé en el mensaje anterior http://www.ajaxperformance.com/2006/12/18/circumventing-browser-connection-limits-for-fun-and-profit/ tienes un ejemplo en donde disminuye el tiempo de carga en un 40% cuando se realizan 6 accesos en paralelo al servidor en lugar de dos. Las temporizaciones las ha tomado la aplicación de rendimiento online que ofrece http://www.gomez.com/ Sin embargo, en las pruebas del equipo de yahoo que explican en http://yuiblog.com/blog/2007/04/11/performance-research-part-4/#what- if llegan a la conclusión de que subir el número de accesos simultáneos por este método puede ser perjudicial, pudiendo ser un número óptimo entre 2 y 4 conexiones en paralelo. Además, la resolución dns que se produce en la primera carga de una página del sitio también puede ser perjudicial, aunque quedarán cacheadas y apenas intervendrán en la temporización para las sucesivas páginas del sitio. Resumiendo: En mi opinión, mejor tener las css separadas. Ganaremos poco uniendo las css a menos que tengamos una cantidad realmente alta. Por otro lado, el método que plantea Mauricio de subdominios a la misma ip podría funcionar si se aplica sobre todo a las imágenes ya que son los recursos más usados. Sería interesante que Mauricio nos dijera el resultado de sus pruebas. Saludos P.D. Choan, no hace falta que vuelvas a repetir lo que has dicho en este hilo, sobre todo para los puntos en los que coincidimos. El 26 de marzo de 2009 18:12, Choan Gálvez choan.gal...@gmail.comescribió: Hola. On Mar 26, 2009, at 17:39 , Daniel Navarro wrote: Hola, preguntaste: Sí, hombre, si ya sabemos que funcionar funciona. Lo que yo me pregunto es si es más eficiente servir N ficheros de X tamaño desde N dominios que servir un fichero de N*X tamaño desde un dominio. Para distintos valores de N y X y eso. Evidentemente, un sólo fichero con todo aglutinado tardará menos, pero ¿concatenarás todos los recursos además de las css?. El límite de 2 conexiones se aplica también a las imágenes, por ejemplo. Cuando se amplía el número de conexiones paralelas, el tiempo de carga puede ser más que apreciable: http://www.ajaxperformance.com/2006/12/18/circumventing-browser-connection-limits-for-fun-and-profit/ No creo que merezca la pena unir las css en una sola por varios motivos: - Apenas se notará la diferencia de tiempo. - El navegador cachea las css por lo que las demás llamadas serán locales. - La separación de css permite gestionarlas de forma más efectiva. Por lo tanto, es preferible tener los ficheros de hojas de estilo separados frente a la pequeña ventaja de una inapreciable carga más rápida en la primera llamada al sitio. Sin embargo, la opción que plantea Mauricio sí que puede ser interesante. Particularmente, como en el proceso de diseño hay tantos parámetros a tener en cuenta (compatibilidad navegadores, optimización motores de búsqueda, etc.) prefiero reducirlos al mínimo, al menos al principio. Eso no quita para que se unan algunos archivos css en uno solo como, por ejemplo, los de jquery. Supongo que cada vez que escriba a la lista tendré que contar mi vida. Resumo mis mails anteriores en este
Re: [Ovillo] OT: Los invito a que visiten mi sitio D iseño Atsui.
Hola, puedes reducir el tiempo de carga de los marcadores sociales, aunque tengas sólo uno (facebook) si copias la imagen a tu servidor. Ahora tienes: a href=http://www.facebook.com/...; ...img src= http://b.static.ak.fbcdn.net/images/share/facebook_share_icon.gif?8:26981; alt= //a Cámbialo por: a href=http://www.facebook.com/...; ... img src=* ../imagenes/facebook.gif* alt=icono facebook //a Saludos El 29 de marzo de 2009 2:18, Diseño Atsui disenio.at...@gmail.comescribió: ¡Gracias por sus sugerencias Daniel Navarro y Fernando Gutierrez! Les comento que por el tema de los marcadores sociales cambié Bookmarkz por ShareThis, aunque a este último todavia no lo probe, pero por lo que estuve viendo este excelente, o al menos es muy llamativo por que despliega una pequeña ventana cuando uno hace click en el icono mostrando varios servicios como Reddit. Y por el tema de la ubicación del menú ya arregle ese asunto y no tuve que quitar el selector de estilo, pero no esta en el Index sino que tienen que ingresar a alguna de las páginas y recién ahí lo podrán ver. Y con respecto a hacer que el título del sitio LA WEB DE DISEÑO ATSUI sea un enlace al sitio creo que lo hare más adelante, por ahora me deja conforme. Pero no descarto la idea para nada. Y en la página de Acerca de deje el Lorem Ipsum porque no se me ocurría algo para poner, tengo ideas en mi cabeza pero tengo que pulir bien lo que pondré ahí así que prefiero por ahora dejarlo así. Se que queda algo desprolijo pero lo pienso arreglar. Y para finalizar te digo Fernando que ya cambié mi PC, por fin di un salto evolutivo. Ahora tengo un AMD Athlon 64 X2 Dual Core Processor 5000+ con 1 GB de ram y una placa de vídeo de 512 MB XFX. Bueno gente, eso es todo. Muchísimas gracias por sus consejos. Y si tienen más por ahí no duden en comentarmelo. Nos vemos. Saluda atentamente, Tadeo. ___ 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] Centrar contenedor de elementos absolutos y ancho dinámico
Hola, como te ha comentado StripTM, cuando no tengas B, asigna a body otra
clase, de forma que puedas diferenciar el diseño en las css.
Te he dejado un ejemplo en
http://webpelon.es/ovillo/2009-mes03-30-Conmuta_una_o_dos_columnas/index.html
Esencialmente, contiene el código siguiente:
HTML página CON B (DOS columnas)
div id=content
div id=A /div
div id=B /div
div id=C /div
/div !-- Fin #content --
HTML página SIN B (UNA columnas)
div id=content *class=una_columna*
div id=A /div
div id=B /div
div id=C /div
/div !-- Fin #content --
CSS
#content {
margin: 0 auto; /* centra el div contenedor (necesita width) */
width: 35em;
overflow: hidden; /* engloba a floats internos */
}
#A {
float: left;
width: 14em; /* mismo ancho que #C */
}
#B {
float: right;
width: 20em; /* ancho #A + ancho #B menor que ancho contenedor */
}
#C {
width: 14em; /* mismo ancho que #A */
}
/* Cuando #B no existe entonces #A y #C se ajustan al contenedor */
.una_columna #A, .una_columna #C {
width: auto;
}
Saludos
El 29 de marzo de 2009 20:19, Tae Sandoval Murgan taeci...@gmail.comescribió:
Saludos a todos:
He diseñado el wireframe de un sitio de la siguiente manera:
--
| ||
| A||
|---| B |
| ||
| C||
| ||
| ||
--
El contenido del elemento B tiene más importancia que el de C, por
ello y pensando en que las páginas podrían llegar a mostrarse sin los
archivos CSS, he escrito el HTML de la siguiente manera:
body
div id=content
div id=A/div
div id=B/div
div id=C/div
/div
/body
Ahora, la idea es que ese esquema permanezca centrado independiente de
la resolución de la pantalla, pero el asunto se complica debido a que
hay páginas en las que B no aparece, y además, en las que lo hace, no
siempre tiene el mismo ancho. Resolví el asunto de forma parcial
utilizando posicionamiento:
#content {
margin-left: auto;
margin-right: auto;
position: relative;
width: 35em; }
#A {
width: 35em; }
#B {
left: 35em;
margin: 0;
position: absolute;
top: 0; }
#C {
width: 35em;
position: relative;
top: 12em; }
Pero, al estar B posicionado de forma absoluta, se ubica con respecto
a content, ¡fuera de él!. Sí content tiene una propiedad min-width en
lugar de width, contiene a B, pero usa el ancho total del lienzo y
todo se va a la izquierda en lugar de ocupar el centro. Y he ahí la
cuestión.
He pensado en usar float, pero ello condicionaría la ubicación de los
elementos en el HTML, así que la opción que me queda es usar un CSS
extra especificando el ancho de content según el propio de B y si
existe o no y de sus dimensiones, pero si pudiera ahorrarmelo con un
par de instrucciones
en CSS, mejor que mejor :)
¿Alguna idea? Gracias de antemano.
___
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
