SlideShare a Scribd company logo
1 of 14
Download to read offline
ACCESIBILIDAD WEB
MÁS ALLÁ DEL MARCADO
Manuel Razzari
Desconferencia: “Accesibilidad en tiempos de crisis”
Junio 15, 2012
SUMARIO
Contenidistas
Diseñadores
Programadores back-end
Maquetadores
Clientes
CONTENIDISTAS
                Confusión @alt y
                epígrafe.
                Alt con nombre de
                imagen.
                Errores de tipeo.
                ¡El enemigo!
¡ALT OBLIGATORIO!
      Si, claro.
DISEÑADORES
¡Artistas! ¡Hippies!
Bajo contraste
Texto muy chico
Flash
Colores con significado
¡El enemigo!



http://soundcloud.com/designerdrugsmusic
12




              10




               8




                                                                 Column 1
                                                                 Column 2
               6                                                 Column 3




               4




               2




               0
                                 Row 1   Row 2   Row 3   Row 4
http://webaim.org/resources/designers/
PROGRAMADOR BACK-END
.NET (C#)
writer.RenderBeginTag(HtmlTextWriterTag.Li);
IDictionary<HtmlTextWriterAttribute, string> attributeList = new
Dictionary<HtmlTextWriterAttribute, string>();
attributeList.Add(HtmlTextWriterAttribute.Href, subDomainNameAuth);
WriteHTMLTag(HtmlTextWriterTag.A, attributeList , regionLink.RegionName,
writer);
writer.RenderEndTag();



Links que no son links
<a id="ToppageUC1_Mainmenubuild2_BemestingButton1_Lin kButton1"
class="MenuButton" href="javascript:__doPostBack('ToppageUC1$Mainmenu
build2$BemestingButton1$LinkButton1','')">Inicio</a>


HTML:         <li><a href="index.html">Un simple link</a></li>



¡El enemigo!
MAQUETADOR (FRONT-END)
Deberían ser nuestros amigos.




“Claramente no se nada
 sobre accesibilidad”

“ARIA, me suena”


http://www.wordsbyf.at/2012/05/21/jsconf-argentina-2012/
MAQUETADOR (FRONT-END)
                                                          Reclaman que falta información.
                                                          Ejemplos prácticos en lugar de “listas
                                                           de cosas que hiciste mal”.
                                                          Video-tutoriales de uso de screen
                                                           readers.
                                                          Prioridades: ¿qué es lo más
                                                           importante que tengo que hacer?




http://paulirish.com/2012/accessibility-and-developers/
GOOGLEARON MAL
 O... ¿no les importa?
SETENTA MIL PESOS




https://github.com/mercadolibre/chico/issues/632
MAQUETADOR (FRONT-END)

No validan en W3C. Validan cross-browser.


                                     +


¿Enseñarles lectores de pantalla, en lugar de
 mostrar cuantos errores de validación tienen?
CLIENTES
 SEO: ¡El enemigo!
 ¿La ley argentina?
 ¿ Sirven los argumentos de “business case”?
 Piden accesibilidad en el requerimiento,
  pero después ¿lo auditan?




http://www.w3.org/WAI/bcase/Overview#custom
¡UDS DIRÁN!
      @mrazzari
 http://goo.gl/cGHJc

More Related Content

Viewers also liked

Erfolgsfaktoren im Change-Management der Verlag
Erfolgsfaktoren im Change-Management der VerlagErfolgsfaktoren im Change-Management der Verlag
Erfolgsfaktoren im Change-Management der Verlag
Markus Wilhelm
 

Viewers also liked (20)

State of the Word 2016
State of the Word 2016State of the Word 2016
State of the Word 2016
 
WordPress 4.4 and Beyond
WordPress 4.4 and BeyondWordPress 4.4 and Beyond
WordPress 4.4 and Beyond
 
WordPress: Getting Under the Hood
WordPress: Getting Under the HoodWordPress: Getting Under the Hood
WordPress: Getting Under the Hood
 
How to Become a Thought Leader in Your Niche
How to Become a Thought Leader in Your NicheHow to Become a Thought Leader in Your Niche
How to Become a Thought Leader in Your Niche
 
XWiki Rendering @ FOSDEM 2014
XWiki Rendering @ FOSDEM 2014XWiki Rendering @ FOSDEM 2014
XWiki Rendering @ FOSDEM 2014
 
Heinold Medien 2 0
Heinold Medien 2 0Heinold Medien 2 0
Heinold Medien 2 0
 
Herausforderung Hyperdistribution
Herausforderung HyperdistributionHerausforderung Hyperdistribution
Herausforderung Hyperdistribution
 
Social Media für Verlage. Einführung und Überblick.
Social Media für Verlage. Einführung und Überblick.Social Media für Verlage. Einführung und Überblick.
Social Media für Verlage. Einführung und Überblick.
 
Kraut-Publishers-Kurzvorstellung
Kraut-Publishers-KurzvorstellungKraut-Publishers-Kurzvorstellung
Kraut-Publishers-Kurzvorstellung
 
Geschaeftsmodelle heinold
Geschaeftsmodelle heinoldGeschaeftsmodelle heinold
Geschaeftsmodelle heinold
 
Heinold learntec 2014
Heinold learntec 2014Heinold learntec 2014
Heinold learntec 2014
 
Erfolgsfaktoren im Change-Management der Verlag
Erfolgsfaktoren im Change-Management der VerlagErfolgsfaktoren im Change-Management der Verlag
Erfolgsfaktoren im Change-Management der Verlag
 
Learntec charts heinold_2013
Learntec charts heinold_2013Learntec charts heinold_2013
Learntec charts heinold_2013
 
Agile Business Development
Agile Business DevelopmentAgile Business Development
Agile Business Development
 
Desarrollo de pruebas en entornos Java EE
Desarrollo de pruebas en entornos Java EEDesarrollo de pruebas en entornos Java EE
Desarrollo de pruebas en entornos Java EE
 
(Codemotion 2014) JVM GC: WTF?!
(Codemotion 2014) JVM GC: WTF?!(Codemotion 2014) JVM GC: WTF?!
(Codemotion 2014) JVM GC: WTF?!
 
Storytelling for Social Banks
Storytelling for Social BanksStorytelling for Social Banks
Storytelling for Social Banks
 
A Few Interesting Things About the Brain [Infographic]
A Few Interesting Things About the Brain [Infographic]A Few Interesting Things About the Brain [Infographic]
A Few Interesting Things About the Brain [Infographic]
 
Wie Printformate auch in einer digitalen Welt überzeugen
Wie Printformate auch in einer digitalen Welt überzeugenWie Printformate auch in einer digitalen Welt überzeugen
Wie Printformate auch in einer digitalen Welt überzeugen
 
Von Lessing zu Lessig
Von Lessing zu LessigVon Lessing zu Lessig
Von Lessing zu Lessig
 

Similar to Accesibilidad web - más allá del marcado

Buenas Prácticas de desarrollo en Ruby on Rails
Buenas Prácticas de desarrollo en Ruby on RailsBuenas Prácticas de desarrollo en Ruby on Rails
Buenas Prácticas de desarrollo en Ruby on Rails
Sergio Gil
 
Edición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvilEdición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvil
Marta Armada
 

Similar to Accesibilidad web - más allá del marcado (20)

Buenas Prácticas de desarrollo en Ruby on Rails
Buenas Prácticas de desarrollo en Ruby on RailsBuenas Prácticas de desarrollo en Ruby on Rails
Buenas Prácticas de desarrollo en Ruby on Rails
 
Diseñando la web móvil con HTML5 y CSS3
Diseñando la web móvil con HTML5 y CSS3Diseñando la web móvil con HTML5 y CSS3
Diseñando la web móvil con HTML5 y CSS3
 
Developing for Android (The movie)
Developing for Android (The movie)Developing for Android (The movie)
Developing for Android (The movie)
 
Presentacion moodler
Presentacion moodlerPresentacion moodler
Presentacion moodler
 
Descubriendo Ruby on Rails (Desarrollo Agil de Aplicaciones Web)
Descubriendo Ruby on Rails (Desarrollo Agil de Aplicaciones Web)Descubriendo Ruby on Rails (Desarrollo Agil de Aplicaciones Web)
Descubriendo Ruby on Rails (Desarrollo Agil de Aplicaciones Web)
 
Descubriendo Ruby On Rails (Desarrollo Agil De Aplicaciones Web)
Descubriendo Ruby On Rails (Desarrollo Agil De Aplicaciones Web)Descubriendo Ruby On Rails (Desarrollo Agil De Aplicaciones Web)
Descubriendo Ruby On Rails (Desarrollo Agil De Aplicaciones Web)
 
Edición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvilEdición de bolsillo: CSS3, HTML5 y JS para la web móvil
Edición de bolsillo: CSS3, HTML5 y JS para la web móvil
 
El Ferrocarril Contra Los Arboles Muertos2
El Ferrocarril Contra Los Arboles Muertos2El Ferrocarril Contra Los Arboles Muertos2
El Ferrocarril Contra Los Arboles Muertos2
 
2014 04 padrino
2014 04 padrino2014 04 padrino
2014 04 padrino
 
Device Days 2012 - HTML5 y CSS3 para móvil
Device Days 2012 - HTML5 y CSS3 para móvilDevice Days 2012 - HTML5 y CSS3 para móvil
Device Days 2012 - HTML5 y CSS3 para móvil
 
Presentacion Ruby on Rails en Universidad Autónoma 2009
Presentacion Ruby on Rails en Universidad Autónoma 2009Presentacion Ruby on Rails en Universidad Autónoma 2009
Presentacion Ruby on Rails en Universidad Autónoma 2009
 
FULLSTACK JS DEV in 2017
FULLSTACK JS DEV in 2017FULLSTACK JS DEV in 2017
FULLSTACK JS DEV in 2017
 
Conversion Web Madrid Tecnologia 2010
Conversion Web Madrid Tecnologia 2010Conversion Web Madrid Tecnologia 2010
Conversion Web Madrid Tecnologia 2010
 
Conversion web
Conversion webConversion web
Conversion web
 
Tutorial code block
Tutorial code blockTutorial code block
Tutorial code block
 
Xss con javascript
Xss con javascriptXss con javascript
Xss con javascript
 
Estandares Web, Accesibilidad y Usabilidad
Estandares Web, Accesibilidad y UsabilidadEstandares Web, Accesibilidad y Usabilidad
Estandares Web, Accesibilidad y Usabilidad
 
Lenguaje HTML
Lenguaje HTMLLenguaje HTML
Lenguaje HTML
 
Mobile Day - Lecciones de vuelo
Mobile Day - Lecciones de vueloMobile Day - Lecciones de vuelo
Mobile Day - Lecciones de vuelo
 
Rails intro
Rails introRails intro
Rails intro
 

Recently uploaded

Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
AnnimoUno1
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial Uninove
FagnerLisboa3
 

Recently uploaded (15)

guía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Josephguía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Joseph
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
 
Desarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdfDesarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdf
 
Presentación de elementos de afilado con esmeril
Presentación de elementos de afilado con esmerilPresentación de elementos de afilado con esmeril
Presentación de elementos de afilado con esmeril
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estos
 
Presentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptxPresentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptx
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
 
Trabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíaTrabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnología
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial Uninove
 
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricGlobal Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvana
 
presentacion de PowerPoint de la fuente de poder.pptx
presentacion de PowerPoint de la fuente de poder.pptxpresentacion de PowerPoint de la fuente de poder.pptx
presentacion de PowerPoint de la fuente de poder.pptx
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNIT
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
 

Accesibilidad web - más allá del marcado