Desenvolvimento

31 jan, 2008

Documentação de Projetos Web – Arquitetura da Informação

Publicidade

A definição teórica de arquitetura da informação pode ser encontrada Arquitetura da informação, porém vou tentar explicar de uma maneira mais clara o que é, e como desenvolver uma boa arquitetura da informação para um projeto web.

Arquitetura da informação é a ciência que estuda a disposição dos elementos na página, a estrutura de navegação e o conteúdo das páginas. Portanto, fazem parte dela, além de outras coisas, o mapa do site, a descrição das informações que estarão contidas na página e o wireframe.

Dessas três partes da arquitetura da informação, irei falar nesse artigo das duas primeiras, pois o wireframe merece um artigo inteiro só pra ele, que virá mais para frente.

Descrição das Páginas

Levando-se em consideração que o briefing já foi feito, e que já se sabe o escopo do projeto já é possível definir o que cada página deve conter em termos de informação.

Vamos usar como exemplo o website de uma agência de produção (web e DTP), assim, vocês que já estão pensando em criar o seu, já podem usar como exemplo.

Uma agência cria um website geralmente com o objetivo de divulgar o seu trabalho de produção e oferecer formas de contato para que possa ter os seus serviços contratados. Logo, um site deve conter uma página inicial, uma seção de contato, uma de portifólio, uma seção com a descrição dos serviços prestados por essa agência e seção página “sobre”.

Nesse ponto temos que lembrar que uma seção não significa uma e somente uma página. Uma seção pode conter mais de uma página. Vamos ao exemplo do portifólio. A agência em questão trabalha com serviços de web e DTP, portando o portifólio pode ser dividido em algumas páginas como:

  • Web
  • Identidade Visual
  • Publicidade
  • Impressos

Cada uma dessas páginas contém imagens dos projetos já realizados e uma breve descrição sobre cada um deles, e no caso de projetos web um link externo para o projeto pronto.

Já a seção “sobre” será composta por somente uma página, com informações sobre a empresa, fundação, crescimento no mercado, principais clientes, etc.

A página de contato terá um formulário de contato para que os visitantes possam solicitar serviços ou informações, e a página de serviços também será composta de uma página, só que dividida em 4 partes, as mesmas partes do portifolio, com descrições sobre os serviços prestados, tecnologias utilizadas para cada tipo de serviço, etc.

Ficamos então com a página inicial em aberto. Essa é a abertura do site, a primeira página que um usuário vê quando acessa o site diretamente, o que não significa que deve ser supervalorizada e que as outras páginas sejam deixadas de lado. Nem sempre um usuário acessa um site digitando o endereço na barra do navegador. Eles também podem acessar seu site através de links em outras páginas que linkem direto para uma página secundária do seu site, e por isso deve se ter o mesmo cuidado com todas as páginas do site.

Mas voltando ao conteúdo da página inicial, já é sabido que ela deve conter um menu de acesso às demais páginas do site. Esse deve estar contido nas demais páginas do site, para que o usuário tenha acesso fácil de qualquer lugar, para qualquer outro lugar do site, fazendo com que a navegação flua.

Além do menu, seria interessante para uma agência mostrar o projeto atualmente em andamento, ou ao menos o mais importante em termos de marketing de todos os que estão em andamento, uma área com notícias rápidas sobre a área de atuação dessa empresa também é interessante.

Feito isso, conseguimos descrever todas as páginas do site. Resta agora organizá-las hierarquicamente.

Mapa do Site

O mapa do site é uma estrutura hierárquica das páginas contidas no site feita após a etapa de descrição das páginas, um serviço web gratuito que ajudo a desenvolver os mapas de sites é o WriteMaps, o mapa do site do exemplo acima ficaria representado da seguinte forma:

Mapa do Site (Hierarquico)Mapa do Site (Hierarquico)

Repare que não é um diagrama de difícil entendimento. As páginas estão dispostas de maneira hierárquica como em uma árvore genealógica, mostrando quais serão as páginas do projeto e qual o fluxo de navegação desse site.

Existe também uma outra maneira de representar o mapa do site, utilizando uma estrutura de tópicos dessa maneira:

Mapa do Site (Tópicos)Mapa do Site (Tópicos)

PS: utilizando o WriteMaps, é possível escrever a descrição das páginas no próprio elemento do mapa do site que representa a página em questão

Com isso terminamos esse artigo. Em breve farei uma pausa na arquitetura da informação para falar sobre o Banco de Dados, mas em seguida volto com o wireframe.