Aplicações Web Acessíveis. Carlos Rafael Gimenes das Neves

Tamanho: px
Começar a partir da página:

Download "Aplicações Web Acessíveis. Carlos Rafael Gimenes das Neves"

Transcrição

1 Aplicações Web Acessíveis Carlos Rafael Gimenes das Neves

2 Por onde vamos... Preocupe-se com o visual Lembra do teclado? Um mundo de faz de conta Juntando tudo: um controle acessível Bons links e referências 2 / 112

3 Preocupe-se com o visual Bons motivos para se preocupar com cores, tipos e sons, mesmo não sendo um designer! 3 / 112

4 Preocupe-se com o visual Antes de tudo... Todos já ouviram falar da W3C?!?!?! 4 / 112

5 Preocupe-se com o visual A W3C, World Wide Web Consortium, é a principal organização internacional responsável por padronizar quesitos relacionados à Web * Assunto paralelo: antes de reclamar ou elogiar um ou outro browser, sempre confira a especificação oficial ; ) 5 / 112

6 Preocupe-se com o visual Preocupada em levar o conteúdo da Web ao maior número de pessoas possível, a W3C criou o Web Content Accessibility Guidelines, ou WCAG, disponível em: O foco principal do WCAG são pessoas com diversos tipos de necessidades especiais, como problemas de visão, surdez, dislexia... 6 / 112

7 Preocupe-se com o visual O WCAG é um conjunto de diretrizes que se atentam a diversas características relacionadas com a experiência do usuário com conteúdo Web, como por exemplo: Sons Cores Animação Texto (tipos / fontes) 7 / 112

8 Preocupe-se com o visual O WCAG está atualmente na versão 2.0, e suas diretrizes são dividida em quatro grandes grupos: 1. Perceptibilidade 2. Usabilidade 3. Compreensibilidade 4. Robustez 8 / 112

9 Preocupe-se com o visual 1. Perceptibilidade 1.1 Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language. 1.2 Provide alternatives for time-based media. 1.3 Create content that can be presented in different ways (for example simpler layout) without losing information or structure. 1.4 Make it easier for users to see and hear content including separating foreground from background. * Conteúdo extraído do WCAG 2.0 na íntegra 9 / 112

10 Preocupe-se com o visual 2. Usabilidade 2.1 Make all functionality available from a keyboard. 2.2 Provide users enough time to read and use content. 2.3 Do not design content in a way that is known to cause seizures. 2.4 Provide ways to help users navigate, find content, and determine where they are. 10 / 112

11 Preocupe-se com o visual 3. Compreensibilidade 3.1 Make text content readable and understandable. 3.2 Make Web pages appear and operate in predictable ways. 3.3 Help users avoid and correct mistakes. 11 / 112

12 Preocupe-se com o visual 4. Robustez 4.1 Maximize compatibility with current and future user agents, including assistive technologies. 12 / 112

13 Preocupe-se com o visual No tempo que temos, não é possível discutir TODAS as diretrizes, então vamos a alguns exemplos práticos! :D 13 / 112

14 Preocupe-se com o visual Gosta de cores?! Que tal essas combinações... Texto Texto Texto Texto Texto Texto Texto Texto Texto 14 / 112

15 Preocupe-se com o visual Como saber se uma combinação de cores é legível?!?!?! 15 / 112

16 Preocupe-se com o visual Bom senso Matemática * A segunda tende a falhar menos!!! :) 16 / 112

17 Preocupe-se com o visual Junto com a WCAG, a W3C criou um conjunto de técnicas para auxiliar os desenvolvedores a atingirem o que é proposto pelas diretrizes Esse conjunto de técnicas está disponível em: 17 / 112

18 Preocupe-se com o visual Cálculo do contraste baseado na luminosidade relativa das cores: L = * CR * CG * CB CX é definido da seguinte forma (X varia de 0 a 1): se (X ) então CX = X / senão CX = ((X ) / 1.055) 2.4 * Extraído das técnicas G17 e G18 18 / 112

19 Preocupe-se com o visual Uma vez calculada a luminosidade relativa do texto e do fundo, obtém-se o contraste através da fórmula: Contraste = (L ) / (L ) Onde L1 é a maior luminosidade (dentre texto e fundo), e L2 é a menor 19 / 112

20 Preocupe-se com o visual Perfeito! Fiz todas as contas, mas... Ainda não sei se minha combinação de cores está boa... :( 20 / 112

21 Preocupe-se com o visual O documento que explica como trabalhar com esse valor de contraste está disponível em: 21 / 112

22 Preocupe-se com o visual Existem dois tipos de aprovação: Nível AA: contempla pessoas normais, ou com pouca perda de visão Nível AAA: comtempla pessoas com maior perda de visão, ou mais idosas 22 / 112

23 Preocupe-se com o visual Contraste mínimo para aprovação: Tamanho da fonte Nível AA Nível AAA < 18pt normal ou < 14pt negrito > 18pt normal ou > 14pt negrito 4.5 : 1 7 : 1 3 : : 1 23 / 112

24 Preocupe-se com o visual Experimentando na prática... carlosrafaelgn.com.br/aula/cores.html * Existem muitos outros sites onde isso também pode ser experimentado / 112

25 Preocupe-se com o visual Fica uma pergunta... Será que todos enxergam as mesmas cores?!?! 25 / 112

26 Preocupe-se com o visual Um causo real / 112

27 Preocupe-se com o visual Existem diversos tipos de daltonismo... Há pessoas que só enxergam preto, branco e tons de cinza Há outras cuja visão não capta corretamente o vermelho, ou o verde, ou o azul / 112

28 Preocupe-se com o visual Exemplos reais de quem se preocupa com isso / 112

29 Preocupe-se com o visual 29 / 112

30 Preocupe-se com o visual 30 / 112

31 Preocupe-se com o visual 31 / 112

32 Preocupe-se com o visual 32 / 112

33 Preocupe-se com o visual Vamos a alguns exemplos práticos... carlosrafaelgn.com.br/aula/cores.html 33 / 112

34 Preocupe-se com o visual Outros fatos e técnicas interessantes... Pessoas com alguns tipos de dislexia não conseguem compreender corretamente textos que utilizam fontes com serifa (dessa forma, por exemplo) Aqui existe bastante informação sobre isso: 34 / 112

35 Preocupe-se com o visual Técnica G19: Nenhum componente deveria piscar mais de três vezes por segundo Técnica G11: Elementos que piscam devem piscar por no máximo cinco segundos, para não distrair Técnica G56: Quando existir um áudio contendo voz, o volume a voz deve ser pelo menos 20dB maior que o volume do som de fundo 35 / 112

36 Resumindo... Branco e preto sempre funciona ;) Verifique a legibilidade dos textos nos elementos Teste as cores antes de liberar o documento ao usuário Se depender de cores, procure utilizar formas ou ícones com desenhos diferenciados 36 / 112

37 Lembra do teclado? Utilizando esse velho amigo na época do swipe, touch e slide 37 / 112

38 Lembra do teclado? Qual a diferença básica entre esses dois documentos... (além do título)?!?! Teclado01A.html Teclado01B.html 38 / 112

39 Lembra do teclado? A diferença é que o da direita (B) confunde o usuário!!!... Quer ver?! 39 / 112

40 Lembra do teclado? Vamos ao código simplificado de ambos: <div> <div>item 1:... </div> <div>item 2:... </div> <div>item 3:... </div> <div>item 4:... </div> </div> Teclado01A.html <div> <div>item 1:... </div> <div style="...">item 4:... </div> <div>item 3:... </div> <div style="...">item 2:... </div> </div> Teclado01B.html 40 / 112

41 Lembra do teclado? O que ocorre... No documento A, a exibição da tela coincide com a ordem dos elementos no código HTML Já no documento B, a exibição da tela foi simulada através de estilos CSS, e a ordem da tela NÃO coincide com a ordem do código HTML 41 / 112

42 Lembra do teclado? Por padrão, o cursor se move de acordo com a ordem dos elementos no código HTML! Mas / 112

43 Lembra do teclado? Novamente, qual a diferença básica entre esses dois documentos... (além do título)?!?! Teclado02A.html Teclado02B.html 43 / 112

