Su navegador no admite frames. <a href='http://www.blogger.com/home'>Acceder a la página pricipal de Blogger</a>

Menú

Ir al comienzo del artículo

Catálogo de servicios

Portada Catálogo de servicios (Word en formato ZIP 2.20 MB) Versión accesible en HTML
Usable y accesible. Olga carreras

martes 26 de junio de 2007

PDF accesibles

Artículos relacionados
[16-09-09] PDF accesibles (2): metodología




El objetivo de este artículo es explicar de la manera más clara y concisa posible cómo hacer que los PDF que forman parte de nuestra web sean accesibles:


  • cómo realizar correctamente enlaces a un fichero PDF

  • qué alternativa accesible ofrecer

  • cómo hacer el propio PDF accesible

Pero para ello primero hay que concienciar a la comunidad de que los PDF de nuestro portal forman parte de él, contienen información relevante, y por tanto es NECESARIO que cumplan con los mismos requisitos de accesibilidad que el resto de sus contenidos.


No podemos escudarnos en frases muy cómodas como esta web es accesible salvo por los PDF sólo por el hecho de que portales importantes, con certificaciones de accesibilidad e incluso de la Administración Pública, lo hacen, fomentando que esta práctica se extienda como algo justificable.




Mi página es accesible... salvo por los PDF


No sé porqué pero los PDF parecen ser siempre el talón de Aquiles de todo desarrollo web accesible. Es muy habitual leer, incluso en los certificados de accesibilidad de los portales web, párrafos como el siguiente:


El resultado de la auditoría satisface los requisitos de accesibilidad de Nivel Doble-A de las directrices de accesibilidad para el contenido web 1.0 del W3C-WAI. Advertencia: A fecha de esta certificación, los documentos PDF de este sitio web pueden presentar problemas de accesibilidad para algunos usuarios

Es accesible Doble-A con una excepción: los PDF, ¿es o no es accesible? ¿es que los PDF no son parte de la web? ¿no tienen acaso información relevante? Es como decir, este portal es accesible salvo por que las imágenes, que no tienen texto alternativo... pues entonces no es accesible.


O más surrealista aún:


Algunos contenidos del portal se presentan en formato PDF. Si se desea una versión accesible de los mismos, se pude solicitar a través del apartado "Contacta" del propio contenido.

Si tienes una versión accesible, ¿por qué debes solicitarla por email? ¿o sólo la harás si te lo piden? Es como decir, si desea una descripción de las imágenes de este portal, llame al 9001 y se las describiremos con mucho gusto.


Y sin embargo esto es lo habitual, extraño es encontrar una web donde se indique que los PDF son accesible y en la cual se ofrezca siempre una versión alternativa, o al menos un esquema y un resumen de su contenido.


¿Por qué? No tengo muy claro si por falta de tiempo, de presupuesto, de conocimientos o de concienciación: los PDF pueden y deben ser accesibles. Si realmente es necesario que incluyas archivos PDF, lo que es evidente es que resulta necesario hacerlos accesibles por las mismas razones por las cuales hacemos accesible el resto de los contenidos, no para poder poner un sello, sino para que los usuarios puedan acceder al contenido que les ofrecemos.


¿Qué dicen las Pautas de Accesibilidad de la WAI 1.0?


 

Muchos formatos no recomendados por W3C (por ejemplo, PDF, Schockwave, etc.) requieren ser vistos bien con plug-ins o con aplicaciones autónomas. A menudo, estos formatos no pueden ser visualizados o navegados con aplicaciones de usuario estándares (incluyendo ayudas técnicas). Evitar estos formatos y características no estándar [...] tenderá a hacer más accesibles las páginas a más gente que utiliza una amplia variedad de hardware y software. Cuando deba utilizar tecnologías no accesibles (patentadas o no), debe proporcionar una página equivalente accesible.


[...]


Nota: Convertir los documentos (desde PDF, Postscript, RTF, etc.) a lenguajes de marcado W3C (HTML, XML) no siempre crea un documento accesible. Por tanto, valide cada página respecto a la accesibilidad y utilidad después del proceso de conversión (consulte la sección de validación). Si una página no se convierte de forma legible, revise la página hasta que su presentación original se convierta adecuadamente o bien proporcione una versión en HTML o en texto plano.



[Pautas de Accesibilidad al Contenido en la Web 1.0]

La W3C no recomienda utilizar ficheros PDF, pero hay que ser realista, después del HTML, es el formato más difundido en Internet, fundamentalmente debido a su compresión y a su capacidad para mantener la integridad de la información, y nuestros clientes nos van a exigir que incluyamos contenido en este formato, así que no nos queda más remedio que ponernos las pilas y aplicar los mismos criterios de accesibilidad que para el resto de nuestra web.



Es cierto que muchas veces se abusa de los ficheros PDF para incluir información en los portales, y que se debe aconsejar siempre al cliente que no los utilice más que para aquellos contenidos que NO sean susceptibles de ser leídos en línea, bien por su longitud o por estar especialmente pensados para ser impresos y mantener un formato concreto: manuales, un boletín oficial, un documento legal, un impreso oficial, etc.



Brevemente: qué es un PDF


PDF (Portable Document Format) es un lenguaje de descripción de páginas derivado del postcript que especifica toda la información necesaria para la presentación final del documento, especialmente ideado para documentos destinados a ser impresos. Fue desarrollado por Adobe Systems en 1993.


Es multiplataforma y un formato abierto, por lo que hay numerosas herramientas gratuitas y de software libre que permiten crear, visualizar o modificar documentos PDF, no sólo Adobe Acrobat (CutePDF, PDFCreator, WinPDF, etc.)


Un PDF admite texto, fuentes, imágenes, perfiles de color, elementos multimedia y ficheros vectoriales; hacer zoom, múltiples páginas; opciones de desplazamiento como miniaturas y marcadores; opciones de seguridad y firma digital; crear formularios; realizar índices, hiperenlaces o búsquedas.


Existen diversas versiones de PDF, la última es la 1.7 del 2006. En la versión 1.4 se incluyeron los PDF tags, que como veremos son imprescindibles para la accesibilidad. Cada versión del software disponible para visualizar o modificar archivos PDF, podrá visualizar determinadas versiones de PDF, por ejemplo, Adobe Acrobat 7 y Foxit Reader 2.0 pueden leer versiones de PDF 1.6 e inferiores, pero no PDF 1.7.


Desde 1995, Adobe ha trabajado en el proceso de la ISO (Organización Internacional para la Estandarización) para proporcionar subconjuntos especializados de PDF como estándares para funciones y sectores específicos.


Son estándares: PDF/A - Archive y PDF/X – eXchange


Son propuestas de estándares: PDF/E – Engineering y PDF/UA- Universal Accesibility (especificación para la creación de PDF accesibles)


Enlazar correctamente nuestro PDF


