CURSO WEBDEISGN - APOSTILA MDULO I

Interface Homem-mquina Usabilidade na Web

Prof.: Luiz Henrique Flix

Sumrio

O QUE A USABILIDADE? ........................................................................................................ 3 APLICAES WEB: USABILIDADE + PRATICIDADE = SUCESSO.......................................... 8 HEURSTICAS DE USABILIDADE EM WEBSITES .................................................................... 9 DIREO DO OLHAR NA TELA DO COMPUTADOR .............................................................. 10 PGINAS FLUIDAS ................................................................................................................... 20 REDUZA O PESO DE SEU SITE .............................................................................................. 21 FATORES DETERMINANTES NO USO DE FONTES .............................................................. 23 USABILIDADE E ACESSIBILIDADE: CONCEITOS MUITO DIFERENTES .............................. 24

O QUE A USABILIDADE?
Tcnicas que ajudam os seres humanos a realizarem tarefas em meios grficos de computador. - Trabalhamos para seres humanos, que querem realizar uma tarefa de uma forma simples e eficaz e neste caso particularmente, devem realiz-la frente ao computador em um meio grfico, a web. A usabilidade ajuda para que esta tarefa se realize de uma forma simples, analisando o comportamento humano, e os passos necessrios para realizar a tarefa de uma forma eficaz. Talvez soe um pouco como um trabalho industrial, mas ao fazer referncia ao termo "tarefa", estamos nos referindo a buscar um programa que queremos ver na tv, ou ver informao sobre um time de futebol favorito, ou comprar um livro sobre artes marciais, por exemplo. Realmente a usabilidade faz falta para fazer uma web? Sim. Seja sua web um portal ou uma pgina pessoal, no se esquea que as pessoas que entram em sua web basicamente entram porque buscam algo. Para tornar isso mais simples a deciso sua, mas certamente entre todos ns podemos fazer da internet um lugar melhor onde as pessoas no se sintam perdidas ou extraviadas ou simplesmente defraudadas. Quais so as 8 regras de Ouro sobre a usabilidade? Espero que lhe sirva. Talvez amanh sejam 10 regras. 1. Na internet o usurio quem manda. Isto quer dizer que sem usurios sua pgina morre, portanto mais vale que cuide bem deles e d o que te pedem, caso contrrio, voc ficar sozinho. 2. Na internet a qualidade baseia-se na rapidez e na confiana. Na internet conta que a sua pgina seja mais que rpida que bonita, confivel que moderna, simples que complexa, e direta. 3. Segurana Se na vida real s vezes nos custa confiar no banco da esquina, imagina como se sente as pessoas na internet quando chegam no seu site. Procure fazer com que tudo funcione como um relgio para que o pessoal possa confiar no seu site. 4. A confiana algo que custa muito ganhar e pode se perder com um simples link quebrado. Isto quer dizer que tal como est a competncia na internet, no se pode perder nem um s visitante por ter um link mal feito. melhor sair com algo simples e ir complicando pouco a pouco, do que sair com tudo e ver "o que acontece". Verses 1.0 so boas enquanto o que esteja posto gere confiana. Pouco a pouco e com o feedback dos usurios, poder ir complicando a pgina. Mas tenha certeza antes de arriscar. 5. Se quiser fazer uma pgina decente, simplifique, reduza, e otimize. As pessoas no vo decorar tudo que houver no seu site por muito que insista, portanto faa-o pelo menos simples, utilize todos os elementos que puder, para que deste modo os usurios sintam-se cmodos e no se percam cada vez que necessitem encontrar algo em seu site. 6. Coloque as concluses no incio. O usurio se sentir mais cmodo ao ver as metas ao princpio. Desta forma no ter que buscar o que necessita e perder menos tempo em completar sua tarefa. Se ele completa sua tarefa em menos tempo se sentir cmodo e talvez se dedique a explorar seu site ou inclusive, talvez o recomende a um amigo. 7. No faa as pessoas perderem o tempo com coisas que no necessitam. Cuidado com as promoes, se fizer pelo menos faa com cuidado. Procure fazer com que a seleo de produtos a exibir seja conseqente e no seja do tipo "vender tudo" em todas as pginas. Segundo

avance o usurio em sua navegao procure deixar mais espao livre. Pode acontecer de na hora de comprar algo veja uma oferta que lhe distraia e perca essa venda. 8. Bons contedos. Escrever bem para internet uma arte. Contudo, seguindo as regras bsicas de (1) colocar as concluses no princpio e (2) escrever como um 25% do que voc colocaria em um papel, com isso pode-se chegar longe. Ler na tela custa muito, portanto, no caso de textos para internet, reduza e simplifique tudo o que puder. Tudo bem, e quanto tempo levar fazer isto? Um desenvolvimento web, em mdia, leva 6 meses - 1 ano. O resto besteira. Portanto se seu business plan depende de um "deadline" para amanh, melhor revis-lo! Elementos de um bom site Primeiros passos. Dispor de tempo, tecnologia e recursos humanos para realizar o projeto. Que todos os departamentos da empresa sintam-se integrados no projeto. O que vai "vender": entende-se vender como promover, anunciar, ou vender diretamente produtos. A quem vai "vender": devemos identificar nosso ncleo de usurios extremos que nos ajudaro a posicionar o produto de uma forma mais definida que se nos dirigssemos diretamente aa grande audincia. Como vai "vender": aqui onde entram os temas de logstica, ateno ao cliente, design do produto e web. Uma vez vendido, o que fazemos: importante prever que ocorrer amanh quando nossos clientes j tiverem comprado os produtos. Fidelidade, promoes, seguimento... O primeiro prottipo. Com todos os requisitos coletados nos primeiro passos, poderemos comear a pensar em como vamos construir nosso site. Recomenda-se que a equipe que esteja nesta fase seja multidisciplinar (como mnimo, programao, design, contedo e um coordenador de equipe). Recomenda-se que o coordenador saiba algo de todas as matrias, (servidor, web, design, contedos) porque ser a pessoa encarregada de criar pontes entre os diferentes departamentos e de chegar a consensos quando surjam problemas de competncia. Com esta equipe se realizar um projeto que servir para aproximarmos da idia de nosso site. Este projeto ser produzido a um nvel quase real para que seja provado por usurios. Teste de usurio. Uma vez produzido o prottipo, faremos nosso primeiro teste de usurio. O teste de usurio nos ajudar a enriquecer o produto observando o comportamento do usurio, vendo as virtudes de nosso produto e, sobretudo, todos aqueles pontos dbeis que possa apresentar. Com o teste de usurio se realizar um novo prottipo que se deveria se possvel, ser testado novamente. Lanamento. Uma vez que tivermos o prottipo ajustado faltar a parte de realizao tcnica. Deve-se dispor do tempo disponvel para ajustar o prottipo realidade, mas no se deve encontrar novos obstculos nesta fase. Para evitar estes novos obstculos, necessrio a total transparncia dos departamentos na hora de realizar o prottipo, ou seja, conhecer todas as possibilidades existentes dentro da operativa, ver o "pior dos casos existentes", ver como funciona "o primeiro dia", etc... Por ultimo, recomenda-se passar uma fase de "emisso de provas", ou seja, lanar o site e prova-lo em real (conexes com mdem, operativa real, ver resposta do correio ou do call center no caso de que existam, etc..)

