Na busca de padronizar e nomear os seletores da codificação CSS, estou adotando o sistema CamelCase.

O CamelCase é um sistema de apresentação do nome de variáveis, funções e classes, das principais linguagens usadas na internet. Exemplos abaixo com o JavaScript:

obj.setStyle('color', 'black');
document.addEventListener("click", function() false, true);

O setStyle e addEventListener estão apresentados neste formato CamelCase. Como neste sistema existem as variações de iniciar com letra maiúscula (UpperCamelCase) ou minúsculas (lowerCamelCase), na criação de seletores e IDs, será adotado somente o início de minúscula (lowerCamelCase).

.container {}
.header {}
.header h1 {}
.headerLogo {}
.siteName {}
.siteTagline {}
.content {}
.main {}
.main p {}
.footer {}

Essa decisão é meio arbitrária, posso dizer, mas como é comum o uso de UpperCamelCase para Classes em PHP, por isso, deixei reservado isto para um uso futuro dentro da programação CSS.

O UpperCamelCase poderia ser usado em IDs, mas depois mudei de idéia, mas deixo aqui apenas documentado isto.

Outro detalhe também é a minha fuga de especificar IDs para layout de sites. Os IDs são usados na programação com JavaScripts, o que acaba criando retrabalho, quando uma escolha do nome do ID, pelo designer, não corresponde as necessidades de implementação do programador de JavaScript.

É tudo por hoje. Até a próxima.

Tags: Boas Praticas, Style Sheets