Na primeira parte do artigo, conhecemos a história da dobra, a importância da área acima dela e como visualizar seu site em diferentes resoluções. Nesta segunda e última parte, veremos como criar designs para além da dobra, formas de encorajar o scroll e alguns pontos-chave sobre o assunto.

Criando designs para além da dobra

Ok, então sabemos que a área acima da dobra ainda é extremamente importante para prender a atenção do usuário. E quanto ao restante do nosso lindo conteúdo? Um estudo da Clicktale mostra que, se uma página tem uma barra de rolagem, isso vai ser utilizado por 76% dos usuários em algum momento. 22% farão o scroll até o fim da página. Então, como mostrado pelo expert em Usabilidade Jakob Nielsen, a área acima da dobra ainda prende a maior parte da atenção e as pessoas rolam a página, mas precisamos ter certeza de que estamos fazendo um design que encoraje a rolagem.

Enquanto dispositivos móveis desenvolveram o scroll como um comportamento natural do usuário, temos que garantir que os layouts das nossas páginas sejam feitos de forma a mostrar todo o conteúdo. Então, como a dobra deve ficar? De forma ideal, temos que fazer com que o conteúdo na linha da dobra leve os olhos dos usuários para o restante da página.

Três formas de encorajar o scroll

1. Criar colunas com tamanhos diferentes

Ao colocar o conteúdo em colunas de diferentes larguras e tamanhos, prevenimos o problema de ter um espaço vazio na página, o que faz parecer com que a página acaba ali. Um parágrafo maior ou uma imagem quebrada pela dobra encoraja o usuário a rolar a página para ver mais informações. Esse estilo é comumente usado em sites de notícias como o New York Times e a BBC.

2. Mostrar o caminho com “trilhas”

Usar um caminho tracejado que guie o usuário pela página é uma ótima forma de encorajar o scroll. A dobra disseca o caminho, e o usuário vai segui-lo naturalmente. Um ótimo exemplo disso é o Guia de WordPress do Simply Business.

3. Às vezes você precisa apenas falar!          

Image source

Em alguns momentos, mais do que tentar um auxílio visual para que os usuários façam a rolagem da página, você pode apenas falar com eles que há mais conteúdo a ser visto. Essa é a opção do Put Things Off para mostrar outras características do app mobile.

Pontos-chave

• A dobra é importante. Enquanto o espaço acima dela deve ser usado como um portal de entrada para que o usuário explore as outras seções do site, seu propósito é agora prender a atenção dele e introduzi-lo à sua marca/produto.
• Vivemos em um mundo multitelas e rolar a página é algo habitual. Se estamos fazendo páginas que demandam scroll, temos que encorajar esse comportamento através de dicas visuais e lembrar o usuário que há mais conteúdo após a dobra.
• Continue monitorando o comportamento do usuário, particularmente em relação às resoluções de tela mais comuns, para garantir que o conteúdo principal se mantenha acima da dobra.

***

Este artigo é uma republicação feita com permissão. Moz não tem qualquer afiliação com este site. O original está em http://moz.com/blog/life-above-and-beyond-the-fold