RWM 1 - Datos.gob.es

Requisitos para la web móvil
datos.gob.es
En colaboración con
Las opiniones recogidas en este documento no se
corresponden, necesariamente, con las de ninguno
de los organismos públicos participantes en esta
iniciativa.
Contenidos
1
BUENAS PRÁCTICAS PARA LA WEB MÓVIL ........................................................... 2
1.1
2
3
Objetivo ................................................................................................................................. 2
REFERENCIA TÉCNICA ............................................................................................. 2
2.1
Web única ............................................................................................................................. 3
2.2
Buenas prácticas para la web móvil ...................................................................................... 3
REQUISITOS PARA LA WEB MÓVIL ......................................................................... 5
3.1
Diseñar para la Web única .................................................................................................... 6
3.2
Utilizar los estándares Web .................................................................................................. 7
3.3
Evitar los riesgos conocidos .................................................................................................. 8
3.4
Recordar las limitaciones ...................................................................................................... 9
3.5
Optimizar la navegación ...................................................................................................... 10
3.6
Comprobar gráficos y colores ............................................................................................. 12
3.7
Minimizar ............................................................................................................................. 13
3.8
Economizar el uso de la red ................................................................................................ 14
3.9
Facilitar la entrada de datos ................................................................................................ 15
3.10 Considerar el uso real de la Web ........................................................................................ 16
1
1 BUENAS PRÁCTICAS PARA LA WEB MÓVIL
Al hablar de Web móvil se hace referencia a la Web de la que una persona puede extraer
información de forma independiente del lugar en el que se encuentre, del contexto en el que
haga el acceso y del dispositivo que utilice para ello.
La demanda creciente por parte de los usuarios de la disponibilidad de la Web no siempre es
respondida de forma eficaz por el mercado, pues actualmente, a pesar de que la oferta de
dispositivos móviles está en clara expansión, la mayor parte de estos poseen desventajas frente a
los equipos tradicionales de escritorio. A consecuencia de esta situación, la experiencia de
usuario en el acceso a la web suele resultar pobre y en general poco satisfactoria.
1.1 Objetivo
Si el contenido se adapta a dispositivos móviles los usuarios podrán acceder a la información
independientemente del dispositivo usado y desde cualquier lugar.
Existen importantes diferencias en el tipo de contenido que pueden manejar los dispositivos
móviles, derivadas de la cantidad de información que pueden manejar y mostrar de forma
eficiente (capacidad de descarga y visualización limitada), las capacidades técnicas de estos
dispositivos (pantallas pequeñas, falta de soporte de algunas tecnologías) y el contexto en el cual
el usuario recibe el contenido (en la calle, en transportes públicos, etc.).
En este documento se recogen los requisitos de independencia de dispositivo y adaptación a la
Web Móvil que deberá cumplir la plataforma para cumplir con los requisitos establecidos.
Estos requisitos son complementarios a los establecidos en las Guías adicionales de
Recomendaciones de Carácter General sobre estándares y Requisitos de Accesibilidad a los
Contenidos.
2 REFERENCIA TÉCNICA
Para resolver estos problemas de interoperabilidad y usabilidad relacionados con los dispositivos
móviles el W3C ha puesto en marcha la Iniciativa de Web Móvil1, cuyo trabajo se centra
principalmente en dos áreas: generación de buenas prácticas y descripción de dispositivos
móviles.
El Grupo de Trabajo de Buenas Prácticas en Web Móvil fue creado para desarrollar pautas,
puntos de verificación y buenas prácticas con el objetivo de ayudar a los proveedores de
contenido a desarrollar contenido Web que funcione correctamente en dispositivos móviles y
hacer posible uno de los objetivos principales del consorcio: la Web única.
Buenas Prácticas para la Web Móvil:
http://www.w3.org/TR/mobile-bp/
1
The Web and Mobile Devices: http://www.w3.org/Mobile/
2
El Grupo de Trabajo de Descripción de Dispositivo guía el desarrollo de mecanismos de
descripción de dispositivos, es decir, bases de datos de descripciones que los desarrolladores de
contenido podrán utilizar para adaptar los contenidos a los diferentes dispositivos.
La adaptación de los contenidos a la Web Móvil puede alcanzarse también, en vez de mediante
diferentes versiones del portal adaptadas a los diferentes dispositivos de acceso, a través de
aplicaciones que hagan la adaptación del contenido existente de forma dinámica según las
necesidades del usuario.
2.1 Web única
El concepto de Web única (One Web) surge como punto de partida para la Web móvil y su
intención es la de ofrecer contenidos, funcionalidades y servicios de forma independiente al
dispositivo que se esté utilizando en el acceso. Un mismo contenido es ofrecido a las personas
que lo soliciten independientemente de que el acceso lo realicen desde un ordenador de
sobremesa o desde un teléfono móvil.
No obstante, la Web única no es un concepto rígido que impida que haya variaciones en
diferentes entornos de acceso. Los dispositivos pueden presentar determinadas características
que en unos casos pueden limitar (por ejemplo, soporte para determinadas tecnologías) y en
otros enriquecer (pantallas táctiles, tecnologías de localización, etc.) los contenidos y
funcionalidades accesibles desde la web. Adaptar los contenidos sorteando las limitaciones y
aprovechando la potencialidad de determinadas características permitirá mejorar la
experiencia de uso de la cada vez más extendida web móvil.
Desde el punto de vista de la adaptación de los contenidos a la web móvil, existen varias
alternativas, si bien, las más recomendables tienen en común el llevar implícito el
reconocimiento de las características del dispositivo en el que se van a mostrar.
2.2 Buenas prácticas para la web móvil
El conjunto de buenas prácticas para la web móvil se plantea a partir de las siguientes premisas:
 La web móvil presenta problemas de presentación a causa de las limitadas capacidades
