Foros del web, para los que viven de bits

rodri · 23-oct-2006, 14:39

Hola a todos,

estoy planeando adquirir del libro del sitio Zen garden:

Código:

The Zen of CSS Design: Visual Enlightenment for the Web

alguien ya lo ha usado?, algún comentario al respecto? me gustaría conocer algunas opiniones con respecto a este libro y si es que existen otras alternativas de diseño css.

gracias a todos.

fearlex · 23-oct-2006, 15:35

Hasta donde tengo entendido, es un libro que se basa mas en la creatividad y el diseño que en conceptos o aprendizaje de css, puedes ir a amazon.com y chekear los reviews de personas que lo han comprado. YO queria comprarlo pero desisti, esperare mas comentarios a ver si me animo :D

opeth · 23-oct-2006, 17:48

exacto es más sobre conceptos de diseño por ejemplo toman alguna página que puedes encontrar en su sitio (Zen Garden) y comentan sobre esta (estilo, color, tipografia etc.) es bastante bueno el libro para darte una idea de lo que puedes hacer con CSS más no te dicen como hacerlo.

Saludos

fer10 · 23-oct-2006, 21:14

eso me da la idea, alguien conoce algun libro que te diga como es la mejor manera de estructurar un documento de forma semanticamente, a lo que me refiero es para que sea modificable, asi como los tiene (Zen Garden)

eso como de poner
<h1><span>css Zen Garden</span></h1>
en vez de
<h1>css Zen Garden</h1>

y asi tener mas control del documento...

fearlex · 24-oct-2006, 06:45

Cita:

Iniciado por fer10

eso me da la idea, alguien conoce algun libro que te diga como es la mejor manera de estructurar un documento de forma semanticamente, a lo que me refiero es para que sea modificable, asi como los tiene (Zen Garden)

eso como de poner
<h1><span>css Zen Garden</span></h1>
en vez de
<h1>css Zen Garden</h1>

y asi tener mas control del documento...

No entiendo bien a lo que te refieres, lo preguntas o lo dices ??

fer10 · 24-oct-2006, 08:54

es pregunta, por si alguien conoce algun libro que hable de eso.