44 Lembra do teclado? E, de novo... A diferença é que o da direita (B) confunde o usuário!!!... Quer ver?! 44 / 112

45 Lembra do teclado? Vamos ao código simplificado de ambos: <div> <div>item 1: <input type="text" /></div> <div>item 2: <input type="text" /></div> <div>item 3: <input type="text" /></div> <div>item 4: <input type="text" /></div> </div> Teclado02A.html <div> Teclado02B.html <div>item 1: <input type="text" tabindex="0" /></div> <div>item 2: <input type="text" tabindex="3" /></div> <div>item 3: <input type="text" tabindex="1" /></div> <div>item 4: <input type="text" tabindex="2" /></div> </div> 45 / 112

46 Lembra do teclado? O comportamento padrão do cursor é seguir a ordem dos elementos no código HTML, de cima para baixo......mas o atributo tabindex altera a ordem padrão dos elementos * Elementos com tabindex iguais são percorridos na ordem dos elementos no código HTML 46 / 112

47 Lembra do teclado? Antes que alguém conclua que o atributo tabindex é malvado (ou qualquer outro adjetivo), um exemplo prático para comparar dois cenários, onde os botões na verdade são controles personalizados (mais sobre isso depois...) Teclado03A.html Teclado03B.html 47 / 112

48 Lembra do teclado? No documento A foi possível navegar pelos botões através do teclado, diferente do documento B Quem foi o responsável por isso?... tabindex 48 / 112

49 Lembra do teclado? O atributo tabindex é responsável por permitir que um elemento como div, receba o foco do teclado No caso, todos os botões do documento A possuem tabindex igual à 0, para que a navegação do cursor siga a ordem do código HTML 49 / 112

50 Lembra do teclado? * Fato interessante: Vamos dar uma olhada no atributo outline nos estilos CSS do documento A / 112

51 Lembra do teclado? Como o estilo dos nossos botões foi bem bolado, modéstia à parte :), os botões já possuem uma indicação visual bem marcante quando o botão possui o foco do teclado Assim, pode-se remover o outline utilizando a combinação destruidora do CSS: 0 none transparent 51 / 112

52 Lembra do teclado? Afinal, por que o teclado é tão importante? 52 / 112

53 Lembra do teclado? Pessoas com deficiência visual geralmente navegam pelos documentos sem o auxílio de mouse ou toque, apenas com o auxílio do teclado, leitores de tela, ou outros dispositivos táteis, como telas em braile 53 / 112

54 Lembra do teclado? Além de utilizar o teclado para navegar linearmente pelos documentos, as pessoas fazem uso de atalhos para acelerar a navegação e poder ir mais rapidamente para locais específicos do documento Os atalhos mais comuns são: títulos e links 54 / 112

55 Lembra do teclado? Ia mostrar duas imagens iguais, de novo, mas ficaria muito repetitivo... Vamos logo para o exemplo! :) * Para constar: Teclado03A.html e Teclado03B.html 55 / 112

56 Lembra do teclado? O que é possível tirar disso? Não basta falsificar, ou simular (para usar uma palavra mais branda) a aparência do documento Visualmente, as pessoas até podem entender que determinada área do documento está destacada, mas quando não se pode enxergar / 112

57 Lembra do teclado? Opa! Já ia me esquecendo! Não tem muita relação com o teclado, mas... Alguém reparou no alerta verde que apareceu nos exemplos? Voice switch from en to pt-br Isso é porque os documentos foram devidamente formatados com o atributo lang="pt-br", que indica o idioma do conteúdo 57 / 112

58 Lembra do teclado? O atributo lang é utilizado pelo leitor de telas para ajustar sua voz para o idioma apropriado, ou ao menos emitir um alerta, caso não possua uma voz compatível Ele também é utilizado para auxiliar alguns serviços de tradução automática / 112

59 Resumindo... Mesmo nos tempos de touch é importante fornecer meios para navegar pelo documento através do teclado O teclado beneficia não só as pessoas com necessidades especiais, mas também pessoas que utilizam um sistema todo dia (pense em um sistema com listas, formulários e cadastros sem teclado...) 59 / 112

60 Um mundo de faz de conta Nem tudo é o que parece, pelo menos de acordo com o WAI-ARIA 60 / 112

61 Um mundo de faz de conta Em um passado não tão distante, os únicos controles encontrados em documentos HTML eram os controles disponibilizados pelo padrão HTML 61 / 112

62 Um mundo de faz de conta Graças a uma série de fatores, como: Maior adoção dos padrões Web Maior compatibilidade entre browsers JavaScript com mais funcionalidades e mais robusto Novas funcionalidades disponibilizadas pelos padrões HTML e CSS Cada vez mais, controles personalizados têm tomado conta da Web 62 / 112

63 Um mundo de faz de conta Os controles personalizados fornecem mais controle (desculpe o trocadilho...) sobre sua aparência, além de comportamentos mais complexos Exemplo: carlosrafaelgn.com.br/aula/spriteanim.html 63 / 112

64 Um mundo de faz de conta A criação de controles personalizados consiste basicamente em alterar elementos comuns como div, span, ul, li, dando-lhes aparência e comportamento bem diferentes! 64 / 112

65 Um mundo de faz de conta Contudo... O que é o controle ao lado? 65 / 112

66 Um mundo de faz de conta Pode até parecer uma árvore... Mas na verdade / 112

67 Um mundo de faz de conta É um conjunto de vários elementos div!!! Mas poderiam ser diversos elementos li, ou qualquer outro / 112

68 Um mundo de faz de conta Quem consegue enxergar visualmente o controle, entenderá e deduzirá sobre o que se trata aquele monte de div Agora, para o browser, sempre será um conjunto de elementos div! 68 / 112

69 Um mundo de faz de conta Como diferenciar um div que é um elemento de uma árvore, de um div que é simplesmente um div?!?!?! 69 / 112

70 Um mundo de faz de conta Para solucionar esse dilema, a W3C criou o Web Accessibility Initiative - Accessible Rich Internet Applications, WAI-ARIA O WAI-ARIA é um conjunto de diretrizes para aumentar a acessibilidade de conteúdo Web dinâmico, como por exemplo, controles personalizados via JavaScript 70 / 112

71 Um mundo de faz de conta A documentação completa do WAI-ARIA é bem extensa, e não poderia ser coberta com nosso tempo ;) Por isso, vamos à parte prática: Roles e States/Properties 71 / 112

72 Um mundo de faz de conta Um role, indica o papel que o elemento tem na página, como um ator em uma peça de teatro Os roles servem para guiar as ferramentas assistentes, para que elas possam proporcionar a melhor interação possível para cada situação Vamos ver o exemplo da árvore / 112

73 Um mundo de faz de conta button treeitem tree 73 / 112

74 Um mundo de faz de conta Outros roles comuns: combobox grid listbox menu menuitem tablist checkbox dialog spinbutton progressbar 74 / 112

75 Um mundo de faz de conta Os states e as properties servem, como o nome sugere, para indicar o estado dos controles, e algumas propriedades estendidas 75 / 112

76 Um mundo de faz de conta Algumas properties comuns: aria-describedby: indica o id do elemento que possui a descrição do controle aria-haspopup: indica se o controle possui um popup aria-labelledby: indica o id do elemento que serve de label (descrição breve) para o controle aria-owns: indica o(s) id(s) do(s) elemento(s) que pertencem ao controle 76 / 112

77 Um mundo de faz de conta Algumas properties comuns: aria-readonly: indica se o conteúdo do controle é somente para leitura aria-valuemin: indica o valor mínimo do controle aria-valuemax: indica o valor máximo do controle aria-valuenow: indica o valor atual do controle 77 / 112

78 Um mundo de faz de conta Algumas properties comuns: aria-valuetext: fornece uma representação textual do valor do controle aria-activedescendant: indica o id do elemento atualmente ativo dentro do controle (como o item selecionado em uma lista) 78 / 112

