css - tag - que es un elemento div
DIV vs. Tablas o CSS vs. Ser estúpido (13)
CSS puede no ser una religión, pero es la forma en que los navegadores interpretan HTML para el diseño. Nos guste o no, todos los navegadores modernos usan (algunas versiones) del modelo de caja W3C. Para continuar confiando en las tablas, siga confiando en una metodología que es simplemente incorrecta a los ojos de las personas que diseñan la tecnología de representación web.
Sé que CSS puede parecer terriblemente complicado a veces, pero creo que es una necesidad en este día y edad (créanme, sus clientes lo querrán).
Si no se siente cómodo tomando el tiempo para aprender realmente CSS (por lo que le toma segundos o minutos colocar los elementos ... no una hora), entonces debe pasar el trabajo de diseño a alguien que sabe realmente que conoce el frente. fin.
Sí, hay muchos problemas con las implementaciones de navegador actuales de CSS, pero nada tan drástico como para sentir la necesidad de volver al diseño basado en tablas. Simplemente siéntese y tómese el tiempo para aprender, como lo haría con cualquier otro idioma o marco.
El mejor recurso de referencia en línea que he encontrado es este: http://reference.sitepoint.com/css
Pero no debería doler mirar un libro como Designing With Web Standards, que ayuda mucho a comprender por qué esto es importante.
Sé que las tablas son para datos tabulares, pero es muy tentador usarlas para el diseño. Puedo manejar DIV para obtener un diseño de tres columnas, pero cuando tienes 4 DIV anidados, se vuelve complicado.
¿Hay algún tutorial / referencia para persuadirme de usar DIV''s para el diseño?
Quiero usar DIV, pero me niego a pasar una hora para colocar mi DIV / SPAN donde lo desee.
@GaryF: Blueprint CSS debe ser el secreto mejor guardado de CSS.
Gran herramienta: Blueprint Grid CSS Generator .
Después de un tiempo, ni siquiera lo piensas. Usar divs con CSS parece ser la opción más fácil de imo. Además, tienes más libertad cuando usas frameworks como jQuery. No podía imaginar hacer algunas de las cosas geniales de jQuery sin usar css o divs. Si utilizas las tablas por estilo y diseño, siento que te pierdes muchas tecnologías nuevas y te quedas estancado en los años 90.
En el Reino Unido y en los EE. UU. Existe un requisito legal para favorecer los diseños de CSS sobre las Tablas. Tanto la Sección 508 (EE. UU.) Como la Ley de Discriminación por Discapacidad (Reino Unido) cubren los estándares de accesibilidad para usuarios con visión limitada.
En el Reino Unido, la legislación se extiende hasta el punto de hacer ilegal la producción comercial de un sitio que impide la capacidad de un usuario con vista parcial de la misma manera que ahora es ilegal tener una tienda con un paso para ingresar y de ninguna manera para que ingrese un usuario de silla de ruedas, es cierto que aún no ha habido procesamientos por el acceso al sitio web. Sin embargo, siempre iría con CSS, ya que significa que el diseño de su sitio es mucho más fácil de mantener a largo plazo.
Invertir tiempo en aprender CSS (utilicé las escuelas W3C y .Net Magazine http://www.netmag.co.uk ) dará sus frutos.
En mi opinión, el sesgo debería ser a favor de CSS sobre IE6, es decir, a menos que haya una razón increíblemente buena (por ejemplo, su sitio solo está dirigido a personas que usan IE6, lo cual sería extraño ), es mejor ''alienar'' a las personas que usan IE6 que las personas con poca visión y / o agentes de usuario automatizados. El uso de IE6 está disminuyendo; el último grupo está aumentando en número. Incluso si su sitio no se ve perfecto en IE6, probablemente será más fácil para los usuarios leerlo que un diseño basado en tablas para aquellos que no lo puedan ver.
Esta es una pregunta muy general, por lo que es difícil responder con detalles. Los dos libros que son excelentes recursos son:
- Diseño web a prueba de balas , Dan Cederholm
- CSS Mastery , Andy Budd
Si solo tienes que pasar una hora diseñando el diseño general de tu sitio, no está mal.
Encuentro que hay muchas limitaciones para CSS que solo parecen insinuar que los diseñadores de especificaciones no hacen sitios web para ganarse la vida.
Use tablas HTML si no puede hacerlo fácilmente en CSS.
Una vez dicho esto, algunos de los marcos ayudan y siempre es más agradable hacerlo en CSS si puede administrarlo.
Es posible que pueda encontrar algo de inspiración aquí: http://blog.html.it/layoutgala/
Esto puede ser inútil, pero de alguna manera no entiendo todos estos problemas relacionados con CSS. Si un diseñador de periódicos intenta insertar una película en la página de anuncios, todos estarían de acuerdo en que está un poco loco. Pero aún esa misma gente se entusiasma con los diseños de tres columnas en HTML. HTML no es apto para manejar bien este tipo de diseño en este momento. Además, los diseños de múltiples columnas generalmente no son muy adecuados para leer en monitores de computadora. ¿No hay suficientes alternativas viables?
Y, por cierto, incluso las tablas no ofrecen una buena manera de implementar un diseño de columna fluido, por lo que no es motivo alguno para recurrir a dichos hacks. Asumiendo un navegador medio moderno (es decir,> MSIE 6), las tablas no ofrecen ninguna ventaja sobre HTML + CSS limpio que yo sepa.
Solo usaría la mesa.
En mi experiencia, usar una tabla para el diseño funcionará igual en todos los navegadores y el CSS no lo hará (especialmente si intentas soportar IE6). Simplemente no vale la pena horas y horas de codificación para que un diseño funcione en CSS cuando se puede hacer en 10 minutos con una tabla.
La otra ventaja del uso de tablas es que su diseño puede muy fácilmente dimensionarse dinámicamente para el contenido. Intentar hacer eso con CSS es una gran pesadilla.
También pensaba que Blueprint era genial hasta que vi YAML (Yet Another Multicolumn Layout). Hay una herramienta de construcción en línea que es fantástica. Puedo obtener un diseño de múltiples columnas atractivo en 5 minutos.
Utiliza CSS para el diseño porque no solo es semánticamente correcto, sino porque las tablas tienen múltiples inconvenientes.
Las tablas son horribles para la accesibilidad porque rompen casi todos los lectores de pantalla, lo que a su vez proporciona a los invidentes información inútil debido a la forma en que se leen las tablas.
También rinden mucho más lento que sus homólogos de CSS. Las tablas deben dibujarse dos veces, una para el diseño y otra para el contenido. Esto puede significar que si tiene una imagen remota o dos en un servidor con una conexión lenta, no se renderizará TODO EL DISEÑO.
¿Usarías una matriz para almacenar un diccionario cuando tienes un hashmap? No. Y no deberías usar una mesa cuando hay algo que funciona mejor.
Está el CSS de Yahoo Grid que puede hacer todo tipo de cosas.
Pero recuerda: CSS NO ES UNA RELIGIÓN . Si ahorra horas usando tablas en lugar de css, hágalo.
Uno de los casos más importantes en el que nunca podría pensar es en formularios. Me encantaría hacerlo en CSS, pero es mucho más complicado que las tablas.
Incluso podría argumentar que los formularios son tablas, ya que tienen encabezados (etiquetas) y datos (campos de entrada).
A List Apart es una gran referencia para usar HTML semántico, el artículo Holy Grail es probablemente uno de los mejores ejemplos. Además, consulte CSS Zen Garden para obtener inspiración sobre el tema o lea el excelente libro de Dave Shea "The Zen of CSS Design".