SlideShare uma empresa Scribd logo
Quando e como usar
WAI-ARIA
Web sem Barreiras
4 de agosto de 2018
Reinaldo Ferraz
• https://pt.slideshare.net/reinaldoferraz
• https://pt.slideshare.net/CentroWeb/
@reinaldoferraz
Ilustração por Iconicbestiary - Freepik.com
WCAG WAI-ARIA
WCAG
ARIA
Web Content Accessibility Guidelines
http://www.w3.org/TR/WCAG/
WCAG
Princípio 1: Perceptível
Princípio 2: Operável
Princípio 3: Compreensível
Princípio 4: Robusto
Princípios do WCAG
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
usuário avançadas desenvolvidos com Ajax,
HTML, JavaScript e tecnologias relacionadas.
http://www.w3.org/WAI/intro/aria
progressbar
radiogroup
scrollbar
slider
spinbutton
status
Tab
tabpanel
textbox
tooltip
73 ROLES (Ou Papéis)
alert
Alertdialog
button
checkbox
dialog
menu
menubar
menuitem
option
...
http://www.w3.org/TR/wai-aria/roles#role_definitions
aria-activedescendant
aria-atomic
aria-autocomplete
aria-busy (state)
aria-checked (state)
aria-controls
aria-describedby
aria-disabled (state)
aria-dropeffect
aria-expanded (state)
aria-flowto
aria-grabbed (state)
35 States and Properties (Estados e Propriedades)
aria-haspopup
aria-hidden (state)
aria-invalid (state)
aria-label
aria-labelledby
aria-level
aria-live
aria-multiline
aria-multiselectable
aria-orientation
aria-owns
...
http://www.w3.org/TR/wai-aria/states_and_properties
Implementação por leitores de tela:
Landmark roles são suportadas em
• JAWS 10
• NVDA 2010.1+
• VoiceOver no iPhone IOS4.
1. As WCAG utilizam a semântica do HTML para tornar
o conteúdo acessível
2. ARIA são atributos que conseguem mudar a
semântica dos elementos para tornar o conteúdo
acessível
Quatro regras para o bom uso de
WAI-ARIA
Regra nº 1
Não use ARIA
(prefira os elementos semânticos do HTML)
<span>Enviar</span>
<span onclick=“Event(this)”>Enviar</span>
<span onclick=“Event(this)”
onmouseover=“Event(this)”
onmouseout=“Event(this)”>Enviar</span>
<span onclick=“Event(this)”>
onmouseover=“Event(this)”
onmouseout=“Event(this)”
onfocus=“Event(this)”
onblur=“Event(this)”>Enviar</span>
<span role=“button” onclick=“Event(this)”>
onmouseover=“Event(this)”
onmouseout=“Event(this)”
onfocus=“Event(this)”
onblur=“Event(this)”>Enviar</span>
<button>Enviar</button>
Regra nº 2
Não mude a semântica
dos elementos
(apenas se você realmente precisar)
Não faça isso:
<h1 role=button>heading button</h1>
Não faça isso:
<h1 role=button>heading button</h1>
Faça isso:
<h1>
<button>heading button</button>
</h1>
Não faça isso:
<h1 role=button>heading button</h1>
Faça isso:
<h1>
<button>heading button</button>
</h1>
Se não puder usar o elemento correto, faça isso:
<h1>
<span role=button>heading button</span>
</h1>
Regra nº 3
Todos os controles
interativos devem ser
acessíveis via teclado
Regra nº 4
Não use role="presentation" ou
aria-hidden="true“ em um
elemento de foco visível
<h1 role=presentation>
heading button
</h1>
<h1 aria-hidden=true>
heading button
</h1>
• Navegação
• Conteúdo escondido
• Falta de controle pelo usuário
• Confusão/desorientação
Ótimo artigo sobre esse tópico: http://webaim.org/techniques/javascript/
Javascript e leitores de tela
Javascript e leitores de tela
Web Aim Screen Reader Survey
Fonte: http://webaim.org/projects/screenreadersurvey5/#javascript
Pesquisa feita com 1465 usuários de software
leitor de tela em Janeiro de 2014
Javascript e leitores de tela
Web Aim Screen Reader Survey
Fonte: http://webaim.org/projects/screenreadersurvey5/#javascript
97.6% mantém o JavaScript habilitado
Javascript e leitores de tela
JAWS 16
- Suporte a MathML (FF e IE)
- Lê cores de fundo (FF)
- Maior suporte a ARIA
NVDA 2015.2
- Suporte aos principais landmarks de ARIA
ORCA / VoiceOver
- Suporte a Live Regions
Javascript e leitores de tela
Quando usar? ou não...
Descrever regiões do site
Descrever regiões do site
<div id="header" role="banner">
A banner image and introductory title</div>
<div id="sitelookup" role="search">....</div>
<div id="nav" role="navigation">
...a list of links here ... </div>
<div id="content" role="main">
... Ottawa is the capital of Canada ...</div>
<div id="rightsideadvert" role="complementary">
....an advertisement here...</div>
<div id="footer" role="contentinfo">
c)The Freedom Company, 123 Freedom Way, Helpville,
USA</div>
Descrever regiões do site
<header>
A banner image and introductory title</header>
<input type=“search”>
<nav>
...a list of links here ... </nav>
<main>
... Ottawa is the capital of Canada ...</main>
<aside>
....an advertisement here...</aside>
<footer>
c)The Freedom Company, 123 Freedom Way, Helpville,
USA</footer>
Descrever regiões do site
header
nav aside
aside
article
section
https://caniuse.com/#feat=wai-aria
Descrição de conteúdos invisíveis
Descrição de conteúdos invisíveis
<div class="foto"
role=“img”
aria-label="Logo do W3C">
</div>
<label for=“pais” aria-label=“Este campo atualiza
automaticamente o próximo campo”>
Selecione o país</label>
<select id=“pais”>
<option>Argentina</option>
<option>Brasil</option>
<option>Bolívia</option>
<option>Chile</option>
<option>Equador</option>
<option>Peru</option>
</select>
Relacionar informações
<form>
<fieldset>
<legend>Casa de espetáculos</legend>
<label for=“valor">Valor do ingresso</label>
<input type=“valor" id=“valor"
aria-describedby="complementar">
<p id="complementar “>
O valor deve ser preenchido em reais</p>
</fieldset>
</form>
role=“application”
role=“tree”
role=“treeitem”
aria-expanded=“false"
aria-expanded="true"
role=“treeitem”
Definir status de elementos
Definir status de elementos
Definir status de elementos
<span role="checkbox" aria-checked="false" tabindex="0"
aria-labelledby=“unchecked"></span>
<span role="checkbox" aria-checked=“true" tabindex="0"
aria-labelledby=“checked"></span>
Definir status de elementos
<input type="radio" name="exemplo01" id="exemplo01">
<label for="exemplo01">Unchecked</label>
aria-live: Determina a prioridade da leitura pela TA (off, polite, assertive)
Conteúdo dinâmico
<span id="messages" aria-live="polite" >
Fulano adicionou você como amigo
</span>
Conteúdo dinâmico
Aplicar técnicas de acessibilidade em um site
com usabilidade ruim é como passar batom
em um porco. Não importa o quanto você
passe, ele continuará sendo um porco.
Não faça da ARIA o seu batom.
Fonte: http://webaim.org/blog/accessibility-lipstick-on-a-usability-pig/
Mantenha sua aplicação simples
Obrigado
www.ceweb.br
reinaldo@nic.br @reinaldoferraz
08 de agosto de 2018