Princpios gerais de usabilidade em web sites

Resumo: Embora estes princpios podem parecer muito gerais, so a base da disciplina e de sua extrapolao e perfeita compreenso permite resolver qualquer casustica concreta.

Os designs de web sites devem seguir os seguintes princpios: 1. Antecipao, o web site deve antecipar-se s necessidades do usurio. 2. Autonomia, os usurios devem ter o controle sobre o web site. Os usurios sentem que controlam um web site se conhecem sua situao em um meio abrangente, mas no infinito. 3. H que utilizar as cores com precauo para no dificultar o acesso aos usurios com problemas de distino de cores (aprox. 15% do total). 4. Consistncia, as aplicaes devem ser consistentes com as expectativas dos usurios, ou seja, com sua aprendizagem prvia. 5. Eficincia do usurio, os web sites devem centrar-se na produtividade do usurio, no no prprio web site. Por exemplo, s vezes as tarefas com maior nmero de passos so mais rpidas de realizar para uma pessoa que outras tarefas com menos passos mas mais complexas. 6. Reversibilidade, um web site h de permitir desfazer as aes realizadas 7. Lei de Fitts indica que o tempo para alcanar um objetivo com o mouse est em funo da distncia e do tamanho do objetivo. A menor distncia e maior tamanho mais facilidade para usar um mecanismo de interao. 8. Reduo de tempo de latncia. Torna possvel otimizar o tempo de espera do usurio, permitindo a realizao de outras tarefas enquanto se completa a prvia e informando ao usurio do tempo pendente para a finalizao da tarefa. 9. Aprendizagem, os web sites devem requerer um mnimo processo de aprendizagem e devem poder ser utilizados desde o primeiro momento. 10. O uso adequado de metforas facilita a aprendizagem de um web site, mas um uso inadequado destas pode dificultar enormemente a aprendizagem. 11. A proteo do trabalho dos usurios algo prioritrio, deve-se assegurar que os usurios nunca percam seu trabalho por conseqncia de um erro. 12. Legibilidade, a cor dos textos deve contrastar com a do fundo, e o tamanho de fonte deve ser suficientemente grande. 13. Continuao das aes do usurio. Conhecendo e armazenando informao sobre seu comportamento prvio deve-se permitir ao usurio realizar operaes freqentes de maneira mais rpida. 14. Interface visvel. Deve-se evitar elementos invisveis de navegao que h de ser inferidos pelos usurios, menus desdobrveis, indicaes ocultas, etc. Outros princpios para o design de web sites so: Os usurios devem ser capazes de alcanar seus objetivos com um mnimo esforo e com resultados mximos. Um web site no pode tratar o usurio de forma hostil. Quando o usurio comete um erro o sistema deve solucionar o problema, ou por padro sugerir varias solues possveis, mas no emitir respostas que meramente informem do erro culpando o usurio. Em nenhum caso um web site pode ir abaixo ou produzir um resultado inesperado. Por exemplo, no devem existir links quebrados.

Um web site deve se ajustar aos usurios. A liberdade no uso de uma web site um termo perigoso, quanto maior for o nmero de aes que um usurio possa realizar, maior ser a probabilidade que cometa um erro. Limitando o nmero de aes ao pblico objetivo facilita-se o uso de um web site. Os usurios no devem sofrer sobrecarga de informao. Quando um usurio visita um web site e no sabe por onde comear a ler, existe sobrecarga de informao. Um web site deve ser consistente em todos os passos do processo. Embora possa parecer apropriado que diferentes reas tenham designs diferentes, a consistncia entre os designs facilita ao usurio o uso de um site. Um web site deve prover de um feedback aos usurios, de maneira que estes sempre conheam e compreendam o que acontece em todos os passos do processo.

O que a Interao Pessoa-Computador A investigao em IPO/HCI leva padronizao da usabilidade, sua melhora e apoio emprico. O enfoque cientfico da IPO/HCI inclui uma variedade de ferramentas e tcnicas que ajudam a desenvolver melhores interfaces de usurio. Nota: A Interao Pessoa-Computador mais conhecida pelo seu nome em ingls, HumanComputer Interaction e suas siglas HCI (a seguir utilizaremos as siglas IPO/HCI)

