Hoje vou postar algumas dicas de CSS, pra ajudar novos designers e até os mais experientes, são dicas simples porem eficazes, vamos as dicas:

Pare com div1, div2…

Evite dar nomes como div1, div2, div3 aos seus elementos. Eles não explicam nada, e quando você for corrigir algum erro, sei la só vai queimar o neurônios sem precisão . Da mesma maneira, barra_azul não faz muito sentido: se você mudar a cor do site, onde vai estar a barra azul? Prefira nomes explicativos, como menu ou barra_links.

Cuidado com Maiúsculas e minúsculas

Nomes de elementos fazem diferença entre letras maiúsculas e minúsculas: BarraLinks é diferente de barralinks. Preste atenção na hora de usar seu elemento no HTML.

Declaração id x class

Para elementos que aparecem apenas uma vez no layout (menu, rodapé, cabeçalho, etc) prefira a declaração id, precedida por um sinal de # (ex. #menu). Para elementos que vão aparecer várias vezes, utilize a declaração class, precedida por um ponto (como .postagems).

Use a mesma declaração entre vários elementos comuns

Se vários elementos terão características em comum, declare-os todos de uma vez, separados por vírgula, assim diminui o a linha de código e agiliza bastante:

h1, h2, h3, h4 {
font-family: Arial, Helvetica, Sans-Serif;
}

Organize-se e lembre da hierarquia

Por ser uma folha de estilo em cascata, a última declaração é a que prevalece. Preste atenção para não declarar um elemento duas vezes: na hora da manutenção, você pode fazer a alteração na primeira e se perguntar porque ela não funciona, quando na verdade uma segunda declaração está perdida no meio do seu código (por isso organização é fundamental!), preste atenção viu ;).

Use comentários

Quando você utilizar o CSS para efeitos mais avançados, como um menu em abas, comente seu código para não esquecer o que cada parte dele faz, é só adicionar/* para abrir um comentário e */ para fechar.ex

#menu ul li a
       /* aba normal */
       {background: #444; color: #FFF; border: 1px #FFF solid;}

#menu ul li a:hover{
       /* aba selecionada*/
       {background: #FFF; color: #F00; border: #F00 1px solid;}

Declare as unidades

Quando trabalhar com valores diferentes de zero, declare as unidades (px, pt, etc). Cada navegador assume uma unidade padrão quando ela não é especificada, gerando resultados diferentes em cada navegador, uma coisa simples como essa pode pesar e muiito na sua imagem na web.

Bom é so isso e até a próxima.