Layout da interface

Atividades relacionadas (ao layout do web site)

Aspectos específicos da interface

Exemplo – Em barras de navegação muito longas, o uso de estilos diferenciados nos rótulos, de bullets e sinais de itens (como pontinhos, setas, caracteres especiais) e de indentação nas barras de navegação, ajuda a visualização dos níveis hierárquicos das informações

Atualizado em 30.10.2009

Na página ilustrada abaixo, a longa barra de navegação permite a visualização não só as diferentes seções do site, mas também a relação de subordinação entre elas.

No alto, o link para a página Principal assinala o nível mais alto da hierarquia. Vê-se que esta página, "Film" (marcada entre linhas horizontais) está localizada dentro da seção "Events & Education", localizada na segunda camada de informações.

A visualização entre as camadas é identificada visualmente através da indentação diferenciada entre elas.

Abaixo da navegação principal, com fundo rosa, podemos identificar três itens, "Tate Collection", "Tate Learning" e "Tate Research" que, por sua natureza independente em relação à visitação e à programação do museu, têm tratamento visual diferenciado em relação aos demais (fundo branco, letras em cinza).

 

Ilustração do conceito:  Tate Modern - Barra de navegação com diversas camadas de informação

http://www.tate.org.uk/modern/eventseducation/film/default.htm/ (acesso em 5.7.2006)

Assuntos relacionados
Componentes da interface web
Usabilidade – Consistência

Avellar e Duarte no Twitter Avellar e Duarte no Facebook