Como muy bien explica Antonio Barranco:



  • Indica claramente que el enlace es a un fichero PDF, así como si este se va abrir en una ventana nueva o si se va a descargar (opción que evitaría la lenta carga de sus páginas y ahorraría al usuario tener que guardarlo después), y en cualquier caso proporciona instrucciones para los usuarios noveles.

  • No lo embebas en la página. No todas las ayudas técnicas soportan que el PDF se abra en el navegador. En el Asistente de Accesibilidad de Adobe Acrobat se encuentra esta opción:



    Asistente de Accesibilidad de Adobe Acrobat: opción de no abrir el PDF en el navegador

  • Indica el tamaño del PDF.

  • Acompáñalo de un esquema y un resumen de su contenido.

  • Indica cómo obtener un lector de archivos PDF.

  • Haz el PDF en una versión inferior a la última del mercado.

  • Pon un nombre significativo y amigable al fichero.

  • Puedes evitar que los motores de búsqueda lo indexen directamente, y de este modo el usuario no pierda el contexto del fichero y con él información relevante sobre el mismo.


Alternativa accesible al PDF


Hacer los PDF accesibles permitirá que muchas personas con discapacidad puedan acceder a su contenido, pero no debemos suponer que todos los usuarios disponen de las ayudas técnicas para acceder a su contenido, sin contar con que existen más tipos de discapacidad que la visual y muchos contextos de navegación desde los cuales los PDF no serán accesibles: desde determinados dispositivos móviles y consolas, TDT, WebTV, ordenadores en los que no haya un visor de archivos PDF y el usuario no tenga permisos para instalarlo, por ejemplo un quiosco de información, o que sí tenga el software adecuado pero no soporte la versión de tu PDF, etc.


Un PDF bien hecho, lo cual implica como veremos que esté correctamente etiquetado, se puede exportar como HTML, XML, RTF, DOC y TXT.


Opciones de exportación de Adobe Acrobat 8


Mi opinión es que los ficheros RTF y DOC NO deberían ser nuestras opciones accesibles, siguen necesitando software externo para que podamos abrirlos y además no son formatos libres.


Nuestras opciones accesibles podrían ser:



  • Texto plano ASCII (.txt)

  • HTML 4.01 + CSS 1.0

  • XML


Al exportarlo como HTML te incorpora los estilos en la etiqueta style de la cabecera, las propiedades del documento como metas, te exporta correctamente las etiquetas si tienes cuidado en definir bien el Role Map (en las "Opciones" del panel Tags) en el PDF para especificar que, por ejemplo, un "Estilo 1" heredado de Word será un <H1>, de modo que después lo exporte como tal y no como <p class=”titulo1”>. Pero al final siempre debes revisarlo y corregir cosas para que sea de verdad un HTML accesible.



Por ello, personalmente prefiero como alternativa accesible la opción del XML+XSL, de esta manera separas el contenido de la presentación. Preparas una plantilla XSL versátil y accesible, que se complete con los datos del XML: un trabajo sencillo y automático con un resultado siempre 100% accesible.



Mi PDF accesible


Recomendaciones generales de usabilidad y accesibilidad que ha de cumplir un PDF


Existen tres tipos diferentes de PDF: no estructurados, estructurados y etiquetados.


Para asegurar la accesibilidad de nuestro PDF es necesario que sea etiquetado, PDF que incluye el contenido, la estructura y el orden de lectura, lo cual facilita una lectura más fiable por los lectores de pantalla, mayor adaptabilidad a distintos dispositivos de salida y una exportación a otros formatos con mejores resultados.


Pero hay que tener claro que un PDF etiquetado no asegura la accesibilidad, si etiquetas de forma incorrecta tu PDF seguirá sin ser accesible. Como muy bien explica muy bien en español la "Guía de Accesibilidad en Documentos PDF" de Inteco, el PDF tiene que cumplir una serie de recomendaciones de usabilidad y accesibilidad, muchas de las cuales son comunes a las que estamos acostumbrados a acatar en una página web:



  • Estructurar el PDF al igual que estructuramos nuestra página web. Incluir una cabecera, un pie y etiquetas estructurales: documento, página, sección, títulos, párrafos, listas, etc., que convertirán nuestro archivo en un PDF “tagged” (etiquetado), requisito previo e imprescindible para que este sea accesible.



    Paleta Tags de Adobe Acrobat



  • Verificar que el orden de lectura por defecto, según la estructura de etiquetas, tiene sentido y es coherente.

  • Al igual que preparas un mapa web o un menú en tu web, en el PDF debes incluir ayudas de navegación y organización (índice, marcadores, etc.) que permitan al usuario desplazarse por el documento mediante enlaces adecuados.

  • Especificar el lenguaje en las propiedades del documento, en la etiqueta de primer nivel y en aquellas otras etiquetas cuyo contenido esté en diferente idioma, de este modo los lectores de pantalla interpretarán correctamente los contenidos.

    El idioma del documento se especifica en la pestaña Advanced del menú File/Properties de Adobe Acrobat (aludo siempre a la versión 8 Professional):



    Modificar en el idioma del documento en Adobe Acrobat



    El lenguaje de una etiqueta se especifica desde la paleta Tags, en las propiedades de la etiqueta deseada, en el campo “Language”.



    Modificar en el idioma de un TAG de tu PDF en Adobe Acrobat

  • Todos los elementos no textuales deben incluir un texto alternativo. Este texto se incluye en las propiedades de la etiqueta en el campo “Alternate Text”. En Word se indica en Formato imagen/Web en la propiedad “Texto alternativo”.

  • Disponer suficiente contraste entre el color de fondo y el de la letra, asegurándonos de que la información esté disponible cuando el color no lo esté. Desde el Asistente de Accesibilidad de Adobe Acrobat puedes indicar “Use high contrast”.

  • Identificar los enlaces como tales y que su destino sea claro.

  • No aplicar el estilo directamente a los elementos. De igual manera que no pondríamos <b>Hola</b> en nuestro HTML, sino que especificaríamos en la CSS un estilo, tampoco en un PDF debemos cambiar directamente la apariencia del texto, sino que a una determinada etiqueta le aplicarás un determinado estilo. En este sentido es muy importante que si realizas el PDF desde un DOC, no incluyas retornos de carro para dar margen (igual que no usarías <br/> en un HTML) porque se exportarán como tags independientes. Siempre hay que hacer uso de los estilos, tanto en el DOC como en el PDF.

  • Redactar con lenguaje sencillo y claro.

  • Explicar las abreviaciones y los acrónimos.

  • Asegurar un orden de tabulación coherente. En Adobe Acrobat, en las propiedades de la página (desde la paleta Pages), selecciona la opción “Use Document Structure in Tab Order”)



    Especificar el orden de tabulación en Adobe Acrobat


Otras recomendaciones son más específicas:



  • Configurar correctamente la seguridad:
  •  

    A document author can specify that no part of an accessible PDF is to be copied, printed, extracted, commented on, or edited. This setting could interfere with a screen reader’s ability to read the document, because screen readers must be able to copy or extract the document’s text in order to convert it to speech.


    To maintain document security while allowing screen readers access to text, use one of the following settings:



    • For low-encryption-level security, select Enable Copying Of Text, Images, And Other Content in the Password Security - Settings dialog box.

    • For high-encryption-level security, select Enable Text Access For Screen Reader Devices For The Visually Impaired in the Password Security Settings dialog box.



    [En la ayuda de Adobe Acrobat 8 Professional en la sección Security/Accesibility]



  • Si nuestro PDF sólo contiene una imagen, procedente por ejemplo del escaneado de un documento textual, será necesario utilizar un procedimiento de OCR (Reconocimiento Óptico de Caracteres). Una buena opción es escanearlo con Adobe Acrobat Capture que incorpora una capa de texto accesible mediante OCR, o utilizar otro procedimiento de OCR.

  • En el caso de que el PDF incluya un formulario, en las propiedades de cada campo se debe especificar una descripción textual que indique claramente al usuario qué datos se le solicitan.


