Qué debes hacer para que tu web sea responsive

10 recomendaciones para mejorar la usabilidad en los formularios para móviles

Cuando desarrollamos una página web para dispositivos móviles, debemos tener en cuenta que los formularios requieren una mayor adaptación respecto a la versión de escritorio. Esto se debe, principalmente a la dificultad que tiene  el proceso de la entrada de datos. Como sabe y experimenta cualquier usuario todos los días, escribir textos en los teclados virtuales de los smartphones es una tarea tediosa, así que conviene que intentemos facilitarlo al máximo. En este artículo, damos una serie de consejos que mejorarán la experiencia de nuestros usuarios cuando acceden a un formulario desde un dispositivo móvil.

Minimiza la entrada de texto

Cuanto menos sea necesario escribir, mejor. Presentar alternativas como cajas de selección, botones de radio, sliders, etc. son cosas a tener muy en cuenta.

Minimiza el número de campos

A no ser que sea totalmente imprescindible, cuanto menor sea el número de campos del formulario, menos pereza tendrá el usuario a la hora de rellenarlo.

Utiliza los campos input del HTML5

Los campos INPUT en HTML5 nos facilitan y mejoran la interfaz de entrada de datos, dependiendo del tipo de campo y de los caracteres que tengan que introducirse. Por ejemplo, permiten cambiar la disposición del teclado virtual y que muestre unas teclas u otras por defecto.

Alinea etiquetas arriba

Debido al espacio reducido en las pantallas móviles, deberíamos incluir el texto explicativo a cada campo en la parte de arriba, en lugar de ponerlo en el lateral.

Elimina contenido accesorio

Deberíamos de eliminar elementos como tips o pop-ups, que si bien no molestan en la versión escritorio, pueden resultar un estorbo en la de móviles.

 Evita formularios multicolumna

Por el espacio reducido que nos lleva a alinear las etiquetas, deberíamos organizar nuestros formularios en una única columna. Además, facilita al usuario  el orden en el que la información debe escribirse.

Recuerda datos introducidos anteriormente

De manera predeterminada, los formularios HTML no implementan la funcionalidad de recordar datos la segunda vez que rellenamos determinados campos, pero si utilizas algún lenguaje de programación como Javascript, en el lado del cliente, o PHP en el lado del servidor, podrás hacer que tu sitio web sea lo suficientemente inteligente como para no solicitar datos que ya se conocen de antemano.

Obtén automáticamente algunos datos

Debemos hacer uso de tecnologías como HTML5 para obtener de forma automática información del usuario. Por ejemplo, utilizando la geolocalización, evitaremos que el usuario tenga que escribir datos como su país, ciudad, etc.

Usa los campos INPUT con autocompletar

En ocasiones, es más cómodo utilizar un INPUT con autocompletar que un SELECT. Como  ejemplo, te ponemos la selección de los pueblos de una provincia, en el que tecleando las primeras letras accederás antes a lo que quieres, que buscándolo en una interminable lista.

Permite ver las contraseñas

Por defecto, siempre recomendamos ocultar la clave escrita, pero sabiendo que los errores tipográficos son frecuentes con los teclados virtuales, añadir elementos que nos permitan ver la clave que estamos escribiendo puede ser de gran ayuda para el usuario.

Existen muchos más consejos útiles para la creación de formularios, especialmente si tenemos en cuanta las especificaciones de cada proyecto, pero este decálogo es una buena base para conseguir diseños simples y agradables para el usuario.

La copia de seguridad que necesitas para tus dispositivos, tus proyectos y tus datos
Accede a tus archivos desde cualquier dispositivo y lugar de forma segura
pack
10 GB
Gratis
Consigue tu backup ahora