Estándares Web y Accesibilidad en Colombia

• Estándares Web y Accesibilidad en Colombia

• Por Gabriel Porrashttp://uxespanol.blogspot.com/

• Oct. 21 de 2006• 3er Congreso de Investigación y

Tecnología en Usabilidad, Realidad Virtual y Robóticahttp://www.uniquindio.edu.co/sinfoci/congreso.htm

http://creativecommons.org/licenses/by-nc/2.5/co/

• Intergrupo

• InterGrupo es una empresa orientada a entregar a sus clientes soluciones que ayuden a transformar sus operaciones y que les permitan construir nuevos modelos de negocios usando tecnologías de punta, permitiéndoles ahorrar costos y mejorar la eficiencia de su negocio.

• Nuestra misión es la de ser líderes en la prestación de servicios de consultoría, desarrollo de software e integración de productos y servicios de tecnología de punta, con un excelente servicio al cliente, promoviendo el crecimiento profesional y humano de nuestros colaboradores.

• Nuestros servicios de consultoría y soluciones de tecnología incluyen: • - Consultoría en Metodología y Arquitectura• - Desarrollo de Software a la Medida - Aplicaciones Empresariales• - Soluciones de Inteligencia de Negocios• - Soluciones de Integración de Aplicaciones - - Soluciones de Infraestructura, Seguridad y Soporte de plataforma

• Nos enorgullecemos de completar nuestros proyectos a tiempo y dentro del presupuesto, excediendo las expectativas de los clientes. Utilizamos metodologías estructuradas para el control y administración de los proyectos.

• La compañía cuenta actualmente con aproximadamente 200 empleados, distribuidos en las principales ciudades del país: Bogotá, Medellín, Cali y Barranquilla, además de nuestras nuevas oficinas en Ecuador, España y Estados Unidos. Del total de empleados, más de 160 personas pertenecen directamente a las áreas técnicas de la compañía, dedicadas a la prestación de servicios profesionales de ingeniería y consultoría.

• • - Certificación de Calidad ISO 9001:2000 otorgada por el ICONTEC – IQNet. • - Microsoft Gold Partner con la máxima calificación en 10 categorías:

– Microsoft GOLD Certified Partner for Custom Development Solutions– Microsoft GOLD Certified Partner for Mobility Solutions– Microsoft GOLD Certified Partner for Licensing Solutions– Microsoft GOLD Certified Partner for Integrated Business Intelligence Solutions– Microsoft GOLD Certified Partner for Integrated E-Business Solutions– Microsoft GOLD Certified Partner for Advanced Infrastructure Solutions – Microsoft GOLD Certified Partner for Networking Infrastructure Solutions– Microsoft GOLD Certified Partner for Security Solutions – Microsoft GOLD Certified Partner for Learning Solutions– Microsoft GOLD Certified Partner for Information Worker Solutions

• - Adicionalmente Centro Autorizado de Soporte Microsoft• - Actualmente en proceso de certificación CMMI.

• http://www.intergrupo.com/

Microsoft GOLD Certified Partner

en 10 categorías

Tim Berners-Lee’s sueña que su invención, la World Wide Web, sea un lugar donde los usuarios puedan desde compartir información hasta trabajar

juntos, jugar y socializar

• http://www.w3.org/People/Berners-Lee/ShortHistory

Como desarrolladores web […] hacemos este sueño una realidad

• http://webstandards.org/learn/faq/

La World Wide Webfue inventada

por Tim Berners-Lee

• Historia• 1989: La World Wide Web fue inventada por Tim Berners-Lee, informático del CERN

(Organización Europea de Investigación Nuclear): Un sistema de hipertexto, basado en Internet, para compartir información.

• http://html.conclase.net/articulos/historia

Primer navegador,el HTML, el HTTP y

el URI• 1990: Aparece el primer navegador y con ello la WWW

se hizo realidad. Se crearon el HTML, el HTTP y el URI. • http://html.conclase.net/articulos/historia

Inicia con 50 servidores

• 1993: Inicia con 50 servidores y dos navegadores: el gráfico para plataformas NeXT y el de texto para cualquier otra plataforma.


Termina con 500 servidores

• 1993:Termina con más de 500 servidores y el navegador Mosaic para varias plataformas: Comienza el crecimiento exponencial de la Web.


Nace la W3C• 1994: Nace la W3C.• http://html.conclase.net/

articulos/historia

Asociación internacional neutra, fundada y dirigida

por Tim Berners-Lee • El World Wide Web Consortium (W3C) es una asociación internacional NEUTRA, fundada y

dirigida por Tim Berners-Lee. Actualmente posee más de 450 miembros incluyendo a Microsoft, America Online (Netscape Communications), Apple, Adobe, Macromedia, Sun Microsystems y una gran variedad de compañías fabricantes de hardware y software, proveedores de contenido, instituciones académicas y compañías de telecomunicaciones.

• http://webstandards.org/learn/faq/

