Category ArchiveUsabilidade



Usabilidade & Acessibilidade 01 Aug 2007 10:22 am

Analisador de contraste de cores

Lendo o blog do Cristian Trentin vi uma ferramenta muito interessante, um analisador de contraste de cores.

Mas o que faz um analisador de contraste de cores?
Serve para analisar se a diferença entre as cores, o contraste entre o plano de fundo e primeiro plano, oferece boas condições de visibilidade.
De repente o que tem boa visibilidade para um, pode ser diferente para outra pessoa, principalmente deficientes visuais, e uma das grandes tiradas dessa ferramenta é justamente a possibilidade de fazer simulações de determinadas condições visuais tais como a Protanopia, Deuteranopia, Tritanopia e Catarata.
Sem entrar em detalhes são doenças que afetam os olhos causando deficiência visual e por consequência a dificuldade de ler o conteúdo de sites com cores mal escolhidas.

O nome do programa é Colour Contrast Analyser.
A pagina da WAT-C desenvolvedora do programa é http://www.wat-c.org
Alias a WAT-C(Web Accessibility Tools Consortium) é um consórcio que desenvolve ferramentas para desenvolvedores de site que focam a facilitar testes de acessibilidade, merece grande destaque essa iniciativa.
A pagina especifica sobre o analisador de contraste de cores é http://www.wat-c.org/tools/CCA/1.1

No blog do Maujor existe a tradução de um excelente tutorial sobre essa ferramenta.

Fiz os testes e meu blog passou em todos, um unico porém foi no teste que simulava cataratas, que embaça toda a tela, mesmo assim esta legivel, porém com alguma dificuldade, um tamanho maior da fonte facilitaria, e está sob estudo.

Desenvolvimento & Usabilidade & Acessibilidade & Avaliação 11 Jul 2007 11:27 am

Sistemas de busca e frames

Que os frames são parte da herança da internet dita 1.0, que seu utilizo massivo como era feito muitos anos atrás é desaconselhado hoje, acho que a maioria dos fazedores de site já sabe, mas porque é desaconselhado?

A Google, considera o frame “fora dos modelos conceituais da web atual”, declarando no seu centro de assistência ao “Fazedor de Site” :D:
“Se nosso motor de busca determina que a busca de um usuário encontra resultados em uma página na sua totalidade, a página inteira é retornada, ainda se com frames; porém, se a busca encontra resultado no interno de um único frame da página, devolvemos apenas o frame em questão, e não toda a página.”

Portanto acho que podemos entender melhor agora o porquê é desaconselhado, não creio que seja do interesse de alguém que um visitante abra um pedaço apenas da sua página, muitas vezes sem ter o que fazer a partir dali, perdido esse visitante é realmente perdido, vai embora, provavelmente não volta mais.

Mas vejam, desaconselhado não é proibido, o iframe principalmente ainda pode ser útil em algumas situações, como upload de arquivos de forma assíncrona(gmail usa), mas utilizar frames para montar o layout, exibir conteúdo, a menos que queiram perder visitas é altamente desaconselhado.

Mas afinal, alguém ainda usa frames? :P

Usabilidade 11 Jul 2007 11:04 am

Usabilidade, esse bicho morde?

Usabilidade na web podemos definir como a propriedade de um site que o torna fácil de navegar, com elementos bem distribuídos, tornando a interação do usuário mais atrativa, mais agradável.

A usabilidade em meios computacionais surgiu em meados da década de 80, com o surgimento dos sistemas de desktop baseados em janelas, de interfaces gráficas mais amigáveis.

Naquela época ainda a Sun já possuía um laboratório voltado para o estudo da usabilidade, o Sun Usability Lab, e este, definiu alguns principais pontos para definir a usabilidade em sistemas da Sun, que são utilizados até hoje por seus engenheiros(tradução livre :P):

Utilidade
A primeira pergunta a ser feita sempre é qual o objetivo do site. Serve para algo? Para quê?

Facilidade de percepção
Como os usuários se comportam em frente a um site que nunca viram? Perdidos? Encontram áreas que não entendem o senso geral e que não sabem dizer como chegaram ali? Querem fazer algo mas não sabem como? Existem metáforas intuitivas? (Exemplo: um carrinho de compras que em determinado site é chamado de “Saquinho de objetos”).