Breve histria As origens da IPO/HCI h que busc-las no ramo da Psicologia Aplicada que estuda a Interao Pessoa-Computador. As duas disciplinas das quais surge a IPO/HCI so as chamadas "Human Factors" e a Ergonomia (na verdade a mesma disciplina, o primeiro termo utilizado nos E.U.A.e o segundo na Europa). Atualmente, o uso destes termos no est claramente estabelecido e inclusive s vezes so utilizados de forma indistinta. O predomnio tradicional na IPO/HCI foi doa engenheiros, embora a influncia da psicologia crescente. A Psicologia a disciplina que estuda a percepo, a memria, a aquisio de habilidades e a aprendizagem, a resoluo de problemas, o movimento, as tarefas de juzo, de busca ou processamento de informao e da comunicao, ou seja, processos todos cujo conhecimento se requer para o adequado desenho de mecanismos de interao do usurio. Embora a Psicologia Cognitiva seja uma cincia muito jovem em relao s investigaes de carter bsico e sistemtico, existem atualmente suficientes achados baseados em resultados empricos que permitem o desenvolvimento da IPO/HCI e, conseqentemente, de web sites adaptados aos usurios. A IPO/HCI tambm uma disciplina jovem, mas no tanto como pudesse parecer. Desde o primeiro computador foi necessrio o desenho de um sistema de comunicao pessoa-computador. Os estudos nesta disciplina permitiram dar uma base terica ao desenho e avaliao de aplicaes informticas. A importncia desta disciplina coloca-se sobre relevo ao ler artigos sobre o tema escritos h quarenta anos nos quais se prediziam de interao dos que se dispem atualmente. Uma das associaes mais influentes neste campo a ACM SIGCHI (Association for Computing Machinery's Special Interest Group on Computer-Human Interaction) que desde 1982 rene aos melhores especialistas em IPO/HCI. Os primeiros estudos especficos de IPO/HCI apareceram nos anos sessenta e referiam-se simbiose Pessoa-Computador (Licklider, 1960). Este autor afirmou antecipando-se problemtica posterior que o problema da interao homem-computador no criar computadores produtores de respostas, e sim, que sejam capazes de antecipar e participar na formulao das perguntas. Licklider e Clark (1962) elaboraram uma lista de 10 problemas que deveriam ser resolvidos para facilitar a interao pessoas-computador. Segundo ele, os cinco primeiros problemas deveriam ser resolvidos de forma imediata, o sexto em um tempo intermedirio e os quatro ltimos, a longo prazo: 1. Compartilhar o tempo de computadores entre muitos usurios. 2. Um sistema de entrada-sada para a comunicao mediante dados simblicos e grficos. 3. Um sistema interativo de processo das operaes em tempo real. 4. Sistemas para o armazenamento massivo de informao que permitam sua rpida recuperao.

5. Sistemas que facilitem a cooperao entre pessoas no design e programao de grandes sistemas. 6. Reconhecimento por parte dos computadores da voz, da escritura manual impressa e da introduo de dados a partir de escritura manual direta. 7. Compreenso da linguagem natural, sinttica e semanticamente. 8. Reconhecimento da voz de vrios usurios pelo computador. 9. Descobrimento, desenvolvimento e simplificao de uma teoria de algoritmos. 10. Programao heurstica ou atravs de princpios gerais. O tempo demonstrou que Licklider e Clark estavam certos na maioria de suas observaes, entretanto, atualmente ainda no se conseguiu realizar alguns dos problemas previstos para sua resoluo a longo prazo. Hansen (1971) em seu livro "User Engineering Principles for Interactive Systems" faz a primeira enumerao de princpios para o design de sistemas interativos: 1. Conhecer o usurio 2. Minimizar a memorizao, substituindo a entrada de dados pela seleo de tems, usando nomes ao invs de nmeros, assegurando-se um comportamento previsvel e provendo acesso rpido informao prtica do sistema. 3. Otimizar as operaes mediante a rpida execuo de operaes comuns, a consistncia da interface e organizando e reorganizando a estrutura da informao baseando-se na observao do uso do sistema. 4. Facilitar boas mensagens de erro, criar designs que evitem os erros mais comuns, tornando possvel desfazer as aes realizadas e garantir a integridade do sistema no caso de um falho de software ou hardware. Apesar da obviedade e antiguidade destes princpios fcil encontrar em web sites de comrcio eletrnico cdigos imemorveis para identificar produtos, mensagens de erro ininteligveis e, em geral, um maltrato constante ao usurio.

APLICAES WEB: USABILIDADE + PRATICIDADE = SUCESSO

Graas aos novos conceitos de webdesign que se incorporaram nestes ltimos anos, possvel ver sites que oferecem servios simples, porm com uma simplicidade e facilidade de uso que conseguem captar a ateno de um grande pblico at conseguir tornar atrativo o que oferecem. Desta forma vemos sites que oferecem aos usurios aplicaes em linha prticas e muito usveis (agendas, administradores de bookmarks, diretrios temticos, administradores de fotografias, etc). No inovam nada, verdade, s aperfeioam servios que sempre estiveram de uma ou outra maneira. Um dos fatores que produziram esta tendncia simplificao absoluta a web 2.0 que trata de pensar unicamente no usurio. Desta maneira, criam-se sites muito otimizados e muito fceis de usar. Onde os acessos so mais freqentes porque o acesso no se limita a um nico grupo de usurios com conhecimentos tecnolgicos. Desta forma, vemos que as caractersticas dos usurios so muito diferentes entre si (idades, conhecimentos, velocidade de acesso, etc) A pergunta , como se consegue estes tipos de sites altamente usveis? O tema vai muito mais alm do que possamos falar nesse artigo. Entretanto, podemos dar algumas sugestes. Resuma tudo mnima expresso: Os usurios necessitam ler somente o necessrio. Nem mais nem menos. Isto se aplica tanto ao que escrevemos como guia de usos como para grupo de links. Evite as extensas listagens de links. Se no puder reduzir a quantidade de links, utilize um gerador de tagclouds para tornar tudo mais "encontrvel". Crie mais categorias hierarquizadas e ordenadas corretamente, use listagens de registros curtas. Simplifique o aspecto: Isto no significa descuidar do design de seu site, no! Trata-se de otimizar e conseguir mediante poucos recursos grficos um bom design. Para isto, deve-se ter em mente os principais conceitos de design. Uma grande ajuda o uso de CSS e XHTML. Entretanto, so muitos os criadores de sites que descarregam todas suas balas no aspecto impactante de seu site. Isto est muito bem. Porque uma coisa uma aplicao web onde o usurio interage com muitas funes, e outra coisa um site comercial de um produto ou servio que se tem que destacar por como se apresenta. Imagens como referncias: Muitos caem no erro de no utilizar nenhuma imagem para referenciar ou destacar determinada seo, por temor a pecar em seu uso e entorpecer o design ou usabilidade. A verdade que todas as provas e estatsticas do tipo "heatmap" mostram que os usurios clicam quase deliberadamente sobre as imagens. Desta forma se necessita dar prioridade a determinada pgina pode utiliz-las. Fontes de letras e suas propriedades: A moda da web 2.0 implementa quase obrigatoriamente o uso de fontes de grande tamanho (16px ou mais). Isto outorga uma facilidade de leitura aprecivel. Entretanto, o abuso deste recurso pode fazer com que utilizemos mal os espaos vazios to necessrios no design. por isso que a variao dos tamanhos e cores de fontes junto com as propriedades clssicas das tipografias (negrito, cursiva, etc) faro com que nossa mensagem seja entendvel. Uso de AJAX O uso de AJAX no garante o sucesso em uma aplicao web. A grande quantidade de tempo invertido em horas de programao pode fazer com que tanto os tempos como os custos de programao se disparem. Entretanto, convm destacar que muito valorizado pelos usurios quando as interfaces so intuitivas, dinmicas e prticas. O uso adequado desta tecnologia pode facilitar enormemente nosso trabalho de usabilidade. A idia que s se utilize quando for necessrio. Concluso: O sucesso de uma aplicao web, depende, como dissemos ao princpio deste artigo, de mltiplos fatores. Porm, no h dvidas de que a facilidade de uso, tanto em usabilidade como no processo de utilizao outorgam um valor agregado considervel. Basta checar uma listagem de aplicaes web 2.0 e veremos que os servios em linha que triunfaram so muito usveis, outorgam uma experincia agradvel e provem um servio simples, porm prtico.

HEURSTICAS DE USABILIDADE EM WEBSITES Jacob Nielsen

1) Feedback - O sistema deve informar continuamente ao usurio sobre o que ele est fazendo. 10 segundos o limite para manter a ateno do usurio focalizada no dilogo. 2) Falar a linguagem do usurio - A terminologia deve ser baseada na linguagem do usurio e no orientada ao sistema. As informaes devem ser organizadas conforme o modelo mental do usurio. 3) Sadas claramente demarcadas - O usurio controla o sistema, ele pode, a qualquer momento, abortar uma tarefa, ou desfazer uma operao e retornar ao estado anterior. 4) Consistncia - Um mesmo comando ou ao deve ter sempre o mesmo efeito. A mesma operao deve ser apresentada na mesma localizao e deve ser formatada/apresentada da mesma maneira para facilitar o reconhecimento. 5) Prevenir erros - Evitar situaes de erro. Conhecer as situaes que mais provocam erros e modificar a interface para que estes erros no ocorram. 6) Minimizar a sobrecarga de memria do usurio - O sistema deve mostrar os elementos de dilogo e permitir que o usurio faa suas escolhas, sem a necessidade de lembrar um comando especfico. 7) Atalhos - Para usurios experientes executarem as operaes mais rapidamente. Abreviaes, teclas de funo, duplo clique no mouse, funo de volta em sistemas hipertexto. Atalhos tambm servem para recuperar informaes que esto numa profundidade na rvore navegacional a partir da interface principal. 8) Dilogos simples e naturais - Deve-se apresentar exatamente a informao que o usurio precisa no momento, nem mais nem menos. A seqncia da interao e o acesso aos objetos e operaes devem ser compatveis com o modo pelo qual o usurio realiza suas tarefas. 9) Boas mensagens de erro - Linguagem clara e sem cdigos. Devem ajudar o usurio a entender e resolver o problema. No devem culpar ou intimidar o usurio. 10) Ajuda e documentao - O ideal que um software seja to fcil de usar (intuitivo) que no necessite de ajuda ou documentao. Se for necessria a ajuda deve estar facilmente acessvel on-line