Requisito fundamental: PDF etiquetado


Como ya he comentado, para asegurar la accesibilidad de nuestro PDF es necesario que sea etiquetado


Los tags de un PDF no suponen ningún problema para aquellos que estén acostumbrados a la maquetación web: p, form, h1, h2, h3, table, tr, th, td, etc. ¿te suenan no?


En el panel de Tags (View/Navigation Panels/Tags) tendrás disponible el árbol de etiquetas de tu documento. Deberás tener especial cuidado cuando tu documento tenga tablas y columnas, para asegurar el orden lógico de lectura, etiquetándolo en bloques con sus correspondientes títulos.


¿Cómo incluyo las etiquetas al PDF?


Si tienes un PDF sin etiquetas puedes añadirlas con la opción “Add Tags to Document” del menú Advanced/Accesibility.


Si el PDF lo creas desde un HTML con el menú File/Create PDF/From Web Page de Adobe Acrobat, deberás tener cuidado de seleccionar en Setting "Create PDF Tags"



Settings de la generación de un PDF desde HMTL en Adobe Acrobat 8


Si el PDF lo creas desde Open Office Writer, la aplicación permite exportar directamente a formato PDF etiquetado y “accesible”, heredando la estructura de tu documento.


Puedes crearlo desde Microsoft Office, a través de PDFMaker, que se instala automáticamente en la Office con Adobe Acrobat 8 Professional.


Es importante configurar correctamente el PDF Marker, marcando en el menú Adobe PDF/Change Conversion Settings de Word las siguientes opciones:


Configuración de PDFMaket desde Word: Settings


También deberías seleccionar todas las opciones de la pestaña “Word” de esa misma ventana (para indicar qué elementos se exportarán al PDF) y las de la pestaña “Bookmarks” (para indicar qué marcadores se exportarán al PDF).


Como hemos ido comentando, el PDF heredará la estructura del DOC, pero la corrección del PDF resultante dependerá de lo bien hecho que esté tu documento original: documento estructurado, utilización de estilos, texto alternativo en las imágenes, etc.


Comprobar la accesibilidad del PDF



Para comprobar la accesibilidad del PDF, una vez que has aplicado lo dicho hasta ahora, deberías:



  • Utilizar la herramienta de comprobación de accesibilidad de Adobe Acrobat disponible en el menú Advanced/Accesibility/Check full. Esta comprobación de accesibilidad revisa:


    • el texto alternativo de elementos no textuales

    • si se ha especificado el idioma

    • el árbol de estructura lógica y el etiquetado

    • la codificación de caracteres

    • la descripción de los campos del formulario


  • Comprobarlo en el lector de pantalla que incorpora Adobe (Ver/Leer en voz alta) y otro lector de pantalla como JAWS.





¿Qué dicen las Pautas de Accesibilidad de la WAI 2.0?



Lo comento en el artículo "Técnicas WCAG 2.0 para 10 dudas habituales sobre accesibilidad". Apéndice I. Duda 3. En resumen, el PDF debe hacerse accesible de forma nativa como explico en este artículo y sino se debe proporcionar una alternativa accesible.

Recomiendo además los siguientes artículos:




Referencias


"Contenidos PDF en la web: Ventajas e inconvenientes" de Antonio Barranco


"Facts and Opinions About PDF Accessibility" de Joe Clark


"Accesibilidad en los documentos PDF" de Fran Tarifa

En Accesibilidad, Usabilidad y Estándares Web en referencia al artículo de Joe Clark .


"Accessibility Resource Center" de Adobe


"How to create Accessible Adobe PDF Files Booklet" de Adobe


"Creating Accessible PDF Documents with Adobe Acrobat 7.0" de Adobe

Me parece un buen colofón el esquema "PDF Accessibility Workflow" tomado de esta guía (página 20):


PDF Accessibility Workflow


"Guía breve Accesibilidad en Documentos PDF" de Inteco


Guía de Accesibilidad en Documentos PDF 6.0 y 8 de Inteco



"PDF Accesibility" en WebAIM


Flujo de trabajo para crear formularios PDF accesibles




Artículos relacionados
[16-09-09] PDF accesibles (2): metodología

Imprescindibles... (1)

80+ AJAX-Solutions For Professional Coding

40+ Tooltips Scripts With AJAX, JavaScript & CSS

Al día en AJAX mediante webéame

Ajax Examples in Action

Noticias... (3)

HP adapta su negocio de impresión a la Web 2.0

jueves 14 de junio de 2007

Tu web en la televisión (1 de 3)

Este artículo tiene tres páginas: estás en la Página 1 (Introducción y TDT).




Existen diversas posibilidades de que un usuario acabe viendo tu web en una televisión, posibilidades que desde mi punto de vista se pueden dividir en dos tipos:
Este artículo comenta todas estas posibilidades, con mayor profundidad en unos casos que en otros porque hay temas que se merecen artículos independientes.


He estado muchos días documentándome y mis objetivos han ido variando a medida que este monstruo crecía.


Finalmente, el objetivo último ha sido, además de sintetizar esta información de la manera más sencilla posible, concluir una serie de recomendaciones de accesibilidad que sirvan para todas ellas (página 3), puesto que al final todas comparten características comunes: dispositivo de salida la televisión, interacción mediante mando a distancia, etc.






1. TDT interactiva


1.1 Qué es


La Televisión Digital Terrestre (TDT) es una nueva tecnología para difundir señales de televisión, también por el aire como la analógica, que la sustituirá por completo en 2010 (el llamado apagón analógico del 3 de abril de 2010).


En marzo de 2007 la TDT tenía una penetración de mercado del 17,6% y en noviembre de 2006 una cobertura nacional del 80,45 % (Impulsa TDT).


De forma resumida, su funcionamiento es el siguiente:


[...] el sonido y las imágenes de los radiodifusores se digitalizan y convierten en bits de información que posteriormente se transmiten a través del aire desde los centros emisores. Esta señal se recibe desde las antenas de nuestras viviendas para finalmente ser convertida de nuevo en sonido e imágenes por los sintonizadores TDT (descodificadores o televisores integrados) que debemos instalar en nuestras casas.


[En Impulsa TDT]



La digitalización de la señal y el aprovechamiento del ancho de banda permite (además de una mejor calidad de la imagen y el sonido, la emisión en Dolby o en formato cine 16:9) que las televisiones puedan ofrecer nuevas funcionalidades de interactividad a través del mando a distancia del receptor:


  • EPG (Guía electrónica de programación)

  • Teletexto digital

  • Servicios interactivos: juegos, chats, votaciones

  • Subtitulado digital

  • Etc.

Hay distintos tipos de decodificadores (también llamados sintonizador digital de TDT, descodificador o decodificador TDT, STB (Set Top-Box) o “zapper” para los no interactivos) de la señal digital, cuyo uso no deja de ser una fase intermedia hasta que todas las televisiones lleven el chip descodificador integrado.

