english   italiano   español
 
4 June 2012
  • Imprimir   | EN| ES

    Design De Navegação Web: Como Dar Instruções E Direções Claras Aos Seus Leitores

    Como você pode ajudar os seus leitores a encontrar o que desejam no seu site? Como facilitar a necessidade de saber onde clicar ou para onde olhar quando querem alguma coisa? As instruções de navegação, também chamadas de design da interface e da navegação para o usuário, baseiam-se em texto e elementos visuais que podem ajudar os visitantes a compreender facilmente onde clicar ou onde procurar para encontrar o que precisam. Como tal, estes sinais de navegação e instruções visuais podem representar uma grande diferença na conversão de visitantes temporários em clientes e fãs de longa duração. Neste artigo, aprenda quais são os elementos básicos fundamentais em que prestar atenção para ter um design de navegação eficiente com boas instruções de navegação para os seus usuários.

    design_navegacao.jpg
    Crédito da foto: António Nunes

    As pessoas tem anseios que desejam realizar, seja fazer uma compra, encontrar uma receita, ou aprender algo novo.

    Inerentes a muitos designs de páginas web são, portanto, informações para ajudar o usuário a executar uma ação.

    Em poucas palavras... Este tipo de sinais visuais devem normalmente fornecer instruções para ajudar os usuários a saber o que fazer.

    Estas instruções guia os olhos e as mentes das pessoas para fazer suas buscas no lugar certo e tomar as medidas adequadas para o que precisam.

    Neste artigo, Connie Malamed identifica e explica quais são os aspectos mais críticos aos quais prestar atenção no esforço de acrescentar ou reforçar as mensagens de navegação do usuário e as instruções para ajudar os leitores a encontrarem o que precisam ou iniciar uma ação específica online.

    Em particular, algumas das principais questões destacadas neste relatório mostram a importância de diversos fatores únicos em projetar instruções de navegação eficazes para o usuário:

    • Maximização da segmentação do público
    • Controle de informação em excesso
    • Estilo de redação
    • Melhora na acessibilidade
    • Teste de relevância

    Não deixar nada ao acaso ou à própria sorte, mas planejar como oferecer uma navegação eficiente para os leitores e clientes que procuram completar uma tarefa específica no seu site é um investimento valioso no qual qualquer editor de conteúdo web profissional, não apenas de um blog, que oferece outros produtos e serviços online deve prestar muita atenção.

    Aqui está o artigo completo em detalhes:

     

     

    A Letra Miúda: Redação De Instruções Para A Interface Do Usuario

    por Connie Malamed



    Instruções Para A Interface Do Usuário: O Que E Para Que

    user_interface_design_instructions_question-mark_id3358431_size1.jpg

    O comportamento de uma pessoa na internet é muito focado em seus objetivos.

    As pessoas tem coisas que querem realizar, seja fazer uma compra, encontrar uma receita, ou aprender algo novo.

    Inerentes ao design de muitas páginas web são, portanto, as informações para ajudar o usuário a executar uma ação.

    Por exemplo, se você deseja criar um botão clicável para alcançar um objetivo desejado (por exemplo, colocar um item em um carrinho de compras), sombrear o botão faz com que ele apareça em destaque e ajuda o público a entender que aquilo é um objeto clicável .

    Este tipo de sinal visual normalmente instrui os usuários a saberem o que fazer a seguir.

    Tais instruções guiam os olhos e as mentes das pessoas para fazerem suas buscas no lugar certo e tomarem as medidas adequadas de acordo com o que precisam.

     





    A Importância Dos Modelos Mentais

    user_interface_design_instructions_mental_models_id3403501.jpg

    Projetar e redigir as instruções que fazem parte da interface do usuário é uma arte e uma ciência, que envolve elaboração e habilidades de design e uma compreensão de como as pessoas usam os modelos mentais.

    Um modelo mental é uma representação interna de como as coisas funcionam. É um conceito amplo de ações, causas e seus efeitos.

    As pessoas aplicam seus modelos mentais a novas situações, assim não precisam reaprender tudo do zero. Isso nos ajuda cognitivamente.

    Através da experiência, os usuários desenvolvem modelos mentais de como os diferentes tipos de sites funcionam.

    Sabem os tipos de ações a serem tomadas em um site de comércio eletrônico em relação aos tipos de ações que operam em um site de fotografia.

    As pessoas aplicam os seus modelos mentais com novos desenvolvimentos, para que não precisem reaprender tudo do zero. Isto significa que elas aplicam o seu estereótipo ou modelo mental de sites similares ao seu quando navegam por ele.

     




    Por Que É Importante Ter Instruções Claras Na Interface Do Usuário

    user_interface_design_instructions_attention_sign_by_bastique.jpg

    Esta é uma das principais razões pelas quais as instruções na interface do usuário são tão importantes.

    As pessoas tem uma experiência desagradável quando seus modelos mentais são imprecisos ou incorretos. Isso causa:

    • frustração,
    • erros do usuário and
    • equívocos na hora de alcanzar uma meta.

    Um usuário frustrado pode procurar para outro site que seja mais fácil de usar.

    Uma escrita fácil de compreender, as instruções e uma apresentação estética podem evitar esses problemas.

    Uma boa instrução guia os visitantes do seu site, mesmo que os seus modelos mentais sejam imprecisos ou enganosos.

    Portanto, aqui estão algumas diretrizes de como redigir instruções na interface do usuário que organizei ao longo dos anos de aprendizagem sobre projetos online, jóias da pesquisa de usabilidade.

     





    Conheça O Seu Público Antes

    user_interface_design_instructions_measure-your-audience-by-siliconvalleywatcher.jpg

    Quando você conhece as características do seu público, pode imaginá-los e dirigir suas palavras a eles.

    A menos que seus convidados sejam um grupo inteligente e homogêneo, o melhor é supor que vão precisar de alguma orientação para atingir seus objetivos.

    Você deve pensar além das características óbvias de uma audiência e considerar as sutilezas de como seus leitores podem perceber e reagir as suas palavras.

    • Eles vão entender as gírias?
    • E o seu sendo de humor?

    Observe o exemplo anterior.

    As instruções divertidas sobre CAPTCHA só poderiam ser compreendidas por um público sofisticado e experiente.

    Usuários inexperientes e sem conhecimento de inglês não tem idéia de que "Comprove que você é humano" significa escrever os caracteres alfanuméricos no campo pedido.

    captcha-instructions.jpg

     





    Combater A Informação Excessiva

    user_interface_design_instructions_too_much_information_by_spaciousplanet_34112286541427770.jpeg

    Encontrar o equilíbrio é sempre um problema.

    Ao redigir as instruções de interface de usuário, tente incluir detalhes suficientes para que os usuários saibam exatamente o que fazer, mas não com tantos detalhes que se torne difícil processar informações.

    As pessoas só pegam pequenas quantidades de informação por vez.

    Você pode dar uma mão a essa situação redigindo instruções em linguagem simples, que ajudarão os visitantes a realizar suas tarefas com eficiência e rapidez.

    Tente usar frases curtas quando possível.

    Por exemplo, essa frase poderia ser facilmente dividida em duas: "Clique no botão Adicionar ao carrinho e, em seguida, clique em Check-out na parte superior da tela.

    O presente artigo pretende fornecer dicas de como ser breve, como no exemplo acima, mas muitas vezes é melhor fazer isso quando o processo de redação já está concluído.

    No final, você olha para o que escreveu a partir de uma perspectiva diferente. É mais fácil ver as informações que são irrelevantes, porque acrescentam confusão à razão.

    Remover detalhes estranhos e supérfluos reforça a cópia final.

    No exemplo a seguir, a comunicação poderia ser mais eficaz com menos palavras.

    Não há necessidade de sacrificar a sua personalidade em benefício da clareza. Com equilíbrio, você pode ter ambas.

    user-interface-instructions.jpg

     





    Redija As Suas Instruções De Modo Efetivo

    user_interface_design_instructions_directions_toilette_22852320.jpg

    A tarefa de escrever com precisão implica uma discriminação sutil entre as palavras com significados semelhantes.

    A pesquisa sobre usabilidade mostra que as pessoas escaneiam uma página web, em vez de lê-la. Portanto, o texto deve comunicar de forma eficaz, se alguém está na página por acaso e quase sem prestar atenção.

    • Use palabras que promovam clareza. "Selecione uma data" está bem, mas "Clique na data" fica mais preciso.
    • Evite a dupla negativa, como "Não quero cancelar o meu registro." E também,
    • Evite usar gírias e expressões idiomáticas que algumas pessoas não entenderão, como siglas e termos técnicos.

    Falando de precisão na escolha das palavras, quando você olha no menu abaixo, entende a diferença entre a procura e a navegação?

    [Nota: Existe um debate sobre qual é o termo mais adequado entre "selecionar" ou "clicar" para as pessoas que usam tecnologia.]

    choosing-words.jpg

     





    Voz Ativa Vs. Voz Passiva

    user_interface_design_instructions_thinking_by_ronen.jpg

    A voz ativa é nítida e limpa e fará as pessoas passarem para a ação.

    A voz passiva faz bocejar os leitores.

    Compare essa frase em duas vozes:

    • Activa - "Clique no link para procurar um artigo de jornal. "
    • Pasiva - "O link do jornal deve ser clicado quando você quiser procurar um artigo."

     





    Como Dar Instruções Claras No Design Da Navegação

    user_interface_design_instructions_pencil_by_eyebiz.jpg

    O design das instruções na interface do usuário pode ser um desafio.

    Você deve determinar qual é o lugar de cada elemento, visualmente e de acordo com a hierarquia da informação. Mesmo tendo que ser identificados pelos usuários, não devem dominar a página. E como um elemento de design, devem se encaixar perfeitamente com o ambiente circundante.

    Resumindo: Planeje o texto de instruções durantes as fases iniciais do design.

     





    1) O Espaçamento Vertical

    user_interface_design_instructions_vertical_spacing.jpg

    Se as instruções tem mais de uma linha, é importante que os leitores saibam que devem vir juntas.

    O leading (ou espaçamento vertical) entre as frases relacionadas deve ser grande o suficiente para permitir a legibilidade, mas pequeno o suficiente para mostrar as frases associadas.

    Quando há várias etapas, é preciso manter cada uma delas separada para aumentar o espaçamento entre as linhas. O número de instruções complexas ou é percebido como tal.

     





    2) Tipo De Letra

    user_interface_design_instructions_legibility_typeface_by_psychology_wichita_edu.gif

    Considere o tipo, um elemento de design.

    Use uma fonte e um estilo consistente com o resto do design do site.

    Considere o tamanho da fonte. As instruções devem ser lidas por pessoas de todas as idades.

    Evite texto em bitmap sempre que possível, de modo que os usuários possam ampliá-lo, se necessário.

     





    3) Gráficos

    user_interface_design_instructions_arrow_signs_26549014.jpg

    Sim, às vezes é quase impossível dizer alguma coisa com palavras.

    Um gráfico fornece suporte e torna compreensível o texto, como esta explicação de como encontrar o número de conta em uma revista.

    ui-with-graphic.jpg

     





    4) Estilo De Texto

    user_interface_design_instructions_love_letter_rose_text_style19098833.jpg

    Não tem problema agregar um pouco de personalidade nas instruções de interface do usuário e mensagens do sistema. Pode ajudar os visitantes a ter uma experiência agradável e bem-humorada.

    Apenas certifique-se de que sua mensagem nas entrelinhas não seja interpretada como uma forma de desprezo.

    Por exemplo, as instruções abaixo ajudam os visitantes a se sentirem melhor. Após a leitura da mensagem, não se sentem chateados por não guardar suas senhas onde não possam ser encontradas.

    humorous-ui.jpg

     





    5) Acessibilidade

    user_interface_design_instructions_mobile-messaging-with-nimbuzz_2.jpg

    É importante que as instruções tenham letra pequena, mas que ainda possam ser lidas por pessoas que tem dificuldade com letras pequenas e / ou dispositivos utilizados para ler a tela do computador.

    Aqui estão algumas diretrizes de acessibilidade básicas para redigir instruções para a interface do usuário:

    • Evite o uso de texto gráfico para que possa ser ampliado (como visto no ponto 2 acima);
    • ofrece alternativas de texto para contenido gráfico para que pueda ser traducido a otras formas, como el Braille, y
    • Separe claramente as instruções do fundo da página para que possam ser vistas facilmente.

    Além disso, usar hiperlinks contextuais não faz sentido se você não puder ver a tela.

    Por exemplo, um link que diz "instruções para usar este formulário" é melhor do que com um "clique aqui."

     





    6) Teste

    user_interface_design_instructions_scientist_19094169.jpg

    Teste as instruções com membros do público, pessoas fora do seu escritório e sem conhecimento prévio de que estão fazendo.

    1. Observe uma ou mais pessoas realizando a tarefa para a qual você redigiu aquelas instruções específicas.
    2. Note qualquer dificuldade que tenham e revise as instruções.
    3. Repita o processo até que as pessoas cumpram a tarefa sem problemas.

     





    Conclusão

    Você pode sesurpreender com o tempo e esforço necessários para redigir instruções eficazes para a interface do usuário. No entanto, pode ser um dos investimentos mais importantes a considerar na concepção de uma interface de usuário bem-sucedida.

    Através da simplicidade de instruções compreensíveis, você pode conseguir por si só - a assistência aos usuários, o tom certo e manter a sua personalidade, o que mostra que você se importa com seus leitores.




    Sobre Connie Malamed

    connie_malamed_thumbnail.jpg

    Connie Malamed é a autora de Visual Language For Designers: Creating Graphics That People Understand. Ela escreve regularmente para Understanding Graphics e é diretora de Connie Malamed Consulting. Connie dá consultorias, apresentações e escreve sobre a interseção da psicologia cognitiva, comunicação visual e aprendizagem.




    Créditos das fotos:
    A Importância Dos Modelos Mentais - Ktsdesign
    Instruções Para O Design Da Interface Do Usuário: Conheça O Seu Público Antes - SiliconValleyWatcher
    Instruções Para O Design Da Interface Do Usuário: Voz Ativa Vs. Voz Passiva - Ronen
    Instruções Para O Design Da Interface Do Usuário - Jesper Noer
    Tipo De Letra - Wichita State University
    Exemplos - Connie Malamed
    Demais Imagens - Clipart

    Connie Malamed -
    Reference: Understanding Graphics [ leia mais ]
     
    Comentários dos leitores    
    blog comments powered by Disqus

     

     


     

    Feed RSS de Notícias Diárias

     

     

    Curated by

    Publisher MasterNewMedia.org - New media explorer - Communication designer

     

     


    Real Time Web Analytics