Ciber Geek >

bootstrap

El SEO y la accesibilidad

Éste post tiene como objetivo dar el puntapié inicial a una serie de post relacionados con el tema de la web y la accesibilidad, o como le dice el resto del mundo, accesibilidad web.

cuadrado negro, metafora para representar la falta de vision

La web para no videntes

Shall we?

Bueno, para empezar a estudiar el tema elegí hacerlo desde un punto de vista de algo que conozco un poco más y con lo que me siento cómodo, que es el SEO, específicamente on-page, y la razón por la cual me apoyo en él se debe a la gran similitud que hay entre las técnicas para hacer un sitio accesible para personas con discapacidades y hacer lo mismo pensando en los robots de los buscadores.

Accesibilidad y SEO

Las similitudes son muchas, empezando por las imágenes, el atributo alt es algo que no dudamos que es importante, no solo para mejorar nuestro ranking, sobre todo en la búsqueda de imágenes, sino que también no es raro acceder a un sitio y que no carguen las imágenes. De hecho, puede ser un buen truco para “acelerar” la conexión a Internet. Sin dudas, casi todos lo consideramos algo necesario.

foto del robot r2d2

R2D2 tiene mas onda que Asimo

Éste es un primer ejemplo de las similitudes, y de como el SEO on-page puede ser beneficioso por varios motivos.

Contenido estructurado

Uno de los puntos que resaltan en cualquier guía sobre SEO, y que también está íntimamente relacionada con la accesibilidad. Empezamos por la etiqueta title, tener un titulo descriptivo es muy importante, para todos, no es nada nuevo, así que no se dejen llevar por la moda del clickbaiting que hizo tan popular a BuzzFeed.

Es importante respetar las estructuras, tablas con títulos (th), listados en vez de párrafos con saltos de linea, y algo especial son los formularios, las etiquetas son importantes.

Los links, evitar cuando se pueda los click aquí, clic allá, etc. Los lectores de pantalla no leen el atributo title, así que ténganlo en cuenta. Además, es bueno para el SEO =) (los emoticones deben ser algo complicado también, queda para la próxima). También eviten llenar el comienzo de su sitio con links y contenido no relacionado, y si lo hacen, al menos pongan primero un link con el texto “Pasar al contenido”, o algo similar.

No todos son no-videntes, hay otros temas a considerar, como las personas que tienen algún tipo de daltonismo, y enfermedades similares, en las cuales los contrastes son importantes.

HTML5 por suerte hace las cosas un poco mejor, y además, si usan Bootstrap, éste framework se ve que fue hecho con la accesibilidad en mente, ya que constantemente fomenta las buenas practicas.

Internet Explorer, es uno de los browsers mas usados, y si bien el tamaño de la muestra es chico, ésto es lo que dicen en ésta encuesta realizada por WebAIM.

Si quieren ir leyendo más, pueden acceder a la sección dedicada a la accesibilidad web de la W3C.

La telefonía móvil en Argentina, mi pequeño aporte

Si son argentinos y tienen un teléfono celular (o similar), bueno, pobres de ustedes, ya que el servicio es bastante pedorro, por decirlo de manera delicada. ¿Y cual es tu aporte? ¡¡HDP!! Seguramente es lo que piensan ustedes, bueno, mi aporte es que hice mi mejor esfuerzo, el cual aún no ha concluido, con el objetivo de recopilar los planes de telefonía disponibles en las 3 principales empresas del mercado, Claro, Personal y Movistar. He aquí la obra de arte, Planes para todos! (nombre trillado y barato si los hay)

planes para todos

He aquí el monstruo

Mi mejor esfuerzo consta de 10hs, y contando, de recopilación de datos, sumados a un rato de maquetado apalancado por Bootstrap y utilizando AngularJS para juntar el menjunje de datos, algunos dirán: – “¿Angular para esa boludez?”, a lo que mi respuesta es algo así como: -“Sí, soy un boludo, me fui de mambo, pero es porque tengo pensado ir contruyendo sobre esta base”.

Otros dirán: -“Pero si lo actualizas tanto como tu blog va a ser una reverenda cagada inútil”. Es verdad, pero la razón por la que pseudo abandoné el blog es porque estaba usando el tiempo en hacer esta fenomenal aplicación, en vez de actualizar como Dios manda, en un momento pensé ir posteando sobre las peripecias que pasé, pero bueno, puede que lo haga próximamente cuando llegue el “Gran Refactoring, Gran”.

El diseño

El diseño actual no le gusta a nadie, ni a mí, pero bueno, espero poder ir mejorando luego de que se terminó, por ahora, la ardua tarea de juntar los datos y decidir cuales eran importantes y cuales no.

Los datos

Los datos salen de los sitios de las empresas de telefonía, sumados a un poco de interacción a través de Twitter, tengo que confesar que todos fueron muy rápidos en contestar a través de éste medio. Lo malo, es que después te mandan mensajes para que los califiques, para que empieces a usar la autogestion, y para juntar firmas para que Carlitos vaya al mundial, a lo cual, meh.

El código

No lo miren, me da pudor, hay una mezcla mortal de cosas locas, filtros, sin filtro, watchers, paparruchadas con expressions, abuso de las bondades de AngularJS, pero bueno, el código fue escrito bajo el siguiente supuesto que todo programador hace: “Ahora lo hago así para obtener resultados rápido, después lo mejoro” Sabemos que después significa nunca. Recuerden, excepto que estén prototipando como Dios manda, o sea, prototipo que NO se debe reciclar y llegar a producción, siempre, siempre, escriban el codigo como si fuese a durar para siempre, y pensando en la pobre persona a la que le puede llegar a tocar mantenerlo en un futuro, aunque sean ustedes mismos, apiádense de ustedes.

Conclusión

Ni los científicos de la NASA son capaces de comprender al 100% los términos de los planes de telefonía de Argentina, si se creían grosos por pasar los test de comprensión de texto de Techint, bueno, piénselo otra vez, porque tratar de “formalizar” los términos de las empresas de telefonía es un dolor de escroto comparable con el de viajar en un colectivo de larga distancia y que atrás te toque una de esas personas que creen que el respaldo de tu asiento es un apoyapies, el de al lado tuyo ronque, y adelante vaya un bebe llorón.