Usabilidade é um termo usado para definir a facilidade com que as pessoas podem empregar uma ferramenta ou objeto a fim de realizar uma tarefa específica e importante. A usabilidade pode também se referir aos métodos de mensuração da usabilidade e ao estudo dos princípios por trás da eficiência percebida de um objeto. (ver definição completa em: pt.wikipedia.org/wiki/Usabilidade)

O seu website deve possuir um layout simples, de fácil interpretação e acesso à informação. O visitante, quando entra em alguma página, scaneia o site rapidamente a procura da informação que ele deseja (ver artigo sobre CopyWriting), se em pouco tempo ele não encontra, ele irá embora e talvez nunca mais volte. Muitas vezes utilizamos sistemas de busca em nossos sites para que o visitante não fique procurando o que deseja. Caso ele não encontre pelo sistema de busca, ele já entende que aquela página não possui o que ele está procurando. Ele irá sair e provavelmente não voltará novamente. Mas caso encontre, ele permanecerá (pelo menos por alguns instantes a mais) em seu site e é nessa hora que começa a guerra visitante x usabilidade.
Se o seu site tem uma boa interface, uma boa navegação, um conteúdo claro e simples, existe uma chance de você conquistar esse visitante, mesmo que o assunto não seja aquele que estava sendo procurando inicialmente (isso acontece comigo com certa frequencia, por sinal). Interfaces complexas, com títulos de difícil interpretação e assimilação confundem o usuário, fazendo com que ele desista de procurar o que deseja ou que não se interesse pelo assunto e vá procurar outro site que seja mais simples de se encontrar o que ele procura.

Por aí ja deve ter dado pra sentir o drama, né? Usabilidade é um conhecimento que todo designer deve ter. Layouts aplicados com essa preocupação são melhores, mais fáceis, mais rentáveis e muitas vezes (mtas mesmo – mas isso é questão de estilo e pauta pra outro post ) mais bonitos.
Eu fiz uma lista com algumas dicas de como melhorar a usabilidade de seu site ou de seus layouts, veja:

1. Copywriting

Sempre faça uma boa descrição do que se trata o site para que o visitante, na hora que entrar, já saiba o tipo de conteúdo que será encontrado ali para que ele não perca tempo tentando descobrir. Mas lembre-se, Copywriting é uma parte muito importante quando o assunto é usabilidade, por dois motivos: 1) facilidade de encontrar o item desejado; 2) prender o visitante; Um bom copywriting realmente prende o visitante, mesmo que o assunto não seja o procurando inicialmente. Para entender melhor como o copywriting funciona, leia um artigo (traduzido por mim) sobre o tema neste link.

2. Facilidade de navegação

Certifique-se de que seu site possui uma fácil navegação (peça pra algum amigo – de preferencia que não entenda do assunto – que navegue em seu site) e verifique se haverá dificuldade de interpretação dos links, de navegação e etc. Nestes testes, sempre acabamos mudando alguma coisa.

3. Páginas leves

Se o seu visitante tem uma conexao dial-up, por exemplo, ele demorará muito para carregar uma página que possui muitas imagens, animaçõe e etc. Então, otimize o máximo que puder o tamanho de suas páginas. Sites que demoram para serem carregados, mesmo quando se tem uma conexao banda larga, irritam seus visitantes e eles, com certeza, irão embora sem nem ver a sua “obra”. Otimização SEMPRE (que possível, claro)!

4. Evite músicas, vídeos e animaçoes na página inicial

Estes recursos são ótimos e muito úteis, mas quando usados da meneira correta. Imagina o seu usuário ter que carregar uma animação 3D sempre que tiver que carregar seu site? Já imaginou o dilema? E musica? Já pensou que ele pode estar acessando a sua página às 3h da manha de uma quarta-feira e o som não está baixo? Posso listar uma infinidade de problemas que estes recursos (chatos) podem causar a seus usuários e fazer com que eles não voltem, ou pelo menos demorem bastante. Mas se mesmo assim vc não vê outra alternativa e tem que colocar algum destes recursos em seu site, NUNCA se esqueça que: se houver música, o botao OFF deve estar visível a 10mil anos luz de distância; Se houver vídeos, o botão de STOP deve estar visível ou pelo menos seja simpático e não inicie o video automaticamente; Se houver animações, a opção “pular introdução” é uma ótima saída.
Você não vai querer que seus visitantes tenham aversão ao seu site, né? Então atende para esta dica.

5. Usar os standards de design a que os usuários estão habituados

