Ver la versión completa : Sufro de <div>itis xD
Pues nada, que me ha dado por mirar un poco los repositorios de lo que he realizado en los ultimos 3 meses en el curro y me he dado cuenta de que:
* Casi todo mi codigo html se compone de <div> e <img>
* Uso bastantes clases e ids (esto ultimo necesario por js)
Alguien sufre de lo mismo?
En serio, no uso tablas, como mucho alguna etiqueta <video> <media> u <object> cuando son extrictamente necesarias, casi nunca uso <li>, ni para menus verticales ni horizontales, ni <table> para tablas de datos, todo mediante div y class.
Es normal, es una buena practica?
El tema esta en que como las cosas funcionan, los cambios los hago mas o menos rapido, todo esta comentado y estructurado, y relamente nadie mira el codigo, no hay problemas, pero creo que me estoy pasado.
Algun tutorial de buenas practicas en el uso de html + css??
Es que me da cosa poner valores en el css sobre las etiquetas html, entre otra de las manias posiblemente estupidas que tengo xD
Saludos y thx!
Si algo funciona, no lo toques xD
Si algo funciona, no lo toques xD
Con un par xDD
No se, son cosas que me preocupan, cuando aprendes un poco por tu cuenta y no tienes a nadie encima, tienes muchas posiblidades de aprender mal, que es lo que me temo que me esta pasando, y prefiero corregir mientras siga haciendo esto, no cuando sea demasiado tarde xD
Yo en cambio sufro con los <div>'s y tiro de <table>'s a saco. Según se ven en un navegador se ven en todos y con CSS y div's no hago más que volverme loco...
Saludos, Nakio.
josepzin
08/10/2011, 16:17
Yo creo que está bien, lo unico que tienes que tener en cuenta es que hay otros tags que estan pensandos para cosas especificas y que tu usas un DIV en lugar de eso.
Y si te pasas a HTML5 mas tendrás que ver que usar segun la situacion, ya que el HTML5 es supersemantico.
Por ejemplo yo en lugar de usar DIV empecé a usar HEADER, FOOTER, NAV, ADDRESS, según lo que va a envolver. Esta bueno :)
jduranmaster
08/10/2011, 16:18
yo al igual que nakio si tengo que hacer al go de WEB para estructurar la información prefiero usar tables porque se ven igual en todos lados. los divs los he utilizado alguna vez, pero poco.
Yo creo que está bien, lo unico que tienes que tener en cuenta es que hay otros tags que estan pensandos para cosas especificas y que tu usas un DIV en lugar de eso.
Y si te pasas a HTML5 mas tendrás que ver que usar segun la situacion, ya que el HTML5 es supersemantico.
Por ejemplo yo en lugar de usar DIV empecé a usar HEADER, FOOTER, NAV, ADDRESS, según lo que va a envolver. Esta bueno :)
Lo bueno es eso que dices, lo que he visto de html5 lo veo clarisimo, pero en xhtml 4, que es lo que toco, y con lo que he prendido, para mi todo son divs en los que despues tengo mis ids de header, footer, nav(menu), etc.
A ver si encuentro en el otro hilo que abri algun enlace a que usar segun que estructuras xD
PD.Los div con class en las cosas comunes e id en las especificas, se maquillan muy bien desde firebug ;)
josepzin
08/10/2011, 16:35
En HTML5 se supone que debe ser algo asi: <header id="header", <footer id="footer", etc. Reemplazas el DIV según lo que vaya a contener.
Para HTML4 yo uso tambien casi todo DIVs y algo de listas. Obviamente eso para las estructuras, luego para los formatos de textos no! :D
jduranmaster
08/10/2011, 17:46
joer otto, pues de haber sabido que estabas liado con la maravillosa ( FULL SARCASM) programación en HTML, te hubiese avisado de que el fin de semana pasado fue la HTML5.0 Party en el ETSIT-UPM. Se dieron conferecias y clases prácticas sobre HTML5.0.
enkonsierto
08/10/2011, 19:38
yo en html 4 uso divs a saco y en html5 las nuevas etiquetas de header, footer, section, etc además de divs cuando no se puedan aplicar las nuevas etiquetas. Las tablas se usan única y exclusivamente para tablas de datos. Para los menús uso siempre listas.
Pues nada, que me ha dado por mirar un poco los repositorios de lo que he realizado en los ultimos 3 meses en el curro y me he dado cuenta de que:
* Casi todo mi codigo html se compone de <div> e <img>
* Uso bastantes clases e ids (esto ultimo necesario por js)
Alguien sufre de lo mismo?
En serio, no uso tablas, como mucho alguna etiqueta <video> <media> u <object> cuando son extrictamente necesarias, casi nunca uso <li>, ni para menus verticales ni horizontales, ni <table> para tablas de datos, todo mediante div y class.
Es normal, es una buena practica?
Imagino que tambien usarás etiquetas para el maquetado de texto, no?
Los DIV's se usan para crear la estructura de la página y las tablas para estructurar INFORMACION (por ejemplo, los elementos de un formulario).
Aún así, lo normal es usar listas (<ol><li>) para la creación de menús. Si miras códigos de menús ya hechos (con o sin efectos JS), verás que la mayoria se crean usando las etiqurtasde listas y cambiando su comportamiento en CSS.
El usar tablas para hacer la estructura de la pagina es hacer las cosas mal. Es algo tedioso y muy dificil de mantener.
Y ya no vale lo de que los DIV's se 'mueven' en algunos navegadores porque, quitando IE7 y IE6 (que hay soluciones para ello), en el resto de navegadores se ven perfectamente, y el que diga lo contrario es que no tiene claro el modelo de cajas de CSS.
Para todos los que usais tablas para maquetar... ¿alguno 'reseteais' el CSS antes de empezar a maquetar? (reset css)
Un fallo común es abusar de las clases y los ID's a la hora de maquetar en CSS. No esta mal, pero no es una buena practica. Existen otros selectores básicos que ayudan a maquetar sin abusar de los anteriores comentados. Pej, el selector descendente da mucho juego y te ahorras el ir creando clases. Tambien hay selectores 'avanzados' (selector de hijos o el selector adyacente,pej) que son muy útiles tambien, pero desde mi punto de vista, con los selectores básicos se puede hacer todo.
Aqui tienes una explicacion de los selectores básicos: http://www.librosweb.es/css/capitulo2/selectores_basicos.html
El tema esta en que como las cosas funcionan, los cambios los hago mas o menos rapido, todo esta comentado y estructurado, y relamente nadie mira el codigo, no hay problemas, pero creo que me estoy pasado.
Algun tutorial de buenas practicas en el uso de html + css??
Es que me da cosa poner valores en el css sobre las etiquetas html, entre otra de las manias posiblemente estupidas que tengo xD
Saludos y thx!
Lo suyo es tener estructuras ya creadas y reutilizarlas. El crear una web, le guste a la gente o no, en el fondo es programación. Como en toda programación, la reutilización de código facilita las cosas. Y mucho más aqui donde las webs suelen seguir una serie de patrones segun las modas y tendencias (menús en el lateral, menú en horizontal, colores pasteles...)
Cuando se crea una pagina web (al igual que un programa) hay que pensar en el mantenimiento posterior (añadir, cambiar, mejorar cosas...) y hacerla intentando que luego ese mantenimiento sea sencillo.
Los que decís que 'si funciona no lo toques' o 'hago esto asi porque funciona (aunque este mal)' es porque no habeis tenido que corregir/cambiar/añadir/mejorar una web ya hecha por otra persona ( o por vosotros mismos 10 meses despues).
Aqui te pongo un enlace para el tema de 'las buenas practicas': http://www.librosweb.es/css_avanzado/capitulo2.html
Un saludo
:brindis:
josepzin
08/10/2011, 20:32
El reset.css ya lo tengo incorporado por defecto :)
Los selectores por hijos y demas son muy practicos, y viendo las nuevas posibilidaes del HTML5+CSS3 es impresionante lo que se puede hacer.
akualung
10/10/2011, 11:41
Algun tutorial de buenas practicas en el uso de html + css??
Hablo desde mi poco más que humilde nivel de conocimientos, pero tal vez lo mejor en ese caso sea ir al W3C y mirar si tienen algun documento con consejos de cómo realizar las pàginas siguiendo sus estándares , etc.
El reset.css ya lo tengo incorporado por defecto :)
Los selectores por hijos y demas son muy practicos, y viendo las nuevas posibilidaes del HTML5+CSS3 es impresionante lo que se puede hacer.
Pero el rendimiento cae en picado por el uso de ids y class?
Id's tengo que usar, por narices, ademas, ya que meto contenido mediante ajax en distintos elementos html, de forma que tiro de esos ids (y class genericos) para definir las propiedades.
Tengo que mirar el tema de los selector de hijos, aunque en la mayoria de los casos creo que no me servirian, ya que uso los mismo elementos en distintos bloques, pero tiene estilos completamente distintos (por ejemplo, un twitt en una lista y el mismo en grande)
Voy a seguir mirando esa web de todas formas, tiene pintaza!
realmente creo que las únicas veces que he usado tablas es solo para imprimir resultados de sql en alguna web o parecido... pero si, yo también sufro de div... xD pero amos a día de hoy html se resume en eso, mientras cumpla su cometido
Hablo desde mi poco más que humilde nivel de conocimientos, pero tal vez lo mejor en ese caso sea ir al W3C y mirar si tienen algun documento con consejos de cómo realizar las pàginas siguiendo sus estándares , etc.
http://www.librosweb.es y w3c es lo mejor para aprender, ahí encontraras todas las soluciones que necesitas para html css js, la verdad esas web's son enciclopedias, mejor que los ejemplos de ambas web's no las vas a encontrar
Pero el rendimiento cae en picado por el uso de ids y class?
Id's tengo que usar, por narices, ademas, ya que meto contenido mediante ajax en distintos elementos html, de forma que tiro de esos ids (y class genericos) para definir las propiedades.
Tengo que mirar el tema de los selector de hijos, aunque en la mayoria de los casos creo que no me servirian, ya que uso los mismo elementos en distintos bloques, pero tiene estilos completamente distintos (por ejemplo, un twitt en una lista y el mismo en grande)
Voy a seguir mirando esa web de todas formas, tiene pintaza!
Mirate todos los selectores (al menos los básicos). El selector descendente te ahorra crear clases muchas veces.
Mirate todos los selectores (al menos los básicos). El selector descendente te ahorra crear clases muchas veces.
Si, si los conocia, pero es que al complejidad no es tanta, de forma que me es mas comodo tener:
<div class="claseCajaA">
.
.
.
</div>
Que empezar a usar los selectores.
Todo esto es porque realmente son cosas muy planas, y a no ser que sea mas estricto el uso de selectores que de clases, o que se mejore mucho el rendimiento (me vendria guay), no le veo sentido empezar a poner los descendientes del div con etiqueta p, luego descendientes de div con etiqueta b, etc...
Realmente por lo que he estado mirando en mi código, quedaría mas o menos igual (añadiendo la complejidad de los selectores, que no es mucha, y disminuyendo alguna linea, pero porque soy ********** y tengo cosas duplicadas xD)
La pregunta es... se gana mucho rendimiento cambiando los class por selectores?Los id no los uso para los estilos, o casi no los uso, pero podria usar selectores a partir de dichos ids.
< - >
Por ejemplo, un caso en el que creo que los selectores no me valen:
Tengo un div, y dentro 4 tipos de texto distintos:
Uno es un <b>, y otros 3 son <p>
Pues el b y el primer p son rojos, el 2º p es gris y el 3º p es blanco.
Lo unico que se me ocurre es mal usar los h para los 3 primeros elementos (b y 2 p) ya que son casi titulos, y asignar los valores de p al ultimo.
O usar clases.
Alguien que me inspire?
IronArthur
10/10/2011, 13:54
De hecho las tablas en general se usan mal, son para presentar datos tabulados (tipo un excel) y no como elemento de maquetación.
Hay que usar divs a saco, always.
Salu2
De hecho las tablas en general se usan mal, son para presentar datos tabulados (tipo un excel) y no como elemento de maquetación.
Hay que usar divs a saco, always.
Salu2
Yo voy a empezar a usar tablas para datos tabulados, porque estaba usando divs y me he dado cuenta que es un poco absurdo xD
josepzin
10/10/2011, 14:16
Por ejemplo, un caso en el que creo que los selectores no me valen:
Tengo un div, y dentro 4 tipos de texto distintos:
Uno es un <b>, y otros 3 son <p>
Pues el b y el primer p son rojos, el 2º p es gris y el 3º p es blanco.
Lo unico que se me ocurre es mal usar los h para los 3 primeros elementos (b y 2 p) ya que son casi titulos, y asignar los valores de p al ultimo.
O usar clases.
Alguien que me inspire?
Primero: el < b > fue reemplazado por el < strong >
Segundo: si tienes distintos tipos de textos, creo que se podrían considerar como títulos y subtítulos, para eso existen los H1, H2, H3, etc.
Luego tambien tienes la opción de usar < em > (enfatizado) para resaltar algo de forma especial.
Si se trata del primer parrafo puedes hacer div.loquesea p:first-child asi el primer parrafo tendra atributos distintos (con CSS3 ya puedes identificar el segundo, o cualquier elemento, es genial)
Y por ultimo te queda poner <p class="red" > asi a ese parrafo le asignas un color/estilo en especial
Y seguro que hay mas maneras!
Por cierto, es css 2.0, se me olvido ponerlo.
Los h yo los interpreto mas para titulos reales, no para parrafos de texto, pero weno, es una interpretacion :S
Luego sigo con ello, pero thx!!
josepzin
10/10/2011, 21:58
Si, los H son títulos, pero si esos textos que comentas pueden pasar por subtítulos, quizás podrías usarlo.
Sino lo mejor es <p class="tipo1" >, <p class="tipo2" >, etc...
Si, los H son títulos, pero si esos textos que comentas pueden pasar por subtítulos, quizás podrías usarlo.
Sino lo mejor es <p class="tipo1" >, <p class="tipo2" >, etc...
Al final como lo he usado siempre XDD
De toda formas con los selectores he estado jugando y gracias a la agrupacion, puedo quitarme el uso de muchos divs contenedores, ya que los usaba para alinear cosas, y con el selector apuntando a todos los elementos, puedo moverlo todo de forma sencilla ^^
Ahora voy a ver como se manejan los sprites xD
Yo creo que está bien, lo unico que tienes que tener en cuenta es que hay otros tags que estan pensandos para cosas especificas y que tu usas un DIV en lugar de eso.
Y si te pasas a HTML5 mas tendrás que ver que usar segun la situacion, ya que el HTML5 es supersemantico.
Por ejemplo yo en lugar de usar DIV empecé a usar HEADER, FOOTER, NAV, ADDRESS, según lo que va a envolver. Esta bueno :)
Yo según lo que tenga que volver uso papel de aluminio, celofán o bolsas específicas para bocadillos.
Yo también soy un fan del DIV, pero como varios años que no hago nada me estoy pegando con mi web personal desde hace algún tiempo (con decir tiene que en su momento usaba TABLE para todo y que las hojas de estilos CSS eran cosas sólo aptas para frikis pijoteros).
La verdad es que para los menús usó bastante el li, y si me preguntas creo que en el menú horizontal de mi página personal también lo utilizo, pero no estoy seguro porque es heredado, aunque poco a poco lo voy haciendo mejor.
sufrir de divitis esta mejor visto que subrir de tablitis, por eso de ser mas antiguas las tablas pecas de antiguo.
suele pasar que la gente que viene de antiguo usa mas las tablas, y las gente que viene de lo nuevo usa mas los divs.
cuando en realidad deberiamos usar las tablas para mostrar "tablas" de datos, y divs para lo demas.
Aiken
sufrir de divitis esta mejor visto que subrir de tablitis, por eso de ser mas antiguas las tablas pecas de antiguo.
suele pasar que la gente que viene de antiguo usa mas las tablas, y las gente que viene de lo nuevo usa mas los divs.
cuando en realidad deberiamos usar las tablas para mostrar "tablas" de datos, y divs para lo demas.
Aiken
Obviamente los divs están hechos para crear agrupaciones de elementos, cualquier tipo de elementos, y las tablas para organizar datos. Hacer la estructura de la página con tablas es un poco salvaje, además, creo que para muchas páginas como las que existen actualmente no se pueden crear usando tablas. O si, pero te vuelves mico.
< - >
En HTML5 se supone que debe ser algo asi: <header id="header", <footer id="footer", etc. Reemplazas el DIV según lo que vaya a contener.
Para HTML4 yo uso tambien casi todo DIVs y algo de listas. Obviamente eso para las estructuras, luego para los formatos de textos no! :D
¿HTML5 valida correctamente si usas un div sin su id apropiado?
< - >
Por cierto, es css 2.0, se me olvido ponerlo.
Los h yo los interpreto mas para titulos reales, no para parrafos de texto, pero weno, es una interpretacion :S
Luego sigo con ello, pero thx!!
Lo suyo es usar h1 para el título del sitio, h2 para las secciones principales, h3 para los títulos de los artículos, h4 para el siguiente elemento de la jerarquía... y los textos normales debería ir siempre en p.
enkonsierto
11/10/2011, 20:44
Lo suyo es usar h1 para el título del sitio, h2 para las secciones principales, h3 para los títulos de los artículos, h4 para el siguiente elemento de la jerarquía... y los textos normales debería ir siempre en p.
eso era así antes, ahora en html5 puedes empezar desde h1 desde cualquier hgroup.
IronArthur
13/10/2011, 09:12
Habeis probado a miraros temas de Accesibilidad?, la mayor parte de vuestras dudas las tendríais resueltas. Pq para que se accesible una página tiene que tener todo eso puesto para lo q se pensó, es decir div para maquetar, tables para contenido tabulado, los H* para texto etc....
Yo tuve que pasar un montón de pagínas web la accesibilidad AA, y creo q veo código fuente html y veo si es accesible sin mirar el resultado en el navegador :lol:
Salu2
Powered by vBulletin® Version 4.2.5 Copyright © 2025 vBulletin Solutions Inc. All rights reserved.