Mais conteúdo relacionado

Mais procurados

jQuery
jQueryjQuery
Web Accessibility
Web AccessibilityWeb Accessibility
Web Accessibility
Mindfire Solutions
 
CSS Dasar #6 : Background
CSS Dasar #6 : BackgroundCSS Dasar #6 : Background
CSS Dasar #6 : Background
Sandhika Galih
 
Web Accessibility Testing With Axe
Web Accessibility Testing With AxeWeb Accessibility Testing With Axe
Web Accessibility Testing With Axe
Aparna A Gopalakrishnan
 
Nuxt.JS Introdruction
Nuxt.JS IntrodructionNuxt.JS Introdruction
Nuxt.JS Introdruction
David Ličen
 
RESTful API - Best Practices
RESTful API - Best PracticesRESTful API - Best Practices
RESTful API - Best Practices
Tricode (part of Dept)
 
Web accessibility
Web accessibilityWeb accessibility
Web accessibility
AGILEDROP
 
CSS3 Media Queries
CSS3 Media QueriesCSS3 Media Queries
CSS3 Media Queries
Russ Weakley
 
Introduction To WCAG 2.0
Introduction To WCAG 2.0Introduction To WCAG 2.0
Introduction To WCAG 2.0
Vision Australia
 
CSS Dasar #9 : Inheritance
CSS Dasar #9 : InheritanceCSS Dasar #9 : Inheritance
CSS Dasar #9 : Inheritance
Sandhika Galih
 