Para poder acceder a la interactividad es necesario tener un decodificador de gama alta, con el estándar europeo MHP (Multimedia Home Platform), con conexión al canal de retorno (los más comunes son Ethernet, RTC o ADSL) para enviar datos. También los hay con disco duro y con soporte para lector de Smart Cards.



Los equipos con MHP incluyen un pequeño ordenador programable con aplicaciones que se descargan on-line y que en próximas versiones incluirán persistencia. Los que incluyen lector de tarjeta chip podrán permitir servicios interactivos con el DNI electrónico. Para ello es muy importante conectar el canal de retorno a la línea telefónica, lo que rara vez se lleva a cabo.


[En "Todo es electrónico"]


 


1.2 Desarrollos TDT interactivos


Los servicios MHP se irán implantando progresivamente, según vaya progresando adecuadamente la implantación de la Televisión Digital Terrestre. Esto significa que seguramente comenzarán a ofrecerse después del "apagón analógico", el 3 de abril de 2010. Todo dependerá de la rapidez de implantación de la TDT.


[En "Pixels y Chips"]



En la actualidad, los servicios interactivos que se ofrecen por TDT son desarrollos específicos. Hoy por hoy en España, y que yo sepa, no se puede acceder a la web desde la TDT.


Desde el año pasado cada vez son más los desarrollos que se hacen para TDT.



La Agencia Tributaria ha comenzado este año a prestar ciertos servicios relacionados con la Campaña de la Renta a través de la Televisión Digital Terrestre (TDT) interactiva, como la solicitud a través de este nuevo canal del borrador de la declaración de la Renta tecleando el número de identificación fiscal (NIF) y la cantidad que aparece en la casilla 681 de la declaración del año pasado.


En noviembre de 2006 se celebró en Zaragoza el primer foro sobre Aplicaciones Interactivas en Televisión, en el cual participó el alcalde de Alcazar de San Juan (Ciudad Real), ciudad que a mediados de 2006 se convirtió en el primer municipio de España y el sur de Europa en disponer de servicios interactivos (1):


Entre ellos, destaca la posibilidad de realizar gestiones municipales, reserva de cita para el médico o consulta de servicios del ayuntamiento, y de la Junta de Comunidades de Castilla-La Mancha, banca electrónica (Caja Castilla-La Mancha), televenta o servicios sociales básicos o especializados.


[En Hispavista]


Las entidades bancarias también comienzan a ofrecer servicios financieros por TDT, por ejemplo Caja Navarra a partir de junio de este año:



[…] podrán conocer la posición de sus cuentas, consultar sus saldos y los últimos movimientos, informarse sobre los productos y servicios de Caja Navarra y bucear entre los centenares de proyectos sociales que las asociaciones sin ánimo de lucro han puesto a disposición de los clientes para ser elegidos.

[…] Para interactuar con la entidad bancaria será necesaria el alta en la banca on line o Clavenet y un decodificador de TDT con el sistema @mhp, que incorpora la tecnología necesaria para que la relación entre Caja Navarra y sus clientes sea, ahora también, televisiva.


[En "El mundo financiero"]


La Diputación de Huesca, desde octubre de 2006, también ofrece la “T-Administración”, que permite a los ciudadanos realizar sus gestiones a través de la televisión digital.



Formulario del portal de la Diputación de Huesca para TDT



Se trata de la primera aplicación nacional de gestión con la administración pública a través de la plataforma interactiva de Televisión Digital Terrestre. Cualquier usuario que disponga de un decodificador sobre el estándar MHP (Multimedia Home Platform) podrá acceder a todo el contenido del portal de la Diputación a través del mando a distancia del televisor, consultar información e incluso acceder a servicios interactivos y realizar trámites a través de la TV. […]

La navegación por la página es sumamente sencilla e intuitiva. En la parte superior izquierda aparece el menú con las secciones principales (La Diputación, La provincia, Servicios y Trámites) y que estará siempre accesible con el objetivo de facilitar la navegación a los telespectadores. En la parte inferior se reflejan los botones de colores que se asignan a cada acción: salida de la aplicación, ayuda, navegación a determinada sección y vuelta al inicio de la página.


[En Diputación de Huesca]


 


1.3 DVB-HTML


Como comentaba, hoy por hoy en España no se puede acceder a la web desde la TDT, es decir, no puedes poner, por ejemplo, http://www.google.com y acceder al buscador, sino que son siempre desarrollos específicos.


El estándar MHP (Multimedia Home Plataform) ha abierto la vía para que los proveedores de servicio puedan proporcionar aplicaciones de TV interactivas que los usuarios descargan y ejecutan en el receptor de TV digital, independientemente de su tecnología y de la red de difusión.


Las especificaciones MHP definen la arquitectura del receptor, los protocolos de transporte y señalización para los canales de difusión e interacción, y los tipos de aplicaciones que pueden ser distribuidas.



MHP 1.1 specifies the Internet Access profile, in which applications can control the basic operations of Open Internet resident clients (Web broswer, e-mail and news client).

To add, and indeed complement the DVB-J application format, MHP 1.1 defined a new optional application type: DVB-HTML

The figure below outlines the basic architecture of MHP 1.1 and the relationship between the DVB-HTML optional application type and the DVB-J application type.


[En mhp.org]


Un terminal MHP va a aceptar determinado tipo de aplicaciones en determinados lenguajes (DVB-J y DVB-HTML) y va incluir una API o conjunto de funciones que las aplicaciones pueden utilizar.


Estas aplicaciones son:


  • DVB-J (Xlet), son aplicaciones programadas en Java (se compilan), que pueden ser descargadas, lanzadas, interrumpidas y destruidas por el usuario desde su receptor de televisión. MHP permite que puedan coexistir múltiples aplicaciones en el receptor.

  • DVB-HTML (Digital Video Broadcast HyperText Markup Language) es un lenguaje declarativo que se interpreta y está basado en estándares de Internet. Se trata de páginas en formato XHTML que son presentadas por el receptor de TV al estilo de lo que realiza un navegador de Internet.



[…] is a standard for allowing digital televisions to access internet content. It is an optional part of the larger MHP1.1 standard of DVB.

The specification is based around a modularized version of XHTML 1.1, and also includes Cascading Style Sheets (CSS) 2.0, Document Object Model (DOM) 2.0, and ECMAScript (also known as JavaScript).


[En Wikipedia]



La extensión de estos documentos es .html y su cabecera:


<!DOCTYPE html PUBLIC "-//DVB//DTD XHTML DVB-HTML 1.0//EN" "http://www.dvb.org/mhp/dtd/dvbhtml-1-0.dtd">


En 2002, Nionex lanzó el primer navegador DVB-HTML del mundo para MHP (Multimedia Home Platform): Pontegra.

El proyecto STB-DVB-MHP (2004) de la Universidad de Vigo trabaja también en un navegador web para TDT, entre cuyos objetivos están los siguientes:


  • Gestión de formularios.

  • Ejecución de applets y JavaScript.

  • Permitir la integración de plug-ins.

  • Servir de aplicación soporte a documentos DVB-HTML.

  • Cumplir la norma MHP 1.1 en los puntos que afectan a los clientes de acceso a Internet.


