Re: [Ovillo] Supermacarrada CSS: Homer en CSS

2008-04-12 Por tema Marc Palau
Lo prometido es deuda, ahí te va la 0.5beta

http://www.nbsp.es/ajax/csspaintr/

como funciona:

selecciona las opciones necesarias de color, tamaño y peso.

pulsa sobre una letra para añadirla a la pizarra, desplazala por la
pizarra y listos.

El listado inferior de momento no hace nada.

El botón exportar os abre un popup con el código de la página.

Usa posiciones absolutas.

el fondo es común para todas, el color es independiente para cada letra.

Falta:
  - z-index
  - borrar
  - arrastrar desde el panel izquierdo
  - evitar selección
  - poco más :P


Feedback? gracias!

Saludos
Marc

 Marc, no te parece complicado porque eres el puto amo... ;)

 Yo me medio atreveria a hacerlo en Flash (y eso que de no tocarlo he
 perdido
 lo mio), pero en XHTML tirando del DOM. ¡Bufff! Ah, y por
 supuesto, en Flash luego no renderizaria el xhtml y el css, asi que nada.
 :(

 Eres una maquina. :)

 Saludos,
 Ernesto Frías | www.ex7.org
 ___
 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] Imagen para Cabecera elástica

2008-04-12 Por tema Jorge
bueno,

probé el método de Martín de los 3 div pero me es imposible que el central, 
que es donde va la imagen, quede centrado respecto al div principal, y que 
por tanto los div laterales tengan el mismo ancho.

alguna idea?

Gracias,

Jorge
  - Mensaje original - 
  De: martin boggino
  Para: Jorge
  Enviado: viernes, 11 de abril de 2008 19:30
  Asunto: Re: [Ovillo] Imagen para Cabecera elástica


  la goudy olt style, tb es muy interesante o la optima, si tenes mac, en 
pc, su homonima es otawa, son tipografias muy buenas con referencias a 
diseños formales, si tendria que dividirlos en 3 div, uno central donde va 
tu imagen y otras dos laterales con bg repeat x,
  saludos
  martin


  El día 11/04/08, Jorge [EMAIL PROTECTED] escribió:
Hola Martin,

gracias por tu desinteresada ayuda.

Te cuento, la imagen me la pasaron los clientes de la página, pero sin 
ver nada del diseño que había hecho. Realmente a mí no me gusta esa imagen 
pero bueno, ellos mandan. Ahora bien, en caso de que sigan queriendo que 
lleve esa imagen, tengo que acomodarla al diseño elástico que contiene la 
cabecera para que quede siempre bien situada. No entendí tu propuesta de 
recortar 2 px por el alto de ambos lados de la imagen. Imagino que habrá que 
situarla bien a la derecha o a la izquierda del div que la contiene y poner 
como imagen de fondo de ése div el listoncillo que seriá el de la izquierda 
si opto por alinear la imagen a la drecha o el de la drecha si la alineo a 
la izquierda para que se vea ese fondo a medida que el div crece (es 
elástico), pero no sé pq propones que recorte la imagen de ambos lados ..

Por otro lado, el logo de la institución ya tiene su área de protección, 
es la imagen que está situada arriba a la izquierda...

En cuanto a las fuentes, voy a probar con una Times a ver que tal,

Muchas gracias de nuevo,

Saludos desde Canarias, España

- Mensaje original - 
  De: martin boggino
  Para: Ovillo, la lista de CSS en castellano
  Enviado: viernes, 11 de abril de 2008 18:33
  Asunto: Re: [Ovillo] Imagen para Cabecera elástica


  bueno jorge, yo soy diseñador grafico, en cuanto a la tipografia del 
sitio,
  la imagen que pusiste esta bien, el tamaño de la fuente es muy grande 
(en tu
  imagen), podes usar otros tipo de recursos para llamar la atencion, tu
  diseño en si, es muy fino, muy buen logrado para el publico que una
  biblioteca accederia, como la tipografia seria una imagen, yo pondria 
alguna
  (con serifa), Times, jugaria con  las mayusculas, todo mayusculas, 
pero las
  iniciales de las palabras con una fuente un poco superior

  te muestro un ejemplo con la arial,
  BIBLIOTECA SIMON BENITEZ PADILLA,

  esto por un lado, por el otro lado, siempre pero siempre tenes que 
dejer un
  area de proteccion del logo o nombre o denominacion institucional, 
