Padronização no (X)HTML

Sempre que começava a escrever um (X)HTML, me perguntava se aquele nome que dei a uma determinada div estava correto, ou se aquele nome de classe realmente representa o seu propósito. Pois bem, encontrei dois artigos que me ajudaram a padronizar meus documentos.

Um deles propõe uma estrutura bem interessante e que é realmente considero correta.

Vamos supor que você tenha uma div que está no topo do site e você a chamou de header, e todo seu CSS foi criado usando este id.

Talvez no momento da concepção do projeto o cliente realmente gostaria de um topo legal no site, mas como sabemos, as coisas mudam muito rápido, e num determinado dia seu cliente te liga e diz que não quer mais aquele topo lá em cima, e sim na lateral, o site não tem mais topo. Daí você muda o seu CSS e aquele topo vai para a lateral. Pronto !!! Ótimo !!!

Nada disso. O site não tem mais topo, então porque manter esse id lá? Se você realmente está querendo fazer uma Web bem feita, você não vai gostar de ver uma barra lateral, com o id header. Então por que na hora de você criar seus documentos, você não usa isso:
======================================================
#branding
Used for a header or banner to brand the site.

#branding-logo
Used for a site logo

#branding-tagline
Used for a strapline or tagline to define the site’s purpose

======================================================

Legal né !!! Isso daí eu ví no primeiro artigo. Agora no segundo artigo, achei legal a criação dos arquivos CSS.

Sempre criava um único arquivo com todas minhas declarações lá dentro. Por mais que eu seja organizado, sempre tinha uma coisa desorganizada:-), um id no lugar errado, uma classe fora do lugar. Por que não criar arquivos separados? Criar um arquivo css para os forms e outro para o menu. Isso vai deixar o código mais organizado e mais fácil de manter. Você não acha?:-)

Mas não vamos nos esquecer que isso daí vale para organizar o conteúdo da página, e as seções de notícias e eventos por exemplo, devem ter id’s ou classes que realmente a representam, afinal, temos que manter a semântica em nossos documentos.

Até…

53 técnicas que você não poderia viver sem saber

Meu colega de trabalho (Augusto) me passou este link com algumas técnicas de como montar menus, formulários, efeitos etc, usando CSS. Muita coisa interessante, vale a pena dar uma olhada.

Cantos arredondados

aqui uma bela maneira de se arredondar os cantos de um box.

Bem interessante, vale uma boa lida no código para ver como se faz.

Sempre utilizei imagens para fazer isso, mas sempre que terminava não ficava satisfeito com o resultado final, seja pelo resultado ou a “gambiarra” que fazia para isso.

Outra coisa bem lega, será quando o CSS3 estiver pronto e difundido entre os navegadores, saca só como seria fácil fácil esse arredondamento de cantos. Ví no Maujor

Como começar com os tais padrões ???

O Diego postou uma bela forma de iniciar o desenvolvimento WEB seguindo os padrões.

Pegando sites prontos e convertendo-os. Ótima método para começar.

O que vocês acham ? Dá certo?