Podemos hablar también de Ortikon Ace Browser:



ORTIKON ACE® Browser is a compact MHP-based DVB-HTML browser application (total size, zipped ~260 kB), and it runs on any STB supporting MHP-version 1.0.2 or later.

Ortikon ACE Publisher es la herramienta de creación de contenidos y Ortikon ACE Browser Emulator el emulador para PC:



ORTIKON ACE Browser Emulator is a PC application for quick, easy and efficient content production. It can be used for previewing purposes in the PC content authoring environment simultaneously with designing. The tool is a WYSIWYG application. So the DTV display screen will be exactly the same as that of the designer's PC. The content will be transferable directly from PC to DTV. With the virtual remote controller the designer tests the technical functioning and usability of the content.

[Ortokon Interactive Ltd]



Ortikon ACE Browser Emulator



En digitv.ortikon.com puedes ver páginas de ejemplo teniendo en cuenta que:

These pages are optimized for ORTIKON ACE® DVB-HTML Browser. Because DVB-HTML is the format for digital-TV they use some features not used in PC world (such as MPEG2 I-frame backgrounds), and thus the layout does not look as they were originally designed on PC. By watching these pages with PC browsers you anyhow get the idea what features our current DVB-HTML Browser support.



Opera también soporta DVB-HTML, anunciando en 2006 que:


Opera Software today announces that Telsey Telecommunications, a leading manufacturer of IP set-top boxes, has selected the Opera browser once again to provide full-featured Internet browsing on the company's WAVES set-top boxes.

[En opera.com]


Puedes ampliar información sobre DVB-HTML en las direcciones que incluyo en el apartado de referencias.


 


1.4 Consideraciones de usabilidad y accesibilidad


Me hace gracia este comentario:


[...] la potencialidad del TDT como medio para navegar por Internet se ve recortada por el hecho de que muchos contenidos no están adaptados para los televisores, por lo que no se visualizan correctamente.

[En noticiasdot.com]


... vaya, eso me suena en contextos más habituales y cotidianos...



Como todavía no se puede acceder a la web desde la TDT, no vamos a poder validar nuestra páginas en este entorno, lo mejor que podemos hacer es como siempre acatar los estándares y cumplir con las Pautas de Accesibilidad de la WAI, y te aconsejo que seguir mis conclusiones y recomendaciones finales.


Si te hayas involucrado en uno de los desarrollos específicos para TDT interactiva, evidentemente sí que podrás y deberás validar la usabilidad y accesibilidad del servicio. Pero esto ya sería motivo de un artículo diferente. Os dejo aquí unos pantallazas del portal de la Diputación de Huesca para TDT, que a mi parecer reflejan un buen hacer en este sentido.



Diputacion de Huesca en TDT: Página principal


Diputacion de Huesca en TDT: Menú desplegado


Diputacion de Huesca en TDT: Página interior



[En León Ciudad Digital]

 


Referencias


"Infraestructuras para servicios multimedia" de Telefónica


Amplia descripción de todas las tecnologías implicadas en el desarrollo de las comunicaciones multimedia. Muy recomendable.

 


"Tecnologías y actividades de estandarización para la interconexión de Home Networks" de Fundación AUNA


Descripción de tecnologías para middleware, software y pasarelas residenciales.


 


Impulsa TDT


Portal de la Asociación para la Implantación y el Desarrollo de la Televisión Digital Terrestre en España.

 


Sintonizador Digital TDT


Guía fácil divulgativa sobre la TDT.

 


mhp.org


MHP: especificaciones, foros, noticias, países donde se está adoptado, etc.


 


"MHP" en Televisión Digital


Descripción del estándar MHP.

 


Documentación de Sistemas de Imagen del GPI-RV de la Universidad de Vigo


Artículos sobre DVB, MHP, TDT, etc.

 


"Decodificadores TDT con MHP y lector de tarjeta chip" de Todo es electrónico


Artículo de marzo de 2007 sobre los distintos decodificadores. Incluye lista de modelos de TDT con MHP y tarjeta chip.

 


Sistema de Recepción Digital Multimedia


Portal del Proyecto STB-DVB-MHP del Departamento de Ingeniería Telemática de la Universidad de Vigo.

 


"DVB-HTML" de Pablo Cesar


Breve presentación de DVB-HTML en diapositivas.

 


DVB-HTML Applications


Buena introducción a DVB-HTML que incluye mención a los "triggers".

 


"DVB-HTML an optional declarative language within MHP 1.1" de Philippe Perrot


Buena introducción a DVB-HTML.

 


"Guidelines for creating DVB-HTML Content" de Ortikon


Extenso manual de DVB-HTML ejemplificado con las páginas de ejemplo de digitv.ortikon.coma

 


"Companies working with MHP" en Interactive TV Web


Listado de herramientas de autor, aplicaciones, decodificadores, servicios, etc.



 


NOTAS


(1) Aunque es curiosa la opinión de los vecinos sobre el tema.


 

 


Este artículo tiene tres páginas: estás en la Página 1 (Introducción y TDT).


Tu web en la televisión (2 de 3)

Este artículo tiene tres páginas: estás en la Página 2 (Televisión como dispositivo de salida).



2. Televisión como dispositivo de salida


2.1 Ordenador personal o portátil


Puedes utilizar tu televisión a modo de monitor conectándola a un PC o portátil.


Desde el punto de usabilidad y accesibilidad esta posibilidad no supone ninguna consideración especial, salvo advertir, como haré en las conclusiones y recomendaciones finales, que la resolución y las características de imagen de una televisión no son iguales que las de un monitor, pero esto es algo que siempre debemos tener en cuenta, puesto que nuestra web también puede ser visualizada desde muchos tipos de monitores, resoluciones, profundidad de color o dispositivos cuya resolución y calidad de imagen puede diferir de la de un monitor (teléfono móvil, una PDA, etc).


 


2.2 Media Center


Al hablar de Media Center lo habitual es hablar de Windows Media Center, por ser el más extendido, pero no es el único, se suman a la “guerra por el salón”: LinuxMCE, XBMC (Xbox Media Center), Apple TV, etc.


Windows Media Center es un sistema operativo de Microsoft que viene instalado en el PC:



El Windows Media Center está ideado especialmente para los nuevos ordenadores HTPC (Home Theater PCs). Estos tienen aspecto de componentes de un equipo de alta fidelidad o de cine en casa, pero realmente son PCs más o menos potentes camuflados en cajas de sobremesa, y que gozan habitualmente de periféricos como sintonizadores de TV, de radio, etc...

[En Duiops]


y que está pensado para el ocio y entretenimiento digital:



Windows media center es la iniciativa de Microsoft para la convergencia de todo el ocio de nuestra casa en un único dispositivo. Media center es un programa que integra el control de la televisión, imágenes, vídeo, audio, radio, etc. Sus principales fortalezas salen a la luz combinando dicho software con un dispositivo hardware diseñado para, en nuestro salón, hacer de sustitutivo de la televisión, la mini cadena, el vídeo, los álbumes de fotos, etc.

[…] Es un detalle positivo el hecho de que sea manejable con un único mando.


[En "Convergencia de dispositivos eléctricos domésticos con elementos tecnológicos y capacidades e-business" de Álvaro García y Guillermo Tejera]