como
  quieras nombrarlo, puedes recortar un listoncillo de tu imagen, 2 
pixeles x
  el alto de tu imagen, de ambos lados, guardalo como gif o jpg,

  saludos desde Asuncion, Paraguay

  El día 4/04/08, Jorge [EMAIL PROTECTED] escribió:
  
   Hola listeros,
  
   trabajo en el diseño y programación de una web de bibliotecas y 
tengo que
   buscar una imagen apropiada para la cabecera. Como no ando bien en 
diseño
   gráfico os pido ayuda para ver si me podéis orientar o aconsejar y 
si tenéis
   alguna idea de qué diseño quedaría bien para la misma. Os comento 
que lleva
   un diseño elástico, tanto en altura como en anchura y que ha de 
permitir
   identificar cuando uno entra en la web de qué biblioteca se trata a 
través
   de su nombre en el diseño de la imagen.
  
   La web, que aún está en desarrollo y queda mucho por hacer, es la
   siguiente:
  
   
http://portal.grancanaria.com/portal/home.bsb?codcontenido=20580
  
   Muchas gracias a [EMAIL PROTECTED],
  
   Jorge
  
  
  
  
 - Mensaje original -
 De: ElfA 4EvEr
 Para: Ovillo, la lista de CSS en castellano
 Enviado: lunes, 31 de marzo de 2008 20:16
 Asunto: [Ovillo] RE: Cabecera elástica con imágen de fondo
  
  
  
 Hola Jorge, otra opción es cargar un css distinto según la 
resolución de
   pantalla del visitante:
  
 script type=text/javascript
 if (window.screen) {var resolucion = screen.width + ' x ' +
   screen.height;
 var css;
 if (screen.width = 800) css = 'template_css_800';else css =
   'template_css_1024';
 document.write ('link rel=stylesheet href=' + css + '.css
   type=text/css');}/script
 En cuanto a las resoluciones de los visitantes aquí te dejo unas 
url's
   dónde verás estadísticas sobre el tema:
  
  
   
http://www.tamingthebeast.net/blog/web-development/monitor-resolution-statistics-0208.htm
  

Re: [Ovillo] Supermacarrada CSS: Homer en CSS

2008-04-12 Por tema laura
hola

2008/4/12 Marc Palau :
 Lo prometido es deuda, ahí te va la 0.5beta

  http://www.nbsp.es/ajax/csspaintr/


estoy alucinando, no se muy bien que funcion tiene esta aplicacion,
pero parece q apunta bien :) . Creo que necesitaria saber si el
objetivo es crear rotulacion en css pero de una en una letra, porque
si pinchas mas de 2 letras, se sobrescriben en la pizarra, efecto que
tambien ocurre al copiar el codigo en un html. Ademas de que lo que se
escribe aparece justo fuera de la caja de color, queda como a medio
camino entre el body y el div que creas con esta aplicacion :)

Lo que si necesita es un boton reset para borrar la pizarra sin tener
q regargar la pagina, o un boton para borrar la ultima accion.

Los cambios que haces a los colores de la letra, no afectan a lo ya
escrito... por un lado guay, pq puedes cambiar el color a lo que vas a
escribir, pero no te permite corregir colores de lo ya escrito.

Ah, bueno, y ya seria lo mas si en lugar de generar codigo html con el
css integrado, generara el css a aparte ;)

A ver si se puede mejorar, porque tiene buena pinta :))

Animo!

Laura




___
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] Imagen para Cabecera elástica

2008-04-12 Por tema laura
2008/4/12 Jorge [EMAIL PROTECTED]:
 bueno,

  probé el método de Martín de los 3 div pero me es imposible que el central,
  que es donde va la imagen, quede centrado respecto al div principal, y que
  por tanto los div laterales tengan el mismo ancho.

  alguna idea?

  Gracias,

Creo (no recuerdo como empezó este hilo) que lo que quieres es seguir
con el logo de la web, pero ahora quieres q sea util para todas las
resoluciones. El otro día me encontré con este mismo caso, y he
pensado una solucion, que seria simple y llanamente centrarla en el
div en que esté incluida, si lo que quieres poner no queda bien
centrado pues podrias decirle a traves de css que esta imagen
concreta se le aplique un tamaño (width i height) que esté en funcion
de la letra (em) o de un %, aunque esto falla cuando la imagen empieza
a pixelarse, pero si no te pasas estirando la web, me parece q puede
funcionar,no?

