Nem só de <div> vive um desenvolvedor FrontEnd
Pois é meus caros!
Não é ‘tão novidade assim’, mas as vezes parece!
| Okay, abandonamos(nem todos), o recorte de layouts em <table>, (sabemos | deveriamos saber) que tableless é um termo perigoso se for mal interpretado…. menos tabelas, não quer dizer, nunca usar. A tag de tabela do HTML possui utilidade. Existem lugares e momentos corretos para usá-las. |
Cada <td> é uma célula, <tr>são as linhas, os <th> são as células de título, o <tbody> é o corpo dos dados tabulares, contém os dados propriamente ditos, o <thead> deve delimitar o cabeçalho… o
Enfiim, ainda as usamos. Nos perguntamos se devemos ou não usar a tag <table> e as filhas desta.
Porém, e as <div>s ?
Você nunca se perguntou se deveria ou não usar uma div ? Naquele contexto ?
Nunca parou para pensar, ‘se fazia sentido’ ?
Repita estes questionamentos com a tag .
É fácil usar essas tags sem semântica. Entretanto não tinha mesmo nenhuma semântica aquele lugar onde enfiamos elas ?
Alguns códigos que vejo, me dão vontade de clamar por um movimento DivLess.
<div id="menu">
<ul>
<li>..```
Tirando raros casos, e efeitos ‘complicados’, precisava da div ? Não poderia ter feito simplesmente e apenas:
``` html
<ul id="menu">
<li>..```
hein?!
Ou então
``` html
<div id="logo"><img src="....```
> _Quase tão feio quanto fazer um website inteiro com table, é desperdiçar marcação HTML vazia de semântica._
A tag <img /> aceita e muito bem o atributo ID.
Para alguns pode parecer absurdo, porém já vi:
``` css
span.bold { font-weight: bold; }
Para os que não entenderam o que eu quis dizer, ou não acham isso um soco no próprio estômago, lhes digo: é absurdo ! Esse tipo de declaração deve soar absurda.
O
é outra tag muito mal usada.
Representa uma quebra, deve ser usada para tal, e não para ‘dar espaçamento’.
Espaço é estilização, logo, margin, padding.. são as formas corretas de configurar um espaçamento.
As tags são HTML, ou seja, estão na camada de conteúdo, e não de apresentação. Devem ser usadas para informar o que aquele conteúdo representa, e não para espaçar, ou colorir , por exemplo. Por este motivo que a tag foi banida depreciada.
Não devemos misturar as camadas.
Olhe para o teu conteúdo, e deixe que ele te responda o que ele é. O próprio conteúdo, deve lhe dizer qual tag é a mais apropriada.
É uma frase de alguém, um depoimento, respostas de uma entrevista, uma citação de um cliente ? que tal a tag ?
Melhor do que um com uma class, certo ?
Lá no rodapé, ou no formulário de contato, precisa colocar o endereço e telefone. Hum… tag <address>, que tal ?
Um disclaimer, pos scriptum, merece menos atenção do visitante. Jogue um !
E as tags , e ? melhor do que se matar com regras no css, para fazer um <span chegar naquele efeito.
Só nisso, economizamos declarações de classes, percebeu ?
Dava para fazer tudo que falei só com <div> e , na verdade, dá para fazer um site inteiro, com tudo apenas usando um desses dois, porém não é praticável, certo ?
A primeira consequência são diversas linhas a mais no css, e diversas declarações de atributos, classes, ids..
Olhe por outro lado agora.
No primeiro momento, deixamos nosso conteúdo nos contar o que ele era, para sabermos qual tag usar.
Agora olhemos o código pronto, sem ler o conteúdo das strings, apenas vendo as tags. Aqui, nossas tags devem ser capazes de nos contar que tipo de informação elas carregam, e o que elas estão fazendo ali na página.
Perceba a ‘loucura’ disso.
Pense, reflita. =)