Efectivamente, desde una misma pantalla se puede controlar todo, y en lugar de ratón, se usa un mando a distancia.



Mando a distancia Windows Media Center


Teclado Windows Media Center


-Mando a distancia y teclado oficiales de Windows Media Center-

 


Es el sistema que se distribuye con la mitad de los equipos informáticos que se venden en España y su público objetivo será 4 millones en 2 años y 7 millones y medio para el 2010.


El navegador por supuesto es Explorer (6 o 7 según versión XP o Vista).


Se están desarrollando servicios específicos para Windows Media Center, por ejemplo Caja Madrid:



La multinacional Microsoft y la entidad financiera Caja Madrid han puesto en marcha un portal de servicios bancarios a través de la televisión pionero en el mundo, que permitirá a los clientes de la entidad financiera acceder, desde sus hogares con total seguridad y a través de un mando a distancia, a un completo menú para realizar las operaciones más habituales como consulta de saldo y tarjetas, extracto de movimientos, recarga de teléfonos móviles y transferencias, entre otros servicios.

Gracias a la facilidad de uso y la alta seguridad que proporciona el sistema operativo Windows Media Center, Caja Madrid amplía la oferta multicanal para sus clientes eliminando la complejidad añadida, sin contraseñas ni nombres de usuario adicionales, e integrándola con los otros servicios de Oficinas, Banca Telefónica, Banca por Internet, Banca a través del Móvil, Cajeros y Comercios.



[En "Microsoft y Caja Madrid crean el primer servicio bancario a través de la televisión del mundo" en cibersur.com]


 


2.3 Consolas


El tema de las consolas se merece un artículo aparte, sólo comentar brevemente en relación con el tema que nos ocupa:


 


Play Station de Sony


Tanto con PS2 como con PS3 se puede navegar por Internet.


El User-Agent que las identifica es: User-Agent Mozilla/4.00 [en] (PS2-PTV 1.1) Interactor 2.2 y Mozilla/4.0 (PS3 (PlayStation 3); 1.00)


Aunque hay que tener en cuenta:


"The PlayStation 3 uses a version of the NetFront browser by Access Co. as its internal web browser. It is the same browser used in the PSP (Sony-branded NetFront 2.81) with the same interface, menus and virtual keyboard. Its user agent string is cloaked, falsely reporting as Mozilla/5.0 (PLAYSTATION 3; 1.00)."

[En Wikipedia]



En "Playstation 3 Browser Specs" en Design 215 podemos ver resumidos los diferentes problemas de este navegador:

  • Framesets and iframes are not supported. The browser will attempt to open some framesets in separate windows but the results are less than desirable. This is bad news for people who use hidden iframes for their Web 2.0 apps.

  • CSS2 seems well supported and Standards compliant pages look good, especially if they are XHTML 1.0.

  • Javascript is somewhat supported but there doesn't seem to be any AJAX support.

  • Certain events are missing (as they would be on mobile devices) like "onkeydown" and so on.

  • Using "for(x in y){...}" to loop through the properties of a Javascript object doesn't work but you can test for the existence of individual properties.

  • Dynamically loading external Javascript files after the page has loaded doesn't seem to work. More bad news for Web 2.0 apps.

  • When using the on-screen keypad, the browser will add a space after each word. It does this on password fields as well, which can cause a bit of frustration if you don't remove the extra space at the end before you try to log in. I discovered this trying to log in to Gmail.


Múltiples ventanas en el navegador de PS3



Sin embargo, al contrario que con otros dispositivos, se pueden abrir diferentes ventanas.



Si quieres ampliar información sobre el navegador puedes consultar la Guía de usuario que incluye muchas imágenes; o bien ver este vídeo de youtube.com acerca de la navegación web con PS3.




 


PSP (PlayStation Portatil) de Sony


Puedes utilizar la PSP para conectarte a Internet o bien conectarte mediante la PS3 y navegar desde la televisión.


