lunes, 9 de diciembre de 2013

El nuevo atributo hidden de HTML5

Según leo en el artículo HTML5 Accessibility Chops: hidden and aria-hidden support on the UP! que se publicó hace unos días, parece que ya se puede usar el nuevo atributo hidden de HTML5, porque ya lo soporta la mayoría de los navegadores web (y supongo que los productos de apoyo como los lectores de pantalla).

Este atributo se puede aplicar a cualquier elemento de HTML. La definición en la especificación de HTML5 dice:
All HTML elements may have the hidden content attribute set. The hidden attribute is a boolean attribute. When specified on an element, it indicates that the element is not yet, or is no longer, directly relevant to the page's current state, or that it is being used to declare content to be reused by other parts of the page as opposed to being directly accessed by the user. User agents should not render elements that have the hidden attribute specified.
¿Pero esto es lo que se ha hecho siempre con display: none en CSS?

Sí, efectivamente, es así. Un poco más de lío... Mirad lo que sigue en la especificación:
The hidden attribute must not be used to hide content that could legitimately be shown in another presentation. For example, it is incorrect to use hidden to hide panels in a tabbed dialog, because the tabbed interface is merely a kind of overflow presentation — one could equally well just show all the form controls in one big page with a scrollbar. It is similarly incorrect to use this attribute to hide content just from one presentation — if something is marked hidden, it is hidden from all presentations, including, for instance, printers.
Hay que llevar mucho cuidado con el uso de este atributo.