pd: lamento no expresarme correctamente =(

fearlex · 24-oct-2006, 08:56

Cita:

Iniciado por fer10

es pregunta, por si alguien conoce algun libro que hable de eso.

pd: lamento no expresarme correctamente =(

No pero me interesaria saber

A ver quien se anima y hace uno , yo conozco el perfecto candidato : "Webosiris". :D

MaXaC · 24-oct-2006, 09:14

Cita:

Iniciado por fer10

eso como de poner
<h1><span>css Zen Garden</span></h1>
en vez de
<h1>css Zen Garden</h1>

Cual es la diferencia entre esas 2 formas de maquetacion

.

fearlex · 24-oct-2006, 09:23

Cita:

Iniciado por MaXaC

Cual es la diferencia entre esas 2 formas de maquetacion

.

Normalmente <h1>css Zen Garden</h1> puede contener el texto, por que <h1><span>css Zen Garden</span></h1> usarias un span que no estaria cumpliendo ninguna funcion, y que si lo borras no afecta en nada, pero lo que entiendo de lo que fer quiere decir, es si existe algun libro que deje saber si es mejor, usar <h1>css Zen Garden</h1> , lo considero semanticamente correcto o <h1><span>css Zen Garden</span></h1>, lo cual considero semanticamente incorrecto, pero a la vez nos ahorra codigo, ya que si a todos los tags que lo soporten le ponemos un span dentro, entonces, solo habria que utilizar un selector con sus respectivas, propiedas, ejemplo:

Cita:

Es solo una idea :D

rodri · 24-oct-2006, 09:48

mmm interesante, aunque siempre es bueno tener la noción de cómo plantear el aspecto de la página. En realidad de ahí nace la necesidad de realizar una buena maquetización.

Bueno, logré conseguirlo en formato digital y recién lo estoy viendo, tal vez sea bueno también buscar un libro en el que , como todos dicen, de los conceptos de cómo construir un css

saludos

fearlex · 24-oct-2006, 09:50

Cita:

Iniciado por rodri

los conceptos de cómo construir un css

Y HTML/XHTML tambien

rodri · 24-oct-2006, 10:02

si tienes razón, las dos van de la mano,

ahhhh, hablando de eso, salió el nuevo paquete de microsoft para el diseño, Microsoft Expression para el desarrollo de sitios basados en estándares XHTML y CSS, pero creo que merece otro hilo.

saludos.

fearlex · 24-oct-2006, 10:22

Cita:

Iniciado por rodri

salió el nuevo paquete de microsoft para el diseño, Microsoft Expression para el desarrollo de sitios basados en estándares XHTML y CSS

Jjajajaja no crei nunca lee/escuchar a Microsoft hablando de estandares

rodri · 24-oct-2006, 10:59

si yo digo lo mismo, corrigiendo, expression tiene tres componentes:
* Graphic Designer
* Interactive Designer
* Expression Designer

pero este sitio vale la pena verlo,
http://www.microsoft.com/products/ex...ression_vision

opeth · 24-oct-2006, 11:01

Web Accessibility: Web Standards and Regulatory Compliance. Ese es un libro que quiero leer digo no habla propiamente de la semántica pero la accesibilidad simpre va acompañada de esta. Pero es un poco complicado conseguirlo en México.

Por cierto no se me hace tan incorrectoc usar

Cita:

<h1>
<span>Zen Garden</span>
</h1>

Porque pienso que no le resta significado con el uso de tag <span> pero bueno talvez me equivoque.

Saludos

fearlex · 24-oct-2006, 11:06

Cita:

Iniciado por opeth

Porque pienso que no le resta significado con el uso de tag <span> pero bueno talvez me equivoque.

Saludos

Cita:

<h1>
<span>Zen Garden</span>
</h1>

Si pones un heading h1 es por que lo necesitas, ademas si le aplicas el estilo al h1, el span esta de mas. Si necesitas un texto, por que se te ocurrio usar un span y meterlo dentro de un <h1>. Digo no tiene logica, pienso yo, mucho menos esto:

Cita:

<h1>
<span> Heading 1 </span>
<span> Heading 2 </span>
<span> Heading 3 </span>
</h1>

Vaya no me luce semanticamente correcto

opeth · 24-oct-2006, 11:13

si pero talvez necesitas que dentro del h1 alguna palabra o parte del texto dentro de este sea diferente y usando <span> sigues manteniendo el significado e importancia de h1.

Saludos

fearlex · 24-oct-2006, 12:28

Cita:

Iniciado por opeth

si pero talvez necesitas que dentro del h1 alguna palabra o parte del texto dentro de este sea diferente y usando <span> sigues manteniendo el significado e importancia de h1.

Saludos

No lo creo, para ello puedes usar <em> o <strong>, o me equivoco ??

metacortex · 24-oct-2006, 12:47

Hace tiempo estuve husmeando en unas páginas con ese atributo. Eso pasa cuando al h1 le tienen asignada una imagen de fondo, pero al mismo tiempo no se desea perder la ventaja de colocar texto en esa etiqueta y hacer la web accesible:

h1 {
background: url("titulo.png");
overflow: hidden;
width: 200px;
height: 50px;
margin: 0;
}

h1 span {
display: none;
}

fearlex · 24-oct-2006, 12:53

Cita:

Iniciado por metacortex

Hace tiempo estuve husmeando en unas páginas con ese atributo. Eso pasa cuando al h1 le tienen asignada una imagen de fondo, pero al mismo tiempo no se desea perder la ventaja de colocar texto en esa etiqueta y hacer la web accesible:

h1 {
background: url("titulo.png");
overflow: hidden;
width: 200px;
height: 50px;
margin: 0;
}

h1 span {
display: none;
}

Hola Metacortex, bueno si me parece mas semantico que usar:

h1 {
background: url("titulo.png");
overflow: hidden;
width: 200px;
height: 50px;
margin: 0;
}

h1 em {
display: none;
}

opeth · 24-oct-2006, 12:57

Cita:

Iniciado por fearlex

No lo creo, para ello puedes usar <em> o <strong>, o me equivoco ??

si podría ser pero con <em> o <strong> implica dar cierto grado de importancia o significado el cual no pretende dar <span>.

La técnica que dice Metacortex el único problema que tiene es en los dispositivos moviles si no me eqiivoco.

Saludos

fer10 · 24-oct-2006, 13:11

yo creo que en cuestion de marquetacion "flexible" si le prodiramos llamar asi.

tienes mas control de lo que se peude hacer, por ejemplo agregar 2 backgrounds para es esta el h1 y el span a nivel bloque.

obteniendo 2 posibles posibilidades para logar y si deseas una nomas, ignoras span.

es a lo que quiero llegar, no se si sea correcto usarlo o como es la manera correcta para marquetar (uso de etiquetas) y asi tener diseños mas felexibles.

pero veo que en css Zen Garden lo usan y mira los diseños tan diferentes que hacen..

Al Zuwaga · 24-oct-2006, 14:15

Cita:

pero veo que en css Zen Garden lo usan y mira los diseños tan diferentes que hacen..

Bueno, pero CSSZenGarden tiene cosas no muy correctas como esta parte (reconocidas por ellos en su FAQ):

Código:

		<div id="footer">
			<a href="http://validator.w3.org/check/referer" title="Check the validity of this site’s XHTML">xhtml</a> &nbsp; 
			<a href="http://jigsaw.w3.org/css-validator/check/referer" title="Check the validity of this site’s CSS">css</a> &nbsp; 
			<a href="http://creativecommons.org/licenses/by-nc-sa/1.0/" title="View details of the license of this site, courtesy of Creative Commons.">cc</a> &nbsp;

			<a href="http://www.contentquality.com/mynewtester/cynthia.exe?Url1=http:%2F%2Fcsszengarden.com%2F" title="Check the accessibility of this site according to U.S. Section 508">508</a> &nbsp;
			<a href="http://mezzoblue.com/zengarden/faq/#aaa" title="Check the accessibility of this site according to Web Content Accessibility Guidelines 1.0">aaa</a>
		</div>

... separa los enlaces con un $nbsp; en vez de haberlos colocado en una lista.

También tiene "cosas" como esta:

Código:

<!-- These

23-oct-2006, 14:39	#1 (permalink)
rodri Fecha de Ingreso: febrero-2005 Mensajes: 401	Libro de Zen Garden Hola a todos, estoy planeando adquirir del libro del sitio Zen garden: Código: The Zen of CSS Design: Visual Enlightenment for the Web alguien ya lo ha usado?, algún comentario al respecto? me gustaría conocer algunas opiniones con respecto a este libro y si es que existen otras alternativas de diseño css. gracias a todos. __________________ 0.o Rodri

23-oct-2006, 15:35	#2 (permalink)
fearlex Fecha de Ingreso: septiembre-2003 Ubicación: Exiliado de mi patria Mensajes: 1.048	Hasta donde tengo entendido, es un libro que se basa mas en la creatividad y el diseño que en conceptos o aprendizaje de css, puedes ir a amazon.com y chekear los reviews de personas que lo han comprado. YO queria comprarlo pero desisti, esperare mas comentarios a ver si me animo :D __________________ Ya viene llegando, el comunismo en Cuba, ya se esta acabando. www.fearlex.com \| www.fearlexworld.com

23-oct-2006, 17:48	#3 (permalink)
opeth Fecha de Ingreso: junio-2004 Ubicación: Distrito Federal, México Mensajes: 339	exacto es más sobre conceptos de diseño por ejemplo toman alguna página que puedes encontrar en su sitio (Zen Garden) y comentan sobre esta (estilo, color, tipografia etc.) es bastante bueno el libro para darte una idea de lo que puedes hacer con CSS más no te dicen como hacerlo. Saludos __________________ Mi blog

23-oct-2006, 21:14	#4 (permalink)
fer10 Fecha de Ingreso: octubre-2005 Ubicación: Guadalajara - Mexico Mensajes: 902	eso me da la idea, alguien conoce algun libro que te diga como es la mejor manera de estructurar un documento de forma semanticamente, a lo que me refiero es para que sea modificable, asi como los tiene (Zen Garden) eso como de poner <h1><span>css Zen Garden</span></h1> en vez de <h1>css Zen Garden</h1> y asi tener mas control del documento... __________________ Saludos FT. www.fernando.com.mx

24-oct-2006, 06:45	#5 (permalink)
fearlex Fecha de Ingreso: septiembre-2003 Ubicación: Exiliado de mi patria Mensajes: 1.048	Cita: Iniciado por fer10 eso me da la idea, alguien conoce algun libro que te diga como es la mejor manera de estructurar un documento de forma semanticamente, a lo que me refiero es para que sea modificable, asi como los tiene (Zen Garden) eso como de poner <h1><span>css Zen Garden</span></h1> en vez de <h1>css Zen Garden</h1> y asi tener mas control del documento... No entiendo bien a lo que te refieres, lo preguntas o lo dices ?? __________________ Ya viene llegando, el comunismo en Cuba, ya se esta acabando. www.fearlex.com \| www.fearlexworld.com

24-oct-2006, 08:54	#6 (permalink)
fer10 Fecha de Ingreso: octubre-2005 Ubicación: Guadalajara - Mexico Mensajes: 902	es pregunta, por si alguien conoce algun libro que hable de eso. pd: lamento no expresarme correctamente =( __________________ Saludos FT. www.fernando.com.mx

24-oct-2006, 08:56	#7 (permalink)
fearlex Fecha de Ingreso: septiembre-2003 Ubicación: Exiliado de mi patria Mensajes: 1.048	Cita: Iniciado por fer10 es pregunta, por si alguien conoce algun libro que hable de eso. pd: lamento no expresarme correctamente =( No pero me interesaria saber A ver quien se anima y hace uno , yo conozco el perfecto candidato : "Webosiris". :D __________________ Ya viene llegando, el comunismo en Cuba, ya se esta acabando. www.fearlex.com \| www.fearlexworld.com

24-oct-2006, 09:14	#8 (permalink)
MaXaC Fecha de Ingreso: abril-2005 Ubicación: Lima-Peru Mensajes: 314	Cita: Iniciado por fer10 eso como de poner <h1><span>css Zen Garden</span></h1> en vez de <h1>css Zen Garden</h1> Cual es la diferencia entre esas 2 formas de maquetacion .

24-oct-2006, 09:23	#9 (permalink)
fearlex Fecha de Ingreso: septiembre-2003 Ubicación: Exiliado de mi patria Mensajes: 1.048	Cita: Iniciado por MaXaC Cual es la diferencia entre esas 2 formas de maquetacion . Normalmente <h1>css Zen Garden</h1> puede contener el texto, por que <h1><span>css Zen Garden</span></h1> usarias un span que no estaria cumpliendo ninguna funcion, y que si lo borras no afecta en nada, pero lo que entiendo de lo que fer quiere decir, es si existe algun libro que deje saber si es mejor, usar <h1>css Zen Garden</h1> , lo considero semanticamente correcto o <h1><span>css Zen Garden</span></h1>, lo cual considero semanticamente incorrecto, pero a la vez nos ahorra codigo, ya que si a todos los tags que lo soporten le ponemos un span dentro, entonces, solo habria que utilizar un selector con sus respectivas, propiedas, ejemplo: Cita: <style type="text/css" span { color: #963; font: Arial, "Times New Roman", serif 100; } </style> <h1><span>css Zen Garden</span></h1> <p><span>css Zen Garden</span></p> Es solo una idea :D __________________ Ya viene llegando, el comunismo en Cuba, ya se esta acabando. www.fearlex.com \| www.fearlexworld.com

24-oct-2006, 09:48	#10 (permalink)
rodri Fecha de Ingreso: febrero-2005 Mensajes: 401	mmm interesante, aunque siempre es bueno tener la noción de cómo plantear el aspecto de la página. En realidad de ahí nace la necesidad de realizar una buena maquetización. Bueno, logré conseguirlo en formato digital y recién lo estoy viendo, tal vez sea bueno también buscar un libro en el que , como todos dicen, de los conceptos de cómo construir un css saludos __________________ 0.o Rodri

24-oct-2006, 09:50	#11 (permalink)
fearlex Fecha de Ingreso: septiembre-2003 Ubicación: Exiliado de mi patria Mensajes: 1.048	Cita: Iniciado por rodri los conceptos de cómo construir un css Y HTML/XHTML tambien __________________ Ya viene llegando, el comunismo en Cuba, ya se esta acabando. www.fearlex.com \| www.fearlexworld.com

24-oct-2006, 10:02	#12 (permalink)
rodri Fecha de Ingreso: febrero-2005 Mensajes: 401	si tienes razón, las dos van de la mano, ahhhh, hablando de eso, salió el nuevo paquete de microsoft para el diseño, Microsoft Expression para el desarrollo de sitios basados en estándares XHTML y CSS, pero creo que merece otro hilo. saludos. __________________ 0.o Rodri

24-oct-2006, 10:22	#13 (permalink)
fearlex Fecha de Ingreso: septiembre-2003 Ubicación: Exiliado de mi patria Mensajes: 1.048	Cita: Iniciado por rodri salió el nuevo paquete de microsoft para el diseño, Microsoft Expression para el desarrollo de sitios basados en estándares XHTML y CSS Jjajajaja no crei nunca lee/escuchar a Microsoft hablando de estandares __________________ Ya viene llegando, el comunismo en Cuba, ya se esta acabando. www.fearlex.com \| www.fearlexworld.com

24-oct-2006, 10:59	#14 (permalink)
rodri Fecha de Ingreso: febrero-2005 Mensajes: 401	si yo digo lo mismo, corrigiendo, expression tiene tres componentes: * Graphic Designer * Interactive Designer * Expression Designer pero este sitio vale la pena verlo, http://www.microsoft.com/products/ex...ression_vision __________________ 0.o Rodri

24-oct-2006, 11:01	#15 (permalink)
opeth Fecha de Ingreso: junio-2004 Ubicación: Distrito Federal, México Mensajes: 339	Web Accessibility: Web Standards and Regulatory Compliance. Ese es un libro que quiero leer digo no habla propiamente de la semántica pero la accesibilidad simpre va acompañada de esta. Pero es un poco complicado conseguirlo en México. Por cierto no se me hace tan incorrectoc usar Cita: <h1> <span>Zen Garden</span> </h1> Porque pienso que no le resta significado con el uso de tag <span> pero bueno talvez me equivoque. Saludos __________________ Mi blog

24-oct-2006, 11:06	#16 (permalink)
fearlex Fecha de Ingreso: septiembre-2003 Ubicación: Exiliado de mi patria Mensajes: 1.048	Cita: Iniciado por opeth Porque pienso que no le resta significado con el uso de tag <span> pero bueno talvez me equivoque. Saludos Cita: <h1> <span>Zen Garden</span> </h1> Si pones un heading h1 es por que lo necesitas, ademas si le aplicas el estilo al h1, el span esta de mas. Si necesitas un texto, por que se te ocurrio usar un span y meterlo dentro de un <h1>. Digo no tiene logica, pienso yo, mucho menos esto: Cita: <h1> <span> Heading 1 </span> <span> Heading 2 </span> <span> Heading 3 </span> </h1> Vaya no me luce semanticamente correcto __________________ Ya viene llegando, el comunismo en Cuba, ya se esta acabando. www.fearlex.com \| www.fearlexworld.com

24-oct-2006, 11:13	#17 (permalink)
opeth Fecha de Ingreso: junio-2004 Ubicación: Distrito Federal, México Mensajes: 339	si pero talvez necesitas que dentro del h1 alguna palabra o parte del texto dentro de este sea diferente y usando <span> sigues manteniendo el significado e importancia de h1. Saludos __________________ Mi blog

24-oct-2006, 12:28	#18 (permalink)
fearlex Fecha de Ingreso: septiembre-2003 Ubicación: Exiliado de mi patria Mensajes: 1.048	Cita: Iniciado por opeth si pero talvez necesitas que dentro del h1 alguna palabra o parte del texto dentro de este sea diferente y usando <span> sigues manteniendo el significado e importancia de h1. Saludos No lo creo, para ello puedes usar <em> o <strong>, o me equivoco ?? __________________ Ya viene llegando, el comunismo en Cuba, ya se esta acabando. www.fearlex.com \| www.fearlexworld.com

24-oct-2006, 12:47	#19 (permalink)
metacortex Moderador Fecha de Ingreso: junio-2004 Ubicación: Venezuela Mensajes: 6.251	Hace tiempo estuve husmeando en unas páginas con ese atributo. Eso pasa cuando al h1 le tienen asignada una imagen de fondo, pero al mismo tiempo no se desea perder la ventaja de colocar texto en esa etiqueta y hacer la web accesible: h1 { background: url("titulo.png"); overflow: hidden; width: 200px; height: 50px; margin: 0; } h1 span { display: none; }

24-oct-2006, 12:53	#20 (permalink)
fearlex Fecha de Ingreso: septiembre-2003 Ubicación: Exiliado de mi patria Mensajes: 1.048	Cita: Iniciado por metacortex Hace tiempo estuve husmeando en unas páginas con ese atributo. Eso pasa cuando al h1 le tienen asignada una imagen de fondo, pero al mismo tiempo no se desea perder la ventaja de colocar texto en esa etiqueta y hacer la web accesible: h1 { background: url("titulo.png"); overflow: hidden; width: 200px; height: 50px; margin: 0; } h1 span { display: none; } Hola Metacortex, bueno si me parece mas semantico que usar: h1 { background: url("titulo.png"); overflow: hidden; width: 200px; height: 50px; margin: 0; } h1 em { display: none; } __________________ Ya viene llegando, el comunismo en Cuba, ya se esta acabando. www.fearlex.com \| www.fearlexworld.com

24-oct-2006, 12:57	#21 (permalink)
opeth Fecha de Ingreso: junio-2004 Ubicación: Distrito Federal, México Mensajes: 339	Cita: Iniciado por fearlex No lo creo, para ello puedes usar <em> o <strong>, o me equivoco ?? si podría ser pero con <em> o <strong> implica dar cierto grado de importancia o significado el cual no pretende dar <span>. La técnica que dice Metacortex el único problema que tiene es en los dispositivos moviles si no me eqiivoco. Saludos __________________ Mi blog

24-oct-2006, 13:11	#22 (permalink)
fer10 Fecha de Ingreso: octubre-2005 Ubicación: Guadalajara - Mexico Mensajes: 902	yo creo que en cuestion de marquetacion "flexible" si le prodiramos llamar asi. tienes mas control de lo que se peude hacer, por ejemplo agregar 2 backgrounds para es esta el h1 y el span a nivel bloque. obteniendo 2 posibles posibilidades para logar y si deseas una nomas, ignoras span. es a lo que quiero llegar, no se si sea correcto usarlo o como es la manera correcta para marquetar (uso de etiquetas) y asi tener diseños mas felexibles. pero veo que en css Zen Garden lo usan y mira los diseños tan diferentes que hacen.. __________________ Saludos FT. www.fernando.com.mx