O documento discute princípios de usabilidade na internet, incluindo a importância de facilitar o uso, princípios de design de interface e avaliação de usabilidade. Aborda também técnicas para melhorar a organização da informação e divulgação de conteúdos online de forma a promover uma melhor experiência do usuário.

1. UsabilidadeTecnologias Dinâmicas para a Internet1

2. Grupo 5 2Fábio Santos | 38156Jessica Simões | 38732KarolinaGonzalez | 48513Ricardo Marques | 35725Universidade de Aveiro 09

3. USABILIDADE = FACILIDADE DE USO

4. Facilidade de uso é obter afirmações......e não interrogações!Boa Navegabilidade.Alcance de objectivos de formaeficaz, eficiente e simples.

5. Princípios Usabilidade

6. Aprendizagem | Eficiência | Memorização | Erros | Satisfação

7. REGRAS

8. Clareza na arquitectura da informaçãoFacilidade de navegação Simplicidade A relevância do conteúdo Coerência Rapidez Foco na experiência do usuário

9. QUESTÕES

10. Questões com foco no utilizador (o que um utilizador não deverá perguntar)Questões com foco no criador Missão do site Público Alvo

11. Vantagens| Desvantagens

12. VantagensSatisfaz o utilizador que visite o sitePermite que o utilizador encontre o que procura (ler, comprar, jogar, etc.)Aquisição de fealdade do utilizador ao site

13. DesvantagensNão ajuda o utilizador na procura de informação; Causa frustração ao utilizador por não obter o que procura; Perda do utilizador para a concorrência;

14. Avaliação de Usabilidade

15. Aspectos(1) Avaliar a extensão das funcionalidades de um sistema(2) Avaliar os efeitos da interface no utilizador(3) Identificar eventuais problemas específicos no sistemaDix et al.’s (1998, pp. 406-407)

16. Metodologias

17. Categorização dos métodos e testes de usabilidade - Dixet al. (1998, pp. 405-435) apresentam uma divisão hierárquica; - BenShneiderman (1998, pp. 124-151) apresenta uma visão mais linear; - Apesar desta diferença, ambos Dixet al. e Shneiderman discutem técnicas e métodos semelhantes.

18. Heurísticas

19. (1) Viabilidade do estado do sistema(2) Consistência entre o sistema e o mundo real(3) Controle e liberdade para o usuário(4) Consistência e padrões(5) Prevenção de erros(6) Reconhecimento em vez de lembrança(7) Flexibilidade e eficiência de uso(8) Desenho estético e minimalista(9) Auxílio no reconhecimento, no diagnóstico e na recuperação de erros(10) Ajuda e documentação

20. COERÊNCIA DA NAVEGAÇÃO

21. PRINCIPIOS BÁSICOS

22. Apresentar claramente a navegação principal ou global; Acesso claro e rápido para a página inicial ; Explorar a utilização de cabeçalhos e rodapés; Usar com cautela gráficos como parte da navegação; Manter a consistência na selecção de cores atribuídas às ligas epáginas visitadas; Ajudar o utilizador quanto à sua localização no site (breadcrumb);

23. DESENHO DE INTERFACE

24. CONVENÇÕES

25. WIREFRAME

26. DIRECTIVAS

27. BOAS VINDASNão oferecer "Boas Vindas" ou "Bem-Vindo" no site;Utilizar o espaço de "Boas Vindas"/"Bem-Vindo" para publicar um slogan ou logótipo referente ao site;

28. INFORMAR OBJECTIVO DO SITE

29. CONTEÚDO

30. ARQUIVO / ACESSO A CONTEÚDO ANTERIOR

31. LINKS

32. NAVEGAÇÃO

33. PESQUISA

34. ATALHOS

35. IMAGENS E ANIMAÇÕES - I

36. IMAGENS E ANIMAÇÕES - II

37. DESIGN GRÁFICO - I

38. DESIGN GRÁFICO - II

39. DESIGN GRÁFICO - III

40. COMPONENTES DE INTERFACE COM O UTILIZADOR

41. TÍTULOS DE JANELAS

42. URL’S – BONS EXEMPLOS

43. URL’S – MAUS EXEMPLOS

44. JANELAS POP-UP / JANELAS INTERMÉDIAS- IIIEvitar Janelas intermediárias aquando o digitar do URL pelo utilizador; O URL deve redireccionar o utilizador para a página inerente ao URL digitado; Evitar Janelas de Pop-up (omitem a homepage, são confundidas com publicidade, dificultam a navegação a utilizadores inexperientes ou com dificuldades motoras);

45. PUBLICIDADE - I

46. COMUNICAR PROBLEMAS / EMERGÊNCIAS

47. ACTUALIZAÇÃO DE PÁGINASNão actualizar a homepage automaticamente (provoca a perda de atenção e interesse do utilizador caso este esteja a visualizar algum conteúdo no momento de actualização); Aquando de uma actualização, não modificar conteúdo que não foi modificado, actualizar apenas acrescentando novo conteúdo ou aquele que foi modificado (ex: actualizações de notícias num jornal online);

48. OBTENÇÃO DE DADOS DO CLIENTEAquando de um registo explicar ao cliente as suas vantagens; Não fornecer links de registo na homepage;

49. EXEMPLOS A EVITAR

53. Boas práticas por linguagemInovar SIM!Mas com modos…53

54. 54Loading…BoringPassados10segundosResultado: Backspace

55. DicasSaber o que o utilizador querDefinir bem objectivo do siteNão descuidar na usabilidade55