Eficiência
Os visitantes podem fazer perguntas ao sistema e receberem respostas sensatas e rápidas, ou devem tentar, tentar novamente, continuar tentando até depois de muito tempo acharem o que procuram? O carregamento do site é rápido?

Fácil de lembrar
Os visitantes lembram de como utilizar o site na segunda ou terceira vez em que retornam ao mesmo?

Prevenção de erros
Os usuários cometem erros de uso das ferramentas, ou com freqüência usam o botão voltar do navegador como se tivessem chego onde não desejam? O sistema do site possui muitos erros?

Satisfação
O sistema é divertido e fácil de usar, ou causa irritação ou frustração por parte do usuário?

Então o que quero dizer é que colocar um site na web, qualquer um faz, mas colocar um site que tenha um objetivo, que possua um layout agradável, com cores bem escolhidas, elementos bem posicionados, onde o usuário se sinta bem e saiba encontrar o que procura com facilidade é que é o desafio, e ai que entra a usabilidade, são anos de estudos nas áreas de Psicologia, Inteligência Artificial, e Sistemas Informativos para conhecer costumes dos seres humanos de frente para o computador, para lhes dar o que procuram da forma mais rápida e agradável possível.

A usabilidade tem como objetivo principal o usuário, facilitar sua vida.

Lembrem-se disso.

Desenvolvimento & Usabilidade & Acessibilidade & Geral 21 Jun 2007 06:50 am

O que são os FEEDS?

Bom muita gente cai de pára-quedas aqui, e vão reparar que a direita tem ali, assine meus feeds, e provavelmente irão pensar, o que é isso, uns vão clicar para tentar entender, outros, simplesmente vão morrer de curiosidade e medo de clicar e o computador explodir.
Assinar o FEED de algum site, em uma comparação a grosso modo, seria o mesmo que assinar sua revista preferida, receber todo conteúdo que ela oferece sem ter que sair de casa para comprar, porém com uma vantagem: Inteiramente grátis.
Quando você assina um FEED está dizendo: “-Quero receber o conteúdo desse site no meu computador sem ter que acessar o site”.
Poxa legal você deve estar pensando, então quando eu clicar ali do lado meu computador automaticamente recebe tudo que for postado nesse site ou em qualquer outro que libere o tal do FEED?
Se você possui um navegador com suporte a FEEDs como Firefox, Opera, sim!
Ele vai pedir para nominar esse FEED e posteriormente sempre que um novo post for inserido no site que você assina o FEED será possível saber, alguns agregadores(programa/site que gerencia suas assinaturas) de Feeds mostram apenas o título, e se for algo do seu interesse pode entrar no site e ler o artigo completo, outros carregam o post inteiro, alguns avisam quando existe novo post de forma visual ou até com som, outros dependem do usuário acessar e visualizar o que foi atualizado.

Existem os agregadores como ja disse que vem integrados nos navegadores modernos, existem os agregadores que podemos baixar da internet, são programas desktop que gerenciam suas assinaturas, alguns clientes de email como Thunderbird também possuem integrado a eles o agregador de feeds, onde o assinante recebe o novo conteúdo diretamente no email, e por fim, existem ainda os agregadores on-line, sites onde cria-se uma conta, e o mesmo guarda todas suas assinaturas.

Para quem não tem navegador com agregador de feeds integrado, ou que prefere algo em separado, seguem alguns agregadores dos mais conhecidos:

On line:
BlogLines
Google Reader

Programas desktop:
Feedreader
SharpReader

Cliente de email com agregador integrado:
Thunderbird

Não quer um programa separado, ou visitar um site para assinar feeds mas seu navegador é velhinho e não possui agregador integrado?

Baixe agora um navegador moderno e divirta-se assinando os feeds de seus sites preferidos:

Firefox
Opera

WebStandards & Desenvolvimento & Usabilidade & Acessibilidade 20 Jun 2007 12:41 pm

Desenvolvimento em camadas