Direo do olhar na tela do computador

Eduardo Rangel Brando

Dissertao de Mestrado - Publicidade on-line, Ergonomia, Usabilidade Este artigo apresenta a maneira como os olhos das pessoas se movimentam ao longo de interfaces grficas digitais. Acredita-se que seja de extrema importncia o conhecimento dos padres de visualizao de dados em telas computadorizadas, pois esta a nica maneira de posicionar, com eficcia, ttulos, barras de navegao, ilustraes, entre outros elementos que formam a interface. No caso da publicidade na internet, saber o local da tela para onde os indivduos costumam olhar pode render bons resultados durante a transmisso de mensagens. De acordo com STRAUSS e FROST (2001), por exemplo, um banner veiculado no topo de uma pgina da internet costuma ser visualizado por 5 milhes de usurios em uma semana. Explorao visual e reas de maior visibilidade da tela De acordo com LYNCH e HORTON (2004), ao visualizarem uma interface grfica digital, primeiro os usurios vem as telas como grandes massas de formatos e cores, com os elementos do primeiro plano contrastando com a rea de fundo. Em seguida, os usurios comeam a identificar informaes especficas, inicialmente atravs dos grficos (quando presentes), e somente ento eles comeam a analisar gramaticalmente o texto e a ler as palavras e frases que o compem.

Figura 10: explorao visual da tela do computador ao longo do tempo.

LYNCH e HORTON (2004) tambm afirmam que, obviamente, as 30 polegadas quadradas da parte superior da tela do monitor compreendem a rea mais visvel de uma interface. Os 10 ou 12 centmetros superiores so a parte que estar mais visvel. Logo, a posio dos elementos faz toda a diferena. Em interfaces projetadas para oferecer uma navegao eficiente, por exemplo, a densidade de links no topo da pgina deve ser mxima.

10

Figura 11: rea visvel da tela do computador, em um monitor com a resoluo de 1024 x 768 pixels.

Estratgias de busca visual Segundo AUMONT apud CHUEKE (2004), tentou-se prever as trajetrias de explorao de uma imagem pelo olho, mas se no for dada uma ordem explcita, essas trajetrias tornam-se uma rede de linhas quebradas. O nico resultado constantemente verificado apresenta-se sob a possibilidade de modificar esta trajetria de explorao, atravs da introduo de ordens particulares de visualizao, o que normal em vista da seguinte afirmao: um olhar informado desloca-se de outro modo no campo que explora.

Figura 12: o grfico acima representa a trajetria de explorao da imagem pelo olho (AUMONT apud CHUEKE, 2004). Por causa deste processo de explorao de uma imagem pelo olho, a interface deve ser projetada e customizada de acordo com ordens particulares de visualizao. De acordo com GOLDSMITH apud CHUEKE (2004), a explorao da interface grfica digital divide-se em 7 zonas de visualizao. Primeiro o olhar direciona-se para o lado superior esquerdo da tela. Depois, movimenta-se da esquerda para a direita. Em seguida, o olhar desce para a parte inferior esquerda da interface grfica digital e a partir deste ponto, passa a explorar as extremidades da tela. Num primeiro momento, explora a extremidade superior esquerda, depois explora a extremidade superior direita. Ento, o olhar dirige-se para a extremidade inferior esquerda, finalizando com um movimento na direo da extremidade inferior direita. Atravs da representao a seguir, possvel observar a trajetria de explorao visual de uma interface grfica digital.

11

Figura 13: leitura ordenada e consciente na cultura ocidental (GOLDSMITH apud CHUEKE, 2004).

COLLARO apud CHUEKE (2004) determina uma forma de explorao visual mais simplificada da interface grfica digital. Conforme possvel observar na representao a seguir, a tela divide-se em 4 zonas, sendo que a trajetria do olhar segue apenas 2 destas zonas, ou seja, vai do canto superior esquerdo direto para a parte inferior direita da interface grfica digital. As outras 2 reas (canto superior direito e parte inferior esquerda) so consideradas como zonas mortas e quase no despertam a ateno dos olhos. Para um indivduo perceber a informao contida nestas zonas mortas, ser necessria uma explorao visual mais consciente e demorada.

Figura 14: zonas de leitura (COLLARO apud CHUEKE, 2004). Em culturas diferentes da ocidental, onde o sentido da leitura realizado da direita para a esquerda, estes processos de explorao visual da interface grfica digital talvez sejam invlidos. Respostas conclusivas s podero ser dadas aps a realizao de testes que captam a trajetria do movimento dos olhos em telas onde o sentido natural de leitura se d da direita para a esquerda.

12

