Como criar rolagem e carregamento de micro animações
Jakob Nielsen
Jakob Nielsen é um consultor dinamarquês de usabilidade na web e fundador do «Nielsen Norman group». Ele é Ph.D. em interação humano-computador pela Universidade Técnica da Dinamarca em Copenhague.
(Wikipédia)
(Wikipédia)
Um dos princípios de usabilidade de Jakob Nielsen diz: "O sistema deve sempre manter os usuários informados sobre o que está acontecendo".
Uma maneira de ajudar seu site a se encaixar nessa regra é fornecer recursos de micro animação. Adicionamos dois tipos de animação:
1. Um indicador de carregamento de página de uma cor personalizável dizendo: "Tudo está bem, a página está carregando".
2. Um indicador de rolagem informando a um usuário qual parte da página ele está visualizando no momento.
1. Um indicador de carregamento de página de uma cor personalizável dizendo: "Tudo está bem, a página está carregando".
2. Um indicador de rolagem informando a um usuário qual parte da página ele está visualizando no momento.
1
Como adicionar uma animação e um indicador de carregamento
Adicione um bloco T228 da categoria "Outros" à parte superior da página.
É assim que o carregamento da página se parece sem uma animação de carregamento:
O carregamento do conteúdo ficará mais suave depois de adicionar esse bloco:
Marque a caixa de seleção "Mostrar um indicador de carregamento" e escolha uma cor de fundo do indicador de carregamento no painel Configurações do bloco.
É assim que o carregamento da página fica depois de adicionar um indicador de carregamento:
Este indicador não é exibido no Safari. O Safari tem o seu próprio indicador de carregamento de páginas.
2
Como adicionar uma animação de rolagem
Adicione um bloco T333 da categoria "Outros" à parte superior da página.
Especifique a cor e a altura da barra de progresso no painel Configurações do bloco.
Especifique a cor e a altura da barra de progresso no painel Configurações do bloco.