Modern Web Development
Modern Web DevelopmentModern Web Development
Modern Web Development
Robert Nyman
 
Alt e Lang: Dois atributos da pesada
Alt e Lang: Dois atributos da pesadaAlt e Lang: Dois atributos da pesada
Alt e Lang: Dois atributos da pesada
Reinaldo Ferraz
 
Routing in NEXTJS.pdf
Routing in NEXTJS.pdfRouting in NEXTJS.pdf
Routing in NEXTJS.pdf
AnishaDahal5
 
SEO Website Analysis - example report
SEO Website Analysis - example reportSEO Website Analysis - example report
SEO Website Analysis - example report
Lynn Holley III
 
Basics of Web Accessibility
Basics of Web AccessibilityBasics of Web Accessibility
Basics of Web Accessibility
Moin Shaikh
 
Front-End Frameworks: a quick overview
Front-End Frameworks: a quick overviewFront-End Frameworks: a quick overview
Front-End Frameworks: a quick overview
Diacode
 
Intro to html, css & sass
Intro to html, css & sassIntro to html, css & sass
Intro to html, css & sass
Sean Wolfe
 
Bootstrap ppt
Bootstrap pptBootstrap ppt
Bootstrap ppt
Ishtdeep Hora
 
WCAG
WCAGWCAG
API Management Reference Architecture
API Management Reference ArchitectureAPI Management Reference Architecture
API Management Reference Architecture
Seong-Bok Lee
 

Mais procurados (20)

jQuery
jQueryjQuery
jQuery
 
Web Accessibility
Web AccessibilityWeb Accessibility
Web Accessibility
 
CSS Dasar #6 : Background
CSS Dasar #6 : BackgroundCSS Dasar #6 : Background
CSS Dasar #6 : Background
 
Web Accessibility Testing With Axe
Web Accessibility Testing With AxeWeb Accessibility Testing With Axe
Web Accessibility Testing With Axe
 
Nuxt.JS Introdruction
Nuxt.JS IntrodructionNuxt.JS Introdruction
Nuxt.JS Introdruction
 
RESTful API - Best Practices
RESTful API - Best PracticesRESTful API - Best Practices
RESTful API - Best Practices
 
Web accessibility
Web accessibilityWeb accessibility
Web accessibility
 
CSS3 Media Queries
CSS3 Media QueriesCSS3 Media Queries
CSS3 Media Queries
 
Introduction To WCAG 2.0
Introduction To WCAG 2.0Introduction To WCAG 2.0
Introduction To WCAG 2.0
 
CSS Dasar #9 : Inheritance
CSS Dasar #9 : InheritanceCSS Dasar #9 : Inheritance
CSS Dasar #9 : Inheritance
 
Modern Web Development
Modern Web DevelopmentModern Web Development
Modern Web Development
 
Alt e Lang: Dois atributos da pesada
Alt e Lang: Dois atributos da pesadaAlt e Lang: Dois atributos da pesada
Alt e Lang: Dois atributos da pesada
 
Routing in NEXTJS.pdf
Routing in NEXTJS.pdfRouting in NEXTJS.pdf
Routing in NEXTJS.pdf
 
SEO Website Analysis - example report
SEO Website Analysis - example reportSEO Website Analysis - example report
SEO Website Analysis - example report
 
Basics of Web Accessibility
Basics of Web AccessibilityBasics of Web Accessibility
Basics of Web Accessibility
 
Front-End Frameworks: a quick overview
Front-End Frameworks: a quick overviewFront-End Frameworks: a quick overview
Front-End Frameworks: a quick overview
 
Intro to html, css & sass
Intro to html, css & sassIntro to html, css & sass
Intro to html, css & sass
 
Bootstrap ppt
Bootstrap pptBootstrap ppt
Bootstrap ppt
 