Figura 15: Windows na sua verso em rabe, onde o sentido natural de leitura da tela se d da direita para a esquerda (CHUEKE, 2004). Para FANG e PEI-LUEN (2003) importante considerar as diferenas culturais dos sites. A internet constituda por uma rica base de dados organizados em hipertextos, cujo objetivo principal a publicao de informaes em um formato eletrnico para uma audincia mundial. O grande nmero de pginas e de dados desestruturados na rede mundial de computadores cria dificuldades para os usurios buscarem por informaes especficas. Ainda de acordo com FANG e PEI-LUEN (2003), o crescimento da world wide web e o fato de muitos sites atingirem audincias internacionais, implicam que os efeitos culturais sejam muito importantes para o desenvolvimento de pginas da internet. Estudos que exploram o impacto da usabilidade em diferentes pases ainda so pequenos. A maioria dos sites voltados para audincias internacionais tem a sua lngua traduzida para cada regio especfica. No caso do portal Yahoo!, por exemplo, possvel observar que o seu layout no sofre modificaes, mesmo quando este site traduzido para regies e culturas completamente diferentes, conforme a sua verso norte americana e a sua verso chinesa, observadas a seguir. No entanto, importante ressaltar que adaptar uma interface para fazer a mesma se adequar aos usurios de outros pases no se limita apenas a essa traduo dos textos de uma lngua para outra. Elementos como formato dos nmeros, smbolos, imagens, cores, funcionalidades, entre outros, tambm representam um papel importante e devem ser considerados durante o desenvolvimento de projetos de interfaces grficas digitais.

13

Figura 16: site Yahoo! em sua verso norte americana.

Figura 17: site Yahoo! em sua verso chinesa.

Apesar dos poucos testes onde o sentido da leitura em interfaces grficas digitais da direita para a esquerda, importante ressaltar que isto no significa que os processos de explorao visual apresentados por CHUEKE (2004) estejam errados. Acredita-se que, pelo menos nas telas computadorizadas desenvolvidas para uma audincia ocidental, as trajetrias de explorao de uma interface pelo olho seguem os movimentos descritos at o momento. O estudo de OUTING e RUEL (2004), gerentes de projeto do EYETRACK III, pode fundamentar o pargrafo anterior, apesar deste estudo apresentar leves diferenas no padro dos movimentos oculares relatados anteriormente. OUTING e RUEL (2004) realizaram uma pesquisa, com 46 usurios, para descobrir como os olhos de uma pessoa se movimentam ao longo da tela do computador. De acordo com as suas concluses, primeiro os olhos fixam-se no topo esquerdo da interface grfica digital. Ento, deslocam-se ao longo desta rea, explorandoa rapidamente, at moverem-se para o lado direito da tela. S depois de explorar a parte superior da interface por alguns segundos, os olhos dirigem-se para a parte de baixo da tela. Dependendo do layout da interface, este padro pode variar. A imagem a seguir uma representao dos movimentos oculares mais comuns ao longo de diversas telas de computador.

14

Figura 18: representao dos padres de movimentos oculares mais comuns ao longo de diversas telas de computador.

Ainda de acordo com OUTING e RUEL (2004), o instinto das pessoas faz com que elas olhem para a rea localizada no canto superior esquerdo da tela, conforme possvel observar na representao de reas de prioridade a seguir. Sendo assim, ao desenvolver uma interface grfica digital, deve-se dar grande importncia para as informaes que estaro contidas nestas reas de prioridade.

Figura 19: representao das reas de prioridade nas interfaces grficas digitais.

OUTING e RUEL (2004) tambm descrevem que as pessoas costumam olhar para os elementos textuais da interface antes dos seus olhos se fixarem em fotos ou grficos. Em pginas com muita informao textual, por exemplo, ttulos e manchetes captam a ateno do olhar, especialmente quando esto localizados na parte superior esquerda da tela. Muito freqentemente, mas nem sempre, ttulos e manchetes tambm podem captar a ateno dos olhos quando esto posicionados na parte superior direita da interface. Fontes menores encorajam o comportamento de leitura das palavras, enquanto fontes maiores promovem a varredura da pgina (pessoas lem apenas as primeiras palavras e s do continuidade ao processo caso a sua ateno seja despertada por estas palavras).

15

Figura 20: movimento dos olhos ao longo da tela de um site.

Para OUTING e RUEL (2004), a navegao posicionada no topo da pgina possui o melhor desempenho, pois visualizada pela maior porcentagem de pessoas num perodo de tempo maior. Pode ser surpreendente, mas OUTING e RUEL (2004) tambm observaram uma maior fixao dos olhares, atravs de perodos de visualizao mais duradouros, nos casos onde havia a presena de uma barra de navegao vertical no lado direito da tela, ao invs do lado esquerdo. Embora seja um novo fator a ser considerado (pessoas no esto acostumadas a observar menus de navegao no lado direito das interfaces), isto pode indicar que no h razo para no colocar uma barra de navegao no lado direito da pgina, usando o lado esquerdo da tela para contedo editorial ou para exposio de anncios (banners).

16

Figura 21: mudana de posio da barra de navegao, para o lado direito da tela, e dos anncios ou contedo editorial, para o lado esquerdo da tela. No caso dos anncios, OUTING e RUEL (2004) constataram que os banners localizados no topo e nas partes esquerdas da interface receberam mais ateno dos olhares. Em contrapartida, banners localizados no lado direito da tela no obtiveram um bom desempenho (visualizados, em mdia, pela tera-parte das pessoas que navegaram na interface). Anncios separados do contedo textual, atravs de um espao em branco ou uma linha, obtiveram menos fixaes de olhares do que os casos onde no havia tal separao. Banners em forma de texto foram visualizados de forma mais intensa, com uma mdia de durao da observao em torno de 7 segundos. Em comparao, anncios em forma de grficos apresentaram uma mdia de 1 segundo e meio. RETTIE, GRANDCOLAS e MCNEIL (2004) relatam que os usurios da internet evitam olhar para os banners. Mas apesar de no olharem diretamente para estas peas publicitrias, percebem os anncios on-line atravs da sua viso perifrica. Ainda de acordo com RETTIE, GRANDCOLAS e MCNEIL (2004), os usurios mais experientes gastam menos tempo processando as informaes de cada pgina, olhando para menos partes de cada site. No entanto, eles tambm afirmam que as pessoas com menos experincia olham com mais facilidade para os banners, gerando uma alta taxa de cliques sobre estes anncios. Isto ajuda a explicar o declnio destas taxas de cliques com o passar dos anos, pois na medida que o pblico da rede mundial de computadores torna-se cada vez mais experiente, diminui a propenso mdia das atitudes que visam clicar sobre um banner. Ao tratar de grficos, OUTING e RUEL (2004) afirmam que tanto para imagens quanto para anncios (banners) prevaleceu a mesma regra bsica: o tamanho do grfico importa. Quanto maior a imagem, ou o banner, maior o tempo que as pessoas permaneceram olhando para a mesma. Imagens com um tamanho mnimo de 210 x 230 pixels, geralmente, foram melhores visualizadas por mais da metade das pessoas que utilizaram interfaces grficas digitais. RETTIE, GRANDCOLAS e MCNEIL (2004) tambm afirmam que as taxas de cliques sobre os banners aumentam na medida que o tamanho destes anncios cresce (banners maiores possuem um melhor ndice de cliques sobre os mesmos). Mas constatou-se que a utilizao de imagens nos anncios on-line no surtiu nenhum efeito significativo, embora esperassem que a presena elementos grficos fosse capaz de aumentar as taxas de cliques. Mas no se pode deixar de ter em mente que, independente do tamanho do anncio on-line ou da utilizao de grficos bem elaborados, a indstria, as marcas, os produtos e a criatividade empregada nos anncios tambm iro afetar a maneira como os usurios reagem aos banners. Concluso Segundo AMANTINI et al (2002), uma peculiaridade da mente humana que nossa memria visual muito mais duradoura que a memria textual. por isso que temos muito mais facilidade de esquecer um nome que um rosto. Desta forma, a construo da interface grfica digital deve ser simples, pois quanto mais simples, mais cognitivo. Sendo mais cognitivo, atingir a compreenso do usurio que ir utilizar esta interface de forma menos cientfica e mais emprica.

17

Complementando a afirmao anterior, BARROS et al (2004) explicam que a interface deve ser vista como uma embalagem. Ela deve conter certas caractersticas como: facilidade de aprendizagem, simplicidade de uso e emitir clareza. Caso a interface no possua esses itens, certamente ocorrero problemas. Para LYNCH e HORTON (2004), o sucesso de uma interface depende de uma diagramao forte, lgica e padronizada (todas as pginas que compem um site, por exemplo, devem ser apresentadas de maneira uniforme) das suas telas. A meta estabelecer uma abordagem coerente dos locais onde aparecem os elementos bsicos da identidade visual, os links de navegao e outras informaes essenciais para a pgina. Sem a adoo de padres de projeto razoveis e coerentes, o usurio sofrer de confuso, produtividade reduzida e oportunidade perdida para beneficiar-se dos recursos da informao apresentada. Atravs da padronizao, os indivduos entendero as mensagens com mais facilidade. Na internet, por exemplo, essa padronizao no existe, mas passados alguns anos, certas convenes j so utilizadas e respeitadas. Para NIELSEN apud MEMRIA (2003), as pessoas gastam mais tempo em outros sites, com isso, tudo que fosse uma conveno e utilizado na maioria destes outros sites seria fixado de forma muito forte em suas mentes. No caso da publicidade veiculada na internet, tambm h o emprego de formatos e posicionamentos especficos na tela. Esta preocupao com a determinao de padres para as peas publicitrias on-line busca, justamente, facilitar a visualizao do anncio e transmitir a sua mensagem com maior eficcia. Porm, a maioria das pginas da internet muito poluda, tem muita informao. A pea publicitria precisa disputar a ateno do usurio com o resto da pgina para transmitir sua informao e, por ltimo, gerar o intento do clique. Este excesso de informao causa dificuldades de compreenso dos anncios. A navegao dos sites tambm um outro ponto crtico, pois depende da maneira como os usurios lem a tela. Em culturas orientais, por exemplo, o padro de leitura da direita para a esquerda, o que influi na percepo dos itens dispostos em uma interface. Caso o banner utilize cones, isto tambm pode gerar rudos de comunicao entre pblicos de diferentes regies, uma vez que tais elementos trabalham com metforas que so extradas do ambiente onde o usurio vive. Por isso, sua interpretao para cada um destes smbolos ser extremamente pessoal. As cores e a maneira como empregada em uma determinada tela, tambm representam problemas, pois so interpretadas de maneiras diferentes de acordo com a cultura ou rea do planeta. Por causa destes motivos, destaca-se a importncia de se conhecer o movimento dos olhos dos usurios ao longo de interfaces grficas digitais. Saber como as pessoas sentem e, em seguida, percebem a informao, pode ajudar a minimizar diversos problemas de interao destes indivduos com as telas computadorizadas. Entre as vrias categorias de problemas, possvel citar a dificuldade de visualizao das mensagens dos anncios online. Vale ressaltar que o fato de conhecer o padro de direo do olhar na tela do computador no garante a resoluo de todos estes problemas de interao entre os homens e as interfaces grficas digitais. Sempre haver telas especficas com problemas particulares, onde ttulos, barras de navegao e posio dos textos, por exemplo, podem causar algum tipo de confuso ou distrbio para o usurio. Mas isto no significa que as informaes deste captulo devem ser descartadas. Uma vez que as reas mais visualizadas da tela foram apresentadas, os elementos da tela que precisam receber ateno devem ser posicionados nas regies mais importantes da interface grfica digital. Logo, se uma mensagem em forma de banner deve ser enviada para grande parte da audincia da rede mundial de computadores, por exemplo, preciso ter conscincia do local da tela que capaz de promover o maior ndice de visualizao desta informao.

Referncias Bibliogrficas AMANTINI, Susy N. Silva R.; UENO, Thas Regina; CARVALHO, Rodrigo Ferreira de; SILVA, Jos Carlos Plcido da. Ergonomia, cores e web-sites. In: Congresso Brasileiro de Ergonomia, 12., 2002, Recife. Anais... Recife: ABERGO - Associao Brasileira de Ergonomia, 1 a 5 set. 2002. 6 p. BARROS, Vanessa Tavares de Oliveira; MAGER, Gabriela; MARTINS, Rosane Fonseca de Freitas; ZERBETTO, Cristiane Affonso de Almeida. Cor e seu emprego em interfaces homem-computador na web. In: Congresso Brasileiro de Pesquisa e Desenvolvimento em Design, 6., 2004, So Paulo. Anais... So Paulo: FAAP - Fundao Armando Alvares Penteado, 13 a 16 out. 2004. 6 p. CHUEKE, Jacques. Apresenta_P&D_fim.ppt A evoluo da ateno em direo s interfaces digitais e a world wide web. So Paulo, 13 out. 2004. Microsoft Power Point 7.0. FANG, Xiaowen; PEI-LUEN, Patrick Rau. Culture differences in design of portal sites. Ergonomics, vol. 46, n. 1-3, p. 242-254, 2003.

18

LYNCH, Patrick J.; HORTON, Sarah. Guia de estilo da web: princpios bsicos de design para a criao de web sites. 2 ed. Barcelona: Editorial Gustavo Gili, 2004. 225 p. MEMRIA, Felipe Ferraz Pereira. Usabilidade de interfaces e arquitetura da informao: navegao estrutural. In: Congresso Internacional de Ergonomia e Usabilidade, Design de Interfaces e Interao Homem-Computador, 2., 2003, Rio de Janeiro. Anais... Rio de Janeiro: LEUI - Laboratrio de Ergonomia e Usabilidade de Interfaces em Sistemas Humano-Tecnologia, 6 e 7 jun. 2003. 6 p. OUTING, Steve; RUEL, Laura. The best of Eyetrack III: what we saw when we looked through their eyes. Eyetrack III, 2004. Disponvel em <http://www.poynterextra.org/eyetrack2004/main.htm>. Acesso em: 12 dez. 2004. RETTIE, Ruth, GRANDCOLAS, Ursula, MCNEIL, Charles. Post-impressions: internet advertising without clickthrough. Academy of Marketing Conference, Gloucester, 11 p. 2004. Disponvel em: <http://www.kingston.ac.uk/~ku03468/docs/Post%20Impressions%20Internet%20 Advertising%20without%20ClickThrough%20whole.doc>. Acesso em: 02 out. 2004. STRAUSS, Judy, FROST, Raymond. E-marketing. 2 ed. New Jersey: Prentice- Hall, 2001. 519 p.

19

PGINAS FLUIDAS
Resumo. 1. Pginas fluidas: definio. 2. Para notcias e texto pode ser vlido ter uma pgina que se redimensiona. 3. Para aplicaes "web" melhor usar tamanhos fixos. 1. Pginas fluidas: definio. Dentro do esquema geral de uma pgina web existem vrias opes: Que a pgina esteja centrada ou justificada esquerda. Que a pagina tenha um tamanho fixo ou que se adapte ao tamanho do navegador. Quando o tamanho da pgina se adapta s dimenses do navegador temos uma pgina fluida. Esta adaptao se consegue fazendo as tabelas que compem nossa pgina com tamanhos relativos (%). Amazon.com uma pgina fluida que se pode seguir como exemplo. 2. Para notcias e texto intensivo melhor usar pginas fluidas. Para pginas com texto e notcias melhor criar pginas "fluidas" j que no prejudicamos a navegao em resolues de monitor baixas (640x480) e sim que aproveitamos o uso de monitores com maior resoluo ao oferecer mais informao na parte superior (menos scroll). 3. Para aplicaes "web" melhor usar tamanhos fixos. No caso de aplicaes "web" tipo "web mail", "carrinho de compra" e formulrios, melhor usar pginas com tamanho fixo j que em monitores com resoluo de tela superior a 1024 a distncia entre a informao e os botes, muito grande e se perde o contexto (botes situados na margem direita e o campo de texto na margem esquerda). Isto no evita que possamos ter a pgina construda com zonas "fluidas" e zonas rgidas. Dentro de uma mesma pgina, zonas de botes e navegao bom conservar o tamanho fixo e em zonas de informao melhor oferecer uma soluo "fluida".

20

REDUZA O PESO DE SEU SITE

Resumo. 1. Pginas mais leves incrementam o nmero de pginas vistas. 2. Elimine as imagens. Elimine os banners de auto-promoo (no do benefcios). 3. Aproveite tudo o que o sistema operacional lhe oferece (botes, cores, tabelas, tipografias). 4. Seja flexvel com as limitaes do HTML. Reduza o peso de seu site. Reduzir o peso de um site em um 20% equivale a incrementar em um 20% o nmero de pginas vistas. O peso das pginas um obstculo que faz com que o nmero de pginas vistas se reduza por sesso de usurio. Peso das pginas Site A Site B Total peso / velocidade de conexo Em uma sesso de 30segs baixam 3 pginas. baixam 6 pginas.

30kbs de html + 20kbs de 50kbs / 5kbs/seg imagens 15kbs de html + 10kbs de 25kbs / 5kbs/seg imagens

Tomando como constantes o tempo de conexo e a velocidade de download, a varivel onde um site pode levar vantagem para servir mais pginas reduzindo o peso. Reduzindo o peso podemos fazer com que o usurio baixe mais informao com o mesmo tempo de conexo. O reduzir o peso das pginas no tem porque requerer mudanas dramticas. Conseguir uma reduo de 10-20% do peso global do site pode supor um grande adianto em relao concorrncia. Em um site onde as pginas so baixadas com rapidez no d preguia clicar nos botes. No s se trata de cuidar dos usurios com modem. Se as pginas pesam pouco e a resposta da web s peties do usurio rpida e gil, no d preguia continuar clicando para comprovar dados e colher mais informao. Se o site pesa e cada petio exige um tempo de carregamento, o usurio se desanima e parar de pedir informao com o qual no finalizar seu trabalho de forma satisfatria. Na Internet vital que um sistema responda de forma rpida para transmitir valores de qualidade, confiana e segurana. melhor criar 3 pginas de 10kbs que 1 de 30kbs. Na Internet conta mais o acessar informao precisa do que a muita informao. Oferecer pginas leves onde o usurio possa tomar decises rpidas sobre avanar ou retroceder vital. O caminho para a informao final (onde poderemos criar pginas mais completas) deve estar composto de pginas simples que ofeream rotas claras. O oferecer todas as rotas no ajuda a tomar uma deciso. melhor oferecer uma pgina simples e que seja o usurio que tome a deciso de continuar ou retroceder, mas no tente prende-lo oferecendo muitas opes. A regra bsica para criar pginas de 10kbs evitar colocar tudo em cada pgina. Muitos sites "arrastam" os menus de navegao de todo o site em todas as pginas enquanto que em geral indicado a posio do usurio no site junto a um boto de "home" e um buscador resolveriam todas as dvidas. Elimine o grafismo. Isto inclui os banners de auto-promoo. O nico grfico necessrio o logo de seu site. Se for relevante, inclua fotografias do produto, notcias ou ilustraes da atividade.

21

No coloque banners de auto-promoo. Se seu site incluir banners, procure coloc-los s quando tiver um patrocinador real. Se no o tiver evite colocar banners internos. Esto incrementando o peso da pgina, sua utilidade mais ou menos nula e estaro criando cegueira no usurio. O problema dos grficos duplo. O peso costuma ser alto e geram uma conexo com o servidor que costuma atrasar o envio do resto de informao. Procure usar os grficos essenciais. Quanto menos pesar sua pgina, mais satisfeito estar seu usurio. Aproveite o que o sistema lhe der. Botes, tabelas, palheta de cores, tipografias, select menus. O sistema operacional lhe oferece uma grande quantidade de ferramentas que sabendo combinar podem lhe ajudar a substituir grande parte do grafismo do seu site. As tipografias que o sistema oferece so limitadas, porm, mais que suficientes para criar ttulos, botes, etc. No use imagens para criar "s ttulos". As tabelas e as cores do sistema costumam ser mais que suficientes para criar todo tipo de botes, layouts, etc. A austeridade deste estilo pode ser enriquecida com grficos bem selecionados e fotos. Procure utilizar tudo o que o HTML cria por padro como as listas e bullets. O querer mudar o sistema s gera pginas mais lentas, ningum vai apreciar a melhora se afinal o site for mais lento. Concentre as foras em oferecer contedo de qualidade e em criar ferramentas que funcionem mais rpido. Seja flexvel com as limitaes do HTML. O principal motivo pelo qual as pginas baixam devagar porque os designers (grficos e programadores) das pginas, pretendem impor seu "estilo de design" a um suporte que tem certas caractersticas. A preciso do HTML algo um pouco brusco em relao ao manejo de tipografia, pargrafos, margens e justificaes, mas melhor saber se mover com agilidade dentro destes limites que impor base de cdigos e grficos uns limites que no melhoram o funcionamento do site. Seja flexvel com a ferramenta e tudo funcionar de forma mais rpida.

22

FATORES DETERMINANTES NO USO DE FONTES

Este artigo no pretende ser um guia sobre todas as variveis que fazem o bom uso das fontes de letras, mas sim, trata de aproximar os conceitos mais importantes que funcionam na hora de conseguir designs de qualidade. Peso Fala-se do peso de uma fonte no sentido de "volume" ou "peso" que percebe o observador sobre um texto ou logo. Nesse sentido, uma fonte ligeira normalmente estilizada, de traos muito magros ou finos, com muito ar ou zonas livres. A aplicao deste tipo de fonte est mais bem dirigida ao rubro editorial ou ao design de tela especfico. Pelo contrario, uma fonte de letra "pesada" volumosa, de traos largos, slida, com muito pouco "ar" em suas formas. Ideal para aplicar em cartazes, logos, ttulos, etc. digno de apreciar os diferentes efeitos que se podem conseguir aplicando diferentes pesos a nossas tipografias. Contraste e cor A combinao da cor de fundo com a cor de composio mais o peso de uma fonte gera outro importante efeito, o contraste. Os fundos claros ou brancos em fontes de cor escura produzem um efeito de limpeza e ordem que requer por exemplo, um web site. O ideal para textos de leitura, que se escolham fundos claros e fontes bem definidas. Entretanto, o uso acertado de fundos com cores intensos produz muito bons efeitos tambm, por exemplo, em um folheto impresso, se pode utilizar muito este recurso. Por exemplo: fontes cor celeste, com um fundo azul intenso. No h parmetros que determinem que cores usar e como us-las. Porm, vale esclarecer que se deve buscar a harmonia tonal ou a boa associao de grupos de cores. Separao entre signos Outra importante varivel na aparncia de uma fonte a separao entre si de um caractere e outro. Pode-se obter muito bons efeitos aplicando esta propriedade a nossas fontes. O escolher uma fonte de letra com muita verticalidade e pouca separao conseguir uma difcil leitura "rpida". Entretanto, as fontes de letras expandidas sobre o "horizonte" permitem a leitura rpida que requer, por exemplo; um grande cartaz ou um poster. Em desenhos verticais, aconselhvel utilizar larguras de linha curtas e separaes estreitas. Sendo o contrrio, em desenhos mais horizontais, aconselhvel recorrer a caracteres espaados. A longitude da linha e entrelinhas Uma linha muito longa, impressa em um corpo de letra menor, na qual se inclui muitas palavras, entorpece a leitura, pela dificuldade que supem passar de uma linha a outra. A leitura sobre monitores sugere um desafio comodidade do leitor. aconselhvel que o leitor no se encontre com linhas de texto nem longas nem curtas demais. O ideal, no caso de textos de leitura utilizar uns 400px. Entretanto, sobre este tema no podemos estabelecer padres porque as variveis so muitas. As entrelinhas o termo tipogrfico que descreve o espao vertical entre as linhas. A entrelinha se usa para dar maior legibilidade s linhas de um texto, quando estas so longas e esto compostas em um corpo pequeno recomendvel usar uma entrelinha que duplique a altura da fonte de letra. Por exemplo, se usarmos 10px, a entrelinha poder ser de 20px. Efeitos, uso e Abuso (Concluso) Tanto se usarmos fontes de letras no web design como no design impresso, no se devem abusar dos efeitos. Principalmente, porque a idia do desenho sempre deve ser comunicar algo e no de "impressionar". H anos atrs se tratava de aplicar a maior quantidade de efeitos possveis sobre as fontes de letras com a idia de "atrair" ao leitor ou observador. Embora a idia do desenho no tenha mudado, hoje se consideram melhores recursos para "atrair".

23

USABILIDADE E ACESSIBILIDADE: CONCEITOS MUITO DIFERENTES

Muitas vezes ouvimos ou lemos sobre a usabilidade e acessibilidade web, geralmente tendemos a pensar que so uma mesma coisa, porm a verdade que so totalmente diferentes. Analisando os comportamentos dos usurios, a Usabilidade nos oferece diferentes tcnicas, para realizar uma tarefa (de forma simples e eficaz em um ambiente grfico relacionado com a web). Podemos mencionar as principais tcnicas de usabilidade:

Autonomia, os usurios devem ter o controle sobre o site. O usurio manda, seria semelhante regra do cliente que sempre tem a razo. Na web qualidade igual a rapidez. (mais de 20 segundos ou 80% dos visitantes ir embora sem ver a pgina) Se o site no carrega imediatamente, deve colocar um pr-carregamento, assim o usurio permanece no site. Devem funcionar todos os links. O site deve ser simples, para que os usurios se sintam cmodos e no se percam cada vez que necessitem encontrar algo na pgina Web. Colocar breves concluses ao princpio ajuda ao usurio a encontrar o que busca em pouco tempo. Escreva os contedos resumidos um 25% do que colocaria em um papel (ler em tela custa muito) No sobrecarregar de informao aos usurios, devem se realizar percorridos de leitura, ficando a vista qual a informao principal e qual a secundria. As cores devem ser utilizadas com precauo para no dificultar o acesso aos usurios daltnicos (aprox. um 15% do total). Utilizar interfaces conhecidas, os sites devem requerer um mnimo processo de aprendizagem. Legibilidade, a cor dos textos deve contrastar com a do fundo, e o tamanho de fonte deve ser suficientemente grande.

Concluindo poderamos dizer que os usurios devem ser capazes de alcanar seus objetivos com um mnimo esforo e com resultados mximos. Falar de Acessibilidade Web falar de um acesso universal Web, independentemente do tipo de hardware, software, infra-estrutura de rede, idioma, cultura, localizao geogrfica e capacidades dos usurios. Por exemplo, uma web deixa de ser acessvel quando para poder visualiz-la corretamente necessitamos um plugin especial ou navegador. Ento, a idia fazer a web acessvel para todos os usurios independentemente das circunstncias e dos dispositivos utilizados na hora de acessar informao. Uma pgina acessvel o ser tanto para uma pessoa com deficincia, como para qualquer outra pessoa que se encontre sob circunstncias externas que dificultem seu acesso informao. J sabemos agora a diferena entre usvel e acessvel, s falta coloc-las em prtica.

24