de los dispositivos (dimensión de pantalla, soporte para estilos, etc.)
 La entrada de datos es un factor limitante que dificulta el uso de la web en los
dispositivos móviles
 El consumo de ancho de banda tiene un coste, además de incidir de forma directa sobre
los tiempos de carga de las páginas
 Los terminales móviles poseen determinadas limitaciones que pueden interferir en la
forma en que se van a ofrecer los contenidos de la web
 No obstante, los terminales móviles también poseen capacidades que pueden suponer
una mejora en la experiencia de uso por parte de los usuarios
3
1.1.1 Consideraciones previas
Existen también una serie de consideraciones previas que debemos asumir como situación de
partida para el objetivo que perseguimos:
 El objetivo es la Web única. El conjunto de buenas prácticas persigue conseguir que una
misma web cubra las necesidades de los usuarios/as independientemente del dispositivo
desde el que se conecten (equipos de escritorio, portátiles, terminales móviles, etc).
 Buscar la mejor experiencia de usuario/a. El usuario/a que accede a la web, lo hace con
un objetivo claro, cubrir una necesidad (obtener información, solicitar un servicio, etc.). El
sitio web al que acceda para ello ha de ofrecerle la posibilidad de satisfacer dicha
necesidad, y ha de hacerlo de la forma que le resulte satisfactoria (previniendo que se
cometan errores, evitando contenidos innecesarios, facilitando la navegación relevante,
etc.).
Para ello, se habrá de diferenciar entre los distintos tipos de acceso que tiene la web:
 Uso repetitivo. Es el que se realiza con frecuencia para acceder periódicamente a
la misma información.
 Uso indiferente. Tipo de uso que carece de un objetivo claro en la navegación.
 Uso urgente. Es el que se da cuando se requiere de información puntual en el
momento.
 Partir de un contexto de envío por defecto. Teniendo en cuenta que existe una amplia