WCAG
WCAGWCAG
WCAG
 
API Management Reference Architecture
API Management Reference ArchitectureAPI Management Reference Architecture
API Management Reference Architecture
 

Semelhante a Quando e como usar WAI-ARIA

Acessibilidade para Web
Acessibilidade para WebAcessibilidade para Web
Acessibilidade para Web
João Conserva
 
HTML5, WAI-ARIA e Acessibilidade na Web - Digital acesso 2011
HTML5, WAI-ARIA e Acessibilidade na Web - Digital acesso 2011HTML5, WAI-ARIA e Acessibilidade na Web - Digital acesso 2011
HTML5, WAI-ARIA e Acessibilidade na Web - Digital acesso 2011
Reinaldo Ferraz
 
Fazendo a Web falar: HTML5, WAI-ARIA e NVDA
Fazendo a Web falar: HTML5, WAI-ARIA e NVDAFazendo a Web falar: HTML5, WAI-ARIA e NVDA
Fazendo a Web falar: HTML5, WAI-ARIA e NVDA
Reinaldo Ferraz
 
HTML 5, CSS 3 e o futuro da Web
HTML 5, CSS 3 e o futuro da WebHTML 5, CSS 3 e o futuro da Web
HTML 5, CSS 3 e o futuro da Web
Diego Pessoa
 
HTML5 - A nova fronteira no desenvolvimento de aplicações WEB
HTML5 - A nova fronteira no desenvolvimento de aplicações WEBHTML5 - A nova fronteira no desenvolvimento de aplicações WEB
HTML5 - A nova fronteira no desenvolvimento de aplicações WEB
Fábio Flatschart
 
HTML 5 e Open Web Platform
HTML 5 e Open Web PlatformHTML 5 e Open Web Platform
HTML 5 e Open Web Platform
Ana Carolina Gracioso
 
Acessibilidade na Web modo Jedi Master
Acessibilidade na Web modo Jedi MasterAcessibilidade na Web modo Jedi Master
Acessibilidade na Web modo Jedi Master
Reinaldo Ferraz
 
HTML5, Mobile Web e além - Computer on the beach 2015
HTML5, Mobile Web e além - Computer on the beach 2015HTML5, Mobile Web e além - Computer on the beach 2015
HTML5, Mobile Web e além - Computer on the beach 2015
Reinaldo Ferraz
 
Android Libs - AndroidDevConf
Android Libs - AndroidDevConfAndroid Libs - AndroidDevConf
Android Libs - AndroidDevConf
Nelson Glauber Leal
 
Nobody leaves this place without coding an accessible projetc
Nobody leaves this place without coding an accessible projetcNobody leaves this place without coding an accessible projetc
Nobody leaves this place without coding an accessible projetc
Reinaldo Ferraz
 
Acessibilidade na web - Computer on the Beach 2015
Acessibilidade na web - Computer on the Beach 2015Acessibilidade na web - Computer on the Beach 2015
Acessibilidade na web - Computer on the Beach 2015
Reinaldo Ferraz
 
Html acessivel - Um guia rápido para melhorar a acessibilidade das suas págin...
Html acessivel - Um guia rápido para melhorar a acessibilidade das suas págin...Html acessivel - Um guia rápido para melhorar a acessibilidade das suas págin...
Html acessivel - Um guia rápido para melhorar a acessibilidade das suas págin...
Centro Web
 
HTML Acessível
HTML AcessívelHTML Acessível
HTML Acessível
Reinaldo Ferraz
 
HTML5 - Road Show TI Experience 2012
HTML5 - Road Show TI Experience 2012HTML5 - Road Show TI Experience 2012
HTML5 - Road Show TI Experience 2012
Fábio Flatschart
 
Passado, Presente e Futuro da Web - Centro Universitário Unimonte 2015
Passado, Presente e Futuro da Web - Centro Universitário Unimonte 2015Passado, Presente e Futuro da Web - Centro Universitário Unimonte 2015
Passado, Presente e Futuro da Web - Centro Universitário Unimonte 2015
Reinaldo Ferraz
 
Acessibilidade na Web - Desenvolvendo para pessoas e não só para máquinas
Acessibilidade na Web - Desenvolvendo para pessoas e não só para máquinasAcessibilidade na Web - Desenvolvendo para pessoas e não só para máquinas
Acessibilidade na Web - Desenvolvendo para pessoas e não só para máquinas
Centro Web
 