79 Um mundo de faz de conta Alguns states comuns: aria-hidden: indica se o controle está visível ou não aria-disabled: indica se o controle está habilitado ou não aria-checked: indica se o controle está marcado ou não aria-selected: indica se o controle está atualmente selecionado ou não (como o item selecionado em uma lista) 79 / 112

80 Um mundo de faz de conta Alguns states comuns: aria-expanded: indica se o controle está expandido ou não (como um item dentro de uma árvore) aria-pressed: indica se o controle está pressionado ou não 80 / 112

81 Um mundo de faz de conta Ufa!!! :D 81 / 112

82 Um mundo de faz de conta Vamos ver mais exemplos práticos / 112

83 Juntando tudo: um controle acessível Mãos à obra! 83 / 112

84 Juntando tudo: um controle acessível Vamos juntos criar um controle lista acessível, similar ao que tenho em meu site, utilizando alguns dos conceitos demonstrados, como navegação por teclado e os atributos WAI-ARIA :D 84 / 112

85 Juntando tudo: um controle acessível * Todos os atributos aria-xxx e role serão definidos através do método setattribute() dos elementos HTML, conforme mostrado na documentação: 85 / 112

86 Juntando tudo: um controle acessível ** Todo o código será criado utilizando apenas métodos e atributos padronizados pela W3C, e funcionará independentemente do browser, desde que o browser siga corretamente o padrão 86 / 112

87 Juntando tudo: um controle acessível *** Pelo tempo e pela intuito, não utilizaremos uma separação em camadas, como MVC 87 / 112

88 Juntando tudo: um controle acessível **** Chega de * s!!! 88 / 112

89 Juntando tudo: um controle acessível Começando pela parte fácil... function btnadicionar_click() { lista.adicionaitem(document.getelementbyid("txtnome").value); return true; } document.getelementbyid("btnadicionar").addeventlistener("click", btnadicionar_click); function btnremover_click() { lista.removeselecionado(); return true; } document.getelementbyid("btnremover").addeventlistener("click", btnremover_click); 89 / 112

90 Juntando tudo: um controle acessível Agora o começo da classe Lista... function Lista(idElemento, largura, altura) { var itemselecionado = null, temfoco = false, elemento = document.getelementbyid(idelemento); elemento.classname = "lista"; elemento.style.width = largura; elemento.style.height = altura; elemento.setattribute("role", "listbox"); elemento.setattribute("tabindex", "0"); } 90 / 112

91 Juntando tudo: um controle acessível Instanciando a lista... lista = new Lista("divLista", "200px", "200px"); Já podemos testar o comecinho! 91 / 112

92 Juntando tudo: um controle acessível Tratando os eventos da lista... elemento.addeventlistener("focus", function () { temfoco = true; if (itemselecionado) itemselecionado.classname = "item itemfoco"; return true; }); elemento.addeventlistener("blur", function () { temfoco = false; if (itemselecionado) itemselecionado.classname = "item itemsel"; return true; }); 92 / 112

93 Juntando tudo: um controle acessível elemento.addeventlistener("mousedown", function (e) { elemento.focus(); if (e.button === 0) { if (e.target!== elemento && e.target.parentnode === elemento) selecionaitem(e.target); return false; } return true; }); 93 / 112