variedad de dispositivos móviles, es importante considerar que también existirá una amplia
variedad de características técnicas y de capacidades. No todos los dispositivos accederán
a los contenidos de la misma manera, e incluso, no todos podrán acceder a todos los
contenidos y/o funcionalidades. Por este motivo, es necesario establecer un umbral de
características técnicas en la web que permitan garantizar el acceso desde los dispositivos
menos capaces (en términos de formatos de imagen admitidos, soporte para estándares,
etc.).
El contexto de envío mínimo por defecto es:
◦
◦
◦
◦
◦
◦
Ancho de pantalla usable: 120px
Marcado: XHTML Basic 1.1 (application/xhtml+xml)
Codificación: UTF-8
Imágenes: JPEG, GIF
Peso del documento: 20KB
Hojas de estilo: CSS Nivel 1, con soporte de @media para handheld y all de CSS
Nivel 2
◦ HTTP: 1.0 o 1.1
◦ Sin soporte de lenguajes de script por parte del cliente
4
3 REQUISITOS PARA LA WEB MÓVIL
Las buenas prácticas se pueden clasificar en función del ámbito que poseen (comportamiento,
navegación y enlaces, layout y contenido, definición de página y entrada de datos por parte del
usuario), si bien, también se clasifican en base a un conjunto de principios generales:
1) Diseñar para una Web única. Al diseñar el contenido y la funcionalidad teniendo en cuenta
los diferentes dispositivos que podrán utilizarse en su acceso, se reducen costes, siendo más
flexible el conjunto y cubriendo las necesidades de un mayor número de usuarios/as.
2) Utilizar los Estándares Web. En un mercado tan fragmentado y diverso como el de los
dispositivos y navegadores, el uso de estándares es la mejor garantía de interoperabilidad
3) Evitar los riesgos conocidos. Un diseño bien planificado reduce problemas de usabilidad
causados por pantallas y teclados pequeños, o por otras características de los dispositivos
móviles
4) Recordar las limitaciones. Cuando se elige una tecnología Web concreta, hay que tener en
cuenta que los dispositivos móviles pueden tener limitaciones en su soporte o diferencias en la
interpretación la misma.
5) Optimizar la navegación. Simplificando la navegación y reduciendo la necesidad de uso del
teclado, se mejora la experiencia de uso al ser factores limitantes cuando se utilizan pantallas y
teclados de reducidas dimensiones, o cuando se dispone de un ancho de banda limitado.
6) Comprobar gráficos y colores. Las imágenes, los colores y el estilo destacan el contenido y
pueden facilitar su comprensión. No obstante, el bajo contraste de algunas pantallas, así como
las condiciones de iluminación en las que se realiza el acceso móvil, pueden dificultar el
acceso visual a los contenidos problemas de compatibilidad con algunos formatos.
7) Minimizar. La reducción del tamaño del sitio web repercute positivamente en la experiencia de
usuario al suponer un ahorro de tiempo en la descarga de los contenidos.
8) Economizar el uso de la red. Algunas funciones de los protocolos web pueden mejorar la
experiencia de uso al reducir los retrasos y los tiempos de espera en la red
9) Facilitar la entrada de datos. En los dispositivos móviles, el uso del teclado y demás métodos
de introducción de datos puede resultar tedioso para el usuario. Es por esto necesario que el
diseño sea eficaz, permitiendo minimizar su utilización, facilitando el acceso a los contenidos y
mejorando la experiencia de uso.
10) Considerar el uso real de la web. La información ha de estar suficientemente sintetizada y
optimizada, dado que los usuarios de la Web móvil suelen realizar el acceso en situaciones en
las que se dispone de poco tiempo o en las que existen distracciones externas.
A continuación se detallan los requisitos específicos para cada uno de los principios, así como las
referencias correspondientes al estándar de referencia:
5
3.1 Diseñar para la Web única
RWM 1 - Mantener la consistencia temática del recurso identificado por una URI
5.1.1 Thematic Consistency of Resource Identified by a URI: http://www.w3.org/TR/mobile-bp/#tc
El acceso al contenido debe ser posible de forma independiente de las capacidades o del
mecanismo de acceso del dispositivo que se utilice, de tal manera que no exista dependencia
respecto a una familia de dispositivos concreta. El acceso a una misma URI debe ser
consistente desde cualquier dispositivo.
RWM 2 - Aprovechar las características de los dispositivos
5.1.2 Exploit Device Capabilities: http://www.w3.org/TR/mobile-bp/#lcd
La necesidad de que el sitio web sea tal que permita el acceso a dispositivos con características
limitadas no implica que no se pueda enriquecer para aprovechar las características de los
dispositivos más avanzados. Siempre que sea apropiado, se debe facilitar el contenido y la
funcionalidad adaptada al dispositivo para proporcionar una experiencia de uso satisfactoria en los
dispositivos más avanzados.
Ejemplos:
 Enlace activo para llamada telefónica
 Enlaces que se asocien a funcionalidades propias del dispositivo o a aplicaciones
instaladas.
 Ubicación actual
 etc.