Una pregunta, he vuelto a ver la web en la que estas trabajando, y no
se adapta a mi resolucion de pantalla (1024) ni tampoco a la de 800,
:((

Ciao
___
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] Imagen para Cabecera elástica

2008-04-12 Por tema Jorge
hOLA Laura,

la web lleva un diseño elástico, no líquido, por lo que sus medidas (em) 
dependen del tamaño de la fuente , no de la resolución (%) que tengas.

Gracias,

Ciao


- Mensaje original - 
De: laura [EMAIL PROTECTED]
Para: Ovillo, la lista de CSS en castellano ovillo@lists.ovillo.org
Enviado: sábado, 12 de abril de 2008 13:25
Asunto: Re: [Ovillo] Imagen para Cabecera elástica


2008/4/12 Jorge [EMAIL PROTECTED]:
 bueno,

  probé el método de Martín de los 3 div pero me es imposible que el 
 central,
  que es donde va la imagen, quede centrado respecto al div principal, y 
 que
  por tanto los div laterales tengan el mismo ancho.

  alguna idea?

  Gracias,

Creo (no recuerdo como empezó este hilo) que lo que quieres es seguir
con el logo de la web, pero ahora quieres q sea util para todas las
resoluciones. El otro día me encontré con este mismo caso, y he
pensado una solucion, que seria simple y llanamente centrarla en el
div en que esté incluida, si lo que quieres poner no queda bien
centrado pues podrias decirle a traves de css que esta imagen
concreta se le aplique un tamaño (width i height) que esté en funcion
de la letra (em) o de un %, aunque esto falla cuando la imagen empieza
a pixelarse, pero si no te pasas estirando la web, me parece q puede
funcionar,no?

Una pregunta, he vuelto a ver la web en la que estas trabajando, y no
se adapta a mi resolucion de pantalla (1024) ni tampoco a la de 800,
:((

Ciao
___
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] Imagen para Cabecera elástica

2008-04-12 Por tema laura
2008/4/12 Jorge
  la web lleva un diseño elástico, no líquido, por lo que sus medidas (em)
 dependen del tamaño de la fuente , no de la resolución (%) que tengas.

Pues si me permites la opinion, me parece un error no tener en cuenta
la resolucion, porque  tener mas del 50% de la web oculta tras el
scroll horizontal, no se yo :
___
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] Supermacarrada CSS: Homer en CSS

2008-04-12 Por tema Marc Palau
Hola Laura,

es para hacerlo letra a letra, pero si pulsas dos veces sobre la misma te
la lanza a la pizarra dos veces.

Luego para añadirlo en alguna página, se tiene que editar el primer DIV
para darle unas medidas y un posicionamiento (ahora está al 100% y
absoluto, es por eso que ocupa todal a página).

Exportar con CSS externo ... tendré que pensar como lo hago, pero se
puede, seguro :P.

lo otro tomo nota y lo añado a la lista de cosas por hacer :)

muchas gracias por tus comentarios.
saludos!
Marc

 hola

 2008/4/12 Marc Palau :
 Lo prometido es deuda, ahí te va la 0.5beta

  http://www.nbsp.es/ajax/csspaintr/


 estoy alucinando, no se muy bien que funcion tiene esta aplicacion,
 pero parece q apunta bien :) . Creo que necesitaria saber si el
 objetivo es crear rotulacion en css pero de una en una letra, porque
 si pinchas mas de 2 letras, se sobrescriben en la pizarra, efecto que
 tambien ocurre al copiar el codigo en un html. Ademas de que lo que se
 escribe aparece justo fuera de la caja de color, queda como a medio
 camino entre el body y el div que creas con esta aplicacion :)

 Lo que si necesita es un boton reset para borrar la pizarra sin tener
 q regargar la pagina, o un boton para borrar la ultima accion.

 Los cambios que haces a los colores de la letra, no afectan a lo ya
 escrito... por un lado guay, pq puedes cambiar el color a lo que vas a
 escribir, pero no te permite corregir colores de lo ya escrito.

 Ah, bueno, y ya seria lo mas si en lugar de generar codigo html con el
 css integrado, generara el css a aparte ;)

 A ver si se puede mejorar, porque tiene buena pinta :))

 Animo!

 Laura




 ___
 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] Imagen para Cabecera elástica

2008-04-12 Por tema laura
2008/4/12 Jorge [EMAIL PROTECTED]:
 Tienes toda la razón, no había caído en eso y como dices tu con la de 800,
 la mitad queda oculta tras el scroll horizontal. Como hago?

  Gracias