El User-Agent que la identifica es: User-Agent Mozilla/4.0 (PSP (PlayStation Portable); 2.00


Pantalla de PSP conectando a Internet


[En el blog de Fon]

Como la PSP usa un formato 16:9 es muy probable que no veas las páginas como sueles hacerlo con tu PC, por ello:



Para solucionar esto la PSP tiene la opción de cambiar el modo de visualización de las WEBs para ello pulsa Triángulo cuando estés navegando, accede al menú Ver, y podrás elegir entre tres modos.

1 – Normal: No hace ajustes, así que para ver toda la página tendrás que desplazarte continuamente

2 – Autoajuste: Encaja el ancho de la página a la pantalla de la PSP como si fuera en el PC

3 – Ajuste inteligente: Reorganiza la página para que se muestre primero el texto y luego las imágenes



[En Guías Trucos y Juegos PSP]


 


Nintendo Wii


Incluye Opera 9 para navegar por Internet, el User-Agent que la identifica es: User-Agent Opera/9.00 (Nintendo Wii; U; ; 1038-58; Wii Shop Channel/1.0; en)


[...] desde Nintendo se ha asegurado que se va a apurar al máximo el control de la navegación con el mando inalámbrico de Wii, que mediante giroscopios y un puerto infrarrojo permite situar un puntero en la pantalla y desplazarlo cómodamente.

[En "Consolas de videojuegos para navegar Internet" de Federico Guzman

El navegador usa una pantalla virtual de 800 píxeles de ancho y una altura entre 376 y 660 píxeles, sacando barras de scroll es caso de necesitarlas. También se puede hacer zoom en las páginas.


Si quieres conocer todos los detalle del Opera 9 de Nintendo Wii, puedes leer "Making Wii-friendly pages" de Mark 'Tarquin'.


Los principales problemas que se encuentran sus usuarios al navegar son:


  • las webs son difíciles de ver con el zoom por defecto

  • en las páginas diseñadas para visualizarse con una resolución superior a 800 píxeles tienes que ir escrolando de lado a lado

  • el tamaño de fuente con el que se trabaja para su visualización en un monitor no se renderizan bien en la pantalla de la televisión


Como curiosidad, existe un plugin (WordPress Wii Edition Plugin) que reconoce que accedes mediante la Wii y renderiza automáticamente tu blog a una versión optimizada: con los colores de la Wii y a un tamaño de fuente adecuado para la visualizarse desde la televisión.


Por supuesto no es necesario que nadie se instale un plugin para ver bien nuestra web, como explicaré en las conclusiones, bastará con que preparemos una CSS especial para la visualización de nuestras páginas desde la televisión.



 


xBox 360 de Microsoft


Cuenta con un buen servicio en línea, pero no con un navegador web.



 


Referencias



Windows Vista Media Center

Presentación de Windows Vista Media Center en el portal de Windows.

Windows XP Media Center

Presentación de Windows XP Media Center en el portal de Windows.

"Windows XP Media Center Edition 2005" en casadomo.com

Presentación divulgativa de Windows XP Media Center Edition 2005.

Apple TV

Web oficial de Apple TV.

"Consolas de videojuegos para navegar Internet" de Federico Guzmán

El artículo está muy bien pero hay que tener en cuenta que es de junio de 2006.

Playstation 3 User's Guide

Web oficial del Internet Browser de PS3.

"Playstation 3 Browser Specs" Design 215

Descripción de las características del navegador de la PS3 y resumen de sus principales problemas.

"PS3 Web Browser" en YouTube.com

Vídeo acerca de la navegación web en PS3.


PlayStation 3

Entrada muy completa en la Wikipedia.

"Web design guide for Opera Browser on Wii" en wiinintendo.net

Artículo acerca de cómo diseñar para Nintendo Wii.


Making Wii-friendly pages

El mejor artículo sobre las particularidad de la navegación web en Nintendo Wii.


Wii Opera browser is OUT!

Características de Opera 9 para Nintendo Wii.


 


Este artículo tiene tres páginas: estás en la Página 2 (Televisión como dispositivo de salida).


Tu web en la televisión (3 de 3)

Este artículo tiene tres páginas: estás en la Página 3 (WebTV y Conclusiones y recomendaciones finales).



2.4 WebTV


2.4.1 Qué es


WebTV es un dispositivo que permite navegar por Internet mediante un receptor de televisión y una línea telefónica.


La primera empresa en entregar este servicio fue WEBTV Networks Inc. (cuyo nombre original fue Artemis). Ésta fue fundada en 1995 por Steve Perlman, Bruce Leak y Phil Goldman, quienes al año siguiente lograron lanzar al mercado la primera máquina que permitía al usuario navegar por Internet [...] además, ofrecía la capacidad de ver televisión en un solo equipo, sin necesidad de añadidos especiales.

[En Wikipedia]


En 1997 Microsoft compró WebTV. En 1998 tenía medio millón de usuarios. En 2001 lo rebautizó con su actual nombre: MSN TV, llegando al millón de suscriptores, que fueron disminuyendo en los años posteriores. En 2004 presentó MSN TV2, haciendo una campaña de promoción orientada a los usuarios sin PC en sus domicilios.


Esta tecnología se encuentra disponible sólo en Estados Unidos y posee dos modos de conexión a Internet, ya sea por banda ancha o por módem.


[Si te interesa su historia, puedes consultarla en la Wikipedia]


En la web oficial de MSN TV se puede ver como el paquete de instalación incluye teclado wireless y mando a distancia (no tiene ratón).



Paquete de instalación de WebTV


En la actualidad, el sistema operativo es Windows CE, puede contener RealAudio y Real Video y soporta imágenes en formato JPEG, GIF, BMP, PNG (puedes consultar todas las características técnicas en su web oficial.


 


2.4.2 TV browser


El primer dispositivo de WebTV se basó en el navegador de Internet Spyglass de Mosaic. Desde la compra de Microsoft se basó en Internet Explorer.


En MSN-TV (classic) TV Browser está basado en Explorer 4 y desde 2004 para MSN-TV2 en Explorer 6 y compatible con Netscape Navigator (su versión más reciente es de 2006).


Hablaré de la versión Classic (mejor probar siempre en la versión más vieja). Destacaría las siguientes particularidades de este navegador (se pueden consultar todas en su web para desarrolladores).


  • Soporta “casi” HTML 4.0, casi porque no soporta: colgroup, col, fieldset, legend, optgroup, tbody, tfoot, thead. Además incluyen nuevos atributos y etiquetas propietarias (como sidebar).

  • Sólo admite una ventana y no puede presentar los frames como estamos acostumbrados, sino que los combina en una tabla con resultados “no previsibles”.

  • Admite CSS1 y algunas propiedades de posicionamiento definidas en CSS2.

  • La implemetación Javascript de TV Browser (JellyScript) “casi” soporta Javascript 1.3. No soporta document.write y los eventos pueden ser sólo disparados por los elementos HTML

  • No admite Java o controles ActiveX, ni otras aplicaciones que requieran plugins o aplicaciones externas como PDF.

Por otro lado, la página web puede interactuar con la televisión de modo que, por ejemplo, desde un enlace puedes ir a ver la televisión, o ponerla como fondo de un elemento, etc.


El User-Agent que lo identifica es: Mozilla/4.0 WebTV/2.6 (compatible; MSIE 4.0)



 


2.4.3 Principales problemas


Los principales problemas que se encuentran los usuarios de WebTV al navegar por la web son los mismos que ya hemos ido viendo en otros dispositivos:


Textos demasiado pequeños en las imágenes


Como no existe el scroll horizontal, el navegador redimensiona horizontalmente las páginas (algo parecido a lo pasaba en AOL Avant, el “paquito” con el que los que sean tan viejos como yo se habrán peleado).


Por esta razón, los gráficos con textos pequeños serán ilegibles, recomendándose un mínimo de 16pt.


Problemas en la disposición de los elementos


El TV Browser escala los textos a 18 pt Helvetica, en consecuencia, si el texto se encuentra en columnas estrechas será difícil de leer. Un desarrollo web siempre debe prever que el usuario pueda seleccionar en el navegador la visualización de las páginas con un tamaño de fuente mayor, por tanto, la única diferencia en este dispositivo es que el usuario “siempre” va a elegir el tamaño más grande de fuente.


Utilización de colores inadecuados para su visualización por televisión



 


2.4.3 Revisemos con MSN TV Viewer


MSN TV Viewer es un emulador de WebTV que nos permite revisar nuestros desarrollos en este dispositivo.

Es gratuito y te lo puedes descargar de su web para desarrolladores.

En el emulador tienes dos pantallas, una donde visualizas las páginas (puedes poner una URL o revisar páginas en local) y otra donde te lista los errores que localiza. También muestra un mando a distancia para que, junto con el teclado, puedas navegar por la página.


Así se ve la página principal de Google:



Google en MSN TV Viewer


Independientemente de que el código de la página de Google me pone los pelos de punta, hay que reconocer que se ve relativamente bien, con el foco en el primer elemento y todo el contenido accesible y legible. Después de aplicarle una CSS para TV, con poquitos cambios, la página se vio perfecta:


Google en MSN TV Viewer tras revisión


Otro ejemplo que he cogido, por estar hablando de televisiones, es la de RTVE:


Portal de RTVE en Explorer 6
-Página principal de RTVE en Explorer 6-



Así se ve la página principal de RTVE en MSN TV Viewer:


RTVE en MSN TV Viewer. Comienzo de la página principal



RTVE en MSN TV Viewer. Contenido de la página principal


En esta web el resultado es más desastroso. Se pueden ver claramente ejemplificados varios problemas comunes: los gráficos con textos (los textos de los menús de toda la cabecera son imágenes) se vuelven ilegibles; y los textos desaparecen de pantalla o pasan a estar en columnas demasiado estrechas, efecto que se puede evitar usando una CSS específica que redimensione los contenidos a la resolución de pantalla de la televisión.



Conclusiones y recomendaciones finales



No tenemos ratón sino mando a distancia


Al maquetar una página siempre debemos recordar que hay usuarios que no disponen de ratón, pero no está de más recordarlo: siempre se ha de comprobar el funcionamiento de una aplicación sin ratón, verificando que se puede interactuar fácilmente con una sola mano.


No se deben utilizar eventos asociados al ratón, hay que comprobar que el tabulador se comporta adecuadamente accediendo a todos los elementos necesarios en el orden adecuado, etc.


También son muy útiles los mecanismos para saltar la navegación y acceder directamente al contenido.


 



CSS específica


Para poder personalizar los colores, el tamaño de fuente, el ancho de nuestra página o la disposición de sus elementos para su correcta visualización desde la televisión, será necesario tener una CSS específica para este dispositivo, de igual modo que creamos CSS específicas para dispositivos móviles o para la impresión.


<LINK REL='stylesheet' media=’TV’ TYPE='text/css' HREF='tvcss.css'>


Este código se situa en el head de la página para que cargue la CSS "tvcss.css" sólo en este dispositivo de salida.


 



Colores: paleta para televisión


La resolución y las características en general de una televisión difieren de las de un monitor y, a menudo, los colores que utilizamos no son “cómodos” para visualizarse en la televisión. En especial hay que huir de las siguientes combinaciones de color de fondo-color de letra:

Combinaciónd de colores que se han de evitar

On most television displays, the following colors will bleed into each other - most especially the red - and will shimmer and flicker. En devfiles.myopera.com


En este sentido es interesante la herramienta WebTV Color Picker que permite revisar tu paleta de colores para televisión.


Por tanto, al crear nuestra CSS específica para televisión, deberemos crear una combinación de colores adecuada para este dispositivo.


 



Imprescindible diseño líquido o diseño elástico


Uno de los problemas recurrentes que hemos ido viendo son problemas relacionados con el scroll, la resolución y la redimensión o reajustes de la página que modifican la disposicion de los elementos.


Siempre hemos de tener en cuenta que el usuario puede tener una resolución de pantalla o un dispositivo de salida diferente del nuestro (un móvil, una PDA, una consola, etc.), por ello resulta imprescindible:



  • cumplir con las Pautas de Accesibilidad de la WAI

  • huir de la maquetación por tablas

  • no idear diseños fijos sino un "diseño líquido" (que se adapte a la resolución del dispositivo) o bien un "diseño elástico", en el cual el ancho de elementos en pantalla depende del tamaño de letra configurado por el usuario en su navegador (Luis Villa), pero en cualquier caso, ejecutado mediante unidades relativas y mediante una maquetación con DIVs.



Como dice Luis Villa: Diseñar para la web requiere una mentalidad flexible capaz de adaptarse a posibilidades de presentación diferentes y a un cierto “descontrol”.


Resoluciones según tipo de televisión
Resoluciones de TV, de la Wikipedia



 


Tipo y tamaño de fuente de los textos


Los gráficos o imágenes con textos pequeños pueden volverse ilegibles en la televisión. Nunca es recomendable que utilices imágenes para contenido textual, pero en caso de ser necesario, su texto deberá tener un mínimo de 16pt.

Por otro lado, los textos deberán tener un tamaño adecuado para visualizarse por televisión, se recomienda el equivalente a unos 18 pt. No está de más recordar que no se deben utilizar tamaños de letra fijos sino siempre relativos.


También hay que tener en cuenta que no dispondremos de las mismas fuentes que en el ordenador. Por ejemplo, Nintendo Wii solo dispone de dos fuentes: una Sans-Serif "Wii NTLG PGothic" y una monoespaciada "Wii NTLG Gothic".


Nuestra CSS específica deberá tener en cuenta todos estos factores.


 



Respetar los estándares


Se recomienda respetar el estándar XHTML Basic, recomendación de la W3C pensada para mejorar el acceso a través de dispositivos alternativos, como dispositivos móviles o televisión.

[...] si partimos de que las características de HTML 4 (marcos, tablas avanzadas, un grupo fijo de atributos manejadores de eventos, etc.) fueron desarrolladas para un cliente del tipo computadora de escritorio, éstas han probado ser inapropiadas para la mayoría de dispositivos distintos.

["XHTML Basic" en usabilidadweb.com.ar]



Si necesitas una introducción sobre XHTML Basic puedes consultar "El XHMTL" de Juan Luis Lara de las IV Jornadas del Sidar]


En cualquier caso mejor XHTML que HTML, y recuerda que la mayoría de los navegadores para la televisión no soportan frames ni ventanas emergentes, ni muchas etiquetas o atributos como he ido indicando.


 


Reconocer el dispositivo


Es muy útil conocer en qué dispositivo nos encontramos. Desde Javascript podremos saberlo preguntando por el appName, sólo necesitamos conocer el User-Agent, que he ido indicando en cada apartado (y que puede variar en función de la versión o el idioma). Por ejemplo para WebTV:

if(navigator.appName.indexOf("WebTV")!=-1) //WebTV detected



Puede ser muy útil en este sentido, para hacer pruebas, la extensión para Firefox User-agent Switcher, que permite cambiar el User-Agent con que se identifica Firefox.

 


Revisar: aprovechemos los emuladores


He ido nombrando distintos emuladores en el artículo (MSN TV Viewer, ORTIKON ACE Browser Emulator, etc.) No hay excusa para no revisar.



 


Formatos no soportados


No siempre se soporta Flash, menos aun ficheros PDF o incluso determinados formatos de imágenes.


Recuerda que, como deberías hacer siempre, tendrás que proporcionar alternativas accesibles para estos ficheros u otros ficheros que necesiten aplicaciones externas.



 


Javascript


Aunque es habitual que se soporte Javascript e incluso AJAX, hay excepciones y comportamientos anómalos, así que, como siempre, se deberá comprobar que la aplicación funciona correctamente sin Javascript y proporcionar las alternativas oportunas.



 


Pautas de Accesibilidad de la WAI


Las Pautas de Accesibilidad de la WAI aseguran la accesibilidad de los contenidos a todos los usuarios desde todos los contextos de navegación, conseguir al menos un nivel de adecuación doble-A es imprescindible para asegurar la correcta visualización e interacción con tus páginas.




 


 


Referencias



MSN TV


Web oficial de WebTV.


MSN TV (developers)


Web oficial para desarrolladores de WebTV.


WebTV


En la Wikipedia viene una amplia entrada con casi todo lo que debes saber sobre WebTV.


"WebTV lleva Internet al salón de su casa" en el Diario del navegante


Un artículo para el recuerdo, es de noviembre de 1997...


"Developing TV Applications using Internet Technology" en W3C


Artículo del año 2000 del "W3C Workshop on Web Device Independent Authoring".


 


Este artículo tiene tres páginas: estás en la Página 3 (WebTV y Conclusiones y recomendaciones finales).


miércoles 13 de junio de 2007

Noticias ... (2)

Claves en vena
En Japón ya se usa el patrón de la palma como identificador, que probará "la Caixa" ...

Jakob Nielsen critica que con la Web 2.0 se ha dejado de lado al diseño

 

Noticias... (1)

Apple lanza versión para Windows de su explorador de Internet Safari

Safari para Windows, reventado en dos horas

 


 

viernes 8 de junio de 2007

Sabías que ... (2)

... existe una extensión para Firefox llamada User-Agent Switcher?

Permite cambiar el User-Agent con que se identifica Firefox y resulta muy útil para realizar pruebas.

Sabías que ... (1)

... existe una forma rápida y cómoda de aumentar o disminuir el tamaño de letra del navegador?

Pulsa "control+rueda del ratón".

Entrevista para el Periódico de Aragón

Daniel Torres Burriel quiso saber algo más de mí: Entrevista en el Periódico de Aragón