Não obstrua a tela com opções de navegação - manequins

> Nas opções de navegação nos sites mais tradicionais, os links para todas as páginas principais estão sempre visíveis. Um site típico inclui uma linha de links na parte superior ou na parte superior esquerda ou direita da tela com links comuns para as seções principais, incluindo a página inicial, a página Sobre nós e outras seções importantes.

Mantendo links de navegação na parte superior de cada página, torna-os fáceis de encontrar, mas entupiam o espaço de design. Adicione o seu logotipo e outros elementos de marca, links de sub-navegação e, possivelmente, publicidade e - yuck - que bagunça.

Não é de admirar que os sites de jornal sejam sempre descritos como "ocupados" e a maioria dos projetos de blog são considerados chatos. Cramming muita informação em cada página antes mesmo de começar a adicionar o conteúdo torna difícil manter as coisas interessantes.

Agora considere a abordagem que a maioria dos designers adotou para criar aplicativos para iPad. Ao projetar sites para iPad e iPhone, você pode se beneficiar da nova geração de designers de aplicativos que estão lá fora.

Uma grande variedade de aplicativos para iPad, incluindo revistas populares

com e Sports Illustrated, exibem duas áreas consistentes onde designers de aplicativos estão colocando elementos de navegação: > No canto superior esquerdo ou direito da página: Ao contrário das páginas da Web, os links de navegação na maioria dos aplicativos são visíveis somente quando você toca um ícone, como o ícone de casa na parte superior esquerda, como mostrado na revista Honeybee.

• Na parte inferior da página:
  Mais uma vez, um conjunto opcional de links de navegação aparece apenas quando você toca na parte inferior da tela, como mostrado nesta figura.

  

• Esta nova prática de design poderia ser uma nova maneira útil de projetar páginas da web, bem como aplicativos. O design mostrado nas figuras foi originalmente criado como um aplicativo para o iPad. Foi projetado usando as novas ferramentas de publicação digital da Adobe, que são ideais para criar comparações interativas e e-books aprimorados. Mas depois que o design foi concluído com as ferramentas de publicação digital da Adobe, que criam automaticamente os links de navegação mostrados, não havia nenhum motivo para não fazer o mesmo em uma versão da página da web.

  

Então, o mesmo design foi recriado em HTML e CSS e testou-o no navegador da Safari.

Voilà!

Esta abordagem da navegação funciona muito bem na web móvel, e deixa muito mais espaço para criar desenhos de grande aparência que preencham a tela no iPad. Mesmo na versão da página da Web deste site, o menu suspenso mostrado aparece apenas quando você toca no ícone Início. O menu desaparece assim que tocar em um link da lista.