Buenas prácticas para la web móvil, del W3C
El original y una traducción, libre, de la lista de 60 buenas prácticas que tratan en profundidad:
* Asegura que el contenido al que da acceso un URI dé una experiencia temáticamente coherente al acceder a él desde diferentes dispositivos.
* Explota las capacidades de los dispositivos para mejorar la experiencia de usuario.
* Toma pasos razonables para subsanar las implementaciones deficientes.
* Haz pruebas sobre dispositivos reales, además de en emuladores.
* Haz breves los URIs de los puntos de entrada.
* Da solo una navegación mínima en lo alto de la página.
* Ten en cuenta los compromisos entre tener demasiados enlaces en una página y pedir al usuario que siga demasiados enlaces para llegar a lo que busca.
* Da mecanismos de navegación consistentes.
* Asigna teclas rápidas a los enlaces de los menús de navegación y a la funcionalidad de uso frecuente.
* Identifica claramente el objetivo de cada enlace.
* Anota el formato del fichero enlazado a menos que estés seguro de que el dispositivo lo soporta.
* No uses mapas de imagen a menos que sepas que el dispositivo los soporta de manera efectiva.
* No uses pop-ups ni hagas aparecer otras ventanas ni cambies la ventana actual sin avisar al usuario.
* No crees páginas que se autorefresquen periódicamente a menos que informes al usuario y le dotes de un mecanismo para detener el refresco.
* No uses marcado para redirigir páginas automáticamente: configura el servidor para hacer las redirecciones mediante códigos HTTP 3xx.
* Minimiza el número de recursos externos enlazados.
* Asegúrate de que el contenido es adecuado para su uso en un contexto móvil.
* Usa lenguaje claro y simple.
* Limita el contenido a lo que el usuario ha pedido.
* Divide el contenido en porciones usables pero limitadas.
* Asegúrate de que el tamaño total de la página sea apropiado para las limitaciones de memoria del dispositivo.
* Limita el ’scroll’ a una dirección, a menos que el scroll secundario sea inevitable.
* Asegúrate de que el material central al significado de una página preceda al que no lo es.
* No uses gráficos para el espaciado.
* No uses imágenes que no puedan mostrarse en el dispositivo. Evita las imágenes grandes o de alta resolución excepto cuando de otra forma se perdería información crítica.
* Asegúrate de que la información comunicada a través del color también esté disponible sin este.
* Asegúrate de que la combinación de color de primer plano y fondo dé suficiente contraste.
* Al usar imágenes de fondo, asegura la legibilidad del contenido en el dispositivo.
* Usa títulos de página breves pero descriptivos.
* No uses marcos.
* Usa las características del lenguaje de marcado para indicar la estructura lógica del documento.
* No uses tablas a menos que sepas que el dispositivo las soporta.
* No uses tablas anidadas.
* No uses tablas para maquetar.
* En la medida de lo posible, da una alternativa para las presentaciones tabulares.
* Da un equivalente textual para cada elemento no textual.
* No confíes en objetos embebidos ni scripts.
* Especifica el tamaño de las imágenes en el marcado, si tienen un tamaño intrínseco.
* Cambia el tamaño de las imágenes en el servidor, si tienen un tamaño intrínseco.
* Crea documento que validen según las gramáticas formales publicadas.
* No uses medidas en píxeles ni unidades absolutas en los valores de los atributos de los lenguajes de marcado y valores de las propiedades de las hojas de estilo.
* Usa hojas de estilo para controlar la maquetación y la presentación, a menos que sepas que el dispositivo no las soporta.
* Organiza los documentos de forma que puedan leerse, en caso necesario, sin las hojas de estilo.
* Usa hojas de estilo cortas.
* Usa marcado conciso y eficiente.
* Envía el contenido en un formato que sepas que el dispositivo soporta.
* Siempre que sea posible, envía el contenido en un formato preferente.
* Asegura que el contenido use una codificación de caracteres soportada por el dispositivo.
* Indica en la respuesta la codificación de caracteres usada.
* Da mensajes de error informativos y formas de navegar desde la página de error a información útil.
* No confíes en que las cookies estén disponibles.
* Da información de caché en las respuestas HTTP.
* No confíes en los estilos de las tipografías.
* Minimiza las pulsaciones de teclas.
* Evita la entrada de texto libre en la medida de lo posible.
* Da valores por defecto preseleccionados siempre que sea posible.
* Especifica modo de entrada de texto, idiomas y/o formatos de entrada por defecto, si el dispositivo los soporta.
* Crea un orden lógico para los enlaces, controles de formulario y objetos.
* Etiqueta todos los controles de formulario apropiadamente y asocia explícitamente las etiquetas con los controles.
* Posiciona las etiquetas de forma que que queden dispuestas apropiadamente en relación a los controles a que se refieren.
Pocas sorpresas, mucho sentido común y un lenguaje, inevitablemente, políticamente correcto. Pero una buena lista de cosas a tener en cuenta cuando nos ponemos a desarrollar.
Leo frecuentemente...
-
-
-
The thing about contrast-colorHace 1 día
-
Is It Time to Kill the Sidebar?Hace 1 día
-
-
-
-
Traction Heroes Ep. 20: GumptionHace 3 días
-
The End of SummerHace 1 semana
-
สล็อตโปรเกรสซีฟ: ตามล่าฝันใหญ่แบบไม่หลุดกรอบHace 1 semana
-
Bookmarklet: Load All GitHub Comments (take 2)Hace 3 semanas
-
My requests for Interop 2026Hace 4 semanas
-
-
-
-
-
-
-
-
Hello world!Hace 1 año
-
-
-
-
-
-
-
-
Fading city APK 1.306065Hace 3 años
-
-
-
-
-
-
-
Hapi.js + Vue.js avatarHace 5 años
-
CSSplay - Responsive flex box galleryHace 5 años
-
-
-
アメリカでおすすめのお土産【2019年版まとめ】Hace 6 años
-
-
-
-
-
Pixel IconsHace 7 años
-
Save pdf smaller size mac onlineHace 8 años
-
Simulador vocalHace 8 años
-
-
-
-
-
-
Moving OnHace 8 años
-
Derelict WorkwearHace 9 años
-
-
NOW UI KIT multiplataformaHace 9 años
-
Goodbye The FontFeed, Hello FontShop NewsHace 10 años
-
-
End of an eraHace 10 años
-
Ungvár in black&whiteHace 10 años
-
Marlon BrandoHace 10 años
-
-
Stage room psd templateHace 11 años
-
-
-
-
-
Pequeños planetas en Google Street ViewHace 13 años
-
13 Best Grunge WordPress Themes onlineHace 13 años
-
Fractal GravityHace 14 años
-
Cita sobre diseñoHace 14 años
-
Fondos Navideños vectorialesHace 14 años
-
-
-
Nuevo BlogHace 15 años
-
Nos pasamos a WordpressHace 15 años
-
Episode 183 - Social Media Ends OutsideHace 15 años
-
Cambio de dirección / Adress changeHace 16 años
-
-
Cerrarán Google Page CreatorHace 17 años
-
2007: More Web Design Trends & ClichesHace 17 años
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
Me interesa...
- cómic (2)
- diseño en ai (5)
- diseño web (76)
- fotografía (4)
- labs (16)
- personal (16)
- posicionamiento SEO y SEM (9)
- sitios de la semana (28)
- tecnología informática (18)