Tendo recentemente começado a ler um pouco mais sobre princípios de design, me deparei com um princípio interessante chamado de Regra 80/20 , também referido como o Princípio de Pareto , o Princípio de Juran , a Regra Vital Pouca e Trivial , e o Princípio da Esparsidade de Fator .

Esse princípio, ao qual me referirei neste artigo, simplesmente como a regra 80/20, quando considerado no contexto do design do site e do aplicativo da Web, pode ter um efeito profundo na experiência do usuário e, em última análise, na eficácia do conteúdo ou funcionalidade do seu site ou aplicativo da web.

Neste post, eu vou primeiro fornecer uma definição básica, então eu vou considerar alguns exemplos específicos de como a regra 80/20 se mostra benéfica, e então eu vou resumir algumas lições que podem ser aprendidas de ter conhecimento desta regra.

Qual é a regra?

A regra 80/20 foi originalmente observada pelo economista italiano Vilfredo Pareto, e o princípio atual foi chamado de Princípio de Pareto por Joseph M. Juran.

Abaixo estão as definições de duas fontes diferentes. Primeiro do livro Princípios Universais do Design :

A regra 80/20 afirma que aproximadamente 80% dos efeitos gerados por qualquer sistema grande são causados ​​por 20% das variáveis ​​nesse sistema.


E a seguir, da Wikipedia :

O princípio de Pareto ... afirma que, para muitos eventos, cerca de 80% dos efeitos provêm de 20% das causas


Então, imediatamente você perceberá que nem sempre é um princípio que nós, como projetistas, temos controle direto, mas sim um princípio que observamos como ocorrendo quase naturalmente.

Com o conhecimento da existência deste princípio, ou padrão de ocorrência, somos então equipados com informações valiosas para tomar decisões que ajudarão a melhorar a usabilidade e a eficácia de nossos projetos.

Nunca se preocupe com a natureza hipotética da regra ...

Sim, há críticos e aqueles que sentem que a regra 80/20 nada mais é do que uma hipótese ou teoria excessivamente geral que nem sempre se aplica.

Mas colocando isso de lado, o conceito em si é certamente benéfico para aqueles que trabalham em interfaces de usuário e funcionalidades que requerem exame e otimização - mesmo se a regra for mais parecida com 70/30 ou 90/10.

Como podemos aplicá-lo à experiência do usuário?

Em qualquer site, aplicativo da Web ou ambiente de software, a regra 80/20 nos diz que 20% das funcionalidades e recursos de qualquer ambiente serão responsáveis ​​por 80% dos resultados ou ações realizadas nesse ambiente.

Em alguns casos, descobrir o que constitui os 20% que têm um impacto tão grande é fácil. Estatísticas da web analítica, envios de formulários e cookies de sessão podem ser usados ​​para rastrear o comportamento do usuário. A análise desses itens nos ajudará a determinar quais áreas da interface do usuário são mais interagidas.

Por outro lado, tarefas menores que não são rastreadas usando esses métodos podem ser mais difíceis de analisar. Nesse caso, os estudos de usabilidade podem ser conduzidos onde os usuários são observados enquanto interagem com a interface do usuário do seu website.

Alguns exemplos que reconhecem a regra 80/20

Seja intencional ou não, há muitas evidências de que os projetistas de UI e UX estão considerando o valor desse princípio.

Tomemos por exemplo um elemento de interface do usuário simples, como uma lista suspensa de países apresentados em um formulário de registro. A maioria dos desenvolvedores de sites ou criadores de conteúdo reconhece que, em 80% do tempo, determinados países serão selecionados.

Assim, embora pareça ser uma má prática para uma lista tão longa quebrar a ordem alfabética da lista, a regra 80/20 permite que a convenção seja quebrada colocando os países mais selecionados no topo, como mostrado na tela abaixo: a partir de Fenn Wright Manson página de checkout:

Opções do país mais provável de Fenn Wright Manson


Em outros casos, como ao adicionar um novo endereço ao seu catálogo de endereços Amazon.com , a escolha padrão é o país mais selecionado - neste caso, os Estados Unidos:

Opção de país padrão da Amazon


Aqui está outro exemplo, desta vez de um negócio baseado no Reino Unido chamado Galeria North Rock , que tem a opção UK selecionada por padrão:

Opção de país padrão da Norht Rock Gallery

Esses exemplos simples acima mostram a importância de otimizar as funções e opções usadas ou selecionadas com mais frequência.

Onde o olhar do usuário?

