Category Archives: accesibilidad web

Día W3C en España: La nueva generación de estándares Web

El jueves 16 de abril, en Barcelona, se celebra el Día del W3C en España, por si a alguien le interesa copy pasteo la información:

El Día W3C en España es un evento que desde hace dos años, se viene celebrando con el objetivo de facilitar un entorno en el que poder establecer un debate sobre el uso de los estándares web y poder conocer las experiencias de empresas y organismos a la hora de utilizar los estándares.
Fechas de interés Día Evento
13 de abril Fecha límite inscripciones
16 de abril Día W3C en España

La jornada de este año que lleva por título La nueva generación de estándares Web tratará temas candentes de la actualidad de los estándares, fundamentales en el crecimiento y evolución de la Web. El Día del W3C en España 2009 está estructurado en tres sesiones orientadas a la aplicación de estándares en el mundo de la empresa y de la investigación.

La inscripción es gratuita, y en Barcelona hace una primavera del carajo.

Más información en la web del evento.

Nos vemos por allí.

Share this:
Share this page via Email Share this page via Stumble Upon Share this page via Digg this Share this page via Facebook Share this page via Twitter

Esquema para nombrar semánticamente las capas de nuestro css y html: CSS/xhtml Naming Schema

Andy Clarke y Eric Meyer han propuesto un esquema para nombrar semánticamente las capas contenedoras de nuestro código de lado de cliente (css y xhtml, de javascript no va la cosa por ahora).
Este es el esquema que proponen tanto para sitios en general como para ecommerce (corto y pego):

#container
Page container (usually a <div>)
#branding
Used for a header or banner to brand the site.
#branding-logo
Used for a site logo
#branding-tagline
Used for a strapline or tagline to define the site’s purpose
#nav or #navigation
Used to contain a navigation device
#nav-main
Main or primary navigation
#nav-section
Navigation to pages within the current site section
#nav-external
Navigation to pages outside the site
#nav-supplementary or #nav-supp
A supplementary list of links, perhaps in a footer. This can replace the common, but presentational #footer
#nav-(whatever)
A list of links named at a designer’s descretion
#search
Related to search interface and search results
#search-input
A search form
#search-output
Search results which could include a <div> or other markup including definition lists
#content
Used for content rather than for another purpose such as navigation
#content-main
The main content area
#content-news
News related content
#content-(whatever)
Could include any form of content, including #content-related, #content-quote etc.
#siteinfo
Used for various site related information
#siteinfo-legal
Copyright information etc.
#siteinfo-credits
Designer or other credits

Y para Ecommerce:

#content-products
An overall area containing products
.products
Referring to individual products
.products-prices
Prices, discounts, special offers etc.
.products-description
A summary or longer description of a product
.products-review
A customer review
.products-(whatever)
Could include any form of product related content

Yo por lo pronto voy a usar el de ecommerce para una tienda online que tengo entre manos.

Share this:
Share this page via Email Share this page via Stumble Upon Share this page via Digg this Share this page via Facebook Share this page via Twitter

David matas

Lo de en casa del herrero cuchillo de palo, deja de tener un ejemplo más. David, el otro 50% de Piscolabis, estrena web, y espero que pronto blog.

Así que si necesitais un buen maquetador web experto en estándares w3c y accesibilidad, ya podeis contar con él. Y que mejor garantía que sea mi mano derecha (bueno izquierda que el niño es zurdo) en muchos de los proyectos del último año, haciendo equipo, con el nombre de Piscolabis.

Share this:
Share this page via Email Share this page via Stumble Upon Share this page via Digg this Share this page via Facebook Share this page via Twitter

Un nuevo algoritmo de google aprende a indexar sitios web en flash

