Design Blog - Blog de design gráfico, web design e universo freelancer.


Regras implícitas no web design

Por | 22 de dezembro de 2009 | Tags: , , | 19 Comentários


Existem algumas coisas que não devem ser feitas no mundo do web design. São regras que muitos web designers mais maduros tendem a acreditar que são puro bom senso, que são “implícitas”. Mas quais são estas “regras implícitas”?

O que não fazer num site

Encontrei neste blog uma lista de coisas que webdevelopers não devem fazer quando estão criando um site para e-commerce ou vendas em geral. Foi nele que me inspirei para fazer minha versão destas regras.

1) Jamais altere o tamanho do browser do usuário

Sim, eu sei que você consegue usar aquele JavaScript na sua página, e como se fosse um mini-milagre, o navegador é redimensionado para cumprir sua vontade e deixar seu site com uma visualização pré-definida por você. Mas não faça isso.

Essa “técnica” é criada por pseudo-web designers (os famosos micreiros) que acreditam que devem controlar a experiência de navegação de cada usuário. Ninguém gosta de se sentir limitado, então por que você acredita que seria diferente com o seu usuário?

2) Não enrole o usuário antes dele entrar no site

Se seu site requer que o usuário carregue a página inicial e depois tenha que abrir o verdadeiro site em um pop-up, você perde. Embrulhe tudo, jogue no lixo e comece novamente. Se seu site não abre automáticamente assim que a pessoa digita o endereço e a mensagem não é mostrada logo de primeira, fica muito difícil de alguém ficar esperando para continuar o acesso no seu site (não importa o quão bacana é sua introdução em Flash).

3) Não faça o usuário ter que decidir entre Flash e HTML

Se seu site pergunta ao usuário qual versão que eles gostariam de acessar: a versão em HTML ou em Flash, você também perde. É como perguntar ao seu consumidor se ele gostaria de entrar na loja tosca ou na loja melhor, onde a “loja melhor” requer óculos especiais e uma espera de 30 segundos.

O que você está realmente perguntando ao usuário é “você quer sair agora e comprar da minha concorrência porque eu coloquei esse impedimento antes de você descobrir o que eu vendo?“.

4) Não faça sites inteiramente em Flash se você pretende vender algo

Se seu site é feito inteiramente em Flash, demita sua empresa de web development, e se você mesmo que criou, coloque no seu portfólio sob a pasta “Projetos inúteis que eu fiz” e comece de novo. Flash é uma ferramenta que serve apenas para impressionar. Ainda não encontrei um site bom em Flash que tenha uma excelente acessibilidade sem pesar ridicularmente demais.

E note que não tem como pular a abertura

E note que não tem como pular a abertura

5) Não tente reinventar a navegação do seu website.

Colocar o menu no topo, na esquerda, até na direita funciona porque você não quer tentar reinventar o jeito como pessoas interagem com interfaces digitais enquanto tenta vender o seu produto ou serviço. Pessoas ficam confusas, irritadas e depois vão embora.

6) Design web é diferente de design gráfico

Se você é um designer de impressos e faz sites como algo complementar, pare de criar sites e providenciar “conselhos” para seus clientes de impressos sobre web design. A diferença entre design de impressos e web design é como fazer o design de uma propaganda para um carro de corrida e realmente construir esse carro de corrida.

7) Seu site precisa ser acessível em outros navegadores

Seu site não funciona em Firefox? O ano de 1999 ligou e falou que quer a internet dela de volta. Acredite: há alguns desenvolvedores que não prestam suporte para outros navegadores.

Sim, na maioria dos mercados Firefox comanda apenas 10 a 15%, mas para alguns sites é uma porcentagem muito maior (alguns inclusive têm 80% de acesso vindo de usuários rodando Firefox). Além do mais, se a equipe que você contratou não fizeram seu site compatível com Firefox eles obviamente não sabem o que está acontecendo no mundo. A falta de conhecimento sobre Firefox por um web designer mostra que ele não está a par da cultura Web e isso é um péssimo sinal caso você seja um dono de negócio.

8) Por favor, evolua

Não estamos mais em 1999. Na verdade, estamos a mais de 10 anos desta data. Sob hipótese alguma use textos piscantes, marquees, Frontpage, pop-ups, download de fontes e introduções em Flash.

