Componentes da interface web

Ícones

Atualizado em 26.11.2009

Ícones são símbolo visuais que recuperam lembranças informacionais a eles relacionadas. Em sites com usuários regulares, ícones podem ajudar a simplificar a navegação, através da rápida visualização de links e informações a eles associadas.

As cores, as formas dos ícones, e a quantidade de detalhes dos ícones de uma interface devem ser baseadas em critérios visuais e conceituais homogêneos. As diferenças entre eles devem ficar facilmente identificáveis mesmo de relance, em passadas rápidas do olho sobre o conjunto.

A navegação baseada nos ícones pode dificultar a identificação por pessoas com diferentes modelos mentais e formações/origens culturais, por isto é importante prover informações também em modo texto. ► Exemplo

Usuários regulares de uma interface web costumam usar mais os ícones como referência do que usuários que visitam um site pela primeira vez. Estes usuários já estão familiarizados com os assuntos principais e já não se detêm muito tempo na leitura dos rótulos, mas na imagem que identificam rapidamente.

Para não aumentar o tempo de carregação das páginas, os ícones devem ser pequenos, bem como ser facilmente visualizáveis em monitores com resoluções mais baixas e mesmo sem distinção de cores (em preto e branco).

O site iustrado abaixo, os ícones abaixo dos links ajudam a identificar o conteúdo das páginas às quais estão relacionadas.► Exemplo

 

Ilustração do conceito:  Digitas, uso de ícones na interface web

http://www.digitas.com (acesso em março 2005 - o layout atual do site já não usa mais ícones)

Referências (Interface web)
Iconspedia (ferramenta de busca de ícones, acesso em 5.11.2009)
Iconlook (ferramenta de busca de ícones, acesso em 5.11.2009)
Icon Finder (ferramenta de busca de ícones, acesso em 2.11.2009)
55 Free high quality icon sets (Smashing magazine, acesso em 2.11.2008)
Icon analysis - Evaluating low spatial frequency compositions (Boxes and Arrows, acesso em 29.7.2006)

Mais informação sobre o assunto
Ícones, grandes aliados do projetista (Instituto Brasileiro de Amigabilidade e Usabilidade, acesso em 10.1.2009)

Avellar e Duarte no Twitter Avellar e Duarte no Facebook