Acessibilidade na Web: Construíndo páginas para pessoas e não só para máquinas
Acessibilidade na Web: Construíndo páginas para pessoas e não só para máquinasAcessibilidade na Web: Construíndo páginas para pessoas e não só para máquinas
Acessibilidade na Web: Construíndo páginas para pessoas e não só para máquinas
Reinaldo Ferraz
 
Acessibilidade na web
Acessibilidade na webAcessibilidade na web
Acessibilidade na web
Nome Sobrenome
 
HTML5- Road Show TI - Senac Jaboticabal
HTML5- Road Show TI -  Senac Jaboticabal HTML5- Road Show TI -  Senac Jaboticabal
HTML5- Road Show TI - Senac Jaboticabal
Clécio Bachini
 
Browser Mobile - Opera
Browser Mobile - OperaBrowser Mobile - Opera
Browser Mobile - Opera
Renato Bongiorno Bonfanti
 

Semelhante a Quando e como usar WAI-ARIA (20)

Acessibilidade para Web
Acessibilidade para WebAcessibilidade para Web
Acessibilidade para Web
 
HTML5, WAI-ARIA e Acessibilidade na Web - Digital acesso 2011
HTML5, WAI-ARIA e Acessibilidade na Web - Digital acesso 2011HTML5, WAI-ARIA e Acessibilidade na Web - Digital acesso 2011
HTML5, WAI-ARIA e Acessibilidade na Web - Digital acesso 2011
 
Fazendo a Web falar: HTML5, WAI-ARIA e NVDA
Fazendo a Web falar: HTML5, WAI-ARIA e NVDAFazendo a Web falar: HTML5, WAI-ARIA e NVDA
Fazendo a Web falar: HTML5, WAI-ARIA e NVDA
 
HTML 5, CSS 3 e o futuro da Web
HTML 5, CSS 3 e o futuro da WebHTML 5, CSS 3 e o futuro da Web
HTML 5, CSS 3 e o futuro da Web
 
HTML5 - A nova fronteira no desenvolvimento de aplicações WEB
HTML5 - A nova fronteira no desenvolvimento de aplicações WEBHTML5 - A nova fronteira no desenvolvimento de aplicações WEB
HTML5 - A nova fronteira no desenvolvimento de aplicações WEB
 
HTML 5 e Open Web Platform
HTML 5 e Open Web PlatformHTML 5 e Open Web Platform
HTML 5 e Open Web Platform
 
Acessibilidade na Web modo Jedi Master
Acessibilidade na Web modo Jedi MasterAcessibilidade na Web modo Jedi Master
Acessibilidade na Web modo Jedi Master
 
HTML5, Mobile Web e além - Computer on the beach 2015
HTML5, Mobile Web e além - Computer on the beach 2015HTML5, Mobile Web e além - Computer on the beach 2015
HTML5, Mobile Web e além - Computer on the beach 2015
 
Android Libs - AndroidDevConf
Android Libs - AndroidDevConfAndroid Libs - AndroidDevConf
Android Libs - AndroidDevConf
 
Nobody leaves this place without coding an accessible projetc
Nobody leaves this place without coding an accessible projetcNobody leaves this place without coding an accessible projetc
Nobody leaves this place without coding an accessible projetc
 
Acessibilidade na web - Computer on the Beach 2015
Acessibilidade na web - Computer on the Beach 2015Acessibilidade na web - Computer on the Beach 2015
Acessibilidade na web - Computer on the Beach 2015
 
Html acessivel - Um guia rápido para melhorar a acessibilidade das suas págin...
Html acessivel - Um guia rápido para melhorar a acessibilidade das suas págin...Html acessivel - Um guia rápido para melhorar a acessibilidade das suas págin...
Html acessivel - Um guia rápido para melhorar a acessibilidade das suas págin...
 
HTML Acessível
HTML AcessívelHTML Acessível
HTML Acessível
 
HTML5 - Road Show TI Experience 2012
HTML5 - Road Show TI Experience 2012HTML5 - Road Show TI Experience 2012
HTML5 - Road Show TI Experience 2012
 