RWM 3 - Adaptarse a las limitaciones de los dispositivos
5.1.3 Work around Deficient Implementations: http://www.w3.org/TR/mobile-bp/#d0e704
La existencia de múltiples dispositivos lleva implícita la existencia de diferencias en la
interpretación que hacen los navegadores de determinadas características del sitio. Dado que no
resulta sencillo el corregir las diferentes formas de interpretar contenidos, resulta indispensable
adaptarlos para que resulten igualmente accesibles (o funcionales).
Recomendación: dado que generalmente las deficiencias en interpretación suelen ocurrir sobre
elementos que incluyen los sitios web para la mejora de la experiencia de usuario (por ejemplo, el
uso de javascript), la solución recomendable pasa por reconocer los dispositivos que no las
soportan y eliminarla en ellos, manteniéndola en aquellos que si la soporten (aprovechando así
las características de los dispositivos).
Para que esto sea posible es necesario seguir las recomendaciones de carácter general en
cuanto a scripting (ver documento PLANCISP-RCG-01)
RWM 4 - Realización de test
5.1.4 Testing: http://www.w3.org/TR/mobile-bp/#test
6
Se deben realizar pruebas de acceso al sitio web desde múltiples navegadores y desde
diferentes dispositivos. Estas pruebas se pueden y deben llevar a cabo tanto en dispositivos
móviles como en emuladores creados para tal fin.
3.2 Utilizar los estándares Web
RWM 5 - Código válido
5.4.7 Valid Markup: http://www.w3.org/TR/mobile-bp/#d0e1584
Se deben crear sitios web acordes a las gramáticas formales publicadas, lo cual previene
resultados impredecibles (tanto en funcionalidad, como en contenidos y aspecto).
RWM 6 - Tipo de contenido
5.4.11 Content Types: http://www.w3.org/TR/mobile-bp/#d0e1770
Se debe procurar enviar el contenido en un formato que sea soportado por el dispositivo y,
siempre que sea posible, se debería enviar el contenido en el formato preferido por este. Para
ello se puede analizar la petición que hace el navegador, enviando el contenido de forma acorde
con esta e indicando el tipo y codificación en las cabeceras HTTP de la respuesta.
Recomendación: En caso de duda acerca del formato a utilizar, se recomienda usar XHTML
servido como application/xhtml+xml
RWM 7 - Codificación de caracteres
5.4.12 Character Encoding: http://www.w3.org/TR/mobile-bp/#d0e1821
El contenido no debería ser enviado al dispositivo en un formato que no sepa utilizar. Para ello se
ha de asegurar que este está codificado en un juego de caracteres soportado, el cual ha de
estar indicado en la cabecera HTTP Content-Type.
La identificación de la codificación soportada por el dispositivo se puede extraer del propio
dispositivo o a partir de la cabecera HTTP Accept-Charset
RWM 8 - Hojas de estilo
5.4.9 Style Sheets: http://www.w3.org/TR/mobile-bp/#style
Toda la información que se utilice para controlar la disposición y presentación de los contenidos
ha de incluirse mediante técnicas de CSS. Estas se relacionarán a través de hojas de estilo
enlazadas, el uso del elemento STYLE incluido en la cabecera de los documentos y/o el uso de
los atributos style.
Recomendación: si bien para la web de escritorio se considera recomendable incluir los estilos
mediante hojas de estilo enlazadas, para la versión móvil se recomienda incluirlos
preferentemente mediante el elemento STYLE. Para evitar la necesidad de implementar ambos
estados por separado sobre una misma web, se recomienda utilizar mecanismos que realicen
esta adaptación en función del dispositivo que realiza la petición.
Asimismo, se ha de tener en cuenta que el sitio web ha de poder ser leído sin hojas de estilo,
puesto que el dispositivo puede poseer un soporte deficiente para este. Esto se traduce en que la
7
estructura lineal de los contenidos de cada página debería adaptarse a la estructura visual que se
pretende conseguir, y no alterar el orden mediante el uso de propiedades de CSS.
RWM 9 - Elementos estructurales
5.4.3 Structural Elements: http://www.w3.org/TR/mobile-bp/#sm
Se deben utilizar los elementos que facilite la gramática del documento para aportar estructura
(encabezados, listas, etc.) y se deben utilizar de forma apropiada y no únicamente para conseguir
efectos presentacionales. Se debe evitar el uso de propiedades de presentación que únicamente
aportan estructura de forma visual.
RWM 10 - Mensajes de error
5.4.13 Error Messages: http://www.w3.org/TR/mobile-bp/#d0e1875
A pesar de que unos sistemas de navegación bien planteados y de que los contenidos puedan
resultar adecuados, es inevitable que en determinados casos se produzcan errores en el acceso
(errores de uso, página web no encontrada, etc.). En estos casos los mensajes de error han de
ser suficientemente claros e informar de cual puede haber sido el origen que los provocó. Para
ello, las páginas de error deberán:




Utilizar el mismo idioma que el resto de la web o que los contenidos a los que se estaba
tratando de acceder.
Deben ser legibles (aunque también puedan incluir el código de error)
Detallar si el problema es temporal, si puede resolverlo el propio usuario, etc.
Incluir sistemas de navegación para volver a la página anterior, reintentar, ir a la home,
etc.
3.3 Evitar los riesgos conocidos
RWM 11 - Pop ups
5.2.8 Refreshing, Redirection and Spawned Windows: http://www.w3.org/TR/mobile-bp/#d0e959
Se debe evitar la apertura de ventanas emergentes. Esta situación, además de desorientar al
cambiar de ventana, puede provocar resultados impredecibles en aquellos dispositivos que no
soporten la apertura de más de una ventana.
RWM 12 - Tablas
5.4.4 Tables: http://www.w3.org/TR/mobile-bp/#d0e1374
El uso de tablas en los dispositivos móviles puede afectar negativamente a la experiencia de uso
al poder provocar la aparición de scroll horizontal y al no estar suficientemente soportadas. Al
aumentar la complejidad, debe evitarse el uso de tablas anidadas, así como de tablas para
controlar la maquetación (tarea que ha de corresponderle a las técnicas de CSS).
RWM 13 - Imágenes
5.3.5 Graphics: http://www.w3.org/TR/mobile-bp/#d0e1219
No se deben utilizar imágenes en blanco para crear espacios y posicionar elementos.
8
RWM 14 - Marcos
5.4.2 Frames: http://www.w3.org/TR/mobile-bp/#d0e1321
Dado el escaso soporte para este tipo de elementos que tienen los dispositivos móviles, así como
el comportamiento problemático que se origina en otros, no se deben utilizar marcos (FRAME e
IFRAME) en la web móvil.
RWM 15 - Mapas de imagen
5.2.7 Image Maps: http://www.w3.org/TR/mobile-bp/#d0e911
A no ser que se reconozca el soporte para los mapas de imagen por parte del dispositivo, se debe
facilitar un mecanismo alternativo de navegación. Asimismo, en aquellos casos en los que los
mapas de imagen impliquen el uso de imágenes de gran tamaño, se debe recurrir a dividir la
imagen en secciones más pequeñas y/o incluir un mecanismo alternativo.
Recomendación: se recomienda no incluir mapas de imagen en la web móvil. Dado que este
sistema de navegación ha de cumplir un grupo de requisitos mínimos para ser accesible, se
recomienda aprovechar estos para la versión móvil.
 Sustituirlas por listas de enlaces
