|link| O Aurélio novamente fez um artigo que gostei muito e pra não perder, resolvi deixar lincado aqui no blog. Vale à pena a leitura da ótica dele acerca de como os sites estão sendo padronizados no quesito “visual” usando poucas, mas importantes dicas.
Apesar de estar o texto básico da postagem aqui, é recomendável ir ao link da postagem pra conferir os links que fazem referências diversas.
Programadores não são bons em webdesign. Não, mesmo. Eu engrosso as estatísticas, admito que meu talento como designer é inexistente, nulo. Me dou bem com os códigos, mas sou uma negação em criação gráfica…
Para tentar mudar essa realidade, comecei a prestar mais atenção no formato dos sites. Tenho bastante experiência em reconhecimento de padrões e logo comecei a perceber algumas características que os sites legais têm em comum. São ingredientes que se repetem e parecem fazer parte da fórmula para uma apresentação agradável.
Continuo sendo leigo no assunto, mas gostaria de deixar registradas as impressões que tive. Use sob sua própria conta e risco ![]()
Cartilha do Webdesigner Antenado – Edição 2006
O cinza é o novo preto
Esqueça black ou #000. O preto está proibido. As letras do site devem ser no máximo cinza escuro. Quando mais claro melhor.
Proibido usar cores berrantes
Amarelão, vermelhão e azulão? De jeito nenhum! Use somente cores suaves tipo bebê ou cristal. O lance é deixar o site em baixo contraste, como se tivesse o canal alpha em 50%.
Branco, muito branco, branquíssimo
Não amontoe os elementos. Use e abuse de margin e padding, quanto mais melhor! Assim como em um mictório público, deixe tudo bem espaçado, distante, com aquele espaço em branco bonito por toda parte.
Use espaçamento generoso entre linhas
Relacionado com o tópico anterior, ter espaços em branco no meio do texto é ultra fashion! O line-height deve ser no mínimo 150%, quanto mais melhor.
Link sublinhado é brega
Com tantas opções de afrescalha^W, digo, de formatação, você vai deixar aquele linkão azul sublinhado? Não né! Mude as cores, abuse do :hover para dar destaque, mude a cor de fundo, use bordas.
Imagens devem ter borda
Claro que você não vai usar aquela bordona azul anos 90 nas suas imagens, mas uma borda fininha e cinza com um padding para deixar a impressão de foto com borda branca, é show.
HTML diet
Ficaram para trás os velhos dias de e
. O HTML hoje deve ser puro, livre de gordura. Os únicos atributos permitidos para qualquer tag do BODY são ID e CLASS. Ah sim, em minúsculas porque o W3C mandou.
Tabelas? Vá de retro!
Toda página que usar tabelas para definir o design terá seu canto reservado no mármore do inferno. Tabelas são do mal. Tabelas dentro de tabelas então? Vixe. Seja moderninho e use DIVs para organizar seu conteúdo. Tabelas só são permitidas para servir ao seu propósito inicial de mostrar dados tabulares (linhas e colunas com números, lembra?).
Seja líquido, se espalhe
Não use medidas absolutas (pixels), sempre use “em” ou porcentagem. O visitante pode usar um palmtop ou uma tela de cinema 30 polegadas, janelinha pequena ou tela cheia, não importa. Seu site deve escorregar para todos os lados e ficar bonitão em qualquer tamanho.
E claro, a foto de natureza
Uma grama verdinha, uma fruta apetitosa, um animal com um semblante sereno, uma paisagem que se perde no horizonte. Você é livre para escolher o tema, mas a indefectível foto de natureza não pode faltar. Ela deve ser totalmente fora de contexto, não ter nada a ver com o resto do site. Mas mesmo assim será “cool”.
É isso. Concorda? Discorda? Tem mais ingredientes a acrescentar? Deixe um comentário.
Para testar a eficácia dessa fórmula, tentei aplicar estes conceitos na página principal de meu site. Admito que estranhei no início, mas gostei do limãozinho
Para comparar, veja como era a versão anterior do site.
Site Velho Site Novo
Versão antiga / Versão nova
Leu até aqui? Então já que você está com tempo, engrandeça seus conhecimentos em webdesign e leia algumas dicas sem prazo de validade, que pregam o bom senso acima de tudo: