ícones, my precious!

Este é o primeiro site que comecei a fazer em WordPress aqui na USP, o primeiro de vários

Nele usamos poucos plugins, usamos por enquanto o Gerenciador de capas do Xemelê, porem estamos desenvolvendo um próprio com características que precisamos. Desenvolvemos também um plugin para cadastro e envio de Newsletter que em breve vamos disponibilizar. Estamos documentando ambos e fazendo testes. Também tenho que ressaltar o trabalho sensacional do programador Pedro Cicolin Leme, que trabalha conosco e está desenvolvendo esses plugins.

Fora isso mais nada, só o tradicional layout, php, jquery e muitas functions personalizadas

1. Serifa vs  Sans-serif (sem serifa)

40% usam serifa
60% não usam fontes serifadas

2. Fonte mais  popular serifada pra título e corpo do texto

Georgia

3. Fonte mais  popular não serifada pra título e corpo do texto

Arial, seguida por Verdana e Helvetica

4. Fonte mais utilizada

Georgia, Arial e Verdana

5. Tamanho da fonte pra título

De 18px a 20px e 24px a 26px, empatados.

6. Tamanho da fonte pro corpo do texto

13px disparado e 14px em segundo.

7. Caracteres por linha

82 a 84, seguido por 88 a 90.

Outras dicas

46% dos sites usam underline nos links
96% dos sites não usam texto justificado
A escala tradicional de fontes é 6, 7, 8, 9, 10, 11, 12, 14, 16, 18, 21, 24, 36, 48, 60, 72

Padrões de escala em pixel

Tamanho da fonte do título ÷ tamanho da fonte do corpo = 1.96
Altura da linha ÷ tamanho da fonte do corpo = 1.48
Tamanho da linha (pixels) ÷ Altura da linha (pixels) = 27.8
Espaço entre parágrafos (pixels) ÷ Altura da linha (pixels) = 0.754

O grande desafio pra mim nesse trabalho foi produzir do zero todo o desenvolvimento do mesmo em WordPress, além de layout e programação. No fim pela primeira vez não usei um template como referência e usei o framework wp-framework. Nunca mais uso um template de referência, a facilidade que o wp-framework proporciona é sensacional sem contar que você conhece exatamente todo os css porque é você quem faz.

Diferente do que muita gente pensa o WordPress é um verdadeiro gerenciador de conteúdo e não se limita a produção de blogs, vide o layout do site que ficou com cara de um pequeno portal.

O que utilizei:
• WordPress
• Wp-framework
• Jquery
• Plugin wp-postratings
• E muito CSS e PHP

Hoje felizmente a web já é mais profissionalizada e reina o xhtml, tableless e css validados e  o IE é o grande  temor de qualquer webdesigner, já que você tem que se desdobrar pro layout ficar correto nele.

Abaixo um truque pra que a feiosa tag <hr /> seja trocada por uma imagem e funcione em qualquer browser.

Esse é o modo tradicional que usava até então mas não funciona no IE.

hr {
  border : 0;
  height : 15px;
  background : url(hr.gif) 0 0 no-repeat;
  margin : 5px;
}

E esse é novo modo que descobri que funciona em todos os browsers inclusive o IE.

hr {
  display : list-item;
  list-style : url(hr.gif) inside;
  filter : alpha(opacity=0);
  width : 0;
}

Descobri no site borgar.net essa solução limpa em css, sem javascripts, jquery, etc..

Porém, se você tem dúvida pra embasar o conceito do seu logotipo, veja abaixo e aprenda Vi no Piores Briefings do Mundo.