94 Juntando tudo: um controle acessível elemento.addeventlistener("keydown", function (e) { switch (e.keycode) { case 38: //cima if (itemselecionado) { if (itemselecionado.previoussibling) selecionaitem(itemselecionado.previoussibling); } else { if (elemento.firstchild) selecionaitem(elemento.firstchild); } break; case 40: //baixo if (itemselecionado) { if (itemselecionado.nextsibling) selecionaitem(itemselecionado.nextsibling); } else { if (elemento.firstchild) selecionaitem(elemento.firstchild); } break; default: return true; } if (e.preventdefault) e.preventdefault(); return false; }); 94 / 112

95 Juntando tudo: um controle acessível Dando vida (colocar abaixo das variáveis em Lista)... function selecionaitem(item) { if (itemselecionado) itemselecionado.classname = "item"; itemselecionado = item; if (item) { item.classname = (temfoco? "item itemfoco" : "item itemsel"); elemento.setattribute("aria-activedescendant", item.id); } else { elemento.setattribute("aria-activedescendant", ""); } return true; } 95 / 112

96 Juntando tudo: um controle acessível this.adicionaitem = function (texto) { var item = document.createelement("div"); item.appendchild(document.createtextnode(texto)); item.classname = "item"; item.id = "item" + iditens.tostring(); item.setattribute("role", "option"); item.setattribute("aria-selected", "false"); elemento.appendchild(item); iditens = iditens + 1; return true; }; 96 / 112

97 Juntando tudo: um controle acessível this.removeselecionado = function () { if (itemselecionado) { var anterior = itemselecionado.previoussibling, proximo = itemselecionado.nextsibling, pos = itemselecionado.posicao; elemento.removechild(itemselecionado); itemselecionado = null; if (proximo) selecionaitem(proximo); else if (anterior) selecionaitem(anterior); } return true; }; 97 / 112

98 Juntando tudo: um controle acessível Agora é só testar! :D 98 / 112

99 Juntando tudo: um controle acessível Bem... Esse comportamento não é legal! Eu quero que o item selecionado apareça conforme eu pressiono as teclas do teclado... Então... Vamos às mudanças! 99 / 112

100 Juntando tudo: um controle acessível Dentro de adicionaitem item.setattribute("aria-selected", "false"); item.posicao = elemento.childnodes.length; elemento.appendchild(item); / 112

101 Juntando tudo: um controle acessível Dentro de removeselecionado itemselecionado = null; while (pos < elemento.childnodes.length) { } elemento.childnodes[pos].posicao = pos; pos = pos + 1; if (proximo) / 112

102 Juntando tudo: um controle acessível Por fim, dentro de selecionaitem elemento.setattribute("aria-activedescendant", item.id); var itemtopo = item.posicao * 28, itemtoporelativo = itemtopo - elemento.scrolltop; if (itemtoporelativo < 0) elemento.scrolltop = itemtopo; else if (itemtoporelativo + 28 >= elemento.clientheight) elemento.scrolltop = itemtopo - elemento.clientheight + 28; } else { / 112

103 Juntando tudo: um controle acessível Pronto!! 103 / 112

104 Juntando tudo: um controle acessível Bem, na verdade... Ainda tem duas coisinhas faltando... Se for para funcionar no IE, temos um probleminha / 112

105 Juntando tudo: um controle acessível Criando uma nova variável no começo do código IE = (navigator.useragent.indexof("msie") >= 0); Modificando o tratamento de mousedown... selecionaitem(e.target); if (IE) e.preventdefault(); return false; 105 / 112

106 Bons links e referências Resumo de todos os links mostrados anteriormente, e onde ir depois daqui / 112

107 Bons links e referências W3C Web Content Accessibility Guidelines 2.0 Techniques for WCAG / 112

108 Bons links e referências Understanding WCAG 2.0 Contrast (Minimum) WCAG /visual-audio-contrast-contrast.html Contrast (Enhanced) 108 / 112

109 Bons links e referências Web Accessibility Tools Consortium Minha página de aula sobre cores carlosrafaelgn.com.br/aula/cores.html Typefaces for Dyslexia 109 / 112

110 Bons links e referências Accessible Rich Internet Applications (WAI-ARIA) 1.0 WAI-ARIA - The Roles Model WAI-ARIA - Supported States and Properties 110 / 112

111 Bons links e referências ARIA Techniques for WCAG 2.0 WARAU - Websites Atendendo a Requisitos de Acessibilidade e Usabilidade (UNICAMP) warau.nied.unicamp.br Mozilla Developer Network developer.mozilla.org/en-us/docs 111 / 112

112 Ficamos por aqui! 112 / 112

Fazendo a Web falar: HTML5, WAI-ARIA e NVDA. Reinaldo Ferraz W3C Brasil

Fazendo a Web falar: HTML5, WAI-ARIA e NVDA. Reinaldo Ferraz W3C Brasil Fazendo a Web falar: HTML5, WAI-ARIA e NVDA Reinaldo Ferraz W3C Brasil Em breve Acessibilidade na Web: A quem se destina? Cegos - daltônicos - baixa visão Deficiência auditiva Deficiência motora Estatísticas

Leia mais

Accessibility in Public Services. Good practices in the construction of websites

Accessibility in Public Services. Good practices in the construction of websites CEGER Centro de Gestão da Rede Informática do Governo Accessibility in Public Services Good practices in the construction of websites Coruña Seminar Accessibility Accessibility is a general term used to

Leia mais

Monday, January 23, 12. Introdução sobre Acessibilidade na web

Monday, January 23, 12. Introdução sobre Acessibilidade na web Introdução sobre Acessibilidade na web Acessibilidade na web é o consumo da informação por qualquer pessoa por qualquer tipo de meio de acesso. Para que serve a web? A web serve para compartilhar informação.

Leia mais

O NOVO ORKUT E AS NORMAS WCAG THE NEW ORKUT ACCORDING WEB CONTENT ACESSIBILITY GUIDELINE (WCAG 2.0) Resumo

O NOVO ORKUT E AS NORMAS WCAG THE NEW ORKUT ACCORDING WEB CONTENT ACESSIBILITY GUIDELINE (WCAG 2.0) Resumo O NOVO ORKUT E AS NORMAS WCAG THE NEW ORKUT ACCORDING WEB CONTENT ACESSIBILITY GUIDELINE (WCAG 2.0) Diogo Moreira Bispo Marcos Augusto Francisco Borges Resumo Tendo o Orkut grande uso no Brasil, torna-se

Leia mais

TECNOLOGIAS WEB AULA 8 PROF. RAFAEL DIAS RIBEIRO @RIBEIRORD

TECNOLOGIAS WEB AULA 8 PROF. RAFAEL DIAS RIBEIRO @RIBEIRORD TECNOLOGIAS WEB AULA 8 PROF. RAFAEL DIAS RIBEIRO @RIBEIRORD Objetivos: Apresentar os principais problemas de acessibilidade na Internet. Apresentar as principais deficiências e as tecnologias de apoio.

Leia mais

Mitos da Acessibilidade Web

Mitos da Acessibilidade Web SAPO Codebits 2008 Magda Joana Silva magdajoanasilva@gmail.com Acessibilidade Web igualdade de acesso a Web sites a pessoas com limitações Acessibilidade Web igualdade de acesso a Web sites a pessoas com

Leia mais

Deficiências. Deficiência Física Deficiência Auditiva Deficiência Visual Deficiência Mental Deficiência Múltipla. Tem dificuldade para:

Deficiências. Deficiência Física Deficiência Auditiva Deficiência Visual Deficiência Mental Deficiência Múltipla. Tem dificuldade para: Deficiências Deficiência Física Deficiência Auditiva Deficiência Visual Deficiência Mental Deficiência Múltipla Tem dificuldade para: ver a tela usar o mouse usar o teclado ler um texto ouvir um som navegar

Leia mais

Acessibilidade no SIEP (Sistema de Informações da Educação Profissional e Tecnológica) Módulo de Acessibilidade Virtual CEFET Bento Gonçalves RS Maio 2008 ACESSIBILIDADE À WEB De acordo com Cifuentes (2000),

Leia mais

ENGENHARIA DE USABILIDADE Unidade V Acessibilidade à Web. Luiz Leão luizleao@gmail.com http://www.luizleao.com

ENGENHARIA DE USABILIDADE Unidade V Acessibilidade à Web. Luiz Leão luizleao@gmail.com http://www.luizleao.com Luiz Leão luizleao@gmail.com http://www.luizleao.com Conteúdo Programático Conceitos e Importância Projeto e desenvolvimento de Web acessível Acessibilidade É o processo e as técnicas usadas para criar

Leia mais

Acessibilidade na Web

Acessibilidade na Web Acessibilidade na Web Departamento de Computação - UFS Tópicos Especiais em Sistemas de Informação Lucas Augusto Carvalho lucasamcc@dcomp.ufs.br Prof. Rogério Vídeo Custo ou Benefício? http://acessodigital.net/video.html

Leia mais

WEBDESIGN. Professor: Paulo Marcos Trentin - paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira

WEBDESIGN. Professor: Paulo Marcos Trentin - paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira WEBDESIGN Professor: Paulo Marcos Trentin - paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira Recursos avançados com CSS Uma vez entendido o uso básico e treinado muito, chegou

Leia mais

Voice Guidance. Guia do administrador

Voice Guidance. Guia do administrador Voice Guidance Guia do administrador Junho de 2015 www.lexmark.com Conteúdo 2 Conteúdo Visão geral... 3 Modelos de impressoras, funções e aplicativos suportados...3 Configuração do Voice Guidance... 4

Leia mais

FORMULÁRIOS ACESSÍVEIS

FORMULÁRIOS ACESSÍVEIS Ministério da Educação Secretaria de Educação Profissional e Tecnológica IFRS Instituto Federal de Educação, Ciência e Tecnologia do Rio Grande do Sul NAV Núcleo de Acessibilidade Virtual FORMULÁRIOS ACESSÍVEIS

Leia mais

Configurações do Windows para Leitores de Tela

Configurações do Windows para Leitores de Tela MÓDULO DE ACESSIBILIDADE VIRTUAL - CEFET BG SIEP (SISTEMA DE INFORMAÇÃO DA EDUCAÇÃO PROFISSIONAL E TECNOLÓGICA) Configurações do Windows para Leitores de Tela Desenvolvido por Celio Marcos Dal Pizzol e

Leia mais

SIEP / RENAPI. Dicas HTML e CSS para Desenvolvimento. de um Site/Portal Acessível

SIEP / RENAPI. Dicas HTML e CSS para Desenvolvimento. de um Site/Portal Acessível SIEP / RENAPI Dicas HTML e CSS para Desenvolvimento de um Site/Portal Acessível Setembro de 2009 Dicas HTML e CSS para Desenvolvimento de um Site/Portal Acessível Cuidados em geral Separar adequadamente

Leia mais

DESENVOLVIMENTO WEB DENTRO DOS PARADIGMAS DO HTML5 E CSS3

DESENVOLVIMENTO WEB DENTRO DOS PARADIGMAS DO HTML5 E CSS3 DESENVOLVIMENTO WEB DENTRO DOS PARADIGMAS DO HTML5 E CSS3 Eduardo Laguna Rubai, Tiago Piperno Bonetti Universidade Paranaense (Unipar) Paranavaí PR- Brasil eduardorubay@gmail.com, bonetti@unipar.br Resumo.

Leia mais

Adaptação de materiais digitais. Manuela Francisco manuela.amado@gmail.com

Adaptação de materiais digitais. Manuela Francisco manuela.amado@gmail.com Adaptação de materiais digitais Manuela Francisco manuela.amado@gmail.com Plano da sessão Tópicos Duração Documentos acessíveis: porquê e para quem. Diretrizes de acessibilidade Navegabilidade, legibilidade

Leia mais

Curso de Capacitação em Gerenciador de Conteúdo PLONE

Curso de Capacitação em Gerenciador de Conteúdo PLONE Curso de Capacitação em Gerenciador de Conteúdo PLONE 1 Índice Customização Acionar modo debug 3 Propriedades Básicas 10 Arquivos de Customização 15 2 Customização Intermediário Com a definição do posicionamento

Leia mais

Afinal o que é HTML?

Afinal o que é HTML? Aluno : Jakson Nunes Tavares Gestão e tecnologia da informacão Afinal o que é HTML? HTML é a sigla de HyperText Markup Language, expressão inglesa que significa "Linguagem de Marcação de Hipertexto". Consiste

Leia mais

Sumário INTRODUÇÃO 3 DICAS PARA CRIAR UM BOM SITE 4

Sumário INTRODUÇÃO 3 DICAS PARA CRIAR UM BOM SITE 4 Sumário Todos os direitos reservados e protegidos pela Lei 5.988 de 14/12/73. Nenhuma parte deste livro, sem prévia autorização por escrito de Celta Informática, poderá ser reproduzida total ou parcialmente,

Leia mais

Coleção - Análises de email marketing em clientes de email

Coleção - Análises de email marketing em clientes de email Coleção - Análises de email marketing em clientes de email Thunderbird e Terra Nesta terceira edição da Coletânea de Análises de Email Marketing em Clientes de Email, apresentamos os estudos do webmail

Leia mais

A PÁGINA DISCIPLINAR DE MATEMÁTICA DO PORTAL DIA A DIA EDUCAÇÃO

A PÁGINA DISCIPLINAR DE MATEMÁTICA DO PORTAL DIA A DIA EDUCAÇÃO A PÁGINA DISCIPLINAR DE MATEMÁTICA DO PORTAL DIA A DIA EDUCAÇÃO Resumo: Dolores Follador Secretaria de Estado da Educação do Paraná e Faculdades Integradas do Brasil - Unibrasil doloresfollador@gmail.com

Leia mais

Capítulo 7 O Gerenciador de Arquivos

Capítulo 7 O Gerenciador de Arquivos Capítulo 7 O Gerenciador de Arquivos Neste capítulo nós iremos examinar as características da interface do gerenciador de arquivos Konqueror. Através dele realizaremos as principais operações com arquivos

Leia mais

MANUAL DO NVDA Novembro de 2013

MANUAL DO NVDA Novembro de 2013 MANUAL DO NVDA Novembro de 2013 PROJETO DE ACESSIBILIDADE VIRTUAL Núcleo IFRS Manual do NVDA Sumário O que são leitores de Tela?... 3 O NVDA - Non Visual Desktop Access... 3 Procedimentos para Download

Leia mais

PADRÕES PARA O DESENVOLVIMENTO NA WEB

PADRÕES PARA O DESENVOLVIMENTO NA WEB PADRÕES PARA O DESENVOLVIMENTO NA WEB Ederson dos Santos Cordeiro de Oliveira 1,Tiago Bonetti Piperno 1, Ricardo Germano 1 1 Universidade Paranaense (UNIPAR) Paranavaí PR- Brasil edersonlikers@gmail.com,

Leia mais

TAW Tópicos de Ambiente Web

TAW Tópicos de Ambiente Web 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

Leia mais

Guia de Início Rápido

Guia de Início Rápido Guia de Início Rápido O Microsoft OneNote 2013 parece diferente das versões anteriores, por isso criamos este guia para ajudar você a minimizar a curva de aprendizado. Alterne entre a entrada por toque

Leia mais

WAI-ARIA, UMA APROXIMAÇÃO

WAI-ARIA, UMA APROXIMAÇÃO WAI-ARIA, UMA APROXIMAÇÃO Fernández Rivera, Javier Tradução: Leondeniz Candido de Freitas Versão em espanhol disponível em http://www.nosolousabilidad.com/articulos/wai_aria.htm Resumo: introdução ao ARIA

Leia mais

IRISPen Air 7. Guia Rápido. (Windows & Mac OS X)

IRISPen Air 7. Guia Rápido. (Windows & Mac OS X) IRISPen Air 7 Guia Rápido (Windows & Mac OS X) Este Guia Rápido do Usuário ajuda você a começar a usar o IRISPen Air TM 7. Leia este guia antes de utilizar o scanner e o respectivo software.todas as informações

Leia mais

WebDesign. Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br. Escola CDI de Videira

WebDesign. Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br. Escola CDI de Videira WebDesign Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira Entendendo Alguns Conceitos Antes de prosseguirmos é importante ter em mente o motivo pelo

Leia mais

Humano-Computador (IHC)

Humano-Computador (IHC) 1 INF1403 Introdução a Interação Humano-Computador (IHC) Turma 3WA Professora: Clarisse Sieckenius de Souza Acessibilidade: Uma questão de lei e direitos humanos 15/Mar/2010 Stephen Hawking um dos maiores

Leia mais

Unidade 1: O Painel de Controle do Excel *

Unidade 1: O Painel de Controle do Excel * Unidade 1: O Painel de Controle do Excel * material do 2010* 1.0 Introdução O Excel nos ajuda a compreender melhor os dados graças à sua organização em células (organizadas em linhas e colunas) e ao uso

Leia mais

Criando um formulário no VBA

Criando um formulário no VBA Criando um formulário no VBA No dia-a-dia, não queremos nem ouvir falar em formulários: imediatamente nos vem à mente qualquer idéia relacionada com burocracia... Mas, na hora de criar interfaces de macros,

Leia mais

Como Criar uma Aula? Na página inicial do Portal do Professor, acesse ESPAÇO DA AULA: Ao entrar no ESPAÇO DA AULA, clique no ícone Criar Aula :

Como Criar uma Aula? Na página inicial do Portal do Professor, acesse ESPAÇO DA AULA: Ao entrar no ESPAÇO DA AULA, clique no ícone Criar Aula : Como Criar uma Aula? Para criar uma sugestão de aula é necessário que você já tenha se cadastrado no Portal do Professor. Para se cadastrar clique em Inscreva-se, localizado na primeira página do Portal.

Leia mais

Programando em PHP. Conceitos Básicos

Programando em PHP. Conceitos Básicos Programando em PHP www.guilhermepontes.eti.br lgapontes@gmail.com Conceitos Básicos Todo o escopo deste estudo estará voltado para a criação de sites com o uso dos diversos recursos de programação web

Leia mais

PROJETO DE ACESSIBILIDADE VIRTUAL DO IFRS Manual Rápido do NVDA. Sumário

PROJETO DE ACESSIBILIDADE VIRTUAL DO IFRS Manual Rápido do NVDA. Sumário PROJETO DE ACESSIBILIDADE VIRTUAL DO IFRS Manual Rápido do NVDA Sumário O que são leitores de Tela?... 1 O NVDA - Non Visual Desktop Access... 1 Procedimentos para Download e Instalação do NVDA... 2 Iniciando

Leia mais

Introdução... 1. Instalação... 2

Introdução... 1. Instalação... 2 ONTE DO Introdução... 1 O que é IPP?... 1 Qual é a função de um software Samsung IPP?... 1 Instalação... 2 Requisitos do sistema... 2 Instalar o software Samsung IPP... 2 Desinstalar o software Samsung

Leia mais

iconnect 3.3 Atualizações Pesquisa Dinâmica

iconnect 3.3 Atualizações Pesquisa Dinâmica iconnect 3.3 Atualizações Pesquisa Dinâmica Conteúdo iconnect 3.3 Atualizações Pesquisa Dinâmica... 3 1. Feedback do Cliente...3 1.1 Feedback do Cliente no Email da Pesquisa Dinâmica... 3 1.2 Página de

Leia mais

CSS. Oficina de CSS Aula 10. Cascading Style Sheets. Cascading Style Sheets Roteiro. Cascading Style Sheets. Cascading Style Sheets W3C

CSS. Oficina de CSS Aula 10. Cascading Style Sheets. Cascading Style Sheets Roteiro. Cascading Style Sheets. Cascading Style Sheets W3C Roteiro Oficina de Aula 10 s Selos de conformidade Prof. Vinícius Costa de Souza www.inf inf.unisinos..unisinos.br/~vinicius outubro de 2006 W3C São um conjunto de normas, diretrizes, recomendações, notas

Leia mais

HTML / JAVASCRIPT. A versão atual é o HTML5 (seus predecessores imediatos são HTML 4.01, XHTML 1.1, etc.).

HTML / JAVASCRIPT. A versão atual é o HTML5 (seus predecessores imediatos são HTML 4.01, XHTML 1.1, etc.). HTML / JAVASCRIPT Estamos iniciando o estudo do HTML através das TAGS (comandos) para construir formulários. Isso facilitará a continuidade dos nossos estudos da linguagem de programação JavaScript, a

Leia mais

Siep / Renapi Campus Bento Gonçalves / RS Jucélia Almeida DESENVOLVENDO UM SITE ACESSÍVEL

Siep / Renapi Campus Bento Gonçalves / RS Jucélia Almeida DESENVOLVENDO UM SITE ACESSÍVEL Siep / Renapi Campus Bento Gonçalves / RS Jucélia Almeida DESENVOLVENDO UM SITE ACESSÍVEL Web para todos De acordo com Cifuentes(2000), Caplan(2002) e Dias (2003), entende-se por acessibilidade à rede

Leia mais

Coleção - Análises de email marketing em clientes de email

Coleção - Análises de email marketing em clientes de email Coleção - Análises de email marketing em clientes de email Introdução Nesta sexta e penúltima edição da Coletânea de Análises de Email Marketing em Clientes de Email, apresentamos os estudos dos clientes

Leia mais

Lidar com números e estatísticas não é fácil. Reunir esses números numa apresentação pode ser ainda mais complicado.

Lidar com números e estatísticas não é fácil. Reunir esses números numa apresentação pode ser ainda mais complicado. , ()! $ Lidar com números e estatísticas não é fácil. Reunir esses números numa apresentação pode ser ainda mais complicado. Uma estratégia muito utilizada para organizar visualmente informações numéricas

Leia mais

Acessibilidade na web O caminho das pedras para construir sítios acessíveis. SECOP 2011 2 de setembro de 2011 Reinaldo Ferraz W3C.

Acessibilidade na web O caminho das pedras para construir sítios acessíveis. SECOP 2011 2 de setembro de 2011 Reinaldo Ferraz W3C. Acessibilidade na web O caminho das pedras para construir sítios acessíveis SECOP 2011 2 de setembro de 2011 Reinaldo Ferraz W3C.br Um pouco do W3C É um consórcio internacional, criado em 1994 por Tim

Leia mais

PROCEDIMENTO Cadastro de Produtos. Café com Arte Móveis

PROCEDIMENTO Cadastro de Produtos. Café com Arte Móveis Cadastro de Produtos Café com Arte Móveis Valinhos, 22 de Abril de 2015 Versão: 1.0 Página 1 de 28 Alliati Soluções em TI. Controle de Alteração do Procedimento Versão Observações Responsável Data 1.0

Leia mais

VPAT (Voluntary Product Accessibility Template, Modelo de Acessibilidade de Produto) do eportfolio da Desire2Learn Maio de 2013 Conteúdo

VPAT (Voluntary Product Accessibility Template, Modelo de Acessibilidade de Produto) do eportfolio da Desire2Learn Maio de 2013 Conteúdo VPAT (Voluntary Product Accessibility Template, Modelo de Acessibilidade de Produto) do eportfolio da Desire2Learn Maio de 2013 Conteúdo Introdução Recursos de acessibilidade principais Navegação usando

Leia mais

HELP Fornecedores ATENÇÃO!!! IMPORTANTE: o acesso ao SIGA só poderá ser feito através do navegador Internet Explorer, versões 6 a 9.

HELP Fornecedores ATENÇÃO!!! IMPORTANTE: o acesso ao SIGA só poderá ser feito através do navegador Internet Explorer, versões 6 a 9. HELP Fornecedores IMPORTANTE: o acesso ao SIGA só poderá ser feito através do navegador Internet Explorer, versões 6 a 9. ATENÇÃO!!! Se a versão do seu navegador Internet Explorer for superior a 9, siga

Leia mais

Interação Humano-Computador Design: estrutura e estética PROFESSORA CINTIA CAETANO

Interação Humano-Computador Design: estrutura e estética PROFESSORA CINTIA CAETANO Interação Humano-Computador Design: estrutura e estética PROFESSORA CINTIA CAETANO Arte X Engenharia Desenvolver Sistema Web é arte? A Web oferece espaço para arte...... mas os usuários também desejam

Leia mais

UNIVERSIDADE FEDERAL DE PELOTAS. Índice

UNIVERSIDADE FEDERAL DE PELOTAS. Índice Índice Capítulo 10 Inserindo figuras e objetos... 2 Configurando AutoFormas... 2 Criando Caixas de Texto... 3 Inserindo Linhas e Setas... 3 Utilizando WordArt... 4 Inserindo Figuras... 5 Configurando figuras...

Leia mais

Banco de Dados Microsoft Access: Criar tabelas. Vitor Valerio de Souza Campos

Banco de Dados Microsoft Access: Criar tabelas. Vitor Valerio de Souza Campos Banco de Dados Microsoft Access: Criar tabelas Vitor Valerio de Souza Campos Objetivos do curso 1. Criar uma tabela no modo de exibição Folha de Dados. 2. Definir tipos de dados para os campos na tabela.

Leia mais

Manual do Usuário Android Neocontrol

Manual do Usuário Android Neocontrol Manual do Usuário Android Neocontrol Sumário 1.Licença e Direitos Autorais...3 2.Sobre o produto...4 3. Instalando, Atualizando e executando o Android Neocontrol em seu aparelho...5 3.1. Instalando o aplicativo...5

Leia mais

Introdução. Como adquirir o FrontPage?

Introdução. Como adquirir o FrontPage? Introdução O software FrontPage é muito utilizado para a criação, gerenciamento e publicação de páginas (sites) na Internet. Sendo um produto da Microsoft Corporation, ele apresenta uma interface bastante

Leia mais

SSE 3.0. Guia Rápido. Módulo Secretaria. Nesta Edição

SSE 3.0. Guia Rápido. Módulo Secretaria. Nesta Edição SSE 3.0 Guia Rápido Módulo Secretaria Nesta Edição 1 Acessando o Módulo Secretaria 2 Cadastros Auxiliares 3 Criação de Modelos Definindo o Layout do Modelo Alterando o Layout do Cabeçalho 4 Parametrização

Leia mais

Sumário. Este Guia Rápido do Usuário ajuda você a começar a usar o IRISPen TM Executive 7.

Sumário. Este Guia Rápido do Usuário ajuda você a começar a usar o IRISPen TM Executive 7. Este Guia Rápido do Usuário ajuda você a começar a usar o IRISPen TM Executive 7. As descrições fornecidas neste guia são baseadas no sistema operacional Windows 7. Leia este guia antes de operar este

Leia mais

Acessibilidade na Web Cesár Bomfim Brasília 15 de Março

Acessibilidade na Web Cesár Bomfim Brasília 15 de Março Acessibilidade na Web Cesár Bomfim Brasília 15 de Março Avaliação Passos para Site Acessível -Seguir padrões Web; -Seguir as diretrizes e recomendações de acessibilidade; -Realizar avaliação de acessibilidade.

Leia mais

Dando um passeio no ASP.NET

Dando um passeio no ASP.NET Dando um passeio no ASP.NET Por Mauro Sant Anna (mas_mauro@hotmail.com). Mauro é um MSDN Regional Director, consultor e instrutor. O principal objetivo da arquitetura.net é permitir ao usuário o fácil

Leia mais

GASweb - Usabilidade Parte 1-3

GASweb - Usabilidade Parte 1-3 GASweb - Usabilidade Parte 1-3 Nível Básico Por: Lucas Bruno O GASweb - Application Generator é um produto que oferece aos seus usuários o grande aumento de produtividade. Entretanto, assim como as demais

Leia mais

Conceitos de extensões Joomla!

Conceitos de extensões Joomla! capítulo 1 Conceitos de extensões Joomla! Entendendo o que é extensão Extensão pode ser entendida como uma pequena aplicação desenvolvida com regras de construção estabelecidas pelo ambiente Joomla!. É

Leia mais

1 2 3 W O R K S H O P 4 5 6 W O R K S H O P 7 W O R K S H O P 8 9 10 Instruções gerais para a realização das Propostas de Actividades Para conhecer em pormenor o INTERFACE DO FRONTPAGE clique aqui 11 CONSTRUÇÃO

Leia mais

MÓDULO MULTIMÉDIA PROFESSOR: RICARDO RODRIGUES. MAIL: rprodrigues@escs.ipl.pt esganarel@gmail.com. URL: http://esganarel.home.sapo.

MÓDULO MULTIMÉDIA PROFESSOR: RICARDO RODRIGUES. MAIL: rprodrigues@escs.ipl.pt esganarel@gmail.com. URL: http://esganarel.home.sapo. MÓDULO MULTIMÉDIA PROFESSOR: RICARDO RODRIGUES MAIL: rprodrigues@escs.ipl.pt esganarel@gmail.com URL: http://esganarel.home.sapo.pt GABINETE: 1G1 - A HORA DE ATENDIMENTO: SEG. E QUA. DAS 11H / 12H30 (MARCAÇÃO

Leia mais

Microsoft Office PowerPoint 2007

Microsoft Office PowerPoint 2007 INTRODUÇÃO AO MICROSOFT POWERPOINT 2007 O Microsoft Office PowerPoint 2007 é um programa destinado à criação de apresentação através de Slides. A apresentação é um conjunto de Sides que são exibidos em

Leia mais

Voltado para novos usuários, este capítulo fornece uma instrução para edição de Leiaute do SILAS e suas funções.

Voltado para novos usuários, este capítulo fornece uma instrução para edição de Leiaute do SILAS e suas funções. 13. Editor de leiautes Voltado para novos usuários, este capítulo fornece uma instrução para edição de Leiaute do SILAS e suas funções. Neste capítulo uma breve explicação será apresentada sobre a organização

Leia mais

Guia de Início Rápido

Guia de Início Rápido Guia de Início Rápido O Microsoft OneNote 2013 apresenta uma aparência diferente das versões anteriores; desse modo, criamos este guia para ajudá-lo a minimizar a curva de aprendizado. Alternar entre o

Leia mais

Desenvolvimento de um CMS 1 para a criação e publicação de web sites acessíveis por deficientes visuais.

Desenvolvimento de um CMS 1 para a criação e publicação de web sites acessíveis por deficientes visuais. Desenvolvimento de um CMS 1 para a criação e publicação de web sites acessíveis por deficientes visuais. Tales Henrique José MOREIRA 1 ; Gabriel da SILVA 2 ; 1 Estudante de Tecnologia em Sistemas para

Leia mais

Manual de Integração Via Gadget. Passo a passo para realizar a integração entre websites e a plataforma Virtual Target.

Manual de Integração Via Gadget. Passo a passo para realizar a integração entre websites e a plataforma Virtual Target. Manual de Integração Via Gadget Passo a passo para realizar a integração entre websites e a plataforma Virtual Target. Manual de Integração Via Gadget 1. Introdução 1.1. O que é? Virtual Target Gadgets

Leia mais

Manual de Utilização do Zimbra

Manual de Utilização do Zimbra Manual de Utilização do Zimbra Compatível com os principais navegadores web (Firefox, Chrome e Internet Explorer) o Zimbra Webmail é uma suíte completa de ferramentas para gerir e-mails, calendário, tarefas

Leia mais

Solução de acessibilidade. Guia do administrador

Solução de acessibilidade. Guia do administrador Solução de acessibilidade Guia do administrador Julho de 2014 www.lexmark.com Conteúdo 2 Conteúdo Visão geral...3 Configurando o aplicativo...4 Configurando o acesso do usuário...4 Desativando funções

Leia mais

Universidade Federal do Espírito Santo CCA UFES. Centro de Ciências Agrárias CCA UFES Departamento de Computação. JavaScript

Universidade Federal do Espírito Santo CCA UFES. Centro de Ciências Agrárias CCA UFES Departamento de Computação. JavaScript Universidade Federal do Espírito Santo Centro de Ciências Agrárias CCA UFES Departamento de Computação Universidade Federal do Espírito Santo CCA UFES JavaScript Desenvolvimento de Sistemas para WEB Site:

Leia mais

Aula 01 - Formatações prontas e condicionais. Aula 01 - Formatações prontas e condicionais. Sumário. Formatar como Tabela

Aula 01 - Formatações prontas e condicionais. Aula 01 - Formatações prontas e condicionais. Sumário. Formatar como Tabela Aula 01 - Formatações prontas e Sumário Formatar como Tabela Formatar como Tabela (cont.) Alterando as formatações aplicadas e adicionando novos itens Removendo a formatação de tabela aplicada Formatação

Leia mais

Barra de ferramentas padrão. Barra de formatação. Barra de desenho Painel de Tarefas

Barra de ferramentas padrão. Barra de formatação. Barra de desenho Painel de Tarefas Microsoft Power Point 2003 No Microsoft PowerPoint 2003, você cria sua apresentação usando apenas um arquivo, ele contém tudo o que você precisa uma estrutura para sua apresentação, os slides, o material

Leia mais

Banco de Dados Microsoft Access: Criar tabelas

Banco de Dados Microsoft Access: Criar tabelas Banco de Dados Microsoft Access: Criar s Vitor Valerio de Souza Campos Objetivos do curso 1. Criar uma no modo de exibição Folha de Dados. 2. Definir tipos de dados para os campos na. 3. Criar uma no modo

Leia mais

ANDRÉ APARECIDO DA SILVA APOSTILA BÁSICA SOBRE O POWERPOINT 2007

ANDRÉ APARECIDO DA SILVA APOSTILA BÁSICA SOBRE O POWERPOINT 2007 ANDRÉ APARECIDO DA SILVA APOSTILA BÁSICA SOBRE O POWERPOINT 2007 CURITIBA 2015 2 SUMÁRIO INTRODUÇÃO AO MICROSOFT POWERPOINT 2007... 3 JANELA PRINCIPAL... 3 1 - BOTÃO OFFICE... 4 2 - FERRAMENTAS DE ACESSO

Leia mais

Configuração dos Controles Remotos do KDE. Michael Zanetti Tradução: Marcus Gama

Configuração dos Controles Remotos do KDE. Michael Zanetti Tradução: Marcus Gama Configuração dos Controles Remotos do KDE Michael Zanetti Tradução: Marcus Gama 2 Conteúdo 1 Introdução 5 1.1 Requisitos.......................................... 5 2 Uso 6 2.1 Controles remotos e modos................................

Leia mais

Controle de acesso. http://www.larback.com.br. .com.br

Controle de acesso. http://www.larback.com.br. .com.br http://www.larback Controle de acesso Construiremos um sistema simples para cadastro de links. O sistema terá uma página pública (onde serão exibidos os links) e uma área administrativa, onde os usuários

Leia mais

Tutorial Plone 4. Manutenção de Sites. Universidade Federal de São Carlos Departamento de Sistemas Web Todos os direitos reservados

Tutorial Plone 4. Manutenção de Sites. Universidade Federal de São Carlos Departamento de Sistemas Web Todos os direitos reservados Tutorial Plone 4 Manutenção de Sites Universidade Federal de São Carlos Departamento de Sistemas Web Todos os direitos reservados Sumário Introdução 1 Como fazer a autenticação do usuário 1.1 Através do

Leia mais

Continuação. 32. Inserir uma imagem da GALERIA CLIP-ART

Continuação. 32. Inserir uma imagem da GALERIA CLIP-ART Continuação 32. Inserir uma imagem da GALERIA CLIP-ART a) Vá para o primeiro slide da apresentação salva no item 31. b) Na guia PÁGINA INICIAL, clique no botão LAYOUT e selecione (clique) na opção TÍTULO

Leia mais

CAPACITAÇÃO EM LIBREOFFICE IMPRESS

CAPACITAÇÃO EM LIBREOFFICE IMPRESS CAPACITAÇÃO EM LIBREOFFICE IMPRESS Nelson Luiz Cesário FCAV/UNESP Câmpus de Jaboticabal O que é o Impress? O Impress é o aplicativo de criação e edição de apresentações da família LibreOffice. Você pode

Leia mais

Acessibilidade Introdução. M. Cecília C. Baranauskas Instituto de Computação

Acessibilidade Introdução. M. Cecília C. Baranauskas Instituto de Computação Acessibilidade Introdução M. Cecília C. Baranauskas Instituto de Computação Acessibilidade - Demo Esta parte é baseada no video em http://www.doit.wisc.edu/accessibility/video Liste os principais problemas

Leia mais

Guia de Início Rápido

Guia de Início Rápido Guia de Início Rápido O Microsoft Word 2013 parece diferente das versões anteriores, por isso criamos este guia para ajudar você a minimizar a curva de aprendizado. Barra de Ferramentas de Acesso Rápido

Leia mais

Tablet Widescreen Slimline

Tablet Widescreen Slimline Tablet Widescreen Slimline Manual do Usuário Avançado Instalação Desenho Escrita Navegação Configuração Manutenção www.trust.com/69/faq Instalando e conhecendo seu tablet Trust 6 7 8 9 0 Cabo USB 6 Pontas

Leia mais

Dicas para usar melhor o Word 2007

Dicas para usar melhor o Word 2007 Dicas para usar melhor o Word 2007 Quem está acostumado (ou não) a trabalhar com o Word, não costuma ter todo o tempo do mundo disponível para descobrir as funcionalidades de versões recentemente lançadas.

Leia mais

JavaScript (Funções, Eventos e Manipulação de Formulários)

JavaScript (Funções, Eventos e Manipulação de Formulários) Linguagem de Programação para Web JavaScript (Funções, Eventos e Manipulação de Formulários) Prof. Mauro Lopes 1-31 23 Objetivos Iremos avançar um pouco mais em nosso estudo sobre o JavaScript. Iremos

Leia mais

POWERPOINT BÁSICO. Facilitador Alisson Cleiton dos Santos Analista Programador / Professor contato@alissoncleiton.com.br

POWERPOINT BÁSICO. Facilitador Alisson Cleiton dos Santos Analista Programador / Professor contato@alissoncleiton.com.br POWERPOINT BÁSICO Facilitador Alisson Cleiton dos Santos Analista Programador / Professor contato@alissoncleiton.com.br POWER POINT INICIANDO O POWERPOINT 2000 Para iniciar o PowerPoint 2000. A partir

Leia mais

Aula 9: Fundamentos do JQuery Fonte: Plano de Aula Oficial da Disciplina

Aula 9: Fundamentos do JQuery Fonte: Plano de Aula Oficial da Disciplina Programação para Internet Rica 1 Aula 9: Fundamentos do JQuery Fonte: Plano de Aula Oficial da Disciplina Objetivo: Capacitar o aluno para o trabalho com o framework JQuery. INTRODUÇÃO JQuery é uma biblioteca

Leia mais

PRINCÍPIOS DE INFORMÁTICA PRÁTICA 08 1. OBJETIVO 2. BASE TEÓRICA. 2.1 Criando Mapas no Excel. 2.2 Utilizando o Mapa

PRINCÍPIOS DE INFORMÁTICA PRÁTICA 08 1. OBJETIVO 2. BASE TEÓRICA. 2.1 Criando Mapas no Excel. 2.2 Utilizando o Mapa PRINCÍPIOS DE INFORMÁTICA PRÁTICA 08 1. OBJETIVO Aprender a utilizar mapas, colocar filtros em tabelas e a criar tabelas e gráficos dinâmicos no MS-Excel. Esse roteiro foi escrito inicialmente para o Excel

Leia mais

Guia de Início Rápido

Guia de Início Rápido Guia de Início Rápido O Microsoft PowerPoint 2013 parece diferente das versões anteriores, por isso criamos este guia para ajudar você a minimizar a curva de aprendizado. Encontre o que você precisa Clique

Leia mais

Presskit Guia Rápido. Release 2.0. Presskit

Presskit Guia Rápido. Release 2.0. Presskit Presskit Guia Rápido Release 2.0 Presskit 06/07/2009 Sumário 1 Login 2 Login e Senha...................................... 2 Esqueci minha senha.................................. 2 Fale Com o Suporte...................................

Leia mais

RELATÓRIO DO GOMOMETER

RELATÓRIO DO GOMOMETER RELATÓRIO DO GOMOMETER Análise e conselhos personalizados para criar sites mais otimizados para celular Inclui: Como os clientes de celular veem seu site atual Verificação da velocidade de carregamento

Leia mais

Inicialização Rápida do Novell Vibe Mobile

Inicialização Rápida do Novell Vibe Mobile Inicialização Rápida do Novell Vibe Mobile Março de 2015 Introdução O acesso móvel ao site do Novell Vibe pode ser desativado por seu administrador do Vibe. Se não conseguir acessar a interface móvel do

Leia mais

Instalando o IIS 7 no Windows Server 2008

Instalando o IIS 7 no Windows Server 2008 Goiânia, 16/09/2013 Aluno: Rafael Vitor Prof. Kelly Instalando o IIS 7 no Windows Server 2008 Objetivo Esse tutorial tem como objetivo demonstrar como instalar e configurar o IIS 7.0 no Windows Server

Leia mais

Instalando o IIS 7 no Windows Server 2008

Instalando o IIS 7 no Windows Server 2008 Goiânia, 16/09/2013 Aluno: Rafael Vitor Prof. Kelly Instalando o IIS 7 no Windows Server 2008 Objetivo Esse tutorial tem como objetivo demonstrar como instalar e configurar o IIS 7.0 no Windows Server

Leia mais

Conceitos Fundamentais de Microsoft Word. Professor Rafael rafampsilva@yahoo.com.br www.facebook.com/rafampsilva

Conceitos Fundamentais de Microsoft Word. Professor Rafael rafampsilva@yahoo.com.br www.facebook.com/rafampsilva Conceitos Fundamentais de Microsoft Word Professor Rafael www.facebook.com/rafampsilva Introdução É um editor de texto ou processador de texto? editores de texto: editam texto (assim como uma máquina de

Leia mais

Tutorial: Gestão da Central de Serviços

Tutorial: Gestão da Central de Serviços Tutorial: Gestão da Central de Serviços Orientação para acesso e edição de conteúdos de ofertas de serviços da Central de Serviços da UFABC Novembro de 2014 Autor: Nilson José Zoccaratto Versão 2 Conteúdo

Leia mais

FAQ Perguntas Frequentes

FAQ Perguntas Frequentes FAQ Perguntas Frequentes 1. COMO ACESSO A PLATAFORMA DE ENSINO?... 2 2. NÃO CONSIGO REALIZAR O MEU CADASTRO NO AMBIENTE VIRTUAL DO MMA.... 4 3. FIZ MEU CADASTRO NO SITE E NÃO RECEBI O E-MAIL DE CONFIRMAÇÃO

Leia mais

Copyright 2013 by Desire2Learn Incorporated. Desire2Learn e seus logotipos relacionados são marcas registradas da Desire2Learn Incorporated.

Copyright 2013 by Desire2Learn Incorporated. Desire2Learn e seus logotipos relacionados são marcas registradas da Desire2Learn Incorporated. Lista de Verificação WCAG 2.0 (Web Content Accessibility Guidelines, Diretrizes de Acessibilidade do Conteúdo da Web) do eportfolio da Desire2Learn 13 de março de 2013 Conteúdo Introdução Recursos de acessibilidade

Leia mais

Análise Comparativa dos Recursos e Diferenças das Tecnologias de Programação HTML5 e HTML4

Análise Comparativa dos Recursos e Diferenças das Tecnologias de Programação HTML5 e HTML4 Análise Comparativa dos Recursos e Diferenças das Tecnologias de Programação HTML5 e HTML4 Guilherme Miranda Martins 1, Késsia Rita da Costa Marchi 1 1 Universidade paranaense (Unipar) Paranavaí PR Brasil

Leia mais

AULA APLICAÇÕES PARA WEB SESSÕES E LOGIN E SENHA

AULA APLICAÇÕES PARA WEB SESSÕES E LOGIN E SENHA Sumário Construção de sistema Administrativo... 1 Sistema de Login... 2 SQL INJECTION... 2 Técnicas para Evitar Ataques... 2 Formulário de Login e Senha fará parte do DEFAULT... 5 LOGAR... 5 boas... 6

Leia mais

Editando textos no Siga-Doc

Editando textos no Siga-Doc Editando textos no Siga-Doc Introdução...2 Executando o editor de textos...3 Acessando pela primeira vez...3 Se o editor de textos não for exibido...4 Trabalhando com tabelas...6 Inserindo uma tabela...6

Leia mais

Interface BVS-Site. Arquiteturta e Personalização da Interface

Interface BVS-Site. Arquiteturta e Personalização da Interface Interface BVS-Site Arquiteturta e Personalização da Interface Julio Takayama takayama@bireme.ops-oms.org Desenho Gráfico e Interfaces DGI-GA BIREME/PAHO/WHO Tópicos Arquitetura da BVS Modelo de Interfaces

Leia mais