Barras de rolagem são as áreas laterais à janela do browser, que sinalizam a existência de conteúdo que ultrapassa a área visível da página e permitem o deslocamento da janela para alcançá-lo, ajudando a adaptar a janela ao conteúdo publicado.

Como muitos relutam em utilizar as barras de rolagem e ignorem o conteúdo localizado abaixo da janela que aparece no browser, é importante que o conteúdo mais importante de cada página fique localizado “acima da dobra”, ou na parte visível logo que esta carrega no browser.

Esta afirmação se aplica especialmente na página Principal de um site : apenas 23% dos usuários que visitam um site pela primeira vez usam as barras de rolagem nesta página e este número diminui nas visitas seguintes. (1)

Jakob Nielsen afirma que os hábitos de uso da internet nos últimos 15 anos mudaram muito, e que se em 1995 os usuários raramente faziam a rolagem, em 2010 esta era bastante usada. No entanto, o grau de atenção variava muito entre o alto da página visível sem rolagem e as áreas mais baixas, acessáveis por rolagem: 80,3% das ações de fixação do olhar (que demonstra atenção) se concentraram no alto, enquanto apenas 19,7% nas parte mais baixas. (2)

Na página Principal, o assunto principal e o motivo principal das visitas devem ficar localizados acima da dobra (um site sobre cotação das bolsas de valores deve ter estas informações identificáveis à primeira vista, no alto).

De qualquer modo, se os leitores estão interessados no conteúdo, o que acontece em sites de conteúdo especializado, procuram descobrir, ou pelo menos dar uma olhada, no que está localizado abaixo da dobra. Ou seja, fazem a rolagem quando o conteúdo os motiva a se deslocar para além do alto da página.

Alguns websites usam fotos de tela cheia na abertura e setas apontando para baixo, indicando que se deve fazer a rolagem da tela para ver o resto do conteúdo, o que remete aos links “clique aqui”, encontrados em situações em que o layout do link não fica suficientemente claro para motivar a ação (Travel Episodes, exemplo abaixo). Já se a narrativa do conteúdo em si aponta para a parte de baixo, com a inserção de elementos que indiquem que o desenvolvimento do conteúdo continua, fica mais fácil compreender o que fazer.

Botão de rolagem
A tela acima tem um botão de rolagem com a indicação que o conteúdo continua na parte de baixo da página. Acesso em 04.2015

Os usuários estão habituados a encontrar nas barras de rolagem os seguintes elementos:

Setas acionáveis no alto e embaixo, sensíveis ao toque prolongado do mouse.

Um botão arrastável, normalmente em cor diferente do fundo, que sinaliza o movimento em direção à parte de cima ou de baixo da página e, pelo tamanho, indica se a janela é mais ou menos extensa.

A semelhança do formato das barras de rolagem à interface do browser – e aos programas que usuário está acostumado a usar – ajuda os usuários a identificá-las imediatamente e também a entender seu modo de uso.

Quando as barras são muito diferentes da interface do browser, sua funcionalidade fica difícil de identificar, especialmente pelos usuários que usam a internet há pouco tempo.

Barras de rolagem muito discretas, como as da tela abaixo, dificultam a identificação pelo usuário, que deixa de ter acesso a informações que pode estar procurando.

A barra de rolagem retangular, que apresenta contraste com a cor de fundo, é mais facilmente visível e reconhecível em relação aos outros elementos da interface.

Rolagem horizontal
Quando o conteúdo aponta claramente para uma continuidade horizontal, o leitor realiza o movimento com naturalidade.

As barras de rolagem podem ser horizontais (pouco indicadas, pois exigem a rolagem horizontal, usada por apenas 0,4% dos usuários) ou verticais, mais comuns e previsíveis. A rolagem horizontal deve ser evitada, pois a maioria dos usuários não se sente confortável fazendo este movimento, especialmente se a interface já demanda rolagem vertical. A rolagem em duas dimensões (horizontal e vertical) é dispersiva e exige que o usuário precise decidir qual dos movimentos vai fazer primeiro.

Este problema é ainda mais grave para pessoas com deficiências físicas, especialmente motoras, que sentem ainda mais dificuldades para a rolagem em dois sentidos, na medida em que precisam usar as setas do teclado para se deslocar em cada sentido.

(Atualizado em 10.5.2015)

 

Referências

1) Livro: Prioritizing web usability, Jakob Nielsen e Hoa Loranger. New York: New Riders, 2006