Guiar la Web hacia su máximo potencial • Misión: Guiar la Web hacia su máximo potencial a

través del desarrollo de protocolos y pautas abiertas que aseguren el crecimiento futuro de la Web.

• http://www.w3c.es/Consorcio/

Presentes y FuturosWeb = Universal,

Accesible,Base de Conocimiento, Confiable, Mejor (UX)

• Objetivos presentes y futuros:• * Una Web universal• * Accesible desde cualquier lugar• * La Web como base de conocimiento• * Una web de confianza• * Mejorarla mediante la experiencia de usuario• http://www.w3c.es/Presentaciones/2006/0712-estandaresGPUL-MA/#(7)

La Web debe ser universal y para todo

el mundoSin tener en cuenta

dispositivos, usuarios, cultura, geografía o lengua

• La Web debe ser universal y para todo el mundo.• Sin tener en cuenta...• ...características de los dispositivos de acceso• PCs, teléfonos, TVs, PDAs...• ancho de banda, pantalla pequeña en B/N, sin sonido, sin pantalla...• ...discapacidades de los usuarios• color o ceguera...• dificultades con un teclado, ratón...• dislexia, dificultades cognitivas o neurológicas...• ...diferencias culturales, geográficas o lingüísticas• sentidos de escritura...• formato de fechas, números de teléfono, códigos postales, elementos numerados...• diferentes tipos de teclados...• http://www.w3c.es/Presentaciones/2006/0712-estandaresGPUL-MA

1. EspecificacionesXML, XHTML, SVG, RDF...

• Para alcanzar su objetivo crea:• Especificaciones (Los requisitos que un producto o

servicio debe cumplir): XML, XHTML, SVG, RDF... • http://www.w3c.es/Presentaciones/2005/0314-

estandares-JA/

2. DirectricesWCAG, UAAG, ATAG...

• Para alcanzar su objetivo crea:• Directrices (Normas generales para la ejecución de algo):• WCAG (Web Content Accessibility Guidelines - Pautas de Accesibilidad del Contenido

Web)• UAAG (User Agent Accessibility Guidelines - Pautas de Accesibilidad para Agentes de

Usuario)• ATAG (Authoring Tool Accessibility Guidelines - Pautas de Accesibilidad para las

Herramientas de Autor)... • http://www.w3c.es/Presentaciones/2005/0314-estandares-JA/

3. HerramientasValidadores, Amaya, Jigsaw…• Para alcanzar su objetivo crea:• Herramientas: Validadores, Amaya

(Navegador), Jigsaw (Servidor Web)... • http://www.w3c.es/Presentaciones/

2005/0314-estandares-JA/

• Al momento ha publicado más de 80 estándares

• http://www.w3.org/TR/

¡It’s Evolution, Baby!

Dispositivos móviles• Mercado altamente dinámico• Gran potencial de usuarios

• Actualmente W3C se centra en dispositivos móviles con acceso a la Web:• Características de la Movilidad:• * Mercado extremadamente dinámico• o 245 Millones de unidades vendidas el último trimestre de 2005• o Se estiman ventas de 930 Millones de unidades en 2006• * Número muy grande de potenciales usuarios• o Estimación de 500 Millones de usuarios sólo China en 2007.• o En el futuro: un ordenador por familia, pero uno (o más) teléfonos móviles por persona.• o Ya en Japón se accede más Internet vía Móvil que PC.• http://www.w3c.es/Presentaciones/2006/0712-estandaresGPUL-MA/#(13)

• Nuevo Foco: Dispositivos Móviles

• http://www.w3c.es/Presentaciones/2006/0712-estandaresGPUL-MA/#(13)

Muy importante¡Ahora más que nunca!

• La estandarización es importante: Ahora más que nunca

• http://www.w3c.es/Presentaciones/2006/0712-estandaresGPUL-MA/#(14)

Tecnologías W3C usadas para el contenido Web

• Estándares Web• Son tecnologías, establecidas por el W3C y otros, usadas para crear e interpretar el

contenido basado en Web, de tal manera que estos documentos estén siempre disponibles y sean accesibles para tantos como sea posible.

• http://www.456bereastreet.com/lab/developing_with_web_standards/webstandards/

1. Lenguajes Estructurales

HTML 4.01X-HTML 1.0 y 1.1

XML 1.0• Lenguajes estructurales o de contenido:• * HTML (Hypertext Markup Language) 4.01• * XHTML (Extensible Hypertext Markup Language) 1.0• * XHTML 1.1• * XML (Extensible Markup Language) 1.0 • http://www.456bereastreet.com/lab/developing_with_web_standards/webstandards/

2. Lenguajes de PresentaciónCSS Level 1, 2 y 3

MathMLSVG

• Lenguajes de Presentación• * CSS (Cascading Style Sheets) Level 1• * CSS Level 2 revision 1• * CSS Level 3 (in development)• * MathML (Mathematical Markup Language)• * SVG (Scalable Vector Graphics)• http://www.456bereastreet.com/lab/developing_with_web_standards/webstandards/