Passado, Presente e Futuro da Web - Centro Universitário Unimonte 2015
Passado, Presente e Futuro da Web - Centro Universitário Unimonte 2015Passado, Presente e Futuro da Web - Centro Universitário Unimonte 2015
Passado, Presente e Futuro da Web - Centro Universitário Unimonte 2015
 
Acessibilidade na Web - Desenvolvendo para pessoas e não só para máquinas
Acessibilidade na Web - Desenvolvendo para pessoas e não só para máquinasAcessibilidade na Web - Desenvolvendo para pessoas e não só para máquinas
Acessibilidade na Web - Desenvolvendo para pessoas e não só para máquinas
 
Acessibilidade na Web: Construíndo páginas para pessoas e não só para máquinas
Acessibilidade na Web: Construíndo páginas para pessoas e não só para máquinasAcessibilidade na Web: Construíndo páginas para pessoas e não só para máquinas
Acessibilidade na Web: Construíndo páginas para pessoas e não só para máquinas
 
Acessibilidade na web
Acessibilidade na webAcessibilidade na web
Acessibilidade na web
 
HTML5- Road Show TI - Senac Jaboticabal
HTML5- Road Show TI -  Senac Jaboticabal HTML5- Road Show TI -  Senac Jaboticabal
HTML5- Road Show TI - Senac Jaboticabal
 
Browser Mobile - Opera
Browser Mobile - OperaBrowser Mobile - Opera
Browser Mobile - Opera
 

Mais de Reinaldo Ferraz

Acessibilidade Digital e Realidade Estendida (VR/XR)
Acessibilidade Digital e Realidade Estendida (VR/XR)Acessibilidade Digital e Realidade Estendida (VR/XR)
Acessibilidade Digital e Realidade Estendida (VR/XR)
Reinaldo Ferraz
 
Acessibilidade na Web - Muito além do código
Acessibilidade na Web - Muito além do códigoAcessibilidade na Web - Muito além do código
Acessibilidade na Web - Muito além do código
Reinaldo Ferraz
 
WCAG 2.2 e 3.0
WCAG 2.2 e 3.0WCAG 2.2 e 3.0
WCAG 2.2 e 3.0
Reinaldo Ferraz
 
Legendas na Web
Legendas na WebLegendas na Web
Legendas na Web
Reinaldo Ferraz
 
WCAG 2.2
WCAG 2.2WCAG 2.2
WCAG 2.2
Reinaldo Ferraz
 
Por que re-descentralizar a Web?
Por que re-descentralizar a Web?Por que re-descentralizar a Web?
Por que re-descentralizar a Web?
Reinaldo Ferraz
 
Passado, presente e futuro da acessibilidade na web
Passado, presente e futuro da acessibilidade na webPassado, presente e futuro da acessibilidade na web
Passado, presente e futuro da acessibilidade na web
Reinaldo Ferraz
 
WCAG 2.1
WCAG 2.1WCAG 2.1
WCAG 2.1
Reinaldo Ferraz
 
Re-descentralizar a web
Re-descentralizar a webRe-descentralizar a web
Re-descentralizar a web
Reinaldo Ferraz
 
The power of ALT and LANG attributes
The power of ALT and LANG attributesThe power of ALT and LANG attributes
The power of ALT and LANG attributes
Reinaldo Ferraz
 
Accessibility on SVG and SEO
Accessibility on SVG and SEOAccessibility on SVG and SEO
Accessibility on SVG and SEO
Reinaldo Ferraz
 
Technological study of Brazilian government websites
Technological study of Brazilian government websitesTechnological study of Brazilian government websites
Technological study of Brazilian government websites
Reinaldo Ferraz
 
WCAG 2.1
WCAG 2.1WCAG 2.1
WCAG 2.1
Reinaldo Ferraz
 
Acessibilidade na web
Acessibilidade na webAcessibilidade na web
Acessibilidade na web
Reinaldo Ferraz
 
Aplicações em HTML5 para interação com a TV Digital
Aplicações em HTML5 para interação com a TV DigitalAplicações em HTML5 para interação com a TV Digital
Aplicações em HTML5 para interação com a TV Digital
Reinaldo Ferraz
 
Atributos textuais para imagens e SEO
Atributos textuais para imagens e SEOAtributos textuais para imagens e SEO
Atributos textuais para imagens e SEO
Reinaldo Ferraz
 
