Usabilidade de paginação de resultados: Orkut, BuscaPé, Submarino e Google

Um dos grandes e persistentes problemas de usabilidade é a navegação entre os resultados de uma busca. Nem sites famosos escapam deste problema. Veja como o Orkut, BuscaPé, Submarino e Google se comportam nessa situação.


A motivação

Ao navegar no Orkut, percebi que aquele menuzinho de navegação no canto superior direito possui uma fonte bem pequena, linkando cada página dos resultados (ocorrências). Ora um algarismo tem uma largura muito pequena, utilizando tamanho de fonte padrão do browser (sem alterações personalizadas no CSS). Assim, tomei este site e mais 2 nos quais lembrava que existia algum tipo de páginação (BuscaPé e Submarino) e, para finalizar, peguei o Google, uma referência na web atual.


Teoria

Algumas heurísticas de usabilidade orientam para exibir um link que seja fácil de clicar, no sentido de poupar do usuário habilidades de arqueiro, ao posicionar o mouse em cima de um link. Esse tipo de coisa acontece frequentemente em menus drop-down, mas é paginação que ele se faz presente, constantemente.


Navegação, na prática

Com exceção do Submarino, que pagina por intervalos (1-50, 51-100, etc), todos os outros utilizam apenas o algarismo a que se refere à página. Ou seja, um largura extremamente curta para ser clicado. Além, é claro, da formatação que não ajuda muito.


Como fica o CSS?


Orkut: Verdana, 11px.



BuscaPé: Verdana, 10px, além de aplicar STRONG direto no HTML.



Submarino: Arial, 11px.



Google: Arial, 10pt.


Deste modo, com fonte em torno de 11px (ou 10px + STRONG, o que não ajuda muito, no BuscaPé) o algarismo solitário ainda fica difícil de ser clicado. É claro que na paginação de "10" para cima a coisa melhora, pois uma dezena tem largura maior. Mas isso não resolve o problema.


Situações pontuais

Quando o usuário utiliza 800 x 600 ou uma configuração que torna a fonte maior, o problema é minimizado. Mas não é conveniente forçar o usuário a adora uma configuração tal ou então aplicar um CSS personalizado, bem como aumentar a fonte (Ctrl + no FireFox).


Contornando o problema

Exibir links como o Submarino faz, pode ser adequado em situações específicas. Se o resultado de uma busca oferecer uma quantidade pequena de registros, forçar a criação de intervalos (mesmo que pequenos) pode ser inconveniente para o usuário. Portanto, essa solução não pode ser gereralizada.

Uma solução possível é aplicar, dentro da tab "a href" um espaço em branco antes e depois do algarismo, aumentando a área clicável do link, aplicando o HTML: n . Essa solução não é semanticamente perfeita, piora um pouco a acessibilidade (força a leitura de um "espaço em branco" nos leitores de tela) mas valida corretamente o código e torna a usabilidade melhor.

Essa solução é extremamente fácil de ser implementada pelas linguagens server-side, uma vez que no loop de geração da páginação pode ser incluído facilmente " " antes e depois do algarismo a ser linkado, quando este link é gerado dinamicamente.


Conclusão

O problema de criar links com má usabilidade é muito comum na paginação. Sites famosos ainda cometem este erro, sistematicamente. No entanto, não podemos forçar usuários com dificuldades de coordenação motora ou pouca acuidade visual a ficar "catando" o link de uma paginação de resultados.