# Recursos de usabilidade grátis

> Descubra recursos essenciais sobre usabilidade web grátis. Ferramentas, artigos, livros e referências completas para aprender e aplicar UX design!

URL: https://dpw.dev/ui-ux/recursos-usabilidade/  
Publicado em: 2010-04-12  
Categoria: ui-ux  
Tags: ferramentas, usabilidade  
Autor: Tárcio Zemel

**Usabilidade deve ser prioridade para cada site!** Sem usabilidade, até mesmo o mais belo web design será ineficaz. Conheça recursos, ferramentas, software, listas, artigos e mais, que irão ajudá-lo a projetar e desenvolver sites altamente utilizáveis e proporcionar uma melhor experiência para o visitante.

> Artigo baseado em [35+ Usability Resources for Web Designers](http://designm.ag/resources/usability/).

## UsabilityTest.com

Você pode participar da comunidade [UsabilityTest.com](http://www.usabilitytest.com/) para obter **opiniões sobre usabilidade** e/ou fornecer feedback para outros usuários. É possível assista a vídeos de usuários utilizando seu site ou aplicativo web e obter informações valiosas de como melhorar a interface.

Oferece painel administrativo onde é possível acompanhar estatísticas de testes através de gráficos de fácil entendimento, mas, sem dúvida, sua principal _feature_ é a possibilidade de assistir a videos dos visitantes em seu site, acompanhando cada clique do mouse que foi dado durante a sessão de navegação.

## WebsiteOptimization.com

[WebsiteOptimization.com](http://websiteoptimization.com/services/analyze/) permite testar o tempo de carregamento de uma página e apresenta um relatório com alguns resultados interessantes a respeito.

Seu relatório de análise provê número de requisições HTTP; tamanho (peso) dos elementos da página, como HTML, imagens, CSS e javascript; total de objetos externos; tempos de download; dentre outros, Além disso, oferece, baseado nas análises feitas, recomendações de o que pode ser feito para aprimorar o desempenho do site.

## LinkChecker Firefox Add On

Essa extensão do Firefox testa, com facilidade e rapidez, os links de uma página. Depois de instalado o [LinkChecker](https://addons.mozilla.org/pt-BR/firefox/addon/532), acesse uma página e, para usar o plugin, selecione, no Firefox, **Ferramentas > Check Page Links**; na barra de status, à direita, você pode acompanhar o número total de links encontrados e quantos % restam para o fim da análise.

Enquanto a ferramenta varre os links da página, vai "marcando" os links encontrados durante a análise. No final do processo você pode ver quais links são válidos pela cor dada a cada um: se estiver verde, então o link é válido; se for de outra cor que não o verde, então é hora de rever aquele link...

## ClickHeat

Já havia comentado sobre o ClickHeat no artigo sobre [7 ferramentas para web designs melhores](/design/7-ferramentas-para-web-designs-melhores/), mas, devido a sua importância, vale a pena reforçar o uso da ferramenta! O [ClickHeat](http://www.labsmedia.com/clickheat/) gera mapas de calor de cliques em páginas web, mostrando zonas "quentea" e "frias".

É uma ferramenta que deve ser baixada e instalada no servidor - o processo é simples, não se preocupe. Depois de instalada e configurada, a ferramenta faz heatmaps baseados nos movimentos do cursor do mouse e cliques dados pelos visitantes. Nos relatórios de mapa de calor é possível filtrar amostragens por data, resolução de tela, navegador usado, dentre outros. Sem dúvida, uma excelente ferramenta para análises de **usabilidade na web**!

## Five Second Test

Teste as primeiras impressões dos seus visitantes para melhorar o layout do seu site através de testes super rápidos de 5 segundos! Num primeiro momento pode parecer bastante estranho, mas a proposta do site com seus testes de 5 segundos é bastante válida como forma de complemento aos testes de usabilidade em um site.

Uma página de um site é apresentadadurante 5 segundos. Depois, 5 inputs aparecem e você deve indicar quais os itens que você se lembra de ter visto - ou seja, aqueles que chamaram sua atenção. A análise serve para saber se aquele recurso ou [call to action](/usabilidade/4-elementos-design-call-to-action/) que você inseriu no site realmente prendeu a atenção do visitante. Experimente o [Five Second Test](http://www.fivesecondtest.com/), é até divertido!

## Colour Contrast Check

Baseado na [recomendação de contraste do WCAG 2](http://www.w3.org/TR/2008/REC-WCAG20-20081211/#visual-audio-contrast-contrast), (que, apesar das [controvérsias](http://maujor.com/wcagsamurai/intro-pt-br.html), é um documento oficial do [W3C](http://www.w3.org/)), este recurso ajudará a evitar problemas com o contraste de cores em um web design.

Para os testes na [Colour Contrast Check](http://www.snook.ca/technical/colour_contrast/colour.html), você deve informar 2 cores (em hexadecimal ou utilizando os sliders presentes na ferramenta) que serão analisadas e, em tempo real, é possível conferir se a combinação escolhida passa ou não em testes, como a diferença de brilho, diferença de cor, se as cores são compatíveis, e outros mais.

## GrayBit

GrayBit mostra uma versão em escala de cinza de um site para ajudar com testes de contraste. Você fornece o endereço da página que quer analisar e ele mostra tudo em escala de cinza, incluindo imagens.

O propósito desse tipo de teste que o [GrayBit](http://graybit.com/) proporciona é saber se as páginas de um site realmente possuem contraste suficiente. Neste sentido, também o [Colorblind Web Page Filter](/acessibilidade/colorblind-web-page-filter/) é bastante interessante!

---

Fonte: [dpw - desenvolvimento para web](https://dpw.dev/) (pt-BR).
Guia para agentes: https://dpw.dev/llms.txt
Índice completo: https://dpw.dev/sitemap-index.xml
Feed: https://dpw.dev/rss.xml