Dice el blog de google que han desarrollado un nuevo algoritmo capaz de indexar contenidos textuales, tales como textos, menús, botones o banners.
Vamos una de cal y otra de arena.
Es una magnífica noticia que sitios web en flash puedan indexar, y contenidos antes invisibles empiezen a ser visibles. Todavía hay mucha web en flash y esto supone un gran adelanto.
Lo malo sería que se retrocediera tanto camino conseguido. Uno de las grandes hitos conseguidos por los estandaristas, separar contenido de presentación, algo imposible en flash, puede verse afectado: ¿Qué pasara cuando el típico cliente hortera que quiere mariconadas en flash se entere de que flash sindica algo? Y digo algo, porque no me creo que flash indixe jamás a más de un 10%, al menos en muchos años.
Tendremos que seguir convenciendo acerca de que tecnología se adapta a sus necesidades, pero ahora los horteras tienen un as en la manga.
Por cierto no quiero decir que usar flash sea de horteras, al contrario flash es diseño puro y la mayoría de los sitios web en flash son auténticas maravillas desarrolladas por grandísimos profesionales y creativos. Me refiero a hortera cuando quieren una web en flash porque no saben hacer otra cosa y se rinden a un cliente que lo único que quiere es musiquita, intros en flash y banalidades varias. Para ejemplos varios de a lo que me refiero podeis daros una vuelta por QueWeb.
Quizá resurja de nuevo la lucha por convencer al cliente de que sitio web con contenidos igual a tecnología de desarrollo basada en estándares web. Los dioses no lo quieran.

Share this:
Share this page via Email Share this page via Stumble Upon Share this page via Digg this Share this page via Facebook Share this page via Twitter

Granada.org y su mal planteamiento de la accesibilidad web

granada.org

En un artículo de José Pita me he encontrado con la noticia de la renovación de la web del Ayuntamiento de Granada.
Para que no nos sorprendamos, las espectativas se han cumplido: la web está mal hecha: errores de código, sin doctype, imposible de navegar sin javascript, imágenes o css desactivado, hojas en estilo en cascada propias de un novato (lo que no está mal en si, pero no es correcto para una web institucional), una de las descripciones en el head más estúpidas jamás vista…
Pero mi lo que me ha chocado es una de esas cosas que se hacen en aras de ser más experto en accesibilidad que nadie y que revela que no tienes mucha idea de lo que estás haciendo, esto:

A parte del fallo en la maquetación de las listas, que es lo de menos a estas alturas, es esto lo que me causa desconcierto:

Se trata de un configurador de tamaño de pantalla, dónde puedes elegir si quieres que la página web ocupe el 100%, el 60%, 1000px o 1100px o la configuración estándar a 800px…
Mmmm ¿me puede decir alguien a que clase de experto se le a ocurrido esto?

Cuando un usuario llega a una página web quiere encontrase con la información que busca o llegar a ella en la menor cantidad de pasos y con la mayor claridad posible. El hecho de que el diseño de la página sea flexible, ayuda y mucho pero eso no significa, ni mucho menos añadir semejante funcionalidad extra: el diseño debe o debería ser flexible pero no superconfigurable, ya de paso, ¿por qué no cambiamos el fondo de color y lo ponemos rosita o verde fluorescente?. Sencillamente porque eso no es serio, está bien para tu página, o para una web desenfadada pero ni muchos menos para el ayuntamiento de un ciudad seria.
Por si fuera poco, dicha herramienta está oculta tras un icono sin texto en una barra de herramientas sin texto que acompañe a la función: Los iconos deben apoyar el referente del anchor del enlace, pero no sustituirlo, un icono que represente la idea y apoye el texto al que acompaña, si está bien elegido no deja de ser un acierto, pero eliminar el texto en pro de ese icono, es errar el tiro de una forma epectacular.

¿Más cosas?
cuando activas otra configuración de pantalla diferente a 800px la barra de herramientas y buscador se desmaqueta, ahí no han sabido aplicar bien las css.