3. Modelo de ObjetosDOM Level 1, 2 y 3

• Modelo de Objetos• * DOM (Document Object Model) Level 1• * DOM Level 2• * DOM Level 3 Core• http://www.456bereastreet.com/lab/

developing_with_web_standards/webstandards/

4. Lenguajede ScriptECMAScript 262(JavaScript)

• Lenguajes de Script• * ECMAScript 262 (la versión estandarizada de JavaScript)• http://www.456bereastreet.com/lab/developing_with_web_standards/webstandards/

• The European Computer Manufacturers Association (ECMA) is an organization officially founded in 1961 in order to meet the need for standardizing computer operational formats, including programming languages and input/output codes.

• The main use of ECMAScript, which is an object-based language, is to manipulate the objects in web pages which are specified by the Document Object Model (DOM).

• http://www.webstandards.org/learn/faq/#p22

Documento Web =Estructura (X-HTML) +Presentación (CSS) +

Comportamiento (Script)• Resumiendo, podemos decir que los estándares web dividen

un documento en tres partes, su estructura (X-HTML), su presentación (CSS) y su comportamiento (ECMAScript).

• http://www.estandaresweb.es/introduccion_estandares.html

Documento Web =Estructura Válida,

Adecuada y Semántica + Presentación sin Tablas +Visible en cualquier parte

• Cuando un documento se adhiere a los estándares Web significa que además de usar estas tecnologías:• * está hecho de HTML o XHTM válido• * está estructurado adecuadamente y codificado semánticamente• * usa CSS en lugar de tablas para su diseño• * se puede ver en cualquier navegador• http://www.456bereastreet.com/lab/developing_with_web_standards/webstandards/

• Veamos el malo:• <table width="100%" border="0" cellspacing="0" cellpadding="0">• <tr>• <td>• <font color="#000000" face="Times New Roman,Times,Serif" size="3">• <strong>El hombre pisa Marte</strong></font><br>• <font color="#000000" face="Times New Roman,Times,Serif" size="2">• por Perico Palotes<br>• Nuevo Periódico Nacional</font>• <font color="#990000" face="arial,helvetica,sans-serif" size="1">• 21 Abr 2005, 4:20 PM GMT</font>• </td>• </tr>• </table>• http://www.w3c.es/Presentaciones/2005/1004-estandarizate-JA/10.html

El Malo

• Veamos el feo:• <div id="noticia">• <div class="titulo">El hombre pisa Marte</div>• <div class="autor">Perico Palotes</div>,• <div class="newspaper">Nuevo Periódico Nacional</div>• <div class="date">21 Abr 2005, 4:20 PM GMT</div>• </div>• http://www.w3c.es/Presentaciones/2005/1004-estandarizate-JA/10.html

El Feo

• Veamos el bueno:• <div

id="noticia">•

<h1>El hombre pisa Marte</h1>•

<h2>Perico Palotes</h2>,•

<p>Nuevo Periódico Nacional</p>•

<date>21 Abr 2005, 4:20 PM GMT</date>• </div>• http://www.w3c.es/Presentaciones/2005/1004-estandarizate-JA/10.html

El Bueno

• CSS Garden: Separación de presentación y contenido

• http://csszengarden.com/

1. Desarrollo más rápido y más simple

• Ventaja: Un montaje más rápido y un mantenimiento más simple


• http://www.estandaresweb.es/ventajas-de-los-estandares-web.html• Buenas prácticas en diseño web: Daniel Torres Buriel:

http://www.box.net/public/static/36yo31aexk.pdf

2. Menores costos• Ventaja: Menores costos.




3. Compatibilidad• Ventaja: Compatibilidad con los navegadores actuales y futuros.




4. Descarga más rápida

• Ventaja: Descarga y presentación más rápida de las páginas (simplificación de código).

• http://www.456bereastreet.com/lab/developing_with_web_standards/webstandards/• http://www.estandaresweb.es/ventajas-de-los-estandares-web.html• Buenas prácticas en diseño web: Daniel Torres Buriel:


5. Accesibilidad• Ventaja: Mayor y mejor accesibilidad




6. Posicionamiento• Ventaja: Mejor posicionamiento en los motores de búsqueda.




7. Adaptación• Ventaja: Adaptación más simple (para impresión, para la PDA, para

el Móvil…).




8. Contenido reutilizable

• Ventaja: Un sólo código para todo: Contenido reutilizable por múltiples formatos o dispositivos.

• http://www.456bereastreet.com/lab/developing_with_web_standards/webstandards/• http://www.estandaresweb.es/ventajas-de-los-estandares-web.html• Buenas prácticas en diseño web: Daniel Torres Buriel:


9. Mayor audiencia• Ventaja: Maximización de la audiencia potencial (Usuarios y

Dispositivos).




10. Web Semántica• Ventaja: Da soporte a la Web Semántica > EL FUTURO!




11. Internacionalización• Ventaja: Incrementa el soporte para la Internacionalización




