Realizei uma análise de navegação e usabilidade do site do Vera Cruz. Fiz um levantamento dos sites atuais, identifiquei erros e apontei soluções para promover uma arquitetura mais funcional.

2. Análise do site baseado em conceitos universais e
convenções de usabilidade.

4. Barra de localização: Busca: Destaque principal:
Não apresenta um campo É necessário estudar o tamanho das
• Home Não apresenta barra de
localização indica para o de busca para o usuário. Isso áreas de destaque. Nessa área por
usuário que ele está na poderia ajudá-lo a localizar o exemplo o conteúdo está todo em
Home. conteúdo com mais precisão. Flash e demora muito para aparecer.
Menus:
Não está claro qual é
menu de contexto do site. Conteúdo:
O usuário tem que dar As áreas devem ser
muitos cliques para ter Repensadas e quantidade de
acesso ao sublinks dos animações acontecem ao
Menus. mesmo tempo atrapalhando a
leitura do usuário
Área de Destaque: Interação:
A área de destaques Oferece pouca interação com o
Mesmo tempo. É necessário Usuário.
ter uma hierarquia visual
mais clara, não está claro
qual é conteúdo que estar
em destaque.
Formas Importante: a home deve responder a quatro
Marca:
É necessário repensar questões principais dos usuário:
O logo está sendo replicado em
aplicação do logo e
diversos lugares em diversas
repensar as formas 1 – O que isso?
cores. Isso pode descaracterizar
triangulo e retângulo e 2 – O que posso fazer aqui?
a identidade visual da marca. Ela
quadro 3 formas 3 – O que eles tem?
não de variar muito deve ser
diferentes em vidência. 4 – Porque eu devo estar aqui e não num outro lugar?
preservada.

5. • Home
Fotos em destaque: As fotos aparecem em destaque numa grande área do site, mas não apresentam legenda,
não fica claro o que elas representam: Alunos, Projetos, Eventos?
Maior aproveitamento das imagens: As fotos poderiam ser
visualizadas numa galeria de fotos da escola. As fotos são
Interessantes e isso provar interesse das pessoa em conhecer
melhor a escola. Com um simples clique poderia haver a
possibilidade de ir direto para galeria de fotos.

7. usuário
Conteúdos espalhados:
Espaços em branco:
Os links podem apresentar seus respectivos
O espaço em branco dá uma sensação que não
conteúdos em novas páginas ou em área que
há conteúdo suficiente ou mesmo pode ser
estejam próximas e coerentes que facilitam a
interpretado como um erro. Algo que não oi
leitura do usuário. O usuário não pode procurar o
concluído e deve ser evitado.
conteúdo ele dever ser acessível e intuitivo.

12. Menus:
As áreas do lateral direita
e lado esquerdo estão em
branco. A timeline está numa
nova janela o ideal é deixar
Sempre num área do site.
Para que o conteúdo fique
mais conectado. Deixar
apenas conteúdos periféricos
para ser apresentados em
novas janelas.

13. Menu principal
Deveria permitir o acesso para todas as páginas
principais e suas respectivas subpáginas.
De ser concebida uma novo estrutura para organizar e
agrupar as demais páginas dentro de um contexto
Coerente com o grupo principal de informações ou
Ausência de Referência serviços da escola.
Onde indica que está é a Home
ou página inicial do site?
Menu contexto
Apresenta um menu que se desdobra
e exibe os sublinks correspondentes
ao menu principal selecionado.
Ausência do Submenu
Não aparece só quando o usuário
acessa o conteúdo de uma página
interna. Deve obedecer a hierarquia
do menu principal e seguir uma
lógica que permite a fácil associação
do conteúdo a exibir, com sua ordem
Hierárquica.

14. Ausência de localização da página
Nenhuma página mostra o “Migalhas de pão” , o caminho de localização da página de onde usuário está. Ou seja, é necessário mostrar
para o usuário o caminho que ele percorreu e onde e ele está. Na tela ao lado para visualizar o conteúdo foi necessário usar a barra d
rolagem e o usuário perde a referencia de onde está. Segundo as convenções de usabilidade de Steve Krug define algumas boas
práticas das migalhas de pão se caracterizam por:
Serem colocadas no Alto:
Parecem funcionar melhor se forem apresentadas acima de todo o resto. Elas ficam literalmente na margem parecendo um acessório.
Quando ficam muito abaixo do conteúdo do site podem confundir com a navegação.
Usa o sinal entre níveis:
O uso do sinal “>” é bem adotado no mundo inteiro, “:” ou “/” funcionam, mas o sinal “>” é mais satisfatório.
Letras pequenas:
Para deixar claro que se trata de um acessório para apoiar o usuário não deve ser o destacar mais do que o conteúdo do site.
Colocar em negrito o último item:
O último item da lista deve ser o nome da página atual e deixá-lo em negrito dá o destaque necessário.
* Steve Krug é um dos grandes pesquisadores de navegabilidade autor de diversos livros incluindo “Não me faça pensar” (2001)

15. Para demonstrar um exemplo de aplicação desse conceito de navegação e usabilidade exploramos um exemplo baseado no site atual da
escola Vera Cruz. Essa imagem é de um conteúdo que foi acessado do item comunidade.

16. Agora é possível observar o exemplo da mesma página, mas com aplicação das “migalhas de pão” ou seja com o caminho que o usuáro
Percorreu. Se ele desejar voltar a página anterior ele poderá clicar nos itens apresentado na barra da migalha de pão sem se perder. Outro
Ponto interessante é que nesse exemplo o usuário sabe onde ele está.

17. Conflito navegação dos Menus
Os itens de menu estão muito próximo e podem
Confundir o usuário. O site apresenta 3 Menus isso
em áreas diferentes isso confunde o usuário o ideal é
que a navegação
Ausência do Submenu
Não aparece só quando o usuário
acessa o conteúdo de uma página
interna. Deve obedecer a hierarquia
do menu principal e seguir uma
lógica que permite a fácil associação
do conteúdo a exibir, com sua ordem
Hierárquica.

18. Destaques e divisões
A hierarquia de um
conteúdo não precisa se
segmentado por cores
existem diversos
elementos que podem se
utilizados visualmente
para dividir uma sessão.
Com site apresenta muitas
cores não é possível
identificar a cor da escola.
Qual é cor que representa
a escola?

19. •
•
•
•Deixe
•

20. serviço Temporariamente Indisponível: mensagem de serviço
indisponível.
Erro de servidor: mensagem de servidor não encontrado quando
o site é acessado com outro navegador.
Loading (carregar o site):
Demora para na área de
grande destaque no site. O
usuário não pode esperar
mais do que 2 seg. Caso Erro de servidor: mensagem de plugin do Flash. Deve
contrário ele pode desistir de ter uma instrução para o usuário baixar o plugin do Flash.
ver o conteúdo do site. É Mesmo assim o site está
necessário mostrar a
contagem para o usuário
saber o quanto falta para
carregar o site.