Depois do post “10 dicas pro webmaster não querer te matar“, que teve diversos picos de acesso e cada dia bate novo recorde pro blog, resolvi inverter o foco e ajudar o webmaster a não ser decapitado e exposto em praça pública pelo designer. São leves toques (PARA OS WEBMASTERS) que, junto com o outro post, ajudarão a manter o clima de designers x webmasters calmo, feliz e com aroma de rosas so campo. Vamos lá:
1. Alinhamentos
Não existem coisas quase alinhadas. Ou estão ou não estão, inclusive ele existe pra isso: tornar duas coisas exatamente na mesma linha. Não tente justificar com “Ah, mas são só 3 pixels” se o resultado final ficar com cara de amador. Claro, isso se aplica quando não bate de frente com o item “6. Desapego com a arte” da outra lista de dicas.
2. Cores
Muitas vezes, na hora de usar o conta-gotas do seu software favorito para pegar a cor de algum elemento, você pode pegar a “cor errada”, ainda mais quando os layouts são distribuídos em JPG compactado ou algo equivalente. Na maior parte das vezes ele cria “borrões”, principalmente próximo a letras e bordas de ilustrações. Caso você clique nesses borrões acidentalmente para identificar o hexadecimal da cor, pode ter resultados diferentes a cada uma das páginas do seu projeto. Veja no exemplo a seguir que fiz com uma das imagens do post “Pensar com tipos“, três cores diferentes, retiradas da mesma letra A:

3. Compactação de imagem
É bem interessante alinhar com o designer (caso ele não as entregue recortadas) como as imagens serão compactadas pra web, seja em JPG, GIF, PNG 8 ou 24. As vezes as existem muitas perdas de qualidade ou cores essenciais para o projeto.
4. Tipografia
Não, Arial não é igual Tahoma e tampouco com a Verdana. Times New Roman não tem nada a ver com a Georgia. Ok, ok, as vezes é complicado de identificar pra quem não é acostumado, então vale a pena certificar-se de qual das tipografias é utilizada no projeto. Uma família trocada pode causar bastante estranheza por parte de quem vê, mesmo que não tenha o olho treinado. Fica aquela sensação de letreiro preto com letrinhas amarelas de padaria, onde sempre tem fontes diferentes pra compor o “menu”. Perceba como as famílias são diferentes:

5. Entrelinhas e entreletras
Muito comum ser ajustada entre os designers gráfcos, muitas vezes esses dois recursos essenciais não são aplicados na web ou não seguidos pelos HTMLers à risca. Os projetos que precisam colocar mais texto em menos espaços, como portais de conteúdo ou notícias, podem usar uma redução no entreletras (no CSS, letter-spacing) e/ou no entrelinhas (line-height no CSS) para resolver esse problema. Fique atento nessas medidas pra não parecer que “tem texto demais e tá quebrando o layout”
6. – Deixa que eu faço, é só um botãozinho? – NÃO!
Sem radicalizar nada, mas é bem complicado inventar um botão, cor de algo ou posicionamento quando teve um cara que ficou cinco meses pensando e executando só isso. Essa dica não é relacionada ao apego com o produto e sim com a garantia de identidade posta à prova no site todo, desde decisões de estrutura para todo o layout até a cor do link do canto do rodapé. Se precisar criar algo, chegou a hora de trabalhar junto com seu amiguinho designer de novo! Ó que beleza! Pra você entender como é ruim uma pessoa não treinada inventar esses designices, seria como, depois de meses e meses de trabalho árduo e códigos lipíssimos e organizados, vir um designer infeliz e mexer em tudo via Dreamweaver, pelo modo layout. Entendeu? Dói, né?
Mais alguém tem dica aí? Ah, aproveita pra comentar e enviar pros amiguinhos codeiros que você conhece.


#1 by d.vespa on December 16th, 2009
Quote
Uma consideração para designers a respeito do item 2 e que 99% deles prefere ignorar: sempre que possível, dar preferência ao uso de cores com hexadecimal ‘perfeito’ – ou seja, dentro das 256 cores web básicas. Por que? Em primeiro lugar porque evita o problemas como o do conta gotas já que a cor é “pura”. Segundo porque a chance de ter qualquer variação de cor de uma placa de vídeo pra outra é praticamente nula (não levanado em consideração a calibragem do monitor, obviamente). É deveras chato quando você quando a cor que no seu monitor parece laranja e no da pessoa que fez o lay fica rosa por conta da interpretação do sistema.
“Mas e se eu quiser uma cor fora das 256?” – Tudo bem, pode usar, não é crime ou proibido. Mas há de se convir que é dificil ficar sem opção com 256 cores – afinal, se na facul/colégio técnico/etc vc se virava com uma caixa de 36 cores, qual é a dificuldade? :p
#2 by Borginho - WebMaster Amigo on December 16th, 2009
Quote
Não fui eu, juro
Muito legal o post…. Parabéns!
#3 by Obelix on December 16th, 2009
Quote
Gostei.. muito bom…
Pingback: Como enlouquecer um fotógrafo | Magel Studio
#4 by Dine Oliveira on December 29th, 2009
Quote
Fico encantada toda vez que entro neste BLOG.
Depois das 10 dicas para o webmaster não te matar, acho que não há nada mais justo do que o inverso!
Tento não brigar por nenhuma das dicas exceto a de Alinhamento, que confesso agora: “Fico puta!” mas dou razão ao designer que por sua vez também fica puto comigo em muitos casos. Rs…
O ideal seria pararmos de achar que o curto tempo, que geralmente temos para desenvolvimento implica numa coisa feita “as pressas” (pra não dizer feita qualquer jeito).
Parabéns pelo Post!!!
#5 by Diogo Paixão on January 5th, 2010
Quote
Muito bom…
#6 by Leandro Corso on March 4th, 2010
Quote
Muito bom este post também, só não concordo 100% com a terminologia “webmaster”, assim como eu comentei no post anterior. Pelo descrito no seu texto vc chama de webmaster o desenvolvedor que geralmente é um profissional de T.I. Então pq não chamá-lo de programador? Se vc leu o livro do Felipe Memória pode ver que webmaster é outra coisa! Acho q vou colocar um post no meu blog sobre isso. Mas enfim! Estou curtindo seu blog e vou acompanhá-lo pq vc trata de assuntos realmente relevantes. Parabéns novamente!
#7 by Rafael Cavalcante on March 4th, 2010
Quote
hahah sensacional!
Passo por isso direto…
Verdana s2