Muita gente por ai prega webstandards muitas vezes sem saber o que é.
Independente da palavra em si que serve meramente como referencial, como já disse, as favas com brigas por defender terminologia, chega de fanáticos tecnológicos.
Me empolguei :P
Voltando ao tema, webstandards não é somente um código xhtml limpo e validado na W3C, o conceito vai muito além, mas eu costumo dizer que para fazer um site corretamente é preciso trabalhar com camadas, lembram as camadas do Photoshop? Certo, nada a ver, mas serve para visualizar o que seria.
As chamadas camadas no desenvolvimento para web são 3, apresentação, comportamento e conteúdo, sendo a última a mais importante, por trazer toda informação contida no site.
Rapidamente vou explicar como funciona cada uma dessas camadas.

Conteúdo

Como escrevi algumas linhas acima esta é a camada mais importante de todas, o conteúdo é o que motiva uma pessoa a acessar um site, o site pode ser feio, lento, mas tendo um conteúdo bom, o visitante retorna, claro, tendo um outro site com conteúdo tão bom quanto o primeiro, mas bonito e rápido de acessar o visitante certamente não pensará duas vezes em abandonar o site bom, mas feio.
Logo, o conteúdo é o mais importante, mas o design também conta e muito.
Para desenvolver essa camada você usará linguagens de marcação de hipertexto, como HTML ou XHTML.
Definido o layout, a montagem do seu site deve começar aqui, não é uma regra, seu site não explodirá se usar outra ordem, mas é o aconselhável.
Digo isso porque antes de começar a pensar na parte visual, devemos estruturar a forma como será exibida a informação a fim de evitar misturar as camadas.
Será difícil porque o layout vai ficar na sua cabeça louco para aparecer na tela, mas resista, pense primeiro na estrutura, lembre-se de definir o que é importante no conteúdo com as tags devidas, isso facilita a acessibilidade, usabilidade, indexação nos mecanismos de busca e ainda facilitará a implementação da parte estética do site, da camada de apresentação.

Apresentação

Como o próprio nome diz e vocês devem imaginar, essa camada diz respeito a forma como o site é exibido na tela, é a parte visual, é aqui que vamos definir as propriedades visuais dos elementos da página com o tão famoso CSS :D
Lembrem-se menos as vezes é mais, e a ordem do dia aqui é simplicidade, muita gente gosta de montar um CSS cheio de código proprietário, como por exemplo o “filter” da Microsoft, lembrem-se que isso afeta a experiência e a acessibilidade do seu visitante.
Hacks não são proibidos, mas não são também recomendados, fuja de todos se possível, se não for, use o mínimo, prefira os comentários condicionais para carregar um css a parte do principal somente com os ajustes.
Fuja da coceirinha, é, quem nunca durante a montagem do HTML não sentiu coçar a mão para definir alguma propriedade do elemento diretamente nas tags html, parecia tão mais simples, tão fácil, até se lembrar que um dia aquilo vai precisar de atualização, não misture as camadas, o html diz respeito somente a camada de conteúdo, caso contrário você certamente no futuro se perderá no próprio código.

Comportamento

Muita gente adora essa camada, é a parte das ditas “frescuras”, aqui a linguagem normalmente utilizada é Javascript interagindo com o esqueleto do site, com o HTML, com a árvore de elementos do HTML, para os íntimos simplesmente DOM.
Essa camada tem má fama pelo uso exagerado por parte de alguns desenvolvedores dos recursos que oferece, é também por ser a única das 3 camadas dispensável, seu site pode tranquilamente viver sem ela :D
Um exemplo de código javascript que interage com a DOM:

document.getElementById(id)

Esse código seleciona algum elemento da árvore DOM para ser manipulado.
Nesta camada que surgem efeitos muito vistos em alguns sites, como o esmaecimento de textos, imagens que somem, aparecem, que mudam de lugar, validação de formulários, a sugestão aqui é o bom senso como sempre.
Essa camada é importante por melhorar a forma de interagir como o visitante do site, mas os recursos usados em excesso ou de forma errada, podem afetar a acessibilidade e a boa experiência do usuário.

Para finalizar, não esqueça o principal, teste no maior número possível de browsers o seu site, garanta a acessibilidade do mesmo e a felicidade do seu visitante, tem coisa mais chata do que entrar em um site escrito:

Melhor visualizado na resolução 800×600, com Internet Explorer, monitor Samsung, e sentado inclinado ligeiramente a direita.

Hoje uma mensagem dessas pega muito mal, mas seja sincero, quem aí que desenvolvia no tempo das trevas da internet nunca usou esse recurso extremamente agradável.
:P

Next Page »