Rafael Marin

Você provavelmente é bem organizado e toma conta direitinho do seu código PHP, Ruby, Python, ASP(?). Arquivos de classes organizados em pastas, todos com nomenclatura extremamente lógica. Seu HTML é impecavelmente semântico, e seu Javascript brilha, de tão bem estruturado. Agora, como anda a saúde das suas folhas de estilo?

CSS é, na maioria dos casos, a ovelha negra das linguagens no que se refere à manutenção. Já aconteceu com você de ter que mudar algum detalhe nos estilos de um site meses depois de ele ter sido concluído e custar um pouco até achar os seletores e propriedades corretas? Ou então, de criar seletores ambíguos, apenas com nomes de classe diferentes, e quando você precisa fazer alterações precisa mexer em mais de um lugar? Você ultimamente tem se perdido em centenas (milhares?) de linhas de código CSS?

Faça um esforço, e traga a organização que você já possui com seus scripts para a sua folha de estilo em cascata. Não é dificíl, pois as orientações você provavelmente já conhece e aplica, quase naturalmente. São algumas das sugestões que eu vi por aí e outras que eu mesmo sugiro a você.

Indentação

Mantenha seu código CSS indentado de acordo com a hierarquia que os seletores representam. No exemplo acima, #topo ul li pertence à #topo ul, e este pertence à #topo - assim como #topo img também pertence à #topo. Repare então que cada bloco de código recebeu uma indentação de acordo com seu nível hierárquico. Indentar seu CSS é importante justamente para visualizar facilmente a estrutura do seu site, sem necessariamente ter que ver o HTML todo novamente.

Ordem alfabética nas propriedades

Alguns de vocês podem julgar esta dica um tanto inútil. Na hora de escrever o código pela primeira vez, colocar as propriedades em ordem alfabética pode ser um pouco chato, cansativo. Mas se você reparar, na hora de fazer manutenção, você quase sempre fica procurando as propriedades no meio da confusão de caracteres. Para mim faz bastante diferença colocá-las nesta ordem, já deixa o código pronto para o futuro.

Agrupamento das propriedades

Os seletores #certo e #errado já dizem tudo. Você pode e deve resumir, por razões óbvias, a declaração das propriedades. Acredite, os dois blocos de código fazem exatamente a mesma coisa.

Na continuação desta série, veremos dicas avançadas para otimizar e estruturar seu CSS. Lembre-se sempre que todo esforço é sempre recompensado, e você é quem ganha quando precisar fazer manutenção e encontrar um código estruturado e intuitivo.

Acho que a imagem fala por si, pessoal. Vocês não sabem o quanto sou grato e quanto eu aprendi escrevendo e interagindo com vocês. Ainda estou pensando em uma maneira de recompensar vocês (spoiler: haverá sorteio por aqui). Obrigado pela audiência e pela feedelidade.

Baixem já o CodeCast 3! Neste episódio falamos sobre semântica e microformatos, é um episódio curto, mas até que ficou legal. :D

Eu sempre quis aprender programação orientação a objetos. Mas sempre me pareceu algo bastante subjetivo, difícil de entender a primeira vista. Foram algumas tentativas até que, finalmente, as peças começaram a se encaixar e toda essa história de classes, herança, objetos, começaram a fazer sentido. Custou, ah se custou. Passei muito tempo tentando entender, não pela linguagem, mas pela lógica atrás disso.

Programar em seqüência, proceduralmente, sempre pareceu muito natural para mim. Até o momento que eu percebi que reinventar a roda não é lá o que se pode chamar de produtivo. Ainda não fiz nada, meus amigos, não esperem um grande lançamento de software de minha parte. Mas já é um bom começo ao menos entender a lógica por trás de tanta coisa abstrata.

Dica: Se alguém aí também não entende, o Danilo do Digital Minds publica infreqüentemente uma série de artigos muito bons sobre PHP OO para quem também está boiando no assunto.

Eu uso PHP, e estou estudando (e finalmente entendendo) orientação a objetos. E você, como programa?