ALT and TITLE attributes in images and SEO
ALT and TITLE attributes in images and SEOALT and TITLE attributes in images and SEO
ALT and TITLE attributes in images and SEO
Reinaldo Ferraz
 
Web das Coisas - Que tal fazer coisas que sejam realmente úteis?
Web das Coisas - Que tal fazer coisas que sejam realmente úteis?Web das Coisas - Que tal fazer coisas que sejam realmente úteis?
Web das Coisas - Que tal fazer coisas que sejam realmente úteis?
Reinaldo Ferraz
 
Re-descentralizar a web!
Re-descentralizar a web!Re-descentralizar a web!
Re-descentralizar a web!
Reinaldo Ferraz
 
Internet das Coisas - Aprisionamento ou descentralização social?
Internet das Coisas - Aprisionamento ou descentralização social?Internet das Coisas - Aprisionamento ou descentralização social?
Internet das Coisas - Aprisionamento ou descentralização social?
Reinaldo Ferraz
 

Mais de Reinaldo Ferraz (20)

Acessibilidade Digital e Realidade Estendida (VR/XR)
Acessibilidade Digital e Realidade Estendida (VR/XR)Acessibilidade Digital e Realidade Estendida (VR/XR)
Acessibilidade Digital e Realidade Estendida (VR/XR)
 
Acessibilidade na Web - Muito além do código
Acessibilidade na Web - Muito além do códigoAcessibilidade na Web - Muito além do código
Acessibilidade na Web - Muito além do código
 
WCAG 2.2 e 3.0
WCAG 2.2 e 3.0WCAG 2.2 e 3.0
WCAG 2.2 e 3.0
 
Legendas na Web
Legendas na WebLegendas na Web
Legendas na Web
 
WCAG 2.2
WCAG 2.2WCAG 2.2
WCAG 2.2
 
Por que re-descentralizar a Web?
Por que re-descentralizar a Web?Por que re-descentralizar a Web?
Por que re-descentralizar a Web?
 
Passado, presente e futuro da acessibilidade na web
Passado, presente e futuro da acessibilidade na webPassado, presente e futuro da acessibilidade na web
Passado, presente e futuro da acessibilidade na web
 
WCAG 2.1
WCAG 2.1WCAG 2.1
WCAG 2.1
 
Re-descentralizar a web
Re-descentralizar a webRe-descentralizar a web
Re-descentralizar a web
 
The power of ALT and LANG attributes
The power of ALT and LANG attributesThe power of ALT and LANG attributes
The power of ALT and LANG attributes
 
Accessibility on SVG and SEO
Accessibility on SVG and SEOAccessibility on SVG and SEO
Accessibility on SVG and SEO
 
Technological study of Brazilian government websites
Technological study of Brazilian government websitesTechnological study of Brazilian government websites
Technological study of Brazilian government websites
 
WCAG 2.1
WCAG 2.1WCAG 2.1
WCAG 2.1
 
Acessibilidade na web
Acessibilidade na webAcessibilidade na web
Acessibilidade na web
 
Aplicações em HTML5 para interação com a TV Digital
Aplicações em HTML5 para interação com a TV DigitalAplicações em HTML5 para interação com a TV Digital
Aplicações em HTML5 para interação com a TV Digital
 
Atributos textuais para imagens e SEO
Atributos textuais para imagens e SEOAtributos textuais para imagens e SEO
Atributos textuais para imagens e SEO
 
ALT and TITLE attributes in images and SEO
ALT and TITLE attributes in images and SEOALT and TITLE attributes in images and SEO
ALT and TITLE attributes in images and SEO
 
Web das Coisas - Que tal fazer coisas que sejam realmente úteis?
Web das Coisas - Que tal fazer coisas que sejam realmente úteis?Web das Coisas - Que tal fazer coisas que sejam realmente úteis?
Web das Coisas - Que tal fazer coisas que sejam realmente úteis?
 
Re-descentralizar a web!
Re-descentralizar a web!Re-descentralizar a web!
Re-descentralizar a web!
 
Internet das Coisas - Aprisionamento ou descentralização social?
Internet das Coisas - Aprisionamento ou descentralização social?Internet das Coisas - Aprisionamento ou descentralização social?
Internet das Coisas - Aprisionamento ou descentralização social?
 

Quando e como usar WAI-ARIA