Todas as páginas de Internet têm um conjunto de regras que convém obedecer, como por exemplo: sublinhar links, permitir sempre o retorno à página principal ou ter menus de navegação e muitas outras “regras”. Quando isso não acontece os visitantes ficam confusos, mas claro que isso é muito relativo. Ele pode variar conforme a usabilidade do seu site mas é uma preocupação que deve estar sempre presente durante a criação e desenvolvimento. Nunca se esqueça disso!

6. Escrever o conteudo do site sem erros ortográficos

Um erro ortográfico pode indiciar que não houve muito cuidado na preparação do site. Se tiver muitos erros ortográficos e frases mal redigidas, parecerá que o site é pouco profissional e terá pouca credibilidade. E não é isso que queremos, né? Então tenha sempre um português, no mínimo, bom. Pegue corretores ortográficos (tipo, word) ou um amigo para corrigir seus textos. É uma boa saída para que fugiram das aulas de português.

7. Escrever o texto de forma legivel e com uma dimensão adequada

Para garantir uma boa usabilidade, o texto deve ser escrito com letras não mto grandes e legiveis. Deve também usar cores que permitam uma leitura correta do texto (um bom contraste ajuda muito – mas cuidado com os daltônicos!). E não se esqueça das pessoas com problemas de visão , preocupe-se em construir seu site onde seja possível se alterar o tamanho da fonte pelo browser sem que haja quebras no layout.

8. Restringir acesso à informação

Evite restringir o acesso ao conteúdo com senhas. A maioria deles não fara um cadastro em seu site só para continuar lendo um artigo. Caso isso seja necessário, mostre ao seu usuário que ele terá outros benefícios. E ainda sim, apenas as pessoas realmente interessadas sobre o tema do seu site farão o cadastro.

As dicas encontradas aqui não são apenas para se ter um bom layout mas também para se ter uma boa navegação. Elas são importantes e devem estar presentes desde a criação do layout até o desenvolvimento. Nunca se esqueça que seu site não foi feito apenas para você e sim para os seus visitante. Se preocupar com eles é uma das tarefas de um bom designer.

Então, como pode o copywriting influenciar a usabilidade? Para responder a isso, preciso primeiro ilustrar como pessoas geralmente percorrem um site. É caótico. Nós não nos focamos em nada em particular. Ao invés disso, nós “lemos” a página rapidamente, passando de um ponto a outro, tentando achar o que estamos procurando. Está é uma ilustração do caminho que alguém faz ao entrar em alguma página – as linhas e os pontos vermelhos mostram os vários movimentos do usuário e os vários focos de atenção, respectivamente.

Isso acontece muito rápido. Com pouco segundos nós “scaneamos” a página procurando por alguma coisa de nosso interesse. O maior problema que pode ocorrer no copywriting é o comprimento. É muito fácil escrever demais, especialmente quando conhecemos sobre o que estamos falando. É fácil pensar que colocando informações demais deixaremos as coisas mais claras para os nossos visitantes. Isso pode ser verdade, se ele ler tudo – mas ele não lerá!
Nosso visitantes estão “scaneando” loucamente a página procurando pedaços de informação, e a maioria deles não tem paciencia para ler parágrafos de texto – algumas vezes nem sentenças de texto. Temos que desenvolver curtos e consistentes pontos de foco para cada ponto de informação vital em nosso site. Estes pontos de foco devem fazer duas coisas: prender a atenção de seu visitante e chamar a atenção.

Veja um exemplo real:
Aqui está uma parte do site da MacPorts, uma ferramenta para Mac que ajuda a intalar vários programas ‘open source’.

É muito texo. Ninguém lerá isso tudo – e mesmo que leia, ele não ficará muito feliz com isso. Suponho que a maioria das pessoas chegam nesta página desejam fazer o download do MaxPorts, mas o link de instalação está no meio do texto. O que, cerca de 80% deste texto pode ser cortado sem que se perca nenhuma informação importante.

Aqui vai um rápido redesign:

Não está perfeito, mas eu penso que já é um grande avanço. Se eu tivesse mais tempo teria mudado um pouco mais o design e re-escrito o topo e os botões de seleção, mas as áreas mais importantes foram modificadas. Marcadores, titulos consistentes, fontes largas e chamando atenção, tudo ajuda tornar a página scaneável. As pessoas conseguem ver quais links estão disponíveis e a encontrá-los olhando rapidamente sem que seja necessário ler muito texto.

Copywriting deve ser sucinto e conciso. Usar fontes grandes para chamar atenção. Deixe claro a próxima ação com o mínimo de palavras possível e nunca entre em detalhes. O mais importante – corte qualquer palavra e sentença que não adiciona nenhum valor real. Seja curto e grosso!
Você provavelmente pensará que o copywriting está curto o suficiente, mas foi você quem escreveu – você conhece tudo o que está escrito e do que se trata. O visitante não e para encontrar ele terá que ler – eles estão aqui para fazer alguma coisa, então tire algum tempo e dê atenção para fazer coisas super fáceis de se scanear e encontrar.