El buscador: mal muy mal. Al menos han sabido dejar espacio para 15 caracteres, lo que te deja escribir una frase, pero una vez que le das a esa flechita el buscador desaparece. Muy mal, por dos cosas:

  1. El botón de buscar debería ser un botón de con la palabra buscar dentro, y ni mucho menos un flechita, ya estamos dejando otra vez la funcionalidad en manos de la intuición, déjate de intuiciones: que haya un botón con el texto “buscar” dentro,
  2. Cuando aceptas la busqueda, desaparece la cajita del buscador. ¿Por qué? Esta claro que la búsqueda avanzada sólo debería ofrecerse cuando ya has buscado algo, eso es un acierto, pero ocultar la búsqueda principal es un gasto innecesario. Y mucho menos cuando posicionas mal y haces mal una búsqueda avanzada.
    La búsqueda avanzada debería ofrecerse antes de los resultados, de la forma menos intrusiva posible y con la posibilidad de ocultarla, y desde luego esta debe ofrecer ayuda ya que si realmente no va a existir una mejora, mejor no ponerla. Además está muy mal estructurada, con los inputs y enlaces ordenados anárquicamente, simplemente, la búsqueda avanzada o está maquetada.
  3. Otro error de libro es que el logo no ofrezca un acceso directo a la portada. Yo soy un usuario experto , he navegado mucho y paso más de 12 horas al día delante de un ordenador conectado a internet, y os juro que para volver a la pantalla inicial he tenido que buscar hasta pinchar en la miga de pan. Lo primero que he hecho es intentar pinchar en el logo, nada. Luego he ido al menú de navegación, pero no había enlace a la home. después he visto la miga de pan y he accedido. Unos minutos más tarde he visto ese icono de una casita junto a la flechita del buscador. uff vaya torpe que soy. Si yo he dado tres pasos, no quiero saber los que dará un usuario inexperto.

    Y para terminar: aumento del texto. Aquí aprueban, con un 5 pelado pero aprueban al menos. Probad a aumentar el texto, todo se desencaja, pero no demasiado. Además tienen un acierto, no ofrecen esos innecesarios iconos de aumentar o disminuir tamaño de letra: para eso ya están los navegadores y una maquetación tipográfica basada en em´s. ¡Bien!, pero ya puestos a preocuparse por tamaños de pantalla, por qué ofrecer una maquetación flexible, de manera que cuando el texto aumente las áreas se expandan.
    Volvemos al inicio, mal muy mal: la caja de herramientas para cambiar el tamaño del área de la pantalla es un gasto innecesario de esfuerzos, para eso, hacer las cosas bien. ¿O es que los desarrolladores de la nueva web no están cualificados para ello?

    Share this:
    Share this page via Email Share this page via Stumble Upon Share this page via Digg this Share this page via Facebook Share this page via Twitter

“Forzar la casualidad”, las verdades y mentiras sobre el SEO

Rubén Divall ha escrito un pequeño y conciso artículo sobre SEO: forzar la casualidad.
Según Rubén, y lo suscribo completamente:

Posicionar una palabra no es trabajo de gurús, sino de chinos. La paciencia y las horas son las claves de éxito y a veces influye otro factor clave: casualidad. Casualidades como el nombre del dominio, el primo que tiene 30 páginas web o las masas sociales son casualidades que afectan muy positivamente.

De obligada lectura.

Share this:
Share this page via Email Share this page via Stumble Upon Share this page via Digg this Share this page via Facebook Share this page via Twitter

Análisis de la accesibilidad de los ayuntamientos de la provincia de Granada

Rubén Divall ha elaborado un análisis acerca de la accesibilidad de los sitios web de los ayuntamientos granadinos.
El resultado es demoledor, como lamentablemente era de esperar.
Citando al propio Rubén:

De un total de 63 sitios analizados, encontramos 7389 erroes HTML en total. Siendo correctos, los portales del Exc. Ayuntamiento de Órgiva y el Exc. Ayuntamiento de Cijuela. Sólo 2 ayuntamientos pasaron la primera prueba el 3,17% de los que están representados en Internet…
En el resto de sitios pudimos encontrar resultados muy variopintos, desde sitios inaccesibles totalmente (realizados con películas en Flash) hasta webs arcaícas y no modernizadas con posicionamientos y maquetaciónes con tablas anidadas y repletas de errores HTML. También encontramos algunos sitios parcialmente bien hechos, con semántica web y maquetado con capas, pero con excesivos errores XHTML. La anécdota la encontramos en la página web del Ayuntamiento de Otívar dónde con 889 errores de código, sin contenidos semántico y maquetación con tablas anidadas afirman tener un portal con Accesiblidad doble A, con la distinción del sello WC3 AA Conformance.

De obligada visita.

Share this:
Share this page via Email Share this page via Stumble Upon Share this page via Digg this Share this page via Facebook Share this page via Twitter