Daniele V Silva - Webdesigner, desenvolvedor front-end, programador de interfaces, Gerente de projetos web, consultora e freelancer

via Instagram http://ift.tt/1wOdFrt

Fondue night

A navegação atípica – formas diferentes de fazer a mesma coisa

Publicado em , por , na categoria Elementos e técnicas, Webdesign

A navegação Atípica não é exatamente um elemento de desenvolvimento, algo que você possa “pegar e aplicar”, é uma questão de conceito, de pensar fora do grid e quando bem usado se torna um dos estilos mais poderos.

É uma forma de aproximar o usuário da idéia que você deseja transmitir, pode ser uma outra forma de interagir com o produto, de torná-lo familiar antes que o seu cliente o conheça realmente.

Para isso é preciso que exista uma relação muito firme entre o produto e o estilo da navegação, como é o caso do Jornal do Brasil On-line, ele trabalha com um jeito bastante comum entre sites de revistas e jornais para exibir o conteúdo: efeito de “página virando”.

Mesmo que, na maioria das vezes o resultado seja péssimo pela falta de recursos que o Fred já citou em um dos seus posts no usabilidoido, a intensão é boa.

Até hoje só conheci um projeto que conseguiu um efeito real com essa ideia e está a venda no TemplateMonsters.

Embora a navegação atípica tenha todo o poder de caracterização que eu já citei, também existem desvantagens:

  1. Em sites com uma navegação convencional os links são simples e intuitivos, enquanto que uma navegação atípica pode complicar a vida de usuários leigos. Na maioria das vezes ela exige um curto (ou não tão curto) processo de aprendizagem, obrigando o usuário a entender o conceito antes de começar a clicar, já vi até casos absurdos onde foi desenvolvido um pequeno tutorial sobre como navegar. Ora, se o usuário não é capaz de descobrir sozinho o que procura em um site é porque tem alguma coisa errada aí…
  2. Ao mesmo tempo que esse conceito pode criar uma atmosfera de interatividade prendendo a atenção do usuário e fazendo com que a experiência seja inovadora e divertida, é preciso ter em mente que o publico nem sempre está ali para se divertir, algumas vezes (ou na maioria das vezes) ele procura por uma informação clara e rápida.
  3. No caso de leitores de tela, se torna muito difícil navegar com em uma aplicação atípica e se for em flash, então é impossível.
  4. Uma navegação atípica pode se tornar lenta, exigindo que o usuário pense mais do que o gostaria para cada ação que for executar. Isso tornaria a visita cansativa ao invés de divertida.

Penso que o desafio aqui está ver as alternativas, e entender como as pessoas “do outro lado” fazem as coisas. Entender o que elas esperam e o que você pode oferecer de inovador sem perder a qualidade.

Uma coisa com certeza você perceberá: a grande maioria dos projetos com navegação fora do grid foram desenvolvidos em Flash. No entanto, acredito, que a maioria deles poderia ter a sua navegação perfeitamente adaptada para o Html/Css/javascript. Logicamente não falo das animações, mas do estilo de navegação.

Mas se o flash e o html/Css garantem um resultado muito parecido, porque escolher Html/CSS?

De todos os motivos que consigo pensar, o mais relevante é a indexação nos mecanismos de busca. Todos sabem que o resultado da indexação do flash é muito precário, mesmo quando se trata de mecanismos inteligentes como o google.

Hoje em dia sabemos que é desnecessário construir um site todo em flash apenas para criar apenas uma navegação por abas, por exemplo. E apesar de eu ser bem contra o flash (bem contra mesmo) vou citá-los aqui pois tenho esperança de que esses casos sirvam de exemplo para empurrar os designers de html/css para fora do grid e impulsioná-los a incorporar algumas dessas técnicas em seus projetos.

Sem dúvida, o melhor é pensar na mensagem que você deseja passar e no público que vai recebê-la e então decidir qual a forma adequada de servi-la.

E por mais criminoso que isso pareça, nós que trabalhamos com html/css temos que dar o braço a torcer e reconhecer a qualidade desses trabalhos em flash.

Espero que encontre aqui boas ideias para seus novos projetos.

Exemplos de sites

screenvader.comE esse? É uma coisa bem esquisita, mas é gostoso de navegar… É o tipo de site que você não deve acessar se estiver procurando alguma coisa, porque fica dependendo da sorte… As vezes alguma coisa aparece
scriptographer.comNão, eu não perdi a noção das coisas… Esse exemplo LEMBRA um pouco a navegação do anterior porem é feito em html/css/favascritp. com janelas que sobropoem as outras conforme são ativadas
templatemonster/6855Compare esse exemplo com o próximo e veja um exemplo bem claro de um projeto em flash que poderia seradaptado para html/css/javascript.
moofx.mad4milk.netComo eu falei, é uma navegação em html/css/javascript bem interessante que algumas pessoas, desnecessáriamente, fazem em flash.

Exemplos de Uso

9 opiniões sobre “A navegação atípica – formas diferentes de fazer a mesma coisa”

  1. Daniella disse:

    Muito legal o post é a segunda vez que entro aqui. Estava procurando referência de navegação diferente e achei seu post. Meu desafio era achar proposta diferentes utilizando html e css.
    Abraços,

  2. joao flavio disse:

    muito bom este seu artigo.
    show de bola.

  3. Daniel Farias disse:

    Muito legal!!! Principalmente o Moofx. Parece ser em flash mas é todo em Java/html/css!!! Muito bom!

  4. danielevsilva disse:

    Realmente, muito legal esse site, vai entrar na segunda parte desse artigo.
    Eu tive uma dificuldade imensa de encontrar bons exemplos de navegação átipica brasileiros, se você tiver outros serão muito bem vindos
    Obrigada

  5. Micox disse:

    Ótimo artigo Daniela.

    Não é necessário ir atrás de sites gringos pra ver coisas boas não.
    Veja só a simplicidade e beleza deste site feito só com JS/CSS e HTML: http://willgm.com/

  6. Great site loved it alot, will come back and visit again.

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *