TAW Tópicos de Ambiente Web Teste rveras@unip.br Aula 11
Agenda Usabilidade Compatibilidade Validação Resolução de tela Velocidade de carregação Acessibilidade
Testes
Nesta etapa do projeto do web site os componentes da interface são testados metodicamente para garantir a ausência de erros e a aderência aos requisitos definidos nas etapas anteriores. Os erros devem ser registrados e corrigidos Os testes do site em versão beta são críticos para a avaliação do produto antes do lançamento. Devem ser realizados em várias etapas e de forma que haja tempo útil para a sua avaliação e para a realização dos ajustes que se mostrarem necessários Depois do lançamento do site, os testes também se mostram necessários, em função da observação do uso pelos usuários, para entender em detalhe suas ações e preferências e para traçar seus perfis com mais precisão Por exemplo, se os usuários não estão chegando às camadas mais profundas de informações, testes presenciais de usabilidade ajudam a apontar os motivos (se há problema no sistema de navegação ou em relação aos rótulos dos links) Devido à complexidade do projeto de web sites, vários testes devem ser aplicados, como: Usabilidade Compatibilidade Validação Resolução de tela Velocidade de carregação Acessibilidade
Testes de Usabilidade Os testes de usabilidade de um web site verificam se o usuário médio tem controle das suas ações ao lidar com a interface, se acha facilmente as informações que precisa e também se a funcionalidades dos links, formulários e recursos tecnológicos atende as suas necessidades Os testes têm como objetivo o aperfeiçoamento do design, da arquitetura da informação, da abordagem editorial do conteúdo e, de modo geral, da experiência do usuário na sua visita a um web site Devem ser feitos em várias etapas do projeto, com usuários representativos do público-alvo Se, por exemplo, o site publicar notícias, deve-se procurar representantes dos leitores interessados nestas notícias. Se vender produtos, os testes devem ser feitos com possíveis compradores O número de usuários testados deve ser compatível com as funcionalidades a serem testadas. Há alguma discordância entre os especialistas sobre o número mínimo de usuários necessários à realização de testes satisfatórios, que varia entre 5 e 20. Estes usuários podem ser recrutados pelos próprios projetistas ou pela empresa contratante do projeto De qualquer forma, quanto menos usuários, maior a margem de erro dos resultados (tabelas de cálculo da margem de erro em http://www.raosoft.com/samplesize.html e http://www.measuringusability.com/wald.htm) Quanto mais funcionalidades puderem ser testadas por pessoa, melhor, mas é importante que os testes não sejam longos, para não cansar os usuários
de Usabilidade Condições de realização Tanto os testes, como os critérios para a sua avaliação, são únicos e variam de acordo com os objetivos e o escopo de cada site (e de cada aspecto testado). Os resultados obtidos não devem ser reutilizados em outro projeto Dependendo da etapa em que são aplicados, os testes podem ser realizados a partir de modelos em papel (para avaliação de decisões estruturais), de modelos estruturais estáticos (wireframes) ou interfaces em HTML, com ou sem o layout definido. O critério de uso de cada suporte depende do grau de precisão dos resultados esperados, da rapidez e dos custos com que se precisa obter os resultados Durante a realização do projeto quanto mais rapidamente estes testes de rotina forem realizados, maiores as chances de proverem informações preciosas para o ajuste das interfaces no momento do seu desenvolvimento Os testes podem ser feitos remotamente (através de uma interface, num passo-apasso de etapas seqüenciais) ou na presença de técnicos responsáveis por sua aplicação Estudos comparativos verificaram que os testes presenciais costuma apontaram problemas de usabilidade que não foram registrados nos testes remotos, e são portanto mais completos que os testes remotos
de Usabilidade Atividades relacionadas: Os três processos listados a seguir devem ser combinados. A separação visa apenas à identificação de cada processo Aplicar questionário para usuários representativos do público-alvo, com questões sobre uso, funcionalidade e conteúdo Acompanhar "ao vivo" o uso da interface, com narração em voz alta dos movimentos, verificando a repetição de padrões de comportamento (testes com 5 a 10 usuários para avaliações genéricas); registro em vídeo ou em áudio, uso de programa de data-logging Considerar o uso de "checklists" para avaliação Conselho Nacional de Arquivos - diretrizes gerais para a construção de websites de instituições arquivísticas Massachutets Institute of Technology - MIT - Usability guidelines Governo dos Estados Unidos - Usability basics É importante manter a perspectiva que, apesar da sua importância, os resultados dos testes de usabilidade não são incontestáveis. Devem ser reafirmados por meio de outras métricas de avaliação, como as baseadas em estatísticas de acessos, por exemplo, que ajudam a compor uma perspectiva mais ampla da opinião e das ações dos usuários Se por um lado a popularidade de um site não informa se tem interface funcional e adequada aos seus usuários, por outro a boa usabilidade pode não se mostrar suficiente para garantir as vendas esperadas num site de comércio A boa receptividade do canal pelo público é resultado de uma série de fatores combinados, que devem ser examinados separadamente para permitir o ajuste adequado de cada uma das variáveis Depois do lançamento do canal, a realização periódica (anual, bianual) de testes da interface, de preferência por consultores ou agentes externos, permite a verificação dos padrões de comportamento dos usuários do site a partir de situações do cotidiano de acesso
Testes de Compatibilidade O público da web usa uma ampla variedade de browsers e plataformas, com diferentes configurações, recursos e interpretações dos padrões web. Muitos apresentam inconsistências na interpretação dos códigos de página a página O ajuste do código para cada programa ou o uso de padrões web para a definição do layout ajuda a contornar os problemas causados por estas diferenças No entanto, deve-se testar uma página em tantos browsers, plataformas e dispositivos quanto for possível, para permitir uma percepção mais precisa da sua forma e das suas funcionalidades, bem como para permitir um acesso apropriado pela maior parte dos usuários A programação deve ser também compatível com versões antigas dos navegadores, na medida em que os usuários se preocupam cada vez menos em atualizar suas versões dos navegadores e programas adicionais, como plug-ins De qualquer forma, mesmo que o código não funcione perfeitamente numa plataforma ou programa, é importante que ao menos a estrutura da página e seu conteúdo se mantenham estruturados Os Testes de Compatibilidade verificam as páginas em várias versões de browsers, com ou sem o uso de plugins. Pode-se através deles avaliar o site em vários tipos de plataformas e dispositivos e verificar como a página é interpretada por cada um dos usuários do site a partir de situações do cotidiano de acesso
de Compatibilidade Atividades relacionadas Testar a interface em diferentes versões de: Programa navegador (Internet Explorer, Opera, Firefox, Mozilla) Nos navegadores utilizados, é importante verificar:» Se as páginas são compreensíveis sem uso de javascript» Se o usuário pode navegar sem o uso de plug-ins» Se o usuário pode navegar sem visualizar imagens Sistemas operacionais (PC, Macintosh, Linux) Dispositivos, inclusive em aparelhos móveis ou emuladores Avaliar os três browsers mais utilizados pela maioria dos usuários, em estatísticas de acesso gerais da web Outra opção é a realização de uma pesquisa para conhecer o perfil dos equipamentos e programas dos usuários mais freqüentes de um site específico
Validação Verifica se o site tem HTML ou XHTML válida ou compatível com standards web, para facilitar o carregamento das páginas nos diversos browsers e dispositivos móveis com acesso à web Verifica também se os arquivos de estilos CSS são compatível com os padrões web (inclusive as configurações de impressão das páginas), se o uso de divs é adequado E verifica se o site usa DOCTYPE (document type declaration) correto, de acordo com a versão de (X)HTML usada. Primeira declaração a ser inserida em uma página web, antes mesmo da marcação <html>, instrui o browser para lidar com o código ao começar a carregar uma página Esta verificação inclui também se há erros em linguagens de programação, como Javascript e em recursos dinâmicos como Ajax O browser utilizado pelo desenvolvedor pode ignorar alguns erros, mas algumas marcações erradas podem resultar em problemas de visualização em outros browsers Erros de validação devem ser aceitos apenas se há uma clara necessidade de uso de marcações fora dos standards e se os resultados foram satisfatórios na maioria dos browsers testados Verificação de links quebrados Atividades relacionadas Validar o código do site com ferramentas como W3C Validator ou WDG validator Validar os estilos CSS do site com ferramentas como W3C CSS Validator Checar os links do site via programa de desenvolvimento, como o Dreamweaver ou disponíveis online, como Link Valet (para verificar apenas algumas páginas) ou Xenulink (para a avaliação de sites inteiros)
Resolução de Tela Os testes do layout e da funcionalidade da interface em diversas resoluções são realizados para verificação da sua consistência em diversos dispositivos, com diversas configurações de hardware e software Em computadores, o uso de programas no ambiente desktop considera o tamanho de monitores a partir de 15', com resoluções de tela de 640 x 840, 768 x 1024 ou maior No entanto, se levamos em conta os diversos dispositivos de acesso à web, as larguras de tela variam de 200 pixels (em celulares) a 2000 ou mais pixels A medida do conjunto constituído por textos, imagens e elementos funcionais não necessariamente deve acompanhar a largura da janela do browser, mas levá-la em consideração para se manter estruturado Ou seja, a interface deve ficar compreensível em cada uma destas configurações (embora legível com mais clareza em algumas resoluções, direcionadas aos usuários prioritários) Na medida em que os monitores e as resoluções de tela aumentam, a medida das colunas de textos não deve se adaptar simplesmente a estes limites: a legibilidade de linhas muito longas e a estruturação de elementos gráficos fica prejudicada quando os blocos de textos acompanham mecanicamente a configuração-padrão de monitores muito largos É importante por isto avaliar não só que tipo de conteúdo deve ser disponibilizado para cada dispositivo como o seu modo de estruturação para cada resolução
Resolução de Tela Atividades relacionadas Adaptar o tamanho das fontes a configurações que tragam conforto visual para cada usuário: Algumas pessoas usam fontes de tela maiores do que o padrão, devido a problemas de visão. Outras mudam os tamanhos das fontes simplesmente porque usam monitores de alta resolução, em que as fontes ficam muito pequenas e ilegíveis Por outro lado, há usuários que preferem a leitura de textos com fontes pequenas É importante que cada usuário possa ajustar o tamanho das fontes do site no browser. Para isto, é importante verificar se os tamanhos de todos os textos da interface ficam dimensionáveis em escala apropriada (nos estilos CSS, o uso de marcações de texto baseadas em ems ou % torna os textos configuráveis pelos usuários) Testar a interface em várias resoluções disponíveis no ambiente de desenvolvimento Para resoluções maiores do que as dos dispositivos disponíveis, pode ser feita uma simulação em dispositivos móveis no Opera, com a ferramenta de zoom (não é muito precisa, mas ao menos os erros mais grosseiros ficam visíveis) Testar a interface em dispositivos móveis, com baixas resoluções Usar a propriedade do CSS2 max-width para limitar a largura máxima da janela do site
Velocidade de Carregamento Embora o uso da banda larga no Brasil tenha aumentado muito nos últimos anos, pesquisa sobre o acesso residencial à internet feita pelo Comitê Gestor da Internet do Brasil, a TIC Domicílios, mostra que em 2006 o tipo predominante de conexão foi o modem dial-up, com 49,06% dos acessos. Segundo a pesquisa, apenas 28,64% dos domicílios brasileiros acessaram a internet com banda larga, sendo os principais motivos alegados o alto custo das conexões e dos equipamentos Outra pesquisa, realizada pelo Ibope/NetRatings e divulgada em 2008, aponta que 81,5% dos 22,9 milhões de usuários residenciais acessaram a internet com uma conexão banda larga das suas residências Apesar das diferenças dos dados disponíveis, podemos ver que temos no país um número relativamente alto de usuários que acessam a internet por linha discada (4,2 milhões daquele total), usuários que precisam ser considerados no projeto dos sites web brasileiros Por isto, no projeto das páginas, é preciso verificar o tempo de carregamento tanto por linha discada como por banda larga, de forma a balancear os recursos oferecidos para os usuários com diferentes condições de acesso A partir desta verificação, pode-se reavaliar o tamanho médio das imagens publicadas e dos arquivos adaptados para a transferência de informações online
Velocidade de Carregamento Atividades relacionadas Verificar o tempo de carregamento das páginas em conexão por linha discada (56Kbps ou menos). Se uma página leva mais de 30 segundos para carregar, o site pode estar perdendo visitantes, que desistem de esperar e procuram outras páginas Publicar imagens, animações e vídeos que realmente se somem às informações em formato de texto Inserir imagens maiores e arquivos para download em camadas mais profundas, com aviso ao visitante sobre o tamanho do arquivo e seu formato
Testes de Acessibilidade Verificam a adesão a normas básicas de acessibilidade, de forma que o site seja navegável por usuários com alguma deficiência física Atividades relacionadas Navegar pelo site sem habilitação da visualização de imagens ou usando um programa simulador, como textbrowser emulator (ou o programa emulador do Opera 7), de forma a verificar como uma pessoa com problemas visuais navega pelo site. A visualização de imagens é desabilitada também por muitos usuários que dispõem de conexões lentas e preferem ler os textos a ver o layout completo da interface Verificar se todas as imagens dispõem de marcações alternativas, ou "alt", com a descrição do seu conteúdo Verificar se a estrutura do site se mantém compreensível com os estilos CSS desabilitados. Os estilos CSS devem estar configurados com unidades relativas para o dimensionamento de fontes, fios, localização de elementos, de forma que se adaptem à configuração de cada usuário Verificar se os formulários podem ser utilizados por usuários de browsers e programas de acesso para portadores de deficiências físicas Verificar se as cores utilizadas são contrastantes e a funcionalidade dos elementos críticos de navegação não se baseia nas cores destes elementos. Desta maneira há menos riscos de usuários com visão deficiente ou com problemas de distinguir entre cores (especialmente entre vermelho e verde) tenham dificuldade de se deslocar na estrutura de informações Navegar pelo site sem habilitação de JavaScript Verificar algumas páginas do site em ferramentas como Bobby ou Accessibility Valet