Tamaño adecuado a los botones táctiles
Utilizando las recomendaciones de Google Insight, y tomando en cuenta la experiencia de usuario al utilizar diferentes aplicaciones para diferentes usos y necesidades. Estas recomendaciones deben aplicarse cuando detectamos que en nuestra web existen elementos táctiles (como botones, enlaces, campos de formulario, etc.) puede estar pequeños o demasiado juntos, lo que complica que el usuario pueda hacer uso de ellos sin equivocarse al querer tocarlos en una pantalla táctil. Es más complicado poder usar los enlaces o botones pequeños o muy juntos en una pantalla táctil que en una computadora con un ratón.
Para evitar que los usuarios se frustren al tocar el elemento incorrecto, estos elementos deberían ser lo suficientemente grandes y estar lo suficientemente separados entre sí para que el usuario pueda tocarlos sin tocar otros por accidente.
El tamaño medio de la yema del dedo de un adulto es de aproximadamente 10 mm de ancho (un poco menos de media pulgada), y las directrices de interfaz de usuario de Android recomiendan utilizar elementos de aproximadamente 7 mm, o de 48 píxeles CSS, en un sitio con una ventana gráfica bien configurada para móviles. Para comenzar debes asegurarte de que los elementos más importantes de tu sitio (los que se utilizarán con más frecuencia) sean lo bastante grandes como para tocarlos sin dificultad; como mínimo 48 CSS píxeles de alto y de ancho, suponiendo que se haya configurado la ventana gráfica correctamente. Los enlaces que se utilicen menos pueden ser más pequeños, pero aun así deberían estar lo bastante separados entre sí, de modo que una yema de dedo de 10 mm no toque por error otros enlaces al mismo tiempo.
Los usuarios no deberían tener que usar el zoom (ni depender de otras funciones de interfaz del navegador, como la lupa de Chrome) para presionar con facilidad y con precisión el botón o el enlace deseado. Algo que debemos tomar muy en cuenta es aumentar de tamaño los elementos táctiles más importantes para que puedan ser usados sin problemas. Entre ellos, se incluyen los elementos más utilizados por los usuarios, como los botones para acciones frecuentes, las barras de búsqueda, los campos de formulario más importantes y los principales enlaces de navegación.
Estos elementos táctiles deberían ser por lo menos de 7 mm (48 píxeles CSS si has configurado la ventana gráfica correctamente) y deberían tener espacio adicional alrededor de ellos si miden menos de 7 mm. Cabe mencionar que es necesario dejar espacio suficiente entre los elementos táctiles más pequeños. Es normal que los enlaces o los botones utilizados con menos frecuencia tengan un tamaño menor al recomendado (7 mm), pero no debería haber otros elementos táctiles en un radio de 5 mm (32 píxeles CSS). De este modo, el usuario no tocará por error otros elementos.