• La Web Universal• (Imágenes W3C en diferentes

dispositivos)• http://www.w3c.es/

Presentaciones/2005/1004-estandarizate-JA/11.html

• ¿Quieres utilizar y/o revisar los estándares Web en tu sitio?

• - Valida: W3C Markup (http://validator.w3.org/) y el W3C CSS Validation Service (http://jigsaw.w3.org/css-validator/),

• http://uxespanol.blogspot.com/2005/12/herramientas-para-diseadores-y_27.html

1. Valida:W3C Markup y W3C CSS Validation

2. Instala Navegadores:IE, Firefox, Safari, Opera, Amaya, Braille Surf, Hal Screen ReaderLynx,

Nokia Mobile Broser Simulator, pwWeabSpeak, MSN TV Viewer…

• ¿Quieres utilizar y/o revisar los estándares Web en tu sitio?• - Navegadores: IE, Firefox, Safari, Opera, Amaya, Braille Surf, Hal Screen

ReaderLynx, Nokia Mobile Broser Simulator, pwWeabSpeak, MSN TV Viewer…



• - Toolbars: Internet Explorer Developer (IE) (http://www.microsoft.com/downloads/details.aspx?FamilyID=e59c3964-672d-4511-bb3e-2d5e1db91038&amp;amp;displaylang=en) y Web Developer Toolbar (F) (http://chrispederick.com/work/webdeveloper/).


3. Utiliza ToolbarsIE Developer (IE) y Web Developer (F)

4. Instala Add-Ons:Plug-ins para IE

Extensiones para Firefox• ¿Quieres utilizar y/o revisar los estándares

Web en tu sitio?• - Add-Ons: CheckIE (IE), Checky Extension,

Firebug Extension …• http://uxespanol.blogspot.com/2005/12/

herramientas-para-diseadores-y_27.html

5. Utiliza Herramientas Online:

Browser Shots, html2text, iCapture, Mac ScreenShot Service, LynxViewer…


• - Online: Browser Shots, html2text, iCapture, Mac ScreenShot Service, LynxViewer…


Estos y otra grancantidad de recursos:http://uxespanol.blogspot.com

/2005/12/herramientas-para-diseadores-y_27.html



“El poder de la web está en su universalidad.

Un acceso a la Web para todos independientemente de su discapacidad es un aspecto

esencial”Tim Berners-Lee

• Accesiblidad• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/1.html

Iniciativa de Accesibilidad Web

WAI• 1997: Lanzamiento de la Iniciativa de Accesibilidad Web: WAI.• Nace la Iniciativa de Accesibilidad Web, conocida como WAI (Web

Accessibility Initiative). Una actividad desarrollada por el W3C.• http://www.w3c.es/Consorcio/historia

Facilitar el acceso de las personas con discapacidad

• Objetivo: facilitar el acceso de las personas con discapacidad

• http://www.w3c.es/divulgacion/guiasbreves/Accesibilidad

1. Desarrollarpautas

• Objetivo: facilitar el acceso de las personas con discapacidad:

• - desarrollando pautas de accesibilidad• http://www.w3c.es/divulgacion/guiasbreves/

Accesibilidad

2. Mejorar herramientas

• Objetivo: facilitar el acceso de las personas con discapacidad:• - mejorando las herramientas para la evaluación y reparación

de accesibilidad Web• http://www.w3c.es/divulgacion/guiasbreves/Accesibilidad

3. Educar

• Objetivo: facilitar el acceso de las personas con discapacidad:• - llevando a cabo una labor educativa y de concienciación en relación a la

importancia del diseño accesible de páginas Web• http://www.w3c.es/divulgacion/guiasbreves/Accesibilidad

4. Investigar

• Objetivo: facilitar el acceso de las personas con discapacidad:

• - abriendo nuevos campos en accesibilidad a través de la investigación en este área.

• http://www.w3c.es/divulgacion/guiasbreves/Accesibilidad

Es hablar de un acceso universal a la Web,

independientemente del tipo de hardware, software,

infraestructura de red, idioma, cultura, localización geográfica y capacidades de

los usuarios• http://www.w3c.es/divulgacion/guiasbreves/Accesibilidad

• Incapacidades visuales• Deficiencias auditivas• Incapacidades físicas• Incapacidades del habla

• Discapacidades neurológicas y cognitivas

• La accesibilidad Web engloba muchos tipos de discapacidades, incluyendo:• - Incapacidades visuales como ceguera, baja visión y daltonismo.• - Deficiencias auditivas como sordera y dificultades auditivas.• - Incapacidades físicas como las motoras.• - Incapacidades del habla.• - Discapacidades neurológicas y cognitivas como dislexia, acalculia (discalculia), deficiencia de atención, incapacidades intelectuales, problemas de memoria, epilepsia…• http://www.w3.org/WAI/EO/Drafts/PWD-Use-Web/#usage

• Por ejemplo: Michael un señor de 35 años quedó ciego por un accidente. Estudia por medio de libros hablados y mediante un lector de libros electrónicos (eBook reader). Para navegar en Internet utiliza JAWS (http://www.freedomscientific.com/fs_products/software_jaws.asp), un lector de pantalla que se integra con Internet Explorer, el cual lee el contenido de los sitios Web en voz alta.

Ciego por un accidente.Estudia con libros hablados y un eBook reader.Navega con JAWS, un lector de pantalla para IE.

Personas discapacitadas en Colombia: 2.6 millones

(el 6.4% de la población).

Con problemas de visión:1.1 millones

(el 2.7% de la población)• Existen millones de personas con discapacidad que no pueden utilizar la Web.• En Colombia, el DANE de acuerdo con el Censo del 2005, determinó que hay 2.6 millones de personas discapacitadas, el

6.4% de la población. De ellas 1.1 millones de personas tienen problemas de visión, es decir aproximadamente el 2.7% de la población.

parte de…requisito para…

La Usabilidad• Accesibilidad: íntimamente relacionada con la usabilidad.• La accesibilidad debe ser entendida como 'parte de', y al mismo tiempo

'requisito para', la usabilidad.• http://www.nosolousabilidad.com/articulos/accesibilidad.htm

• Ejemplo de Usabilidad vs. Accesibilidad: El caso del Metro de Medellín.

• http://uxespanol.blogspot.com/2006/10/accesibilidad-en-el-mundo-real-y.html

¡Usable y accesible!

Pasado Presente

Acceso equitativo eigualdad de oportunidades

Participación activaen la sociedad

• ¿Por qué la Accesibilidad Web es importante?• - Porque proporciona un acceso equitativo e igualdad de oportunidades.• - Ayuda a personas con discapacidad a que participen más activamente en la sociedad.

• La Web ofrece a aquellas personas con discapacidad una oportunidad de acceder a la información y de interactuar. ¡Es su derecho!

• http://www.w3c.es/Traducciones/es/WAI/intro/accessibility

• Componentes• http://www.w3.org/WAI/intro/

components.php

UsuariosQue usen

adecuadamente los navegadores

• Componente Usuarios: Navegadores web y reproductores multimedia• 1. para que las personas con discapacidad puedan utilizarlos• 2. para que funcionen bien con las ayudas técnicas• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/2.html

• Pautas de Accesibilidad para Agentes de Usuario: UAAG (User Agent Accessibility Guidelines)

• http://www.w3.org/TR/UAAG10/

UAAGPautas de

Accesibilidad para Agentes de Usuario

DesarrolladoresQue generen contenido

accesible con las herramientas

• Componente Desarrolladores: Herramientas de autor• 1. para que las puedan utilizar las personas con discapacidad• 2. para que generen contenido accesible• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/2.html

ATAGPautas de

Accesibilidad para

Herramientas de Autor

• Pautas de Accesibilidad para Herramientas de Autor: ATAG (Authoring Tool Accessibility Guidelines)• Ayuda a los desarrolladores de software a crear herramientas de autor para producir contenido Web accesible• http://www.w3.org/TR/ATAG10/

ContenidoQue pueda ser navegado

• Componente Contenido: Sitios Web y aplicaciones• permite que las personas con discapacidad interactúen

adecuadamente con la web.• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/2.html

WCAGPautas de Accesibilidad al Contenido en la Web

• Pautas de Accesibilidad al Contenido en la Web: WCAG (Web Content Accessibility Guidelines)• Cómo hacer páginas Web accesibles sin sacrificar el diseño, ofreciendo la flexibilidad necesaria para que la información

sea accesible bajo diferentes situaciones y proporcionando métodos que permiten su transformación en páginas útiles e inteligibles.

• http://www.w3.org/TR/WCAG10/

• ¿Y los Estánadres?• Son la base para lograr la

Accesibilidad.• http://www.w3.org/WAI/guid-

tech.html

¡Son la base!

• 14 Pautas de Accesibilidad del Contenido en la Web - WCAG:• 1. Proporcione alternativas equivalentes para el contenido visual y auditivo• http://www.discapnet.es/web_accesible/wcag10/WAI-WEBCONTENT-

19990505_es.html

1. Proporcione alternativas

equivalentes para el contenido visual y

auditivo

4. Identifique el idioma usado

• 14 Pautas de Accesibilidad del Contenido en la Web - WCAG:• 4. Identifique el idioma usado• http://www.discapnet.es/web_accesible/wcag10/WAI-

WEBCONTENT-19990505_es.html

9. Diseñe para la independencia del

dispositivo• 14 Pautas de Accesibilidad del Contenido en la Web -

WCAG:• 9. Diseñe para la independencia del dispositivo• http://www.discapnet.es/web_accesible/wcag10/WAI-


12. Proporcione información de

contexto y orientación• 14 Pautas de Accesibilidad del Contenido en la Web - WCAG:• 12. Proporcione información de contexto y orientación• http://www.discapnet.es/web_accesible/wcag10/WAI-


• 65 Puntos de Revisión• Una lista de todos los puntos de revisión de las citadas pautas, organizados por conceptos,

como lista de revisión. Cada punto de verificación está asignado a uno de los tres niveles de prioridad establecidos por las pautas.

• Tabla de Puntos de Verificación: http://www.discapnet.es/web_accesible/wcag10/full-checklist.html

• Lista de Puntos de Verificación: http://www.discapnet.es/web_accesible/wcag10/checkpoint-list.html

Lista y Tablade Revisión

(Para tu actual sitio Web)

Clasificadas por Prioridades

• 65 Puntos de Revisión• Una lista de todos los puntos de revisión de las

citadas pautas, organizados por conceptos, como lista de revisión. Cada punto de verificación está asignado a uno de los tres niveles de prioridad establecidos por las pautas.

• Tabla de Puntos de Verificación: http://www.discapnet.es/web_accesible/wcag10/full-checklist.html

• Lista de Puntos de Verificación: http://www.discapnet.es/web_accesible/wcag10/checkpoint-list.html

1:Se tiene que cumplir

2:Se debería cumplir

3:Se puede cumplir• * Prioridad 1: se tiene que cumplir ya que, de otra manera, ciertos grupos de usuarios no podrían acceder a la información del sitio Web. Ej: Proporcione un texto equivalente para todo elemento no textual (Por ejemplo, a través de "alt").• * Prioridad 2: se debería cumplir ya que, si no fuese así, sería muy difícil acceder a la información para ciertos grupos de usuarios. Ej: Utilice hojas de estilo para controlar la diagramación y la presentación.• * Prioridad 3: se puede cumplir ya que, de otra forma, algunos usuarios experimentarían ciertas dificultades para acceder a la información. Ej: Cree un orden lógico para navegar con el tabulador a través de vínculos, controles de formulario y objetos.• http://www.w3c.es/divulgacion/guiasbreves/Accesibilidad

• En función a estos puntos de verificación se establecen los niveles de conformidad:• * Nivel de Conformidad "A": todos los puntos de verificación de prioridad 1 se satisfacen.• * Nivel de Conformidad "Doble A": todos los puntos de verificación de prioridad 1 y 2 se satisfacen.• * Nivel de Conformidad "Triple A": todos los puntos de verificación de prioridad 1,2 y 3 se satisfacen.• http://www.w3c.es/divulgacion/guiasbreves/Accesibilidad

1. Posibilita el acceso de las personas

con discapacidad• Ventajas• * Posibilita el acceso de las personas con

discapacidad• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/

14.html

2. Mejora el acceso de las personas mayores

• Ventajas• * Mejora el acceso de las personas mayores• http://www.w3c.es/Presentaciones/2004/11-

WAI-JA/14.html

3. Mejora la navegabilidad

• Ventajas• * Mejora de navegabilidad• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/14.html

4. Aumenta la usabilidad

• Ventajas• * Aumenta la usabilidad• http://www.w3c.es/Presentaciones/2004/11-

WAI-JA/14.html

5. Mejora la indexación

• Ventajas• * Mejora la indexación• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/14.html

6. Mejora el accesoen general

• Ventajas• * Mejora el acceso en general• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/14.html

7. Permite la independencia de

dispositivo

• Ventajas• * Permite la independencia de dispositivo• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/14.html

8. Da soporte ala Web Semántica

• Ventajas• * Da soporte a la Web Semántica• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/14.html

9. El Contenido es reutilizable por

múltiples formatos o dispositivos

• Ventajas• * Contenido reutilizable por múltiples formatos o dispositivos• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/14.html

10. Incrementa el soporte para la

internacionalización

• Ventajas• * Incrementa el soporte para la Internacionalización• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/14.html

11. Demuestra responsabilidad social

y reduce la responsabilidad legal

• Ventajas• * Demuestra la responsabilidad social y reduce la responsabilidad

legal• http://www.w3c.es/Presentaciones/2004/11-WAI-JA/14.html

1. La accesibilidad obliga a crear dos

versiones de un sitio

• Mitos• - La accesibilidad obliga a crear dos versiones de un sitio• Diseño con estándares web por Jeffrey Zeldman• Buenas prácticas en diseño web: Daniel Torres Buriel:


2. Una versión de sólo texto satisface el requisito de acceso

igualitario o equivalente

• Mitos• - Una versión de sólo texto satisface el requisito de acceso igualitario o equivalente• Diseño con estándares web por Jeffrey Zeldman• Buenas prácticas en diseño web: Daniel Torres Buriel: http://www.box.net/public/static/36yo31aexk.pdf

3. La accesibilidad cuesta demasiado

• Mitos• - La accesibilidad cuesta demasiado• Diseño con estándares web por Jeffrey Zeldman• Buenas prácticas en diseño web: Daniel Torres Buriel: http://www.box.net/public/static/36yo31aexk.pdf

4. La accesibilidad obliga a crear diseños primitivos y simples

• Mitos• - La accesibilidad obliga a crear diseños primitivos y simples• Diseño con estándares web por Jeffrey Zeldman• Buenas prácticas en diseño web: Daniel Torres Buriel:


5. Los sitios accesibles deben tener el mismo aspecto en

todos los navegadores• Mitos• - Los sitios accesibles deben tener el mismo aspecto en todos los navegadores• Diseño con estándares web por Jeffrey Zeldman• Buenas prácticas en diseño web: Daniel Torres Buriel:


6. La accesibilidades sólo para discapacitados

• Mitos• - La accesibilidad es sólo para discapacitados• Diseño con estándares web por Jeffrey Zeldman• Buenas prácticas en diseño web: Daniel Torres Buriel:


7. Dreamweaver o cualquier otra

herramienta resuelve todos los problemas

• Mitos• - Dreamweaver o cualquier otra herramienta resuelve todos los problemas• Diseño con estándares web por Jeffrey Zeldman• Buenas prácticas en diseño web: Daniel Torres Buriel:


• Mitos• - Los diseñadores pueden ignorar las leyes de accesibilidad si los

clientes se lo piden• Diseño con estándares web por Jeffrey Zeldman• Buenas prácticas en diseño web: Daniel Torres Buriel:


8. Los diseñadores pueden ignorar las

leyes de accesibilidad si los clientes se lo

piden

• Tu usuario más importante: Google es Ciego• http://www.w3c.es/Presentaciones/2005/1004-estandarizate-JA/12.html

“Tu usuario más importante es ciego. La mitad de las visitas a tu sitio vienen de Google, y

Google sólo ve lo que un ciego puede ver. Si tu sitio no es

accesible, tendrás menos visitas. Fin de la historia.”Steven Pemberton

Obligan seguir los Estándares Web y las Guías de Accesibilidad

• La Ley:• A nivel gubernamental, en los países desarrollados, hay leyes que obligan a

trabajar bajo los estándares web y aplicar las guías de accesibilidad.

Estados UnidosSección 508

2001

• Estados Unidos: Sección 508, la cual obliga desde el 2001 a desarrollar sitios accesibles a todas las dependencias del gobierno.

• Otros países: http://www.w3.org/WAI/Policy/• http://uxespanol.blogspot.com/2006/10/accesibilidad-en-el-mundo-real-y.html

• España cuenta con la LSSI (Ley de Servicios de la Sociedad de la Información y del Comercio Electrónico) que entró en vigencia en enero de 2006, la cual exige que las Administraciones Públicas hagan accesibles sus sitios web.


EspañaLSSI (Ley de Servicios de la Sociedad de la Información y del Comercio Electrónico)

Enero 2006

ChileDecreto 100: Normativa del Gobierno de Chile para el Desarrollo de Sitios Web

GubernamentalesAgosto 2006

• Por su parte en Chile, el pasado mes de agosto de 2006, fue aprobado el Decreto 100: Normativa del Gobierno de Chile para el Desarrollo de Sitios Web Gubernamentales. En esta normativa implícitamente se especifica el uso de HTML semántico y de las hojas de estilo para la presentación. Igualmente recomienda el uso de HTML, XHTML o XML válido, se refuerza la independencia de navegadores y se establece una Guía de Accesibilidad para Discapacitados en Sitios Web.


• ¿Quieres utilizar y/o revisar la accesibilidad en tu sitio?

• - Validadores: LOS MEJORES ESTAN EN ESPAÑOL: Examinator (http://www.accesible.com.ar/examinator/), HERA (http://www.sidar.org/ex_hera/hera-xp.php.en) y TAW Online (http://www.tawdis.net/) - Test de Accesabilidad Web…


1. Valida:Examinator, HERA y TAW Online…

2. Instala Extensiones:Extensiones: Accessibility Extension, MozBraille Extension, SIDAR y HERA

Extension, TAW3 with a clic…

• ¿Quieres utilizar y/o revisar la accesibilidad en tu sitio?• - Extensiones: Accessibility Extension, MozBraille Extension, SIDAR y

HERA Extension, TAW3 with a clic…• http://uxespanol.blogspot.com/2005/12/herramientas-para-

diseadores-y_27.html

• ¿Quieres utilizar y/o revisar la accesibilidad en tu sitio?• - Toolbars: Web Accessibility Toolbar (IE)

(http://www.visionaustralia.org.au/info.aspx?page=614).


3. Instala la Toolbar:Web Accessibility Toolbar (IE)

• ¿Quieres utilizar y/o revisar la accesibilidad en tu sitio?• - Online: Accessibility Tools & Wizards, formArchitect,

CBC: Color Blindness Check (WAT), Color Scheme Generator 2, Colorblind Web Page Filter, Colour Blindness Simulator, Considering the Color Blind Design Evaluation, VisCheck…


4. Utiliza Online Tools:formArchitect, Color Blindness Check,

Color Scheme Generator, Colour Blindness Simulator, VisCheck…

Estos y otra grancantidad de recursos:http://uxespanol.blogspot.com

/2005/12/herramientas-para-diseadores-y_27.html

• ¿Quieres utilizar y/o revisar la accesibilidad en tu sitio?


Se Evaluaron1. Los 10 ganadores de los

Premios Internet Colombia 2005

2. Los 10 blogs más visitadosde Blogalaxia.com

3. Los 50 sitios más visitadossegún Ranking.com

• Colombia• Se evaluaron el uso de los estándares web y las guías de accesibilidad en los sitios web y blogs colombianos más visitados.• - Los 10 ganadores de los Premios Internet Colombia 2005• - Los 10 blogs colombianos con mayor número de visitas en enero de 2006, entre 650 blogs inscritos en Blogalaxia.com para esa fecha.• - Los 50 sitios colombianos con mayor número de visitas para diciembre de 2005, según Ranking.com.• http://uxespanol.blogspot.com/2006/04/estndares-web-y-accesibilidad-en.html

Se Evalúo1. Doctype, el HTML, marcosy la validez del HTML (W3C)

2. SiteScore: Califica diseño,popularidad y accesiblilidad

3. Examinador: Califica las pautas• Se evalúo:• Doctype, el HTML, marcos y la validez del HTML: http://validator.w3.org/• SiteScore (http://www.silktide.com/tools/sitescore): Califica de 1 a 10 que tan bien diseñado, popular y accesible es

un sitio: http://www.silktide.com/tools/sitescore/• Examinator (http://www.accesible.com.ar/examinator/): Califica de 1 a 10 de acuerdo con su cumplimiento con las

pautas WCAG 1.0 de accesibilidad del World Wide Web Consortium (W3C): http://www.accesible.com.ar/examinator/

AclaraciónLos validadores tienen sus

CONTRAS: Interpretan literalmente las guías y no pueden hacer

revisiones de contenido• Aclaración• Es problemático revisar un sitio web sólo con herramientas automáticas: Las herramientas

hacen una interpretación literal de las guías, no pueden hacer revisiones de contenido, pueden revisar guías obsoletas, entre otros.

• Beneficio: tiempo que se gana al revisar las guías y estándares básicos, los cuales demandan labores muy operativas.

• http://www.webcredible.co.uk/user-friendly-resources/web-accessibility/automated-tools.shtml

AclaraciónPero tienen sus Pros: Revisan

rápidamente lo básico y operativo

• Aclaración• Es problemático revisar un sitio web sólo con herramientas automáticas: Las herramientas

hacen una interpretación literal de las guías, no pueden hacer revisiones de contenido, pueden revisar guías obsoletas, entre otros.

• Beneficio: tiempo que se gana al revisar las guías y estándares básicos, los cuales demandan labores muy operativas.

• http://www.webcredible.co.uk/user-friendly-resources/web-accessibility/automated-tools.shtml

Versión del HTML

• Resultados• Versión del HTML

Errores Validador W3C

• Resultados• Errores Validador W3C

SiteScore: Accesibilidad

• Resultados• SiteScore: Accesibilidad

Examinator

• Resultados• Examinator

Servicios de Consultoría

En el mundo: InnumerablesEn España: Decenas

En Colombia: 1• Servicios de Consultoría• A nivel mundial, el número de compañías que ofrecen sus servicios como consultores en Estándares Web,

Usabilidad, Accesibilidad y temas de Experiencia de Usuario es innumerable. Solamente en España, se pueden contar más de 100 compañías que están especializadas en éstas áreas u ofrecen dentro de su portafolio este tipo de consultorías.

• En Colombia, por el contrario, no hay ninguna compañía que ofrezca exclusivamente este tipo de servicios. Mediante una búsqueda en Google Colombia sólo se pudo encontrar una compañía que, dentro de su portafolio de desarrollo de software y diseño gráfico, ofrece consultorías en usabilidad: Aracnea Net Ltda. (http://www.aracnea.net/)

• http://www.google.com/search?q=usability+consulting• http://www.google.es/search?cr=countryES&q=consultoria+accesibilidad• http://www.google.com.co/

El Estudio Completo

Estándares Web y Accesibilidad en Colombia

http://uxespanol.blogspot.com/2006/04/

estndares-web-y-accesibilidad-en.html

• El Estudio Completo• Estándares Web y Accesibilidad en Colombia

http://uxespanol.blogspot.com/2006/04/estndares-web-y-accesibilidad-en.html

Revisemos…El sitio de la

Universidad del Quindíohttp://www.uniquindio.edu.co/

• Gracias

Gabriel H. Porras R.Email: [email protected]

Blog: http://uxespanol.blogspot.com

• Creative Commons: http://creativecommons.org/licenses/by-nc/2.5/co/

http://creativecommons.org/licenses/by-nc/2.5/co/

Estándares Web y Accesibilidad en Colombia

Technology

Transcript of Estándares Web y Accesibilidad en Colombia