Pues convertir el ancho de todas las cajas q tengas al % q mas
convenga en cada caso, o tb hay soluciones de tipo js, se puede ver
que resolucion tiene el visitante y aplicar uno o otro css en funcion
de ella.
Hay mas opciones, seguro que los compis de la lista te saben guiar :)

Suerte!

Laura
___
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] Imagen para Cabecera elástica

2008-04-12 Por tema Jorge
Gracias otra vez,

js si no keda otro remedio sí, pero si no pues mejor evitarlo. El trabajo es 
para una Administracion Pública obligada a cumplir con el nivel de 
accesibilidad AA como minimo y si lo uso habria que ofrecer una alternativa 
para los que no tengan js habililtado. Creo que mejor usar porcentajes.. 
pero con esto tb hay problemas por que con altas resoluciones las lineas de 
texto alargadas pueden ser dificiles de leer y las etiquetas max-width, 
max-height, .. no funcionan en todos los navegadores. Hay hacks que ofrezcan 
alternativas a esas etiquetas en los navegadores que no las soportan?

Saludos,
Jorge


- Mensaje original - 
De: laura [EMAIL PROTECTED]
Para: Jorge [EMAIL PROTECTED]
CC: ovillo@lists.ovillo.org
Enviado: sábado, 12 de abril de 2008 14:58
Asunto: Re: [Ovillo] Imagen para Cabecera elástica


2008/4/12 Jorge [EMAIL PROTECTED]:
 Tienes toda la razón, no había caído en eso y como dices tu con la de 800,
 la mitad queda oculta tras el scroll horizontal. Como hago?

  Gracias

Pues convertir el ancho de todas las cajas q tengas al % q mas
convenga en cada caso, o tb hay soluciones de tipo js, se puede ver
que resolucion tiene el visitante y aplicar uno o otro css en funcion
de ella.
Hay mas opciones, seguro que los compis de la lista te saben guiar :)

Suerte!

Laura

___
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] Supermacarrada CSS: Homer en CSS

2008-04-12 Por tema Ernesto Frías
Añado yo un comentario...

¡Eres el amo Marc! :)

Ahora en serio, si bien hay que mejorarlo, me ha parecido una pasada, sobre
todo para haberlo hecho en un plazo de tiempo tan minimo. Prometo ojearlo,
porque tengo curiosidad... ;)

Soy consciente de que faltan cosas, pero como primera aproximación, ¡xapo!
:)

Un abrazote man,
Ernesto Frías | www.ex7.org
___
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 el momento para crear una lista de diseño y desarrollo web?

2008-04-12 Por tema Fernando Gutierrez
Pienso que la opción de reactivar la lista de WEB-ES es la mejor opción.
La calidad de la lista, para los que la hemos conocido, está fuera de toda
duda. No sé si Guille (Bisho) seguirá administrándola, pero en su momento
era de lo mejor, con un prestigio y funcionamiento comparables a Ovillo.

El día 11/04/08, laura [EMAIL PROTECTED] escribió:

 2008/4/11 Tei [EMAIL PROTECTED]:

  On Thu, Apr 10, 2008 at 9:11 PM, laura [EMAIL PROTECTED] wrote:
hola
   
 2008/4/10 Tei  @gmail.com:
 

   Acabo de comprobarlo y si que se puede acceder. Sigue las
   instrucciones de pantalla. Vamos.. que pide una contraseña, si no la
   habias puesto antes, se la das, hay que confirmarla por correo. Todo
   por interfaz web. Nada del otro mundo, y solo para consultar archivos
   viejos, no para postear ni nada.


 a no ser que haga falta pasar un dia o dos, he hecho todo eso, pero no
 me deja pasar...
 http://listserv.rediris.es/cgi-bin/wa?A1=ind0803L=web-es
   Perdone, con la dirección de correo-e que usted ha introducido no
 está autorizado a acceder a los archivos de la lista WEB-ES. Recuerde
 que dicha dirección de correo debe estar suscrita en WEB-ES.

 Su navegador automáticamente autentica sus solicitudes de acceso
 usando una cookie para la dirección de correo electrónico
 [EMAIL PROTECTED]
 ...

 
 
   [1]http://manuales.dgsca.unam.mx/majordomo/majordomo.html


 Voy a tener q leermelo mañana bien...

 Ciao


 Laura

 ___
 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




-- 
_
Fernando Gutiérrez
___
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