Se você considera sites com essas coisas como “sites bem elaborados”, você precisa olhar o ano do seu calendário. A web evoluiu e os web designers sensatos viram que essas porcarias citadas não agregavam em nada (e portanto, deixaram de usá-los).

9) Música de fundo é para sites de música

Se seu site é diretamente relacionado a música (ex: site de banda e não seu portfólio de design), não faça ela começar a tocar assim que o site é aberto. E sob hipótese alguma esconda o ícone de parar a música.

Muitos usuários navegam na internet em horário de trabalho, e alguns esquecem as caixas de som ligadas. Há ainda aqueles que escutam música no computador com fones de ouvidos a um volume baixo. Acessar um site que começa a tocar música faz qualquer um querer esganar o maldito desenvolvedor.

10) Procure utilizar navegação em texto

Mesmo que só fique visível quando as imagens são desabilitadas. Alguns aparelhos móveis ou pessoas com conexão mais lentas podem desabilitar imagens e sofrer com a falta de um menu legível.

11) Prefira mapas de site

Um mapa de site mais bem pensado com sub-seções lógicas é melhor que menus “drop-down”. Em termos simples, drop-downs nem sempre funcionam. Ou seja, talvez não rode em alguns navegadores.

12) Facilite encontrar informações

Se seu site precisa de um sistema de busca para o usuário poder encontrar informações, é bom começar de novo e demitir o cara que fez o mapa do site (e aqueles menus drop-down na navegação). Sistemas de busca são ótimos, mas se seu usuário precisar procurar por conteúdo no seu site, você já está irritando 50%+ dos seus consumidores.

13) Tempo de download é importante

Tempo de download ainda é um fator em mais de 70% dos internautas brasileiros. Embora você viva no mundo maravilhoso da ADSL ou internet a cabo, a predominância no Brasil ainda é da conexão discada. Se seu site é apenas para usuários de ADSL, não preciso nem te dizer que você está perdendo muitos consumidores.

14) Vídeos em Flash apenas

Se você tiver que colocar vídeo, não pergunte ao usuário qual a conexão dele ou qual player ele quer utilizar. A grande maioria não sabe qual a velocidade de conexão e nem sabem se eles sequer possuem Real Player, Windows Media Player ou Quicktime. Coloque seu vídeo embedded no Flash. O Flash ganhou a batalha em questão de vídeo faz muito tempo (é só ver o YouTube).

15) Não seja sempre o mais atual.

Só porque existe uma linguagem nova não quer dizer que você precisa usar ela em tudo. Lembre-se que alguns navegadores podem não estar aptos a essas mudanças.

16) Não controle o modo de navegar do usuário

Alguns sites não permitem o clique com o botão direito do mouse para “evitar a cópia”. Mas o que o desenvolvedor não sabe é que talvez o usuário use esse menu do mouse para tarefas específicas, como voltar de página, recarregar, etc. Além do mais, qualquer um pode simplesmente desativar o Javascript na sua página se ele realmente quiser copiar seu texto.

Essas são apenas algumas dicas do que não deve ser feito ao se criar um site – considere como um “erros mais comuns”.

O que mais você acha que web designers devem evitar de fazer?


Compartilhe o conhecimento


Canha

Criador e editor-chefe do Design Blog, trabalha como designer e programador no xCake. Nerd desde pequeno, ama tudo relacionado a internet. Seu maior sonho é entrar em algum quarto e dizer "Senhores, não se preocupem: sou da Internet".

Acesse seu site Siga no Twitter