3.4 Recordar las limitaciones
RWM 16 - Cookies
5.4.14 Cookies: http://www.w3.org/TR/mobile-bp/#d0e1925
Se debe evitar el uso de cookies cuando no sean soportadas por los dispositivos. En su lugar
se puede recurrir a la gestión de sesiones por URI, teniendo en cuenta no exceder la longitud
máxima que esta pueda tener para ser interpretada correctamente por el dispositivo.
RWM 17 - Object y script
5.4.5 Non-Text Items: http://www.w3.org/TR/mobile-bp/#d0e1433
Una amplia variedad de dispositivos carecen de soporte para objetos embebidos y para scripts,
pudiendo resultar imposible para los usuarios el añadir el plug-in correspondiente para ello. En
otros casos, a pesar de existir soporte, el comportamiento no siempre resulta como está previsto
(eficacia de respuesta, soporte parcial, etc.). Por este motivo, se debe procurar no supeditar la
funcionalidad y los contenidos a la presencia de este tipo de elementos.
RWM 18 - Tablas
5.4.4 Tables: http://www.w3.org/TR/mobile-bp/#d0e1374
Dado que las tablas pueden provocar la aparición de scroll horizontal, y al no estar ampliamente
soportadas por todos los dispositivos, se debe evitar el utilizarlas a no ser que se tenga la certeza
de que existe soporte para ellas y que no originan el mentado scroll. Asimismo, se recomienda
sustituir la presentación tabular de datos por alternativas que tengan amplio soporte y que
puedan reflejar la misma estructura.
9
RWM 19 - Tipografía
5.4.16 Fonts: http://www.w3.org/TR/mobile-bp/#fonts
La mayoría de los dispositivos móviles poseen un reducido número de fuentes, además de un
soporte limitado para tamaños de fuente y efectos tipográficos (negrita, cursiva, etc.). Por este
motivo, se debe procurar no confiar en que exista soporte pleno para los estilos aplicados a
la tipografía del sitio web.
RWM 20 - Uso del color
5.3.6 Color: http://www.w3.org/TR/mobile-bp/#d0e1240
Es necesario comprobar que toda la información que se facilita en la web esté también
disponible por mecanismos alternativos. Esta consideración se ha de hacer porque no todos
los dispositivos tienen el mismo soporte para las gamas cromáticas y porque las condiciones de
entorno en las que se realiza el acceso pueden afectar negativamente (por ejemplo, la iluminación
directa).
3.5 Optimizar la navegación
RWM 21 - Barra de navegación simplificada al comienzo
5.2.2 Navigation Bar: http://www.w3.org/TR/mobile-bp/#d0e773
Si es necesario, incluir una barra de navegación básica al comienzo de la página y, de existir,
enviar el resto de la navegación al final del documento. El objetivo que se persigue es facilitar el
acceso al contenido de la página una vez que se haya cargado y sin necesidad de
desplazamiento mediante el scroll.
Recomendación: Se recomienda tener presente que en determinadas páginas suelen tener
como objetivo la navegación (por ejemplo, la home suele ser la vía de acceso al resto de páginas
del sitio web), con lo que en estas, la pauta debería adaptarse, considerando prioritario incluir
dicha navegación tan pronto se realice la carga.
RWM 22 - Facilitar mecanismos de navegación consistentes
5.2.4 Navigation Mechanisms: http://www.w3.org/TR/mobile-bp/#d0e804
Utilizar mecanismos de navegación que sean consistentes y coherentes a lo largo de todo el
sitio web. De esta forma se mejora la usabilidad de la web móvil al permitir a los usuarios
identificar fácilmente las pautas de navegación y se previene la posible desorientación.
Recomendación: Se recomienda utilizar una metodología drill-down, es decir, un sistema de
navegación que permita acceder de forma directa a los contenidos que jerárquicamente se
encuentran inmediatamente por debajo y por encima del actual sin la presencia de enlaces que
desplacen hacia contenidos no relacionados en esa jerarquía. De esta manera, además de
optimizar la navegación, se mejora la experiencia de uso al disminuir el contenido real presente en
el documento.
10
RWM 23 - Identificación del destino de los enlaces
5.2.6 Link Target Identification: http://www.w3.org/TR/mobile-bp/#d0e864
Identificar claramente cuál es el destino de los enlaces permitirá a los usuarios de la web
móvil reconocer si este es de su interés, pudiendo decidir seguirlo o no. En el entorno móvil esto
resulta de especial relevancia, pues uno de los factores limitantes es el tiempo de conexión, y de
esta manera el usuario no ha de recorrer los enlaces para saber si el destino es de su interés.
Por este motivo, los enlaces en la web móvil han de ser claros, concisos y suficientemente
descriptivos respecto a su destino, informando de las características de este cuando no posea
un formato web o se reconozca que el formato no está soportado correctamente por el dispositivo
(peso del recurso, formato, etc.).
RWM 24 - Accesskeys
5.2.5 Access Keys: http://www.w3.org/TR/mobile-bp/#d0e831
Asignar teclas de acceso rápido (accesskey) a los principales enlaces y funcionalidades del
sitio web, y asignar siempre las mismas, facilita la navegación al disminuir la necesidad de realizar
repetidas pulsaciones (por ejemplo para recorrer los enlaces hasta llegar al enlace deseado).
Recomendación: Se recomienda facilitar visualmente la información acerca de la accesskey que
se asocia a cada enlace. De esta manera, el usuario reconocerá de forma rápida su presencia sin
necesidad de incluir dicha información en documentos independientes.
Asimismo, dado que las accesskey carecen de sentido en aquellos dispositivos carentes de
teclado real (por ejemplo, gran cantidad de los dispositivos táctiles), se recomienda incluso
eliminarlas (o al menos no mostrarlas) en estos, tras reconocer cuáles son las características del
dispositivo.
RWM 25 - URL
5.2.1 URIs of Site Entry Points: http://www.w3.org/TR/mobile-bp/#d0e742
Dado que introducir URI en los dispositivos móviles puede resultar tedioso y presentar
dificultades, se deben mantener las direcciones de acceso lo más cortas posibles,
configurando el sitio para que el acceso se pueda realizar sin necesidad de especificar
subdominios como parte de esta.
RWM 26 - Estructura equilibrada
5.2.3 Balanced Structure: http://www.w3.org/TR/mobile-bp/#d0e790
Es necesario equilibrar entre la necesidad de navegar a través de numerosos enlaces para
llegar a un destino y ofrecer múltiples enlaces en una misma página. La solución pasa por
mantener los enlaces a aquellas secciones/contenidos que más frecuentemente se visitan y
trasladar a otras páginas los que se corresponden con contenidos menos utilizados. De esta
manera se disminuye la necesidad de un largo scroll para llegar al enlace deseado, equilibrando
el coste que puede suponer alargar la navegación.
De forma general se ha de optimizar la navegación, priorizando los enlaces por popularidad o
importancia.
11
3.6 Comprobar gráficos y colores
RWM 27 - Redimensión de las imágenes
5.4.6 Image Size: http://www.w3.org/TR/mobile-bp/#ImageSize
Redimensionar las imágenes en el servidor teniendo en cuenta que se van a mostrar en un
dispositivo móvil permite optimizar el ancho de banda consumido, reduciendo sensiblemente su
consumo y mejorando los tiempos de descarga.
Recomendación: Se considera recomendable adaptar las dimensiones de las imágenes a las
características del dispositivo que las va a mostrar. De esta manera se previene la necesidad de
aparición de scroll horizontal, optimizando el resultado bajo demanda.
RWM 28 - Imágenes de gran tamaño
5.3.5 Graphics: http://www.w3.org/TR/mobile-bp/#d0e1219
Se debe evitar el uso de imágenes de gran tamaño y/o de gran resolución, pues su uso,
además de provocar dificultades en su presentación en los dispositivos móviles, provoca un
consumo de banda mayor del necesario.
Recomendación: En el caso de no poder evitarse su uso por razones de contenido, se
recomienda mostrar una imagen adaptada al dispositivo y crear un enlace a la versión a tamaño
real de la imagen (indicando las características del destino). De esta manera se previene que la
descarga se realice sin que haya sido solicitada por el propio usuario.
RWM 29 - Tamaño de las imágenes
5.4.6 Image Size: http://www.w3.org/TR/mobile-bp/#ImageSize
Especificar el tamaño de las imágenes en el código. De esta forma se informa al navegador
del espacio que ha de reservar para ellas y se previenen los desplazamientos que su carga
pueden provocar en el contenido.
Recomendación: Dado que gran variedad de formatos de imagen incluyen sus dimensiones de
forma implícita, se recomienda añadir esta información antes de servir la página.
RWM 30 - Elementos no textuales
5.4.5 Non-Text Items: http://www.w3.org/TR/mobile-bp/#d0e1433
La descargar de recursos gráficos vía móvil consume ancho de banda y, por extensión, supone
un gasto para el usuario. Este podría optar por desactivarla, con lo que perdería la información
gráfica que estos aportan. Por ese motivo, se considera necesario añadir alternativas textuales
para cada imagen presente en el contenido y que aporte cualquier tipo de información y/o
funcionalidad.
RWM 31 - Uso del color
5.3.6 Color: http://www.w3.org/TR/mobile-bp/#d0e1240
Es necesario asegurar que el contraste entre el color empleado de primer plano y el fondo es
suficiente para no perder información. En el acceso móvil, tanto la iluminación exterior, como la
12
capacidad del propio dispositivo, son factores limitantes en la percepción del color. Por este
motivo, es importante alcanzar unos niveles mínimos de contraste que permitan el acceso pleno a
los contenidos.
Recomendación: Se recomienda respetar los umbrales de contraste propuestos en WCAG 22
RWM 32 - Imágenes de fondo
5.3.7 Background Images: http://www.w3.org/TR/mobile-bp/#d0e1272
Resulta necesario comprobar y garantizar que, en el caso de utilizar imágenes de fondo, el
contenido siga siendo legible, desde los dispositivos móviles, tanto cuando las imágenes están
cargadas, como cuando no se realiza dicha carga. En ambas situaciones, el principal factor a
tener en cuenta es el contraste entre el contenido y el fondo.
RWM 33 - Unidades de medida
5.4.8 Measures: http://www.w3.org/TR/mobile-bp/#me
El uso de unidades de medida absolutas o de pixels en la declaración de dimensiones y de
propiedades del texto provoca que el contenido no se adapte a la pantalla del dispositivo,
pudiendo dificultar la presentación y disminuyendo la calidad en la experiencia de uso. Por este
motivo se debe recurrir siempre al uso de unidades relativas. Esta norma es aplicable a todos
los elementos de la página excepto para las imágenes, para las cuales, como ya se indicó, es
necesario definir sus dimensiones exactas en pixels.
Recomendación: De forma general se debe recurrir a unidades relativas, si bien, es posible
utilizar dimensiones en unidades absolutas cuando se conozcan las características del dispositivo
y se trate de dimensiones que no afectan negativamente al resultado visual final, no provocan la
aparición de scroll horizontal y no provocan la aparición excesiva del scroll vertical.
3.7 Minimizar
RWM 34 - Código de la página
5.4.10 Minimize: http://www.w3.org/TR/mobile-bp/#d0e1733
Utilizar código eficiente para minimizar el tamaño de las páginas, eliminando el marcado
innecesario y aplicando los efectos de estilo mediante el uso de técnicas de CSS adecuadas.
Recomendación: Se recomienda eliminar el pretty-print del código fuente, eliminando de esta
manera gran cantidad de espacios en blanco innecesarios.
RWM 35 - Tamaño de la página
5.3.2 Page Size: http://www.w3.org/TR/mobile-bp/#d0e1099
Dado que la memoria de determinadas familias de dispositivos es limitada, únicamente pueden
mostrar páginas con un tamaño reducido. Por este motivo, se ha de controlar el tamaño y peso
de las páginas y adaptarlas a las características del dispositivo que la va a mostrar.
2
WCAG 2.0 – Contrast (minimun): http://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast
13
RWM 36 - Hojas de estilo
5.4.9 Style Sheets: http://www.w3.org/TR/mobile-bp/#style
Al igual que el tamaño de la página ha de limitarse en función de las características de los
dispositivos, el tamaño de las hojas de estilo también ha de mantenerse optimizado.
Recomendación: se recomienda utilizar las formas abreviadas en la declaración de propiedades
de CSS y evitar la presencia de estilos que no se apliquen. De esta forma se minimiza la
descarga que estás implican y se mejoran los tiempos de renderizado y el consumo de memoria
por parte del dispositivo.
RWM 37 - Scroll
5.3.3 Scrolling: http://www.w3.org/TR/mobile-bp/#d0e1146
Dadas las limitadas dimensiones de las pantallas de los dispositivos móviles, resulta
prácticamente inevitable la aparición de barras de scroll. En el caso de ser necesarias, se debe
evitar la aparición de ambas barras y limitar el scroll a una única dirección.
Recomendación: Se recomienda limitar el scroll al desplazamiento vertical, evitando la aparición
del horizontal. Para ello se puede recurrir a controlar el ancho de la página, redimensionando las
imágenes que lo sobrepasen (en función del dispositivo).
3.8 Economizar el uso de la red
RWM 38 - Autorefresco y redirección
5.2.8 Refreshing, Redirection and Spawned Windows: http://www.w3.org/TR/mobile-bp/#d0e959
Se debe evitar crear páginas que se autorefresquen periódicamente. El autorefresco, además
de ser origen de problemas de accesibilidad, supone un coste al usuario al implicar la descarga
repetida de recursos sin que este lo haya solicitado expresamente.
Al ser un recurso que provoca que la navegación se ralentice, también se debe evitar hacer
redirecciones de cliente. En el caso de ser necesarias, no debería haber más de una por página
y se debería limitar el número de páginas que las requieren.
Recomendación: En el caso de requerir del uso de redirecciones, es importante tener en
consideración el mecanismo que se va a emplear para provocarla debido al soporte que pueda
tener en dispositivo para ello. En general, las menos recomendables son las realizadas con
javascript, debido al posible deficiente soporte que pueda tener el dispositivo, siendo preferible en
cualquier caso el realizarlas del lado del servidor.
RWM 39 - Recursos externos
5.2.9 Externally Linked Resources: http://www.w3.org/TR/mobile-bp/#el
Cada recurso enlazado (tanto desde el propio documento como desde la hoja de estilos) supone
un elemento a descargar, lo cual se traduce en tiempo de carga para la página y coste para el
usuario. Por este motivo se ha de mantener al mínimo el número de recursos enlazados.
14
RWM 40 - Caché
5.4.15 Cache Headers: http://www.w3.org/TR/mobile-bp/#d0e1945
Utilizar información de caché de forma efectiva y eficaz, de tal manera que se pueda reducir
la necesidad de descargar de forma innecesaria recursos repetidos tales como hojas de estilo,
imágenes y páginas completas. De esta manera se aumenta la eficiencia de la página, se
mejoran los tiempos de acceso a los contenidos y se reducen costes.
Recomendación: Se recomienda facilitar información de caché en las cabeceras, utilizando:
◦ Cache-Control: public para permitir el cacheo entre dispositivos
◦ Cache-Control: private para cacheo por sólo por parte del dispositivo que realiza la
petición
◦ Cache-Control: nocache para evitar el cacheo
3.9 Facilitar la entrada de datos
RWM 41 - Limitar las pulsaciones al mínimo
5.5.1 Input: http://www.w3.org/TR/mobile-bp/#d0e2028
Se ha de evitar al usuario de la web móvil la necesidad de introducir valores. Para ello se
puede recurrir a eliminar controles de formulario innecesarios, sustituir elementos por otros que
requieran menos pulsaciones (por ejemplo, se pueden utilizar controles de selección en lugar de
campos de texto), incluir valores por defecto, etc.
Asimismo, se debe facilitar información (tanto para el usuario como en código) del formato
de datos a introducir. Esto resulta de especial interés en aquellos campos en los que el formato
es restringido (por ejemplo formato numérico).
RWM 42 - Tabulación
5.5.2 Tab Order: http://www.w3.org/TR/mobile-bp/#d0e2100
Es necesario que todos los elementos de interacción posean un orden lógico de tabulación a lo
largo del documento. Esto se consigue facilitando que el orden del documento sea el que controle
el propio layout y la tabulación
RWM 43 - Controles de formulario
5.5.3 Labels for Form Controls: http://www.w3.org/TR/mobile-bp/#d0e2133
Es necesario etiquetar todos los controles de formulario mediante el elemento creado para
ello (label en el caso de HTML, con el correspondiente atributo for asociado al id del campo),
siendo igualmente importante que su contenido sea suficientemente claro acerca del control al
que acompaña y que su disposición permita reconocer la relación entre ambos.
15
3.10 Considerar el uso real de la Web
RWM 44 - Título de la página
5.4.1 Title: http://www.w3.org/TR/mobile-bp/#d0e1294
Facilitar un título descriptivo de la página permite una identificación rápida de esta. Es
importante tener en cuenta que los dispositivos móviles ofrecen un reducido espacio para mostrar
el título, con lo que este deberá ser breve y suficientemente claro en su significado.
RWM 45 - Claridad
5.3.1 Page Content: http://www.w3.org/TR/mobile-bp/#cl
Los usuarios de la web móvil generalmente requieren de información específica y no realizan una
navegación de carácter general a lo largo del sitio, lo cual no implica que no necesiten información
adicional o complementaria. Esto se traduce en la necesidad de ofrecer en primer lugar los
contenidos de carácter prioritario y mantener en un segundo orden el resto (generalmente por
debajo del contenido principal).
Esto se ve complementado con la tendencia altamente demandada de redactar los contenidos en
un lenguaje sencillo y claro, evitando ofrecerlos en un estilo discursivo.
De forma general se debe sintetizar la información, ofreciéndola como principal elemento en la
página y haciendo que sea lo más clara posible, y siempre limitar el contenido a lo que el usuario
ha solicitado, pues la información innecesaria supone un consumo de banda no deseado por
parte del usuario, además de un retardo en la carga total de la página.
RWM 46 - Tamaño usable de la página
5.3.2 Page Size: http://www.w3.org/TR/mobile-bp/#d0e1099
En el entorno de la web móvil, resulta fundamental limitar el tamaño de la página a lo
estrictamente necesario para cubrir las necesidades de información que los usuarios pudieran
tener. Esto no se plantea únicamente desde el punto de vista del consumo de ancho de banda y
de los tiempos de carga, sino que un tamaño excesivo de página afecta directamente a su uso al
requerir de un mayor desplazamiento de scroll, además de poder tener como handicap la
capacidad del dispositivo.
Por este motivo, en la web móvil es indispensable limitar el tamaño de la página a porciones
usables de información, y si es necesario, dividirla en páginas de menor tamaño.
16