Idéia
Introdução
Propósito
Estratégias

Desenho de Interface
Introdução(interface)
Desenho de Interface
pra Web-básico
Assuntos de Acesso
Navegação
Links e Navegação

Desenho de Site
Introdução
Estrutura de Site
Elementos de Site I
Elementos de Site II
Desenho de Intranet
Capas de Sites

Notas e Glossário

Dê aos usuários o controle do acesso

A meta aqui é proporcionar para o usuário a informação que eles
querem com o menor número de passos possíveis, e no tempo mais curto.
Isto significa que você tem que projetar uma hierarquia eficiente de
informação, minimizar o número de passos por menu das
páginas. Estudos de interface mostraram que os usuários preferem menus
que apresentam um mínimo de cinco a sete links, e que os usuários
preferem algumas telas com muitas escolhas(mais densas) do que várias
camadas(páginas) de menus simplificados.
Na tabela abaixo note que você não precisa de muitos níveis
de menus para incorporar grandes números de escolhas:

Interação e Largura de banda

Os Usuários não toleram longas demoras. Estudos de IHC (Interface Homem-Computador)
mostraram que para a maioria das tarefas de comutação o limiar de
frustração é ao redor de 10 segundos. Desenhos de páginas Web que não
estão bem "afinados" à velocidade de acesso de rede de seus usuários típicos
só os frustrarão. Se seus usuários são principalmente
browsers que "surfam" a Web por conexões telefônicas a 56Kbs (ou ainda a 28.8 Kbps)
é tolice colocar enormes imagens bitmaps em suas páginas. O usuário comum não será
paciente o bastante para esperar eternamente enquanto suas imagens
carregam por uma linha telefônica. Porém, se você está construindo
uma Intranet universitária ou corporativa onde a maioria dos usuários
estará acessando seu servidor de Web a velocidade da Ethernet
você pode ser muito mais ambicioso no uso de imagens e multimídia.

Simplicidade e consistência

Os usuários não ficam impressionados com complexidade que parece
gratuita, especialmente usuários que podem estar dependendo de seu
site para encontrar informação oportuna e precisa (relacionada ao trabalho).
Suas metáforas de interface deveriam ser simples, familiares e lógicas para
a audiência se você quer uma metáfora para desenho de informação,
escolha um livro ou uma biblioteca, não uma espaçonave ou um
cenário de televisão. Os melhores desenhos de informação são aqueles
que a maioria dos usuários nunca notam.

O site do estadão é um modelo excelente de desenho de Web site.
As páginas usam muitos gráficos para navegação, aplicadas
constantemente em toda as páginas do site.
Uma vez que você conhece onde os links padrão estão no cabeçalho da página,
a interface fica quase invisível e navegação fácil.

Imagem reduzida do tamanho original: www.estadao.com.br

Para a máxima funcionalidade e legibilidade, sua página e
desenho de site deveriam ser construídos em um padrão consistente de
unidades modulares, tudo compartilhando as mesmas grades de leiaute,
temas gráficos, convenções editoriais, e hierarquias de organização.
A meta é ser consistente e previsível, de forma que seus usuários,
sintam-se confortáveis explorando seu site, e confiantes que
eles sabem achar o que eles estão procurando.
A identidade de uma série de páginas em seu site Web
dão sugestões visuais à continuidade de informação.

Os menus gráficos do cabeçalho presentes em todo o site do Estadão
criam uma interface do usuário consistente, e uma imagem sólida
da empresa:

reduzido do tamanho original: www.estadao.com.br

Até mesmo se sua página não usa nenhuma imagem, uma abordagem
consistente ao plano de títulos, subtítulos, rodapés de página, e
links de navegação para sua página inicial ou páginas relacionadas
também vão reforçar o senso do leitor de contexto dentro da organização
do seu site.

Preservar o efeito de um sistema "sem costura" de páginas
você talvez queira considerar trazer informação importante em
seu site local e adaptá-la ao seu esquema de leiaute
ao invés de usar links para enviar o leitor para outro site
(se não há nenhuma restrição por direitos autorais protegidos em
copiar a informação em seu site local).

Se você quer convencer seus usuários que o que você
oferece é preciso e seguro você terá que projetar seu
site Web da mesma maneira que cuidadosamente como
você faria com qualquer outro tipo de comunicação corporativa,
com os mesmos altos padrões editoriais e de design.
Um site que parece amador , com um desenho visual pobre
e baixo padrão editorial não inspirará confiança em seus usuários.

Estabilidade funcional em seu desenho Web significa manter os
elementos interativos de seu site trabalhando confiantemente.
Estabilidade funcional tem dois componentes que colocam as coisas no lugar certo
desde a primeira vez que você desenhou seu site, e então mantendo as coisas
funcionando calmamente com o passar do tempo. Bons sites Web
são inerentemente interativos, com muitos links para páginas
internas, e links para outros locais da Web. Como você cria
seu desenho de site você precisará constantemente conferir todos seus
links para estar seguro de que eles funcionam corretamente. As coisas mudam
depressa na Web, tanto em seu site como em todo o mundo. Você precisará
periodicamente conferir que seus links ainda estão trabalhando
corretamente, e que o conteúdo que eles tem ainda é pertinente para
suas necessidades.

Seu desenho de Web deveria oferecer constante confirmação visual e funcional
do paradeiro e opções do usuário, via
desenho gráfico, botões de navegação, ou links uniformemente colocados

Avaliação também significa estar preparado para responder
as perguntas e comentários dos usuários. Sites Web bem-projetados
sempre deveriam ter links diretos para o editor do site ou o
responsável por manter o site. Planejando este
tipo de relação "on-going", ou em curso, com os usuários de seu site é
vital para o sucesso a longo prazo do empreendimento. Ao estabelecer
uma comunicação com seus usuários você poderá receber contribuições
importantes para melhorar o seu serviço ou site.

Nem todo usuário de seu site poderá levar vantagem das imagens que
você coloca em suas páginas, e vários usuários
pode ser visualmente prejudicados, ou não podem enxergar ou enxergam
com dificuldade. Uma das belezas da Web e HTML é a habilidade para
embutir mensagens "alternadas" ("ALT" em HTML) de forma que usuários sem
capacidades gráficas ainda podem entender a função de imagens em
suas páginas. Usando softwares especialmente projetados, usuários cegos,
podem ouvir (por fala sintetizada) as mensagens alternadas que você
coloca junto com seus gráficos, e assim não vão perder completamente
o conteúdo de suas imagens e botões de navegação.
Se você estiver usando sistemas de menus gráficos para
navegação, estes menus alternativos baseados em texto serão uma
ajuda especialmente importante para usuários sem a habilidade de ver
seus gráficos.

Referências

Estadão www.estado.com.br

Apple Computer, Inc. 1992. Macintosh human
interface guidelines. Reading, MA: Addison-Wesley.

Microsoft Corporation. 1995. The windows interfaceGuidelines for software design. Redmon, WA: Microsoft Press.

Shneiderman, B. 1992. Designing the user interface:
Effective strategies for effective human-computer

interaction. 2^nd ed., Reading , Mass.: Addison-Wesley.