Texto original: www.usabilitypost.com

Se você é um web developer ou designer e novato nos conceitos dos web standards e está indeciso de onde gastar o seu tempo para aprender tudo a respeito, aqui estão algumas das mais importantes razões para que isso seja feito.
Para os profissionais web que já trabalham com os web standards, esta lista será conveniente quando você precisar de bons argumentos sobre o assunto. Sinta-se a vontade para adicionar qualquer benefício que você pensa a respeito.

1 – Apresente-se com um aspecto profissional

Outros web developers e empregadores estarão atentos ao seu trabalho e saberão que você é um profissional que gosta de estar atento às mudanças tecnológicas e mantém seu conhecimento e habilidades sempre atualizadas. Isto lhe dará o aspecto de um verdadeiro profissional web.

2 – Apresente bem os seus clientes

Utilize os web standards em conjunto com as melhoras práticas de acessibilidade e dê aos seus clientes a chance de falar a respeito sobre o quanto eles se preocupam com todas as pessoas. E como eles acham importante que todo mundo possa utilizar os seus serviços e encontrar informações a respeito de seus produtos. Assim, evitaremos passar má impressões causadas pela desconsideração dos visitantes portadores de necessidades especiais, usuários de MAC e de dispositivos móveis.

3 – Maximize o número de clientes potenciais

Você não saberá qual dispositivo seus visitantes usarão para acessar o seu site. Você pode
pensar que sabe. Mas a não ser que você esteja desenvolvendo uma Intranet para uma companhia que tenha uma política sobre qual navegador deverá ser utilizado.
A única coisa que você razoavelmente terá certeza é que os clientes estarão utilizando alguma coisa que compreende HTML. Utilizando os web standards corretamente você terá certeza que você fez sua parte em desenvolver o seu site compatível com o maior número possível de dispositivos.

4 – Carregamento rápido e redução do consumo de banda

Uma marcação bem estruturada que separa a estrutura e o conteúdo da apresentação é geralmente muito mais compacto que um site com tabelas, spacer.gif e “tag soup”. Os documentos serão menores e mais rápido para baixar. Goste disto ou não, há várias pessoas ainda que utilizam conexão discada para acessar a internet.
Se o seu site tem um plano de hospedagem com tráfego de banda limitado, documentos menores reduzirão custos – mesmo que o tráfego aumente.

5 – Atenda os requisitos de acessibilidade

Utilizar os web standards não garante que todos os aspectos do seu site será acessível para as pessoas portadoras de necessidades especiais, mas isto é um bom começo. Tenha certeza que seus documentos estão validados, bem estruturados, semânticos e você estará no caminho certo para ter um site acessível.

6 – Melhore sua posição nos sites de busca

Conteúdo bem escrito, compreensível, bem estruturado e com uma marcação semântica é uma comida saborosa para os robots de sites de busca e você aumentará sua posição nos mesmos. Isso, com certeza, conduzirá para um acréscimo no tráfego, o que é o desejado por todo dono de site.

7 – Mantenha sua marcação fácil de manter

Ao atualizar o seu site, você prefere trabalhar arduamente sobre muitos kilobytes de intermináveis tabelas aninhadas e spacers.gif ou navegar sobre uma marcação simples, clara e bem estrutura?
Removendo, inserindo ou editando conteúdo sem apresentação é muito mais fácil e eficiente do que ter a certeza que toda a apresentação contida no documento estará correta. Utilizando as CSS para controlar o layout torna esse processo mais fácil para fazer alterações de layouts.

8 – Conteúdo resistente ao futuro

Não há ninguém que possa garantir com 100% de certeza que os documento criados e guardados digitalmente hoje serão legíveis daqui a cem anos. Ou quinze anos. Mas se você separar o conteúdo da apresentação e usar os web standards corretamente, você terá feito o melhor que pode para assegurar que seu conteúdo será legível mesmo ainda quando você se for.

9 – Boa razão para os negócios

Por que um dono de site diria não para mais visitantes? Para um site mais rápido? Otimizado para motores de busca? Com bom potencial publicitário? Isso não faz sentido.

10 – Isto é o jeito certo de fazer as coisas

O caminho dos web standards é a forma que deveríamos ter seguido quando começamos a desenvolver para a web. E agora que podemos, por que não fazer as coisas corretamente e ter uma excelente razão para sentimos bem com conosco mesmo?

Artigo original: Ten reasons to learn and use web standards
Tradução (pt-br): Leandro Vieira (artigo publicado)