Discapacidad: Visibilicemos la diversidad [ go ]
El sábado empecé el curso de “Asistente en discapacidad“, que dicta la Fundación artistas discapacitados los sábados a la mañana en la sede de la facultad de Filosofía y Letras de la UBA (Puan 480, CABA).
Las docentes de la primera clase fueron María Pia Venturiello y Marcela Ego. La clase me resultó sumamente interesante y a la vez movilizante. Hablamos sobre el concepto de discapacidad, su evolución histórica y los diferentes paradigmas.
Tomé nota de muchos conceptos sumamente interesantes, pero me gustaría mencionar algunos paradigmas (los primeros, obsoletos, pero que aún pueden verse vigentes entre las personas) acerca de la discapacidad:
- El paradigma previo a la modernidad, veía al discapacitado como alguien a quien el designio divino lo llevó a estar en esa situación.
- A partir de la revolución industrial, comenzó a mirarse a quienes no podían producir al ritmo de los demás como personas que no aportaban lo suficiente. Empiezan a existir las instituciones de encierro, y los hospitales, cárceles y manicomios se ocupan de las personas que no cumplían con lo que la sociedad esperaba.
- En época de posguerra, por la enorme cantidad de heridos, toma preeminencia el paradigma médico: la discapacidad es un problema individual; hay que curar a esas personas y ellas tienen que luchar con su voluntad para reinsertarse.
- A partir del movimiento Vida Independiente (década del ’70), empieza a comprenderse que la diversidad funcional se debe atender a nivel social. La responsabilidad de que alguien sea autónomo o dependa de ayuda externa es de la sociedad, y no del individuo.
A partir de todo ello quiero invitarlos a pensar: ¿Qué tal si pasamos de ver una persona normal y muchas personas “fuera de la norma” (diferentes), y pasamos a entender que las personas venimos en diferentes formatos? Cuando hacemos un edificio, una página web o un objeto de uso cotidiano, tenemos que pensar que hay gente que no ve, gente que no oye, gente que no distingue todos los colores, gente que no tiene sus dos brazos o sus dos piernas, etc. Somos responsables de permitir o dificultar la autonomía de las personas. De todas las personas.
Como dijo la profesora al cierre de la clase, logrando que yo lagrimee hasta llegar a casa: si uno tuvo la posibilidad de ser, el otro también.
Descripción de la imagen: En un primer recuadro hay una figura humana con dos piernas y dos brazos, encerrada en un óvalo y con la etiqueta “Persona normal”, y dos personas con una pierna o un brazo y el rótulo “Persona diferente”. En el segundo recuadro hay tres figuras humanas, en el mismo óvalo, con el rótulo “Personas”. Dos de ellas tienen sólo un brazo o sólo una pierna.
Haciendo magia con CSS [ go ]
Estoy trabajando una plataforma Moodle 2, y debo decir que los muchachos se pasaron con los cambios… ¡cuánto cuesta adaptarse a las novedades!
Sin embargo, voy entendiendo y encontrando la lógica poquito a poco.
Hoy quiero comentar cómo hice algunas cosas espectaculares con CSS.
Yo tenía una página con links (página de categoría) y quería poner al lado de cada enlace una imagen que cambiara cuando pasaba el mouse sobre el link.
Si tuviera acceso al HTML, esto se resuelve de una forma muy simple: creando clases para los enlaces:
En la página Html:
<a class="enlaceazul" href="http://esteenlaceesazul">Este enlace es de color azul</a>
<a class="enlacerojo" href="http://esteenlaceesrojos">Este enlace es de color rojo</a>
En la hoja de estilo CSS, podemos configurar un estilo para cada clase, para su estado “normal”, para el enlace ya visitado y para el enlace en el momento en que el mouse está sobre él:
a.enlaceazul { color: #000099;}
a.enlaceazul:visited { color: #000088;}
a.enlaceazul:hover { color: #0000FF;}
a.enlacerojo {color: #990000;}
a.enlacerojo:visited {color: #880000;}
a.enlacerojo:hover {color: #FF0000;}
Lo que yo necesitaba era poner una imagen a la derecha, así que en lugar de cambiar el color, cambiaba la imagen de fondo, lo cual en cualquier página web puede hacerse utilizando por ejemplo:
background: url(http://imagen.png) no-repeat center right;
En Moodle la cosa se complica porque las imágenes se toman de una manera diferente:
a {background-image:url([[pix:theme|nombredelaimagen]]);}
Pero mi mayor complicación era hacer todo esto… ¡sin tocar el código PHP de la página de Moodle!
Entonces estuve buscando de qué manera podía poner estilos diferentes a enlaces diferentes… de acuerdo al texto del enlace. Y me encontré con un link maravilloso que explica esa y otras cosas geniales: 19 tips y trucos para CSS.
Lo que hacemos es decirle que aquellos enlaces (a) que tienen dentro del texto del enlace (href*) lo que está entre comillas, tienen que tener determinado estilo:
a[href*="texto_del_enlace.html"] {
height: 50px; /* Cambiando la altura del link de acuerdo a la altura de mi imagen */
background: url([[pix:theme|matematica]]) no-repeat right top;
}
a[href*="texto_del_enlace.html"]:hover {
height: 129px; /* Cambiando la altura del link de acuerdo a la altura de mi imagen */
background: url([[pix:theme|matematica2]]) no-repeat right top;
}
En este post se aclara qué son los corchetes en CSS: CSS para pestañas:
Los corchetes se usan para seleccionar atributos, por ejemplo:
[type=radio] {}, con esto seleccionas todos los elementos que tengan el atributo “type” y que éste sea igual a “radio”.
La “viborita” selecciona elementos con el mismo padre, y que respeten el orden del selector, es un selector de hermanos, por ejemplo:
[type=radio]:checked ~ label {}, selecciona todos los elementos “label” que sean hermanos de un elemento con “type” igual a “radio” seleccionado y que ademas, se cumpla que el label esta despues del radio button, lo particular de este selector es que los elementos no tienen que estar exactamente juntos, puede haber otro elemento entre ellos, y aun asi funcionaran.
Aquí una explicación bien detallada de algunos elementos utilizados: CSS: Formatos
Mi charla en el Epuel: accesibilidad web [ go ]
La semana pasada tuve el honor de participar en el Epuel (Encuentro por una Educación Libre), a través de un video y una charla por Skype.
Transcribo aquí el contenido del video:
Hola, me llamo Iris Fernández, quiero hablarles acerca de la accesibilidad web. Cuando hablamos de crear una página web accesible nos referimos a una página que no presente barreras de acceso a ninguna persona. Es decir: cualquier persona, independientemente de que tenga una discapacidad o que esté en una máquina con muy poco ancho de banda o que navegue a través de un dispositivo móvil, cualquier persona tiene que poder acceder al contenido de la página que creamos.
Para crear un sitio web accesible hay que seguir una serie de pautas que determina el consorcio de la triple W (w3c). Estas pautas son muy complejas, tienen muchísimo para estudiar, pero podemos nombrar diez puntos básicos para enseñarles a nuestros alumnos a tener presente siempre el tema de la accesibilidad:
1.-Separar el contenido del formato, es decir que el contenido tiene que estar en un archivo HTML, y el formato -colores, tipo de letra, el color de fondo-, tiene que estar en una hoja de estilo, en un archivo de tipo CSS (hoja de estilo en cascada
2.-Usar correctamente las etiquetas de HTML: H1 para el primer encabezado, H2 para otro título, no indentar usando listas… es decir, cuando existe una etiqueta para crear listas, hay que usarla para crear listas, cuando existe una etiqueta para crear párrafos hay que usarla para crear párrafos y no para los títulos. De esta manera una persona invidente que escucha la página web con un lector de pantallas puede pedir que el programa le lea solamente los títulos, solamente los ítems de la lista, saltear los ítems de una lista, etc.
3.-Siempre tenemos que poner un texto alternativo correcto cuando insertamos una imagen, es decir si hay una imagen de una casa, el texto alternativo tiene que decir “una casa” y no “imagen 1″. Es decir el texto alternativo es una herramienta para los invidentes o para las personas que navegan con un dispositivo que no les muestra la imagen.
4.-Cuando insertamos audios o videos tenemos que ofrecer texto alternativo. Transcribir los audios, describir los videos.
5.-Cuando insertamos enlaces, links, no tiene que decir “clic aquí”, “aquí”… tiene que decir “Biblioteca Nacional”, “Biblioteca del Congreso”, el enlace se tiene que describir a sí mismo, para los casos en que una persona invidente esté navegando por un sitio y con la tecla tab esté recorriendo los enlaces.
6.-Cuando insertamos un organigrama, un gráfico estadístico, una historieta, tenemos que acompañarla por una descripción larga (longdesc). De esta manera, todo el contenido por ejemplo de un organigrama tiene que estar en versión texto para que un invidente pueda acceder a él.
7.-Si usamos scripts de Java, applets, plugins, etc. tenemos que siempre ofrecer texto alternativo, contenido alternativo, que pueda funcionar si alguien no tiene activado Java Script, si no tiene el plugin, etc.
8.-No usar tablas para diseñar. Si nosotros queremos poner contenido de un lado y del otro no tenemos que usar tablas, tenemos que usar DIVs.
9.-En el caso de necesitar efectivamente una tabla, es decir, el contenido encolumnado, tenemos que asegurarnos de que se puede leer de manera horizontal, para que los invidentes que escuchan la página leída puedan entender el contenido.
10.-El punto más importante: permanentemente tenemos que chequear la validez de nuestro código y controlar la accesibilidad de nuestro sitio. Es decir, tenemos que mantenernos informados, tenemos que usar validadores automáticos y saber que cada vez que actualizamos el sitio tenemos que volver a controlar que el código sea correcto.
Bueno, muchas gracias.
Después del video mostré algunos ejemplos de cómo separar el contenido del formato.
Muestro aquí un ejemplo muy sencillo de esta separación.
En el archivo HTML se escribe el contenido, vinculándolo con un archivo CSS, de esta manera:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>El cuento de Caperucita Roja</title>
<link rel="stylesheet" type="text/css" href="cuento.css"/>
</head>
<body>
<h1>Este es el cuento de Caperucita roja</h1>
<h2>Versión irreconocible</h2>
<p>Había una vez una nena que se llamaba Juanita.</p>
<p>Su madre se llamaba Juana, su abuela se llamaba Pepita.</p>
<p>Una vez Pepita le dijo a Juana: la cara de tu hija me suena de algún lado. ¡Ah! ¡Ya sé! ¡Es igual a Caperucita Roja!</p>
<p>Fin.</p>
</body>
</html>
En la hoja de estilo (que debe llamarse en este caso cuento.css) definimos el aspecto de cada elemento:
body {
width: 80%;
font: 1em "Lucida Sans Unicode", "Lucida Sans", verdana, arial, helvetica;
color: #ffffff ;
background-color: #b0c6f4;
margin-left: auto;
margin-right: auto;
}
p {
margin-left: 1em;
}
h1 {
font: 1.4em "Lucida Sans Unicode", "Lucida Sans", verdana, arial, helvetica;
color:#112868;
text-align: center;
border-bottom: 0.05em solid;
}
h2 {
font-size: 1.2em;
color:#112868;
text-indent: 0em;
}
Cuando visualizamos el archivo HTML podemos verlo así:
Te leo un cuento: repositorio de cuentos para niños invidentes [ go ]
Te leo un cuento es un repositorio de cuentos para niños invidentes. Nació en diciembre de 2008 como una idea de un regalo de navidad, y fue creciendo lentamente con la colaboración de un equipo muy valioso.
La dificultad mayor fue siempre conseguir textos, pero ahora descubrí que en Wikisource hay cuentos, fábulas y leyendas libres que podemos grabar.
Así que los invito a grabar un cuento, una fábula o una leyenda… sólo para empezar les pido que elijan uno de este listado (antes de empezar consultar lista de textos en proceso de grabación):
Después, es fundamental que avisen: “estoy grabando tal texto” y nos envíen el link, así lo incorporamos a la lista de textos en proceso de grabación.
¡Esperamos sus aportes!
Posts relacionados
Para navidad, regalemos un cuento libre
¿Qué es eso de las licencias Creative Commons?
Ley de accesibilidad de la información en las páginas web – Argentina [ go ]
Quiero difundir esta excelente noticia, no sólo para los discapacitados sino para toda la gente, con o sin limitaciones físicas, ya que todos en algún momento podemos tener un brazo enyesado o un bebé en brazos y necesitar navegar con una sola mano, por ejemplo, entre tantas otras situaciones.
Se aprobó en Argentina la Ley de accesibilidad de la información en las páginas web. Copio aquí el artículo primero:
ARTÍCULO 1º.- El Estado nacional, entiéndanse los tres poderes que lo constituyen, sus organismos descentralizados o autárquicos, los entes públicos no estatales, las empresas del Estado y las empresas privadas concesionarias de servicios públicos, empresas prestadoras o contratistas de bienes y servicios, deberán respetar en los diseños de sus páginas Web las normas y requisitos sobre accesibilidad de la información que faciliten el acceso a sus contenidos, a todas las personas con discapacidad con el objeto de garantizarles la igualdad real de oportunidades y trato, evitando así todo tipo de discriminación.
El texto completo: Ley de accesibilidad de la información en las páginas web
Quitter: cliente Twitter para invidentes [ go ]
Ayer empezó a seguirme Martin Baldassarre en Twitter*; le pregunté qué cliente está usando para manejarse con Twitter y me habló de Quitter. Es un cliente Twitter muy liviano para Windows.
Ya lo instalé, me bajé el paquete de sonidos The Beatles, pero todavía no logré dominarlo… ¡paso a paso!
Por ahora, cada vez que llega un tweet, escucho el aviso.
También escribí mi primer Tweet desde Quitter.
Por lo pronto puedo decir que se trata de un cliente que no abre ventanas ni necesita el navegador abierto, que permite acceder a múltiples cuentas de Twitter, responder, acceder a los perfiles de los usuarios, listados de seguidores y seguidos, y todas las funcionalidades de un cliente de twitter estándar.
*Aclaración necesaria: en Twitter se llama Seguir a la acción de leer las publicaciones de un usuario.
Interpretación de Lenguaje de Señas – Buenos Aires [ go ]
Reenviemos este mensaje. Se necesita difusión para que la carrera -que es gratuita- tenga alumnos y no cierre.
Está abierta la inscripción para el ciclo lectivo 2010 del IFTS (Instituto de Formación técnica Superior) Nº 27 que dicta la Tecnicatura Superior en Interpretación de Lenguaje de Señas Argentina, única carrera gratuita con título oficial que permite a los egresados desempeñarse como intérpretes en los ámbitos judiciales, educativos, de salud y de medios de comunicación.
Para información e inscripción los interesados tienen que dirigirse a
Av.Asamblea 1221 – Ciudad de BUENOS AIRES, Argentina, en el horario de 19 a 21.
Teléfono (5411) 4923-0115.
A principios de este año esta escuela estuvo a punto de cerrar sus puerta por falta de alumnos. La colaboración de todos ustedes hizo que la escuela siguiera adelante. Ahora, al cierre de este año lectivo, es que les pido si pueden publicarlo o reenviarlo a sus contactos, para que esta escuela no cierre sus puertas y continúe brindando la formación en esta carrera con titulo oficial y gratuita y de gran ayuda para la comunidad.
Mar del Plata, plaza Mitre: juegos para chicos discapacitados [ go ]
Hace unos cuántos años que veraneo en Mar del Plata, y siempre uno de los paseos más esperados es el de la plaza Mitre, donde alquilan bicicletas y kártings.
Esta vez la plaza nos sorprendió positivamente cuando llegamos y vimos nuevos juegos, pero esta vez muy especiales:
Un sube y baja para dos sillas de ruedas.
Una calesita para cuatro sillas de ruedas.
Una hamaca para una silla de ruedas.
El alfabeto dactilográfico.
Hamacas para chicos acostados o sentados (con respaldo).
Y el cartel que nos explica de qué se trata todo esto tan maravilloso.
Me encantaría ver plazas como esta en mi querida ciudad de Buenos Aires…
Por supuesto que la ciudad me permitió sacar unas cuantas fotos (varios cientos en pocos días!), de las que compartí algunas en Wikimedia Commons.
Para navidad, regalemos un cuento libre (II) [ go ]
Hace exactamente un año presentaba mi proyecto Te leo un cuento con este título:
Para navidad, regalemos un cuento libre
Ahora Te leo un cuento tiene diez cuentos libres leídos, y algunos grupos de alumnos que gracias a Marisa Conde y a Carlos Valentini están trabajando en crear y grabar nuevos cuentos para chicos invidentes.
¿Qué es Te leo un cuento?
Es un repositorio de cuentos para niños invidentes, o para padres invidentes o sordos que quieran bajarles cuentos a sus hijos. Por eso ofrecemos el audio, en formato mp3 y ogg, y el texto.
Los cuentos están alojados en un hosting provisto por Carlos Sisek (Netalumno)
¿Cómo participar enviando un cuento grabado? (y el texto correspondiente)
Es muy importante que la licencia del cuento permita compartirlo (lo ideal es que se animen a grabar creaciones propias, pero si buscan en internet, tiene que ser con licencia Creative Commons o alguna otra que permita su uso).
Por otra parte, tiene que estar muy bien grabado, ya que algunos chicos ciegos también tienen problemas de audición o de cognición.
Tenemos que indicar una edad aproximada para los destinatarios y decir de dónde es la persona que lo lee (para que se pueda elegir el acento o el vocabulario de acuerdo al lugar donde vive el niño).
Quiero agradecer a todos los que pusieron su granito de arena en este proyecto:
Narradores y autores:
- Marisa Conde
- Verónica Zambonini
- Viviana Santillán
- Alejandro Joos
- Diana Laura Caffaratti
- Trebol, Óscar Noé Rodríguez Martínez
- Anna SB
- Radiotekita (Producciones Aler)
Fotografía: Nicolás Giorgetti
Hosting: Irene Fernández, Agencia Blog / Carlos Sisek, NetAlumno
Difusión del proyecto: Fernando Pelillo
Asesoría técnica: Guillermo Prandi
¡¡¡Saludos Navideños!!!
Mi taller sobre creación de sitios accesibles en Edusol [ go ]
Estoy terminando de dictar un taller a distancia en Edusol 2009.
Los participantes son maravillosos; increíblemente conozco a muchos de ellos, somos compañeros de redes en diversos entornos…
Para quienes no pudieron hacer el taller durante esta semana, o para quienes estén interesados en difundir la accesibilidad web dictando un taller con este material, pongo a disposición de todos los textos de las tres unidades en PDF.
- Unidad 1 – Principios básicos y primer código HTML
- Unidad 2 – Hojas de estilo
- Unidad 3 – Validación automática del código
Ejemplos y hojas de estilo de la unidad 1:
Otros posts sobre accesibilidad
- Tecnología para mejorar la vida de la gente
- CSS: Float y Clear
- Ubuntu EV: sistema operativo accesible
- ¿Cómo se ve mi sitio en otros sistemas?
- Imágenes en CSS
- Sombras nada más… o ¿sombras en el texto de una web accesible?
- Por qué crear webs accesibles
- Ayuda para crear hojas de estilo
- Cómo saber el código de un color
- Cómo saber si tu sitio es accesible
