01-08-10

Efeito Fading do Google causa problemas de usabilidade

google-fade

Provavelmente vocês já perceberam que ao entrar na primeira página do Google ocorre um efeito de “fade”, aparecendo os links e outras informações que rodeiam a busca somente após mexermos o mouse. É meus amigos, isso mesmo, experimente acessar o Google sem tocar no mouse. Você ficará por horas vendo apenas o logo, a busca e nada mais.

E é exatamente isso que vem ocorrendo em vários lares do mundo. Há relatos de pessoas que ficaram minutos olhando para a página esperando que ela “carregasse toda” já que os links não apareciam.Só depois perceberam que mexendo o mouse, os links aparecem.

Existe um problema de usabilidade ao utilizar esse fade. Um deles é o fato da mensagem de rodapé ficar escondida. Podemos dizer que é um procedimento padrão sentir que a página foi totalmente carregada ao ver aquele textinho lá embaixo com os créditos, links finais ou uma mensagem de copyright. Com o efeito fade isso não ocorre.

Mas afinal, porquê esconder os links do topo? Se eles não querem mostrar os links de seus serviços, para que eles existem?

Coisas do Google.

Para o alto e Avante!

10-24-08

Analisando o novo site do UOL

Vocês perceberam que o design do UOL mudou desde a semana passada? Não? Bem, para aqueles que perceberam, meus parabéns, vocês possuem uma visão bem aguçada. Agora, se você não percebeu, que ótimo! Era isso que o UOL queria, que você não percebesse.

evolucao-uol

As pessoas são avessas as mudanças. Principalmente aquelas novidades que exigem algum aprendizado. A mudança de layout de um portal de notícias como UOL é algo extremamente complicado. Requer bastante critério para que não cause impacto negativo em seus visitantes. Ao mudar o posicionamento de um menu, por exemplo, vocês não imaginam o tamanho da catástrofe. É usuário reclamando aos montes,  perguntando onde está o bendito link que todo dia ele clicava no mesmo canto esquerdo. Clicava até olhando pra cima. Era automático.

Para quem já leu o livro “Não me faça pensar” de Steve Krug, sabe o que estou falando. Krug, comprova, através de testes de navegação que o internauta não gosta de pensar na hora de clicar e navegar. Gostoso é ligar o automático e fazer tudo de olhos fechados. Aí, derrepente, não mais que derrepente, vem a desagradável surpresa: o layout mudou. Completamente. E agora? Cadê a seção de notícias? O menu? A caixa de busca?

Esse fenômeno de repulsa é natural e acontece com todos os sites altamente visitados. O lançamento da última mudança no site do O Globo é um exemplo, que cheguei a comentar em meu site pessoal. Em 2006 O Globo fez uma grande mudança no layout. O impacto visual foi positivo. Porém o de navegação não. Links mudaram de lugar, outros sumiram e chamadas de novela se misturavam a notícias sobre a bolsa de valores. Houve uma tentativa de agrupar o maior número de notícias na primeira tela do site e foi abolido os agrupamentos em seções. Isso deixou o leitor totalmente confuso nos primeiros dias, sem entender o funcionamento do site e como encontrar suas páginas preferidas. Passaram-se 2 anos e as mudanças feitas no layout foram sutis, sem atrapalhar a navegação, ocorrendo de forma gradativa.

Já a mudança de layout do UOL foi diferente. A mudança foi sutil. A maior mudança foram as cores: agora predomina o branco. O branco, todos nós sabemos, favorece a leitura, cansando menos a vista. Além disso, as margens em branco deixam o layout mais leve, com menos barreiras visuais. Foi mantido também o ótimo recurso de seções organizados em editorias. Assim a notícia da novela fica em “entretenimento” e da Formula 1 em “esportes” sem misturar um com o outro. Quer saber sobre o último jogo da Copa? Basta bater o olho na editoria esportes e tá tudo resolvido.