Deixe seu comentário!

  • http://twitter.com/marciobda Marcio BDA

    Faltou uma regra: Valide seu html na w3c. Tanta gente esquece disso…

    Ah! Muito legal seu blog.

  • João Ricardo

    Ein Canha não consegui entender muito bem o topico

    12) Facilite encontrar informações

    tem jeito de você dar uma pincelada nele?

  • http://www.imixdesign.com Gustavo Guichard

    Não acho que validar no W3C seja uma regra que entre neste post, pois as vezes temos que usar alguns hacks ou outras ferramentas para fazer o site funcionar nos navegadores mais temidos e, se isso pode ajudar na experiencia do usuário… Um selo do W3C não agrega na navegação do usuário leigo.

  • Guilherme

    Boa tarde amigo, sou um leitor do seu blog, assino seu Feed, sempre gostei de suas postagens, porém achei essa bem infeliz.
    O texto foi elaborado por você ou é uma opinião de outra pessoa?

    Se for seu o texto acho que você poderia colocar no inicio: “Na minha opinião…”,

    Concordo com muita coisa que foi listada, porém descordo de muitas outras, principalmente quando você fala: “Flash é uma ferramenta que serve apenas para impressionar.” Talvez seria melhor pesquisar melhor sobre isso. Enfim…

    Acho que você deveria colocar isso como uma opinião sua, não como regra a ser seguinda. Tem muita coisa listada que depende de outros fatores para seguir.

    Eu como leitor diário do seu blog me senti no direito de escrever esse comentário, espero não ser interpretado erradamente.

    Grande abraço e sucesso com seu blog que gosto muito.

  • Micael Estrázulas

    excelente artigo canha. eu acho que o principal deles, é não controlar a experiência do usuário. Não sabemos o que temos do outro lado, o pessoal que vem da publicidade, dos impressos, dificilmente entende que o usuário interage demais com nossas obras.

    você do outro lado pode ter um jumento ou alguém querendo hackear seu site.

    abraços

  • http://www.twitter.com/gust4vo Gustavo Zimmermann

    Olá Canha.. realmente eu sou um de seus fãs, gosto muito de suas postagens, mas concordo com o amigo Guilherme, quando diz: “Acho que você deveria colocar isso como uma opinião sua, não como regra a ser seguida.”

    Concordei com bastante coisas que você descreveu, mas como o Guilherme mesmo disse, nem tudo o que está aí em cima é REGRA.. As únicas regras realmente válidas e que devem ser seguidas 100% (por serem baseadas em grandes estudos e pesquisas) são as regras da W3C.

    Nas regras da W3C você encontra coisas como navegabilidade, acessibilidade etc… E com bases nesses estudos você monta o seu layout.

    São com bases nesses estudos que tempos menus, normalmente, na horizontal (topo) com repetições no rodapé… ou o mesmo na vertical e do lado esquerdo e por aí se vai…

    Quanto à questão de flash (eu sou fashdeveloper hehe) concordo 100% com você quanto a introduções em Flash… também não curto, mas se você for ver existem inúmeras técnicas para a otimização (em bytes) de sites em Flash (não estou apoiando introduções em flash, mas não condeno sites construídos 100% em flash)… de uma olhada na Galeria FWA (thefwa.com).

    Sites desenvolvidos 100% em Flash dependem muito de quem desenvolve o mesmo (se o cara é um qualquer um em flash, constrói um arquivo imenso, que poderia ser muito bem otimizado) e de quem é o público alvo. Animações tornam o site, realmente, mais interativo e divertido e podem prender mais a atenção do usuário do que sites comuns.. E não é o que todos nós queremos? Pode ser uma pequena animação em um MENU… ou um banner animado…

    Hoje ou você faz uma animação com jQuery ou faz a mesma em Flash (tirando o silverlight da jogada por pertencer a uma “categoria” parecida com a do flash)… a animação que pode acessar um XML em jQuery vai levar o mesmo tempo para carregar se você fazer o mesmo em flash. Ou por acaso alguém de vocês nunca teve que esperar um preloader de AJAX rodar?

    Preloader vão sempre existir, quanto mais avança a tecnologia mais banda temos, com mais banda, mas pesadas são as tecnologias web (isso sim é regra… só você notar as ferramentas que mais utiliza na web). Mas creio que um dia isso vai estabilizar legal.

    Concordo que para um usuário, é um saco ter que esperar um site carregar, eu mesmo não gosto, mas a grande sacada é saber administrar este tempo na qual o usuário está esperando (ex.: http://www.essaeubanco.com.br/).

    Realmente com este resposta ao post espero levantar uma boa discussão (produtiva) de forma que possamos utilizar o conceito de “colaboração” da Web2.0.

    Vlw Canha ;)

  • http://librenz.blogspot.com Rafa Librenz

    Eu concordo com o Canha: Flash é uma ferramenta que serve apenas para impressionar.

    Tudo de útil que o flash traz para uma página (com excesão de áudio e vídeo) o HTML também pode trazer, e com vantagem: muito mais acessível. Sempre.

    Eu já entrei em sites lindos em Flash. E eles me impressionaram. Aí eu quis salvar uma foto e não consegui com o botão direito. Aí eu quis copiar um trecho de um texto e tive que digitar letra por letra.

    Imagine se eu fosse cego.

    Flash é bonito. E útil para algumas coisas (ex.: YouTube), mas perde muito em “facilidade de obter informação” para o HTML.

    Meu conselho: use HTML ao máximo, e só use flash quando for realmente necessário (ex.: colocar um áudio ou um vídeo no site).

  • Dani

    Concordo com a maior parte dessas máximas.
    Apenas acho contraditório não poder reiventar a navegação. Se ninguem cria-se nada novo ainda estariamos utilizando as odiosas marquees em frames amarelos escritos em comics sans com gifs animados pulando por ai. Na minha humnilde opnião os webdesigners deveriam parar de tratar todos os usuarios como idiotas. É importante sim conhgecer as regras do design. Mas para saber como quebra-las. Criatividade aliada ao conhecimento é o que tras evolução.

  • http://www.josantana.com Jo Santana

    Este seria um bom artigo em 2003. Hoje, é datado. Parece que na verdade é esse tipo de artigo é que parou no tempo. Acho que muito do que foi proibido aqui é básico do básico e faz um bom tempo que não vejo mais sites que assim…

    Não gosto de “listas de regras” porque geralmente costumam ser generalistas demais. Sim, também odeio sites com música de fundo, mas alguns sites conseguem fazer bom uso disso. Segundo o Canha, site totalmente em flash é um erro. Mas eu afirmo que depende do caso. Já vi até e-commerces em flash que funcionam muito bem, vide NikeID (http://www.nikeid.com), por exemplo. E existem outros bons exemplos por aí, é só procurar.

    Essas regras deveriam ser atualizadas ao longo do tempo, para a existência desse tipo de artigo fazer sentido. Porque se ainda existe alguém que faz site no padrão “ISO-1999″ :), esse alguém não seria público deste site. Afinal de contas, se um “Varolo” da vida (http://www.varolo.com.br) visitasse sites como este, tomaria vergonha na cara e não faria mais suas pérolas, certo? Além disso, o próprio autor já diz que estas regras são implícitas, ou seja, ele mesmo assume que falar disso é desnecessário, já que todo seu público deve ter esse conhecimento.

    Torço para que esse tipo de lista seja atualizada com o tempo, pra que o número de itens caia a cada ano, com o aperfeiçoamento da categoria. Da lista acima, tópicos como “vídeos apenas em flash” e outros que falam de usabilidade seriam os mais atuais. E mesmo assim, pra falar de usabilidade, seria melhor usar o termo “boa prática”, ao invés de “regra”. Tudo depende da proposta do site. O que tem de Jacob Nielsen por aí que acha que todo site é e-commerce… :)

    Canha, espero que entenda minha crítica. Há muito tempo atrás li um artigo do Michel Lent (http://is.gd/5yZPE) – que inclusive já foi meu professor – onde ele dizia sobre o cuidado que temos que ter para nossa informação não virar ruído no meio de toda essa massa de informação gerada todo dia na web. Dá uma lida, é muito bacana. Inclusive, me fez pensar muito quando li.

    Um abraço e continue nos brindando com seu trabalho. Boas festas!

  • http://vetores-e-pixels.blogspot.com/ Maurício Reis

    Só complementando os comentários acima, acho que quando alguem publica um artigo num blog já está mais do que implicito que é a opinião deste, e não uma verdade absoluta. Assim como acho que listas assim de coisas que não se devem fazer é bom pra quem está iniciando e vai de uma questão de bom senso o quão seguida será esta lista!
    Sem querer criticar, só falando o que acho, até porque não sou um designer mesmo, só aspirante, meu blog é puro conhecimento agregado!
    espero ter ajudado com meu comentário!
    Sucesso e abraços.

  • http://www.marduf.com.br Márcio Eduardo

    Bem,
    ponderando todos os itens do tópico, na minha opinião, em alguns casos suas declarações estão completamente equivocadas. Já fiz sites para fotógrafos, músicos e outros e não é por aí…Parece que você fez o tópico pensando que a grande totalidade das pessoas que acessam a internet tem conexão discada e por isso não devem sofrer a frustação de acessar um site com excesso de recursos visuais…
    NA MINHA OPINIÃO!!

  • http://flickr.com/photos/ceodesign Carllos Eduardo

    Olá Canha:

    Acompanho seu blog a um tempo e recebo as newsletter do mesmo, fico muito grato por isso.
    Achei bem bacana o post, todos os 16 tópicos são muito importantes e essenciais para um bom desenvolvimento web, mais existe exceto no quinto tópico “Não tente reinventar a navegação do seu website”, acho que sites mirabolantes para portfólios de designers são bacanas, não que isso seja um engessamento e sim um atrativo a mais do mesmo.

    Abraços

  • http://www.kadunew.com/blog Carlos Eduardo – kadu

    Interessante o post! Ajuda principalmente quem está iniciando no mundo do desenvolvimento Web. Um livro muito bom para quem está iniciando é o “Não me faça pensar”.

  • Jorge Khanda

    Post interessante, mas analisando as coisas por um ângulo xiita e, convenhamos, pode chegar a ser infantil.

    Flash é para impressionar, sem dúvidas. Mas só consegue fazê-lo quem realmente sabe desenvolver em Flash. Isso inclui acessibilidade, facilidade de carregamento e projeto bem estruturado. E, claro, o público alvo. “Imagine se a pessoa for cega?” – nem todos os produtos/serviços que quer se vender ou mostrar inclui esse público, se é que me entendem. Bem como muitos sites desenvolvidos especialmente (falo especialmente e não também) para o público com deficiência visual são tão claros para quem enxerga.

    Sobre capacidade motora, um site, independente de ser em Flash ou não, deve facilitar a navegação através de suas interações. Não basta apenas substituir o Flash pelo jQuery ou Silverlight ou validar pelo W3C (do que adianta validar se a semântica é errônea? Sabiam que o HTML do Fireworks passa no validador? E aquilo é um lixo).

    Então, cada caso é um caso. Se não houver ousadia (com responsabilidade e estudo), não se evolui. E antes de instituir regras é necessário pensar, testar e repensar.

  • http://www.mixd.com.br Plinio Theodoro

    Muito bom o post, principalmente no item “6″ onde distingue a diferença do profissional de design de impressos e de web.

    Lembrando que em muitos casos, esse conteúdo seria mais apropriado aos clientes do quê aos desenvolvedores, rsssss Quem nunca teve um cliente que perguntou: Tem como por um sonzinho?

  • http://aspiranteliterata.wordpress.com Patricia

    Parabéns, ótimo artigo

  • Pingback: Seu site ( ou outros trabalhos de design) não é para você! « Arquitetura 3D

  • http://www.twitter.com/gabrieldonati Gabriel Donati

    Primeiramente. Tenho minhas raízes no designer gráfico estou entrando de cabeça no web design e apesar de tudo, creio que posso ser um bom web designer também. Criar é criar, independente da plataforma! Se souber as boas-práticas, ter noções de SEO, ou seja, conhecer bem a plataforma, não tem porque se achar limitado a uma mídia ou rótulo.

    Gostei muito do texto, mas encaro como dicas genéricas, não as usarei como regras, porque creio eu que toda regra limita a liberdade de criação.

    Sites em flash x acessibilidade sempre será uma discussão ferrenha. O que temos que levar em consideração é o publico alvo, colocar na balança o que perdemos e o que ganhamos. Ganhamos em interação e perdemos em acessibilidade? Veja o que mais importa no seu projeto.

    Abraço.

  • http://be.net/brunoseven bruno mendes

    só nao concordei com dois itens:
    5) Não tente reinventar a navegação do seu website.
    – acho que reinventar conceitos, ousar, inovar e ser diferente nos sites é algo extremamente bem vindo, mas tem que ser analisada a necessidade do cliente, um site conceito provavelmente nao é ideal para uma empresa cujos clientes buscam apenas algo pratico e funcional em um site. Dizer "nunca reinvente" é uma expressão muito perigosa pra quem mexe com design.

    6) Design web é diferente de design gráfico
    Se você é um designer de impressos e faz sites como algo complementar, pare de criar sites e providenciar “conselhos” para seus clientes de impressos sobre web design.
    — Acho que o melhor nao é exatamente dizer que o DG tem q parar de atuar como WD, mas sim dizer que se ele quer entrar nesse ramo ele precisa se aprimorar e estudar, pois embora sejam coisas diferentes, designer é designer, nao importa a área, mas é necessário aprimoração para prestar serviços nessas areas.