Posts Tagged ‘estandares’

WCAG 2.0

Friday, December 12th, 2008

Lo habréis leido en dos mil sitios, pero por lo menos un breve post de homenaje a un trabajo bien hecho:

Y actualizo

Introducción a WAI-ARIA en castellano

Thursday, December 11th, 2008

David Martín pone a nuestra disposición en su blog (Areia.info) la traducción del documento de Introducción a las pautas WAI-ARIA. Si te dedicas a desarrollar RIAs en HTML, te preocupas por la accesibilidad y no sabes o te da pereza leerte un documento complejo en inglés… no te lo pierdas.

Web Content Accessibility Guidelines – WCAG 2.0

Wednesday, November 5th, 2008

La especificación WCAG 2 pasa también al estado de “propuesta de recomendación”. Esta especificación es realmente imporante ya que es la que se encarga de establecer las pautas y líneas guía para hacer el contenido web accesible.

The Web Content Accessibility Guidelines (WCAG) documents explain how to make Web content accessible to people with disabilities. Web “content” generally refers to the information in a Web page or Web application, including text, images, forms, sounds, and such. (More specific definitions are available in the WCAG documents.)

La versión anterior de este estándar (versión 1) es del año 1999 y parece que esta nueva edición estará terminada en breve (término que para la W3C puede ser desde unos meses a 15 años).

Estoy seguro de que mucho de los que leeis este blog tenéis claro de que va el tema, pero a los que no lo tengáis os recomiendo, insisto y vuelvo a insistir en que conozcáis esas pautas y las apliquéis en lo posible (no siempre lo es)… no nos limitemos a poner el sellito de marras por favor.

Aprovecho para comentar también las otras especificaciones que la W3C edita en torno a la accesibilidad:

  1. WAI-ARIA (Rich Applications): pautas para implementar accesibilidad en las RIAs.: en la pasada edición de Fundamentos Web tuve el placer de asistir a la presentación de este estándar por su responsable y todos quedamos gratamente impresionados por lo bien pensada que está la especificación.
  2. Authoring Tool (ATAG): Líneas guía de accesibilidad para los desarrolladores de software para hacer webs.
  3. User Agent (UAAG): lineas guía de accesibildidad para desarrolladores de navegadores, reproductores multimedia y tecnologías asistivas relacionadas

Todas estas especificaciones y algunas más forman parte de la iniciativa WAI, que cualquiera que se haya tenido que enfrentar al tema de la accesibilidad habrá oído nombrar.

Maquetando sin tablas, pero como con tablas: display inline block

Monday, October 27th, 2008

Aviso: lo que se explica en el siguiente artículo forma parte de lo que denomino “la maquetación web del futuro“, es decir, cosas que podremos hacer dentro de un tiempo pero que, dado el uso que aún tienen algunos navegadores antigüos, hoy por hoy no es recomedandable utilizar

Actualización!: Anieto2k publica un hack que permitiría utilizar esta técnica en todos los navegadores. 

Esta semana he leído dos artículos (artículo 1, artículo 2) donde unidos a la palabra maquetación se usan términos como “Table”, “Cell” o “Row”. ¿Qué pasa? ¿Se ha vuelto a poner de moda la maquetación basada en tablas? Evidentemente no, esto no tiene vuelta atrás aunque todavía haya demasiados sitios webs table based.

La idea central de estos artículos es la posibilidad de poder aplicar a elementos que no son tablas propiedades de éstas. Esto se hace mediante los valores “table”, “table-cell” y “table-row” de la propiedad display. Se vuelve a hablar de esto ahora que Internet Explorer 8 admite y funciona con estos valores, aunque no lo hace de forma totalmente correcta (hablamos de la beta 2).

En la práctica lo que esto supone es que podemos hacer un elemento HMTL como, por ejemplo, un DIV, tenga el comportamiento de una tabla. Es decir, sin hacer atentados semánticos podemos aprovechar las propiedades de la maquetación con tablas. Un claro caso de uso es poder hacer algo que trae de cabeza a cualquier maquetador CSS: que un conjunto de elementos flotantes tengan una altura común. Dos imágenes valen más que 2.000 palabras

Caso 1: (ver html)

Caso 2: (ver html no en Internet Explorer < 8)

Para el segundo caso lo que hemos hecho es usar en los siguientes valores de la propiedad display:

  • display: table->le dice al elemento que se comporte como una tabla.
  • display: table-row-> le dice al elemento que se comporte como una fila de una tabla
  • display: table-cell->  le dice al elemento que se comporte como una celda de una tabla

Ojo, por si no has leido atentamente: esta técnica se podrá usar cuando la gente

Más sobre este tema:

No más “Expresiones” en CSS

Thursday, October 23rd, 2008

Ya lo ha comentado Andrés Nieto, no hay mucho más que decir. Solamente congratularnos por la desaparición de otro de los inventos de la época anti-estándares (o más bién, “yo hago los estándares”) que promovió Microsoft en su IE.

Internet Explorer siguen en el camino que comenzó con IE7 hacia el respecto a los estándares web.

Primera beta de Firefox 3.1

Wednesday, October 15th, 2008

Ya se ha publicado la Beta 1 de la próxima versión de Firefox. No creo que sea muy recomendable su intalación todavía excepto para desarrolladores que deseen ir probando las nuevas características del navegador.

Para desarrolladores web decir que Mozilla sigue avanzando en la adopción de estándares en su navegador. Respecto a propiedades CSS hay interesantísimas novedades como:

  • Font-Face: esta propiedad nos permitirá llamar a fuentes que no sean del sistema desde nuestra hoja de estilos y en navegador se encargará de renderizarla. Firefox se une a Opera y a Webkit (safari) en este movimiento que es uno de los más esperados por los diseñadores web. Sobre fuentes en la web no debéis perderos el artículo en A List Apart.
  • moz-text-shadow: sombras para texto.
  • moz-box-shadow: sombras para cajas.
  • moz-border-image: bordes basados en imágenes.
  • Avances en los layouts en columnas: -moz-column-rule, -moz-column-rule-width , -moz-column-rule-style, y -moz-column-rule-color
  • word-wrap: esperada propiedad que ahora empieza a estandarizarse… ¿Ya podremos dividir palabras?
  • moz-transform y moz-transform-origin: que nos permitirán rotar, escalar y mover elementos mediante CSS

También se avanza muchísimo en selectores CSS:

Y en HTML, lo más destacable es la implementación de dos de los elementos que antes se van a incorporar en los navegadores de nueva generación: video and audio

A otros niveles, también destaca la incorporación definitive de sistema de Geolocalización para el navegador: Geolocation, avances en el elemento Canvas de HTML5 y también en SVG y DOM.

Como decía al principio del post: seguimos avanzando en la incorporación de estándares avanzados… que siga la guerra!