Curso: Educação Comunicação e Multimédia Unidade Curricular: WebDesign 2ºAno | 2º Semestre Docente: Profª Cristina Santos
Acessibilidade na Web e HTML5
Desenvolvendo uma web para todos
Março, 2012
Discentes: Dora estevão nº 10917 Paulo Maurício nº9905 Bruno Estevão nº 9867 1
Índice
Introdução…………………………………………….………………..………3 Enquadramento…………………………………………………….…..…...4 Acessibilidade vs Usabilidade…………………………...........…….9 Porque desenvolver Sítios Web acessíveis? ………………….31 Acessibilidade na Web e o potencial do HTML………………41 Novidades do HTML5…………………………………………….………44 Aplicações HTML5…………………………………………….…………..46 Tabelas…………………………………………………………….…………...47 Gráficos………………………………………………………………………..53 Formulários…………………………………………………..…….……….55 Textos Alternativos………………………………………………….……60 Aria e HTML5…………………………………………………..………..…63 Os Novos elementos…………………………………………………….66 Multimédia…………………………………………………………………..69 O que ficou de fora do HTML5?.......................................74 Funcionalidades e Mudanças HTML5……………........………76 Considerações Finais……………………………………..…………….79 Futuras Investigações………………………………………………….81 Anexo……………………………………………………………….………….82 Webliografia…………………………………………………………………84
2
Introdução • No presente trabalho, pretendemos saber qual a evolução do HTML5 em termos de Usabilidade e Acessibilidade. • O nosso objectivo é verificar se o HTML5 respeita o conjunto de normas de usabilidade e de acessibilidade, e como o faz, de que forma e se permite a todos os cidadãos aceder à informação e aos serviços de uma forma fácil e transparente, de acordo com o estabelecido na legislação vigente.
3
Enquadramento • A importância da informação é crescente e essencial no desenvolvimento da sociedade. A informação é uma arma poderosa, pois pode ser manipulada em função dos interesses económicos, políticos, sociais, entre outros. • Em função destes pressupostos, o Guia das boas praticas na Construção de Web sítios web da Administração Directa e Indirecta do Estado, sobre as normas deve ser utilizado no desenho de sítios Web.
4
Enquadramento • Hoje, a ciência e a tecnologia são vitais na economia de um país e influem fortemente na qualidade de vida e no bemestar social, afectando não só as estruturas produtivas mas também o conjunto das estruturas e instituições sociais. • Por isso, e segundo a Resolução do Conselho de Ministros nº 95/99, “os objectivos primordiais na actuação governativa em matéria de sociedade da informação é o de promover a multiplicação e diversificação de conteúdos nacionais na Internet, dessa forma contribuindo não só para o desenvolvimento de uma indústria nacional de conteúdos, como para um acesso facilitado dos cidadãos, das empresas e de outras instituições à informação”. 5
Enquadramento • Deste modo, temos que ter sempre presente que a sociedade da informação tem que ser uma sociedade para todos os cidadãos, uma vez que a democratização da sociedade do futuro passará pela possibilidade de os vários sectores da população terem acesso às tecnologias de informação e respectiva acessibilidade, pois o desenvolvimento da sociedade da informação poderá tornar-se num poderoso factor de exclusão social.
6
Enquadramento • Sendo a Sociedade da Informação uma sociedade para todos, “não é legítimo abandonar os mais desprotegidos e deixar criar uma classe de info-excluídos. É imprescindível promover o acesso universal à info-alfabetização e à info-competência.” (Livro Verde para a Sociedade da Informação em Portugal, http://www.acesso.umic.pcm.gov.pt/docs/lverde.htm: 13). • Segundo a Resolução do Conselho de Ministros nº 155/2007, “as tecnologias da sociedade da informação representam para todas as pessoas com necessidades especiais (pessoas com deficiência e idosos), um meio propiciador de inclusão e participação social por excelência. 7
Enquadramento • Também neste sentido, a UMIC elaborou o Programa Nacional para a Participação dos Cidadãos com Necessidades Especiais na Sociedade da Informação, através da Resolução do Conselho de Ministros nº 110/2003 • E é neste sentido que a iniciativa para a acessibilidade da web do World Wide Web Consortium (W3C), desenvolveu uma série de directrizes, entre as quais se contam as directrizes sobre a acessibilidade do conteúdo da web, que se tornaram, entretanto, uma norma mundialmente utilizada para a criação de sítios web acessíveis”.
8
Acessibilidade vs Usabilidade • No Programa Nacional para a Participação dos Cidadãos com Necessidades Especiais na Sociedade da Informação, a acessibilidade é “entendida mais facilmente no contexto do urbanismo, a acessibilidade, ou a falta dela, constitui uma das preocupações centrais dos Cidadãos com Necessidades Especiais, e em particular daqueles que têm deficiências. • No domínio da Sociedade da Informação, simples actividades da vida diária como ver televisão, ler um livro, obter informação de um serviços público, receber uma carta de um amigo, ler a informação de um produto e utilizar serviços de telecomunicações são, para pessoas com necessidades especiais, um confronto permanente entre as necessidades e as respostas que a sociedade e o Estado forem capazes de dar. 9
Acessibilidade vs Usabilidade • Tornar mais fáceis estas tarefas do quotidiano constitui, por isso mesmo, uma forma de melhorar a qualidade de vida e a igualdade de oportunidades destes cidadãos. • O Plano Nacional de Promoção da Acessibilidade (PNPA), aprovado pela Resolução do Conselho de Ministros nº 9/2007, constitui um instrumento estruturante das medidas que visam a melhoria da qualidade de vida de todos os cidadãos e, em especial, a realização dos direitos de cidadania das pessoas com necessidades especiais. A Acessibilidade consiste na facilidade de acesso e de uso de ambientes, produtos e serviços por qualquer pessoa e em diferentes contextos. http://www.acessibilidade.net/web/
10
Acessibilidade vs Usabilidade Conselhos para a acessibilidade de um sítio Web Quanto à Apresentação da Informação: 1- Garanta que todas as imagens se encontram legendadas ou descritas com texto; 2 - Garanta que o tamanho do texto pode ser aumentado com as opções do seu navegador; 3 - Garanta que o comprimento do texto na página se ajusta ao tamanho da Janela; 4 - Garanta a identificação do campos dos formulários; Quanto à Navegação: 5 - Permita a activação dos elementos da página através do teclado; 6 - Garanta que os textos das ligações sejam compreensíveis fora do contexto; Quanto à Verificação da acessibilidade 7 - Forneça uma forma simples para contactar o responsável; 8 - Utilize ferramentas e serviços automáticos de análise da acessibilidade; 9 - Afixe o símbolo de acessibilidade na Web. http://www.acessibilidade.net/web/ 11
Acessibilidade vs Usabilidade Actualmente no mercado, existe uma grande variedade de software para pessoas com necessidades (deficientes visuais, portadores de deficiência motora ou dificuldades de coordenação motora, pessoas com problemas de fala e idosos). Estes software permitem a leitura de ecrã, escrita através de teclados virtuais, manuseamento e controlo do computador, texto-voz, o que lhes facilita a utilização das novas tecnologias, como por exemplo o computador: o DOSVOX – Software leitor de ecrã. o Orca – Software leitor e ampliador de ecrã. o Nitrous Voice Flux – Software que controla o computador por voz. 12
Acessibilidade vs Usabilidade o o o o o o o o
IBM Via Voice – Software que controla o computador por voz. NVDA- Software leitor de ecrã, com suporte a vários idiomas. YeoSoft Text to MP3 Speaker – Software leitor de ecrã. JAWS for Windows – Software leitor de ecrã em diversos idiomas. Virtual Vision – Software leitor de ecrã. Read Speaker - Software leitor de ecrã. Mec Braille (Marco Electrónico de correio Braille) – Converte e envia textos em Braille. Projeto Dasher - software que permite escrever sem utilizar o teclado. 13
Acessibilidade vs Usabilidade oTeclado virtual GOK - permite escrever sem utilizar o teclado. oTeclado Virtual Grátis (Windows) - permite escrever sem utilizar o teclado. oText2Speech – Software de text-voz. oImtranslator - Software de text-voz. oPediaphon - Software de text-voz.
14
Acessibilidade vs Usabilidade • Para uma melhor compreensão da forma como alguns destes softwares funcionam, acabámos por testar alguns, como o NVDA, que foi utilizado em tarefas normais, na navegação por alguns sítios da Web, e na utilização do flash aquando da criação de ficheiros. Por alguns momentos, colocámo-nos na pele de um deficiente visual, e a experiencia foi muito enriquecedora, pois pudemos observar como o software funciona, ou seja, como o leitor de ecrã lê os vários objectos, qual a sua ordem de leitura. Pudemos verificar que nem todos os objectos têm leitura, nestes casos o indivíduo não consegue aceder a esse objecto. O que significa que muitos sítios Web não cumprem as normas de acessibilidade e usabilidade. 15
Acessibilidade vs Usabilidade
Utilização do leitor de ecrã NVDA (Non-Visual Desktop Access), V0.5, no Sitio Ipbeja. 16
Acessibilidade vs Usabilidade
Utilização do leitor de ecrã NVDA (Non-Visual Desktop Access), V0.5, no Sitio Flash. 17
Acessibilidade vs Usabilidade
Software utilizado por indivĂduos com necessidades especiais. 18
Acessibilidade vs Usabilidade
Software utilizado por indivĂduos com necessidades especiais. 19
Acessibilidade vs Usabilidade
Teclado Virtual do Windows.
O Windows disponibiliza a qualquer utilizador, uma sĂŠrie de ferramentas atravĂŠs do Painel de Controlo > Facilidade de Acesso. 20
Acessibilidade vs Usabilidade
21
Acessibilidade vs Usabilidade • A Usabilidade é uma das características mais críticadas num site. • Actualmente, os especialistas trabalham constantemente a usabilidade dos Sítios Web. O maior desafio é fazer com que a equipe de trabalho tenha consciência e responsabilidade quanto à usabilidade do Sítio Web. • A usabilidade deverá ser compreendida e deverá ter o seu papel bem definido, pois é atraves dela que se vai facilitar o uso de um Sítio Web. • Na elaboração de um Sítio Web surgem sempre problemas de usabilidade que não foram previstos nos wireframes, storyboards, etc. 22
Acessibilidade vs Usabilidade • Por exemplo, um formulário sem validação, um erro de programação, uma inscrição que não informa se foi gravado com sucesso, campos sem valores, são erros comuns que o programador pode corrigir para melhorar a usabilidade. O mesmo pode acontecer quando um designer elabora um Sítio Web com um visual agradável, mas o conteúdo é confuso. • Para uma boa usabilidade os textos devem ser de fácil leitura, conteúdo claro e conciso que fale a linguagem do público-alvo, os títulos e artigos devem ser perceptivos e intuitivos por forma a facilitar a forma como as pessoas interagem e navegam no Sítio, um detalhe pode afectar a experiência do utilizador. 23
Acessibilidade vs Usabilidade • Os programadores precisam de perceber algumas questões de usabilidade, é importante também que os especialistas em usabilidade compreendam determinadas restrições em termos de design, de implementação do código e de comunicação, mas também sobre o ponto de vista funcional. • A construção de protótipos permite avaliar se a interface cumpre os requisitos, se é de fácil utilização, se é de grande importância para os testes de usabilidade.
24
Acessibilidade vs Usabilidade • O teste de usabilidade é uma técnica formal que envolver utilizadores representativos da população alvo, para averiguar se o Sítio Web é ergonómico e se cumpre as regras estabelecidas. • Os dados são recolhidos através de diversas técnicas, sendo as mais vulgares, as entrevistas e os questionários. Após recolha e tratamento dos dados estes são analisados e dessa análise tiram-se conclusões.
25
Acessibilidade vs Usabilidade O teste de usabilidade caracteriza-se por utilizar diferentes técnicas voltadas essencialmente para a avaliação da ergonomia dos sistemas interactivos multimédia, são elas: • Avaliação Heurística; • Critérios Ergonómicos; • Inspecção Baseada em Padrões, Guias de Estilos ou Guias de Recomendações; • Inspecção por Checklists; • Percurso (ou Inspecção) Cognitivo; • Teste Empírico com Utilizadores; • Entrevistas e Questionários. 26
Acessibilidade vs Usabilidade • A avaliação heurísticas, permite identificar erros mais sérios e difíceis de serem identificados. • Sobre este assunto, alguns estudos indicam que a utilização conjunta de ambos os processos, aplicação de heurísticas e testes de usabilidade, é a melhor forma mais fidedigna de investigar a usabilidade.
27
Acessibilidade vs Usabilidade • A usabilidade de Sítios na web está directamente ligada à capacidade de permitir que o utilizador consiga atingir seus objectivos de uma forma rápida, eficaz e com o menor número de erros possíveis. • A usabilidade de Sítios na web está directamente ligada à capacidade de permitir que o utilizador consiga atingir os seus próprios objectivos, de uma forma rápida, eficaz e com o menor número de erros possíveis.
28
Acessibilidade vs Usabilidade • Os Sítios que já foram visitados pelo utilizador devem ser destacados dos links que o utilizador ainda não visitou, principalmente em Sítios com grande conteúdo onde o utilizador tem uma grande quantidade de links ao seu dispor. • Ao destacar os links visitados fica evidente para o utilizador saber quais as páginas que ele já visitou e as que estão por visitar. • Outro atributo importante é o atributo “título”, em que este pode ser usando em links de imagens do tipo ícone, através dele podemos ter uma descrição desse link.
29
Acessibilidade vs Usabilidade • Muitos dos Sítios utilizam imagens de fundo por trás dos textos, mas é necessário que exista um tom semelhante na forma de uma cor de fundo para evitar que o texto se torne ilegível, como é o exemplo de ter uma imagem escura de fundo e um texto branco sobre a imagem, se essa imagem não for carregada pelo navegador seria interessante ter uma cor escura no fundo desse elemento, pois assim o utilizador conseguirá ler o conteúdo sem problemas. • Não há nada mais desanimador do que entrar em Sítios onde existem textos extremamente grandes, sem títulos, subtítulos e imagens. Os conteúdos devem ser divididos com imagens, títulos e secções claras para facilitar a leitura do utilizador e de software para esse efeito. 30
Porque desenvolver Sítios web acessíveis?
31
AcessĂvel via teclado
32
João é tetraplégico
33
VĂdeos com legendas
34
Michele ĂŠ surda
35
Ou mesmo sem monitor
36
Carlos ĂŠ cego
37
Ajuda pessoas com deficiĂŞncia e tambĂŠm outras pessoas.
38
População com mais de 60 anos no mundo: 1950 –205 milhões 2000 –606 milhões Estimativa para 2050 Quase 2 bilhões de pessoas com mais de 60 anos. (+ de 20% da população)
39
Motivos pelos quais nunca utilizaram a internet
55% Falta de habilidade com o computador/internet Fonte: Pesquisa TIC Domicílios 2010 –CGI.br Pessoas que nunca a acederam à a internet, mas usaram um computador.
40
Acessibilidade na Web e o potencial do HTML5 HTML5 (Hypertext Markup Language versão 5) é uma linguagem para estruturação e apresentação de conteúdo para a World Wide Web.
41
HTML4 –XHTML –HTML5
42
HTML 5 [HyperText Markup Language] 1991 –html tag –Tim Berners Lee 1994 –HTML 2 -já incluia tag <img> 1997–HTML 3.2 1999–HTML 4.01 2000–XHTML 1.0 2001–XHTML 1.1 –CSS 20... –Ian Hickson (Opera) propõe estender HTML: Web Forms 2.0, Web Apps 1.0 2004–Apple, Mozilla e Opera criam WHAT WG (Web Hypertext Application Technology Working Group) 2007–W3C retorna HTML Working Group 2009 –W3C descontinua XHTML 2010-2011–Apple, Google, Microsoft, Mozilla e Opera implementam HTML5 43
Novidades do HTML5 • • • • • • • •
Novos Elementos ; Novos atributos; Suporte completo CSS3; Vídeo e áudio; Gráficos 2D/3D; Armazenamento local; Banco de dados SQL local; Aplicações Web.
44
Web Content Accessibility Guidelines (WCAG) Versão1.0 –5 de Maio de 1999 www.w3.org/TR/WCAG10/ Versão2.0 –11 de Dezembro de 2008 www.w3.org/TR/WCAG/ 45
Aplicações HTML5 O desenvolvimento de aplicações tornou-se mais fácil, através do: • Armazenamento de dados local; • Acesso a arquivos locais; • Banco de dados SQL local; • Cache do aplicativo; • Javascript; • XHTMLHttpRequest 2. 46
Recomendações que permanecem
TABELAS
47
Não utilize tabelas para layout Elas não foram feitas para isso. “As tabelas não devem ser utilizadas como auxiliares de layout. Historicamente, alguns autores têm abusado das tabelas em HTML, como forma de controlar o seu layout de página. Esse uso não é recomendado, porque as ferramentas que tentam extrair os dados tabulares de tais documentos obtém resultados confusos. Em particular, os utilizadors de ferramentas de acessibilidade, como leitores de tela podem achar muito difícil de navegar em páginas com tabelas usadas para layout.” http://www.w3.org/TR/html5/tabular-data.html#the-table-element 48
Utilizar o atributo scope para associar células de cabeçalho e células de dados em tabelas de dados.
<tableborder="1"> <caption>ContactInformation</capti on> <tr> <td></td> <tdscope="col">Name</td> <tdscope="col">Phone#</td> <tdscope="col">City</td> </tr><tr> <td>1.</td> <tdscope="row">Joel Garner</td> <td>412-212-5421</td> <td>Pittsburgh</td> </tr><tr> <td>2.</td> <tdscope="row">Clive Lloyd</td> <td>410-306-5400</td> <td>Baltimore</td> </tr> </table> 49
Utilizar os atributos ID e headers para associar células de dados com células de cabeçalhos em tabelas de dados.
<table> <tr> <throwspan="2" id="h">Homework</th> <thcolspan="3" id="e">Exams</th> <thcolspan="3" id="p">Projects</th> </tr> <tr> <thid="e1" headers="e">1</th> <thid="e2" headers="e">2</th> <thid="ef" headers="e">Final</th> <thid="p1" headers="p">1</th> <thid="p2" headers="p">2</th> <thid="pf" headers="p">Final</th> </tr> <tr> <td headers="h">15%</td> <td headers="e e1">15%</td> <td headers="e e2">15%</td> <td headers="e ef">20%</td> <td headers="p p1">10%</td> <td headers="p p2">10%</td> <td headers="p pf">15%</td> </tr> </table> 50
<table cellspacing="0" cellpadding="0" summary="As duas primeiras colunas da tabela são as variáveis de cruzamento (por exemplo, Regiões do país) e as subdivisões de cada bloco (por exemplo, norte, sul, etc.). As demais colunas são os números percentuais de cada indicador. Informações adicionais para melhor leitura dos dados estão no rodapé de cada tabela."> <caption>A1 -PROPORÇÃO COMPUTADOR</caption> … </table>
DE
DOMICÍLIOS
COM
51
Atributo summary -Elemento details <table> <caption> <strong>Characteristics with positive and negative sides.</strong> <details> <summary>Help</summary> <p>Characteristics are given in the second column, with the negative side in the left column and the positive side in the right column.</p> </details> </caption>
52
Recomendaテァテオes que permanecem
GRテ:ICOS
53
HTML5 Gráficos O HTML5 permite de forma fácil desenhar gráficos, utilizando: • o elemento o <canvas> (desenha gráficos em tempo real); • a linha SVG • o CSS3 2D/3D
54
Recomendações que permanecem
Formulários
55
Utilizar o elemento label para associar rĂłtulos de textos em controles de formulĂĄrios.
Em um campo de entrada de texto: <label for="firstname">First name:</label> <input type="text" name="firstname" id="firstname"/> Em um campo checkbox: <input type="checkbox" id="markuplang"name="computerskillsâ&#x20AC;&#x153;> <label for="markuplang">HTML</label>
56
57
Novidades nos formulĂĄrios <form> <label> Nome <input type="text" name="nome" placeholder="digite seu nome" required/> </label> <label> E-mail <input type=â&#x20AC;&#x153;email"name="email" placeholder="digite seu e-mail" required/> </label> Website <input type="url" name="website" required /></label><label>Escolha a cor <input type="color" name="email" /> </label> <label> Data de destino <input type="datetime" name="email" /> </label> <input type="submit"> </form> 58
Comparação de Browsers Windows Browsers Firefox é o melhor na acessibilidade do HTML5
24/100
92/100
22/100
18/100
18/100
Mac Browsers : Safari é o melhor na acessibilidade do HTML5.
20/100
20/100
14/100
74/100
http://html5accessibility.com/ 59
Recomendaçþes que permanecem
Textos Alternativos
60
<imgsrc=“foto.jpg” alt=“Foto das teclas W, 3 e C fora do teclado”>
61
<figure> <imgsrc="/macaco.jpg" alt=â&#x20AC;&#x153;Foto de um Macaco entre as folhas de uma ĂĄrvore"> <figcaption>Um macaco curioso, LowerKintaganbanRiver, Borneo. Foto de Richard Clark</figcaption> </figure>
62
ARIA e HTML5
63
• WAI-ARIA (Accessible Rich Internet Applications) define uma forma de tornar o conteúdo e aplicativos web mais acessíveis a pessoas com deficiências. • Ele contribui especialmente com conteúdo dinâmico e interface de controles de utilizador avançadas desenvolvidos com Ajax, HTML, JavaScript e tecnologias relacionadas.
http://www.w3.org/WAI/intro/aria 64
<ahref="#“ id="handle_zoomSlider“ role="slider“ aria-orientation="vertical“ aria-valuemin="0“ aria-valuemax="17“ aria-valuetext="14“ aria-valuenow="14"> <span>11</span> </a>
65
Sem창ntica
Os novos elementos
66
Elementos semânticos HTML5 • Novos elementos para cabeçalhos, rodapés, menus, secções e artigos.
Formas HTML5 • Novos elementos de forma, novos atributos, tipos de entrada de novos, validação automática. 67
Exemplo de elementos sem창nticos
68
Recomendações que permanecem
MULTIMEDIA
69
HTML5 Multimédia A reprodução de vídeo e áudio é mais fácil, apenas é necessário introduzir o seguinte código HTML5: • <video width="320" height="240" controls="controls"> <source src="movie.mp4" type="video/mp4" /> <source src="movie.ogg" type="video/ogg" /> Your browser does not support the video tag. • <audio controls="controls"> <source src="song.ogg" type="audio/ogg" /> <source src="song.mp3" type="audio/mpeg" /> Your browser does not support the audio element. </audio> 70
VĂdeo e acesso digital
http://www.w3.org/2009/02/ThisIsCoffee.html
http://acessodigital.net/video-html5/video-acessibilidade-br.html
71
Legendas em SVG
72
<videoid="index_video" width="480" height="360" preload="metadata“ controlsposter="./videos/video-acessibilidade-web-pressione-a-tecla-space-para-tocar-e-pausar.jpg" tabindex="0" style="border:0">
<!--videoem MP4, WEBM e OGG --> <source src="./videos/acessibilidade-video-legendas.mp4video.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'> <source src="./videos/acessibilidade-video-legendas.webmvp8.webm" type='video/webm; codecs="vp8, vorbis"'> <source src="./videos/acessibilidade-video-legendas.theora.ogv" type='video/ogg; codecs="theora, vorbis"'> <!--legendas em ingles, espanhol e portugues--> <trackenabled="true" kind="subtitles" label="English" srclang="en" type="application/ttaf+xml" src="./subtitle/xml_ingles_tt.xml"></track> <trackenabled="true" kind="subtitles" label="Español" srclang="es" type="application/ttaf+xml" src="./subtitle/xml_espanhol_tt.xml"></track> <trackenabled="true" kind="subtitles" label="Português" srclang="pt" type="application/ttaf+xml" src="./subtitle/xml_portugues_tt.xml"></track> 73
O que ficou de fora do HTML5?
74
abbr, align, allowtransparency, archive, background, bgcolor, border, cellspacing, classid, clear, code, codetype, color, compact, frameborder, height, hspace, link, marginbottom, marginheight, marginleft, marginright, margintop, marginwidth, noshade, nowrap, profile, rev, rules, scheme, scrolling, size, standby, target, text, urn, valign, valuetype, version, vlink, vspace, width
CSS
75
Funcionalidades e Mudanças HTML5 • A nova versão do HTML traz novas funcionalidades, como a semântica e acessibilidade. Esta versão melhorou bastante a linguagem de suporte às mais recentes multimédias. • A linguagem continua fácil e legível para os seres humanos e também compreendida por computadores e outros dispositivos • Existem estatísticas de que os melhores Sítios Web estão a utilizar o HTML5, o que se verifica em sítios como motores de busca e redes sociais. Como exemplo, em 2011, o Facebook lançou o Centro de Recursos HTML, o que permitiu aos Web designers desenvolver, testar e implementar diversas aplicações para a rede social. 76
Funcionalidades e Mudanças HTML5 • O HTML5 será o novo padrão para HTML, XHTML e HTML DOM. • HTML5 vai facilitar a criação e optimização de Sítios Web embora ainda não consiga dispensar o Flash ou Shockwave. • HTML5 poderá armazenar dados ou obter sua localização geográfica, as Tags poderão substituir os plug-ins para os trabalhos menos complexos. • Estas funcionalidade permitirão tornar a Web mais flexível, segura e eficiente.
77
Funcionalidades e Mudanças HTML5 O HTML5 irá trazer mudanças significativas para a Web, alterando o que já está padronizado: • HTML5 irá reduzir a importância dos plug-ins; • HTML5 permitirá mais gráficos interactivos; • HTML5 permitirá aplicações para armazenamento; • HTML5 simplificará a catalogação de dados por robôs; • HTML5 irá adicionar posicionamento ao local de acesso; • HTML5 vai facilitar o caminho para vídeo na Web; • HTML5 permitirá os widgets conversarem; • HTML5 irá melhorar a segurança; • HTML5 irá simplificar o desenvolvimento Web. 78
Considerações Finais • •
•
Com a realização do presente trabalho, concluímos que a acessibilidade e usabilidade são elementos fundamentais, e cada vez mais imprescindível na construção de Sítios Web. A qualidade da informação a que se tem acesso em Sítios Web é fulcral para o cidadão, reflectindo-se no seu desenvolvimento pessoal e social. Assim, é necessário que essa informação seja acessível a todos os cidadãos de um modo claro, tendo em atenção, em particular, os utilizadores com necessidades especiais. A aposta no desenvolvimento de software para a melhoria da Acessibilidade deve continuar, pois é através dela que se consegue combater à Info-Exclusão. 79
Considerações Finais • Em relação ao HTML5, tivemos algumas dificuldades em encontrar informação, uma vez que esta nova versão implementa alterações no HTML, através de diversas funcionalidades como semântica e acessibilidade. • Neste sentido, o HTML5 vêm simplificar a construção de Sítios Web, com inclusão de novos elementos, o que o torna cada vez mais versátil. • Com a realização deste trabalho, ficamos mais sensíveis e atentos a todas as questões relacionadas com a acessibilidade e usabilidade, que podem ser utilizadas em diversas linguagens, incluindo o HTML5, de forma a facilitar a vida a todos os indivíduos com necessidades especiais. 80
Futuras Investigações Depois de elaborar este trabalho, aumenta a nossa convicção de que há muito por fazer na área do Webdesign. Temos a noção de que muitas outras análises poderiam ainda ser realizadas sobre esta temática. Julgamos que os seguintes temas seriam de interesse para futuras investigações: • Analisar e testar diversos software utilizados actualmente na melhoria da Acessibilidade; • Avaliar a acessibilidade e usabilidade do Sítio Web do IPBeja e propostas de redesenho. • Estudo comparativo de Acessibilidade/Usabilidade das redes sociais mais utilizadas. Estas são algumas das nossas propostas para futuras investigações. 81
Anexo
82
Associação de Estudantes da Escola Superior de Educação de Beja apresenta o programa para o evento "Distúrbios Culturais 2012" XVII Edição
Dia 29 de Fevereiro: 14h00 - Workshop de HTML5 – Formador: Nuno Pereira, Local: Sala 1.16
83
Webliografia • Carreteiro, Joaquina. (2007). Avaliação de usabilidade e acessibilidade do Sítio Web da ESTIG e propostas de redesenho. Projecto Final de Curso. • Rodrigues, Paula. (2006). Estudo de Usabilidade/Acessibilidade dos Sítios Internet das Câmaras Municipais do Distrito de Beja. • Carioca, Vito J.J. (1997). “Validação de uma escola de atitudes de docentes relativamente à utilização da informática educativa na sua formação contínua”. Dissertação de Doutoramento da Universidade de Extremadura. • Missão para a Sociedade de Informação Ç(1997). “Livro Verde para a Sociedade da Informação em Portugal”. Lisboa: Ministério da Ciência e da Tecnologia. 84
Webliografia Legislação: • Resolução Janeiro. • Resolução Outubro. • Resolução Agosto. • Resolução Agosto.
do Conselho de Ministros nº 9/2007, de 17 de
do Conselho de Ministros nº 155/2007, de 2 de do Conselho de Ministros nº 110/2003, de 12 de
do Conselho de Ministros nº 95/99, de 25 de
85
Webliografia • • • • • • • • • • •
http://pt.wikipedia.org/wiki/Adobe_Flash http://pt.wikipedia.org/wiki/HTML5 http://www.acessibilidade.com http://umic.pcm.gov.pt http://www.acesso.umic.pt/doc.htm http://www.missao-si.mct.pt http://www.acessibilidade.net/web/ http://www.inclusivelondon.com/disabledaccess.aspx http://www.adobe.com/br/accessibility/ http://www.maujor.com/tutorial/acessibilidade-na-html5.php http://tableless.com.br/ 86
Webliografia • http://pt.wikipedia.org/wiki/Usabilidade • http://www.slideshare.net/mar_twinkle/avaliao-heurstica1056976 • http://www.carlostristacci.com.br/blog/acessibilidade-noadobe-flash/ • http://aareis.com.br/web-2-0/artigo-flash-usabilidade-e-web2-0.html • p://pt.wikipedia.org/wiki/HTML5 • http://help.adobe.com/pt_BR/Flash/10.0_UsingFlash/WSd60f 23110762d6b883b18f10cb1fe1af6-7c3ea.html • http://danielcambui.wordpress.com/2011/05/08/acessibilida de-flash-seo-web-deficiente-visuais/ 87