A mudança foi sutil. Os principais elementos, como o menu, ficou no mesmo lugar. O usuário não se perde. E assim UOL vem acertando desde 1999, quando adotou o estilo portal, com página corrida, menu vertical e de topo, seções e muitas chamadas de notícia.

Portanto, se você possui um portal muito visitado ou algum cliente seu deseja mudar o layout do seu portal, cuidado. Seja bastante criterioso e pense 2 vezes antes de mudar seções de lugar. Mire-se no exemplo do UOL. Ter o cabelo preto e resolver pintá-lo de loiro pode lhe causar problemas. Às vezes basta apenas mudar o penteado. Pense nisso. ;)

Para o alto e Avante!.

07-15-08

Site funcionando em todas as resoluções

Dia desses recebi um email do nosso querido leitor Raenner, de Itabira – MG. No email ele pergunta:

Bruno, queria saber como fazer que um site funcione em
todas as resoluções. usando Dreamweaver. Se não der para colocar no
Avante, pelo menos dê uma dica, irá ser muito interessante um post no
Avante sobre este assunto.

Ok, Raenner, então vamos lá. Existe muito, mas muitos textos, artigos e dicas referentes a este assunto na Internet. O que vou fazer aqui é comentar um deles. Primeiro leia o texto  publicado no Fator W, Projetar layout líquido é justiça com o usuário, de Leonardo Procópio. Nesse artigo, Leonardo nos mostra as vantagens de utilizar um layout líquido.  Layout líquido ou fluído  é nada mais do que um site diagramado com valores de largura em porcentagem. Um exemplo, sem frescura, é quando você coloca tudo dentro de divs com larguras em porcentagem. Capiche?

Pois então, no texto Leonardo cita também as desvantagens do layout líquido.

A desvantagem do layout líquido é que ele é bem mais difícil de projetar que o fixo. O desenvolvedor tem que observar diferentes resoluções, não pode usar posicionamento absoluto para os objetos e uma série de outros fatores.

É, em algumas resoluções o site pode ficar feio, o texto muito solto e comprido e todo o site ficar com aspecto de “linguiça”. Por isso que até hoje o layout líquido não pegou. Talvez uma prova disso esteja no próprio layout do Fator W. Veja o que Leonardo disse em 2005:

Aqui no fator W, uso layout líquido. A coluna de informações varia de acordo com a área disponível na tela. Isso permite que tanto quem usa 800×600, 1024×768 ou 1152×864 vejam o site usando todo o espaço disponível na tela.

É, mas se você notar, ao entrar no Fator W, o site não é mais líquido. Quem entra no site utilizando resolução 800 x 600 tem que apelar para a barra de rolagem horizontal. Acho que até o Leonardo cansou do layout líquido por conta da dificuldade de trabalhar com esse tipo de construção. O texto foi escrito em 2005, portanto, de lá pra cá o layout do Fator W deve ter mudado.

Bem, ainda prefiro o layout fixo, prevendo uma resolução mínima. Como sei por estatística que mais de 90% dos meus visitantes usam resoluções acima de 1024 x 768, trabalho com essa resolução mínima, criando o layout baseando-se nessa resolução.  Porém, daqui a um tempo essa minha preferência pode ser mudada. Há 10 anos criava sites baseados em resoluções 640 x 480. O que precisamos então é ficar antenados nas mudanças.

Para o alto e Avante!

02-10-08

Analisando os movimentos do mouse

Aqui está uma ferramenta não só curiosa mas de muita utilidade para aqueles que desejam visualizar como o seu visitante navega por seu site. O Robot Replay grava todos os movimentos do mouse daquele que visitou seu site e depois mostra para você como num filme. Assim você verá onde foi sentido maior dificuldade, as chamadas que estão despertando maior atenção ou descobrir os pontos fracos de seu site.

Ótima ferramenta para a avaliar o comportamento do usuário frente ao seu site.


No vídeo abaixo você poderá ver um exemplo do seu funcionamento.

Para o alto e avante!