56. Organização da informação56

57. Organização da informação57Dividir a informação em unidades lógicas. Estabelecer uma hierarquia por ordem de importância e generalidade. Usar esta hierarquia para estabelecer relações entre trecho de informação

58. Organização da informaçãoLinear58

59. Organização da informaçãohierarquicamente59

60. Organização da informaçãoPoli-hierarquicamente60

61. Organização da informaçãoEm rede61

62. Disposição dos conteúdos62

63. 63Disposição dos conteúdosAlfabética

64. Disposição dos conteúdosCronológica64

65. Disposição dos conteúdosGeográfica65

66. Disposição dos conteúdos66Miscelânea

67. Disposição dos conteúdos67Tarefa

68. Disposição dos conteúdosPúblico-alvo68

69. Disposição dos conteúdos69Tag Cloud

70. Usabilidade Conteúdos70

71. O título é o elemento mais importante!71

72. Um bom título:Rico e conciso Deverá conter as palavras-chave Confirmar a informação que se segue Não revelar tudo72

73. O sumário é o segundo elemento mais importante!73

74. O sumário deve:Conter os principais pontos Não fornecer todas as informações74

75. TextosPouco textoColunas estreitasEspaços em branco75

76. Divulgação de conteúdos76

77. Media Display e Rich MediaSearch Engine MarketingPay-Per-ClickE-mail MarketingRedes sociais virtuaisLink BuildingCusto por Mil ImpressõesCusto por AcçãoMedia tradicionais77

78. 1. Media Display e Rich MediaSão constituídos por banners .Constituídos por uma mensagem e um estímulo para clicar.78

79. 2. SearchEngine Marketing (SEM)Tem como objectivo obter o melhor posicionamento dos Websites nos resultados naturais ou orgânicos dos motores de pesquisa.79

80. 2. SearchEngine Marketing (SEM)Boas práticas:Título sucinto e coerente com o conteúdoPalavra-chave que melhor caracteriza o sitePalavras-chave mais específicas obtém um melhor posicionamentoUma boa estratégia de SEO80

81. 3. Pay-Per-Click (PPC)O anunciante apenas paga por cada clique efectuado no anúncio.VantagensVisitantes qualificados para o WebsiteResultados imediatosFácil e rápido de implementarA campanha segmentada ao público-alvoDesvantagensAs fraudes! Podem acontecer quando uma pessoa ou um script automático imitam um utilizador normal da Web e o anúncio é clicado vezes sem conta81

82. 4. Email MarketingMarketingonline directo para comunicação comercial ou campanhas de sensibilização.Boas práticas-Personalização do e-mail-Medir resultados, calendarizar as acções efectuadas-Segmentar muito bem o público-alvo-Informação bastante clara e objectiva acima de tudo-Corrigirerrosque ocorram (e-mails considerados spam, e-mails inválidos, utilizadores não identificados, etc.)82

83. 5. Redes sociais virtuaisTwitterTwittadFacebookFacebookAdsYoutubeBrandChannelMasthead Video BannerBoas práticasPlanos diferentes para cada rede virtualCriar vinculações marca-cliente83

84. 6. Link Building84Boas práticasEscrever e distribuirartigosoriginaisna WebEscrever e publicar comunicados de imprensa na WebTer o site bem optimizado

85. 7. Custo por Mil ImpressõesO utilizador paga por 1000 vezes que o anúncio for publicado independentemente de ser clicado ou não858. Custo por AcçãoO utilizador paga quando o utilizador cumpre uma tarefa pré definida, como por exemplo a conclusão do formulário de venda.

86. 9. Media TradicionaisSentido da comunicação: emissorreceptorReceptor passivoEnvolve gastos elevadosMedia OnlineSentido da comunicação: emissor receptorReceptor activoPode não envolver gastosComunicação e informação em tempo realSelectividade86

87. Web semântica 3.087máquina inteligente

88. Toda a linguagem tem sintaxe e semântica88

89. Sintaxe estuda a gramática89

90. Semânticaestuda o significado90

91. O Problema91

92. Páginas web são feitas em html92

93. HTML trata da estrutura(sintaxe) da informação e não da semântica!93

94. Computadores comunicam por números10101010110101011010010010101010101010010100101010101001100101001011111011010111010101010011001011111000101001110101010100101094

95. Pessoas comunicam por palavrasBidé corvina pesmacwindows frango chuveiro aroma catinga amor odeio paixão comer chorar jogar brincar ajax flash comunicar aritmética matemática português 95

96. Se os computadores entenderem as letras por trás dos números96

97. Poderão “entender” o que nos interessaPoderão ajudar-nos a encontrar o que queremos Maior Usabilidade97

98. 98

99. Meta-informação99

100. Estruturas de dados sobre os próprios dados, uma breve descrição do conteúdo da página100

101. DicasTagssimples e concisasPrioridade às palavras-chave mais importantesEvite o uso da meta tagREFRESHNãoabuse das meta tagsPara o Google, elas não existem101

102. MICROFORMATOS102

103. Simples convenções para agregar a semântica ao HTML103

104. VantagensProvidenciam uma maneira estandardizada e fácil de catalogar os conteúdosPor ser opensource, facilitam o desenvolvimento de ferramentasLigação entre o conteúdo online e aplicações como o Outlook ou iCalDotam o conteúdo de significado para as máquinasPoupam tempo e esforço ao utilizador, logo aumentam a usabilidade104

105. EXEMPLOSHcardhCalendarGeoEntre outros105

106. OBRIGADO PELA ATENÇÃO106