o Padrão F hábitos de leitura e escaneamento de usuários da web se tornaram bem estabelecidos até agora. É claro que o F-Pattern nem sempre é um indicador em todos os mercados, mas é um ótimo ponto de partida para considerar onde seus usuários procurarão quando interagirem com seus designs.

Dê uma olhada nos heatmaps mostrados abaixo, no conhecido artigo do Alertbox, link acima:

Heatmaps mostrando o padrão F

Assumindo que este é um bom indicador de onde o olho do usuário está focado, isso suporta o conceito da regra 80/20. As áreas mais intensas do mapa podem representar os 20% da página em que os olhos do usuário interagem com 80% do tempo.

A partir desse conhecimento, como designers, podemos tomar decisões que ajudarão a aprimorar e otimizar as áreas para as quais o usuário será habitualmente atraído.

É claro que o design será muitas vezes o fator determinante de onde o usuário está, portanto, essa sugestão deve ser apenas um guia básico e não necessariamente uma maneira dogmática de decidir o que está abaixo dos 20%.

Tendências de design para dispositivos móveis e a regra 80/20

Recentemente, com a explosão de dispositivos móveis em todo o mundo, alguns designers e desenvolvedores, mais notavelmente Luke Wroblewski , foram encorajadores mobile-first web design . Ou seja, ao projetar e desenvolver um site, a versão móvel deve ser feita primeiro, em vez do contrário, para obter certos benefícios.

Em um site ou aplicativo da web tradicional, determinadas áreas do seu site ficarão naturalmente abaixo dos 20% mais usados ​​e interagidos. Quando um site para dispositivos móveis é projetado, o foco é colocado nesses 20% (ou por aí).

Assim, embora a versão para dispositivos móveis de um site possa ter suas próprias opções de 20% mais usadas, em relação ao conteúdo completo disponível em um site tradicional, a versão para celular normalmente terá apenas as funções mais importantes.

Aqui está um exemplo simples abaixo usando o PETCO.com local na rede Internet:

Site completo da Petco

Acima está a versão completa do site, em toda a sua glória desordenada. Embora existam algumas áreas de call-to-action, e certamente não é o pior design do mundo, no geral não é muito focado e há muitas opções.

Compare isso com a versão para celular, abaixo:

Petco mobile

Por outro lado, a interface móvel mostrada acima é simples e ajuda o usuário a acessar primeiro as áreas mais importantes, sem sobrecarregá-las. Quaisquer opções e áreas de conteúdo mais usadas na versão completa são as únicas opções disponíveis na versão móvel.

Assim, bons aplicativos da Web para dispositivos móveis são ótimos exemplos de designers canalizando suas energias nos aspectos mais importantes de seus projetos, mantendo o foco na funcionalidade e no conteúdo (os 20%) que são usados ​​na maior parte do tempo (os 80%).

Lições resumidas

Compreendendo como a regra 80/20 funciona, os projetistas estão preparados para agir de várias maneiras, resumidas abaixo:

  • Sempre que possível, analise os dados de análise e usabilidade com cuidado para determinar as 20% das funções mais usadas do seu site
  • Prioritizar; ou seja, concentre-se nos aspectos mais importantes do seu site ou aplicativo da Web e aprimore
  • Não gaste muito tempo otimizando coisas que caem nos 80% que não são usados ​​com frequência
  • Simplifique seus projetos e layouts com base em dados que determinam o que se enquadra nas 20% mais usadas
  • Remova a funcionalidade não crítica ou o conteúdo que não é usado com frequência
  • Não invista muito tempo e dinheiro otimizando a funcionalidade menos usada, pois o retorno do seu investimento provavelmente será insatisfatório.
  • Encontrar maneiras de melhorar a funcionalidade e o design de elementos mais críticos menos usados ​​que poderiam ter um impacto maior nas conversões se esses elementos do design fossem usados ​​com mais frequência


Enquanto a regra 80/20 é um princípio discutível com algumas falhas inerentes, não é sem valor. Portanto, considere essa regra durante o processo de reformulação, realinhamento ou mesmo para novos projetos.

Isso deve ajudar seus usuários a manter o foco na funcionalidade e no conteúdo mais importantes e, em última análise, ajudar a melhorar as taxas de conversão.


Este post foi escrito exclusivamente para Webdesigner Depot por Louis Lazaris, um escritor freelance e desenvolvedor web. Louis corre Webs impressionantes onde ele publica artigos e tutoriais sobre web design. Você pode siga Louis no Twitter ou entre em contato com ele pelo site dele.

Você já considerou a regra 80/20 em suas decisões de design? Que efeito isso teve no sucesso do seu site ou aplicativo da web? Compartilhe seus comentários abaixo.