Hoy en día existe un gran porcentaje de personas que tienen acceso a internet a través de un dispositivo móvil, y debido a esto, las empresas buscan adaptar sus sitios a las características de dichos artefactos. El diseño de páginas web para móvil permite que cuando un usuario entre a un sitio web desde un dispositivo móvil, se muestre la versión móvil de dicha web automáticamente y si entra desde un ordenador la web clásica.
Conocido esto, resulta importante tomar en cuenta ciertos aspectos relevantes del uso de internet para dispositivos móviles:
1.8.1. MANERA DE USO DE INTERNET MÓVIL.
Es importante tomar en cuenta que, a diferencia que en las computadoras, la gente no está concentrada únicamente en la pantalla cuando usa uno de estos dispositivos. Es por esto que los usuarios, requieren que el contenido de la página sea lo más concreto posible.
1.8.2. LIMITACIONES EN VELOCIDAD DE CONEXIÓN, Y PLANES DE DATOS.
Generalmente la velocidad de conexión suele ser menor en los dispositivos móviles, a su vez un gran número de usuarios pueden poseer un plan de datos limitado. Estos hechos, hacen que sea necesario optimizar al máximo los recursos a usar en un sitio web, con la
finalidad de que contenga menos cantidad de datos, y el acceso sea más rápido.
1.8.3. USABILIDAD.
Para lograr un sitio fácil de usar se puede tomar en cuenta las siguientes observaciones: - Se debe procurar eliminar cualquier elemento prescindible, puesto que la
simplicidad, ayuda a que el sitio sea fácil de usar en dispositivos móviles.
- Se debe evitar el uso de plugins, tales como flash o java, puesto que estos no son compatibles con dispositivos móviles.
- Con respecto al uso de imágenes, se debe ser cauto en usar solo las imprescindibles y con la resolución adecuada, para evitar distorsiones en las mismas al variar las dimensiones de pantalla.
- Se debe sintetizar al máximo el contenido que se muestra en el sitio, para lograr que el usuario logre entender inmediatamente lo que ve en la pantalla.
- Se debe tomar en cuenta que en los dispositivos móviles se navega generalmente en pantallas táctiles, lo cual hace necesario que las dimensiones de los botones, y el espacio entre ellos sean lo suficientemente amplios.
- Se debe tener presente que existen ciertos eventos interactivos del sitio que varían en la web móvil, al no haber un cursor; se prescinde de la necesidad de remarcar los botones, en este caso se debe procurar que estos se distingan como tal; al mismo tiempo no se usa un scroll sino que la pantalla se desliza con el desplazamiento de un dedo sobre esta.
- Se debe buscar la manera de a provechar que los dispositivos móviles suelen tener utilidades que un computador no, como por ejemplo: cámaras fotográficas y de video, localización geográfica y orientación, entre las más importantes.
- Se debe conocer las etiquetas de programación compatibles con los sistemas de los dispositivos. E incluso tomar en cuenta la etiqueta viewport, que nos permite mostrar la versión adecuada del sitio dependiendo del tipo de dispositivo con el que se esté accediendo a él.
1.8.4. VARIEDAD DE TAMAÑOS DE PANTALLA.
El hecho de que los dispositivos móviles en el mercado poseen una enorme variedad de tamaños y resoluciones de pantalla constituye un obstáculo en la determinación de las dimensiones a usar. Para poder tener un panorama más claro al respecto es conveniente consultar al cliente los requerimientos de negocio del proyecto, dependiendo de estos puede ser totalmente factible diseñar sólo para un tamaño de pantalla o dispositivo. Sin embargo, si los requisitos determinan que debe ser utilizado por la mayoría de los
dispositivos, se puede facilitar la tarea mediante la agrupación de los tamaños de pantalla. A continuación se muestran las agrupaciones más frecuentes:
- Tiny.- 84px, 96px, 101px, 128px, 130px, 132px - Pequeña.- 160px, 176px
- Medio.- 208px, 220px, 240px - Grande.- 320px, 360px, 480px + - Escritorio.- 800px +
Estas agrupaciones son, por supuesto, totalmente arbitrarias y los requisitos de un proyecto pueden dictar un conjunto totalmente diferente. Por ejemplo, 320 píxeles para el iPhone y, poco más de 240 píxeles para navegadores móviles más recientes y 128 píxeles para dispositivos más antiguos. Al final, la definición de las agrupaciones de dispositivos realmente se reduce a los objetivos y la necesidad del proyecto.
En base a los grupos definidos, y dependiendo del presupuesto que el cliente disponga para el proyecto y de los requerimientos del mismo, se puede determinar la creación de versiones diferentes para los grupos de pantalla a los cuales se requiere llegar, o la creación de un diseño referente o más que se acoplen a más de un solo grupo de tamaños. Del mismo modo se puede fijar directrices para lograr un diseño más adaptable a cualquier tamaño:
- El logotipo del sitio debe estar adaptado para cada agrupación de dispositivos para garantizar la visualización de dicha imagen.
- Las cabeceras deberían estirarse al 100% del ancho de la pantalla utilizando una imagen de fondo repetitiva siempre que sea posible.
- Las imágenes de contenido no deben ser mayor de 200 píxeles de ancho para el grupo por defecto, (o el 80% de la anchura de la pantalla del dispositivo).
- Las imágenes de contenido debe ser automáticamente optimizadas para escalar, independientemente del ancho de pantalla.
- Siempre que sea posible, las listas de iconos o gráficos decorativos deben de ser eliminados, y así conseguir el mayor espacio disponible para el contenido.
- Una hoja de estilo dinámica se utilizará con el fin de establecer los valores para cada dispositivo.
Aunque no es una recomendación formal, resume las estrategias comunes para adaptar y mejorar el diseño, manteniendo los tamaños de archivos al mínimo. Siempre debemos tomar decisiones de diseño pensando en la mayoría de usuarios, y en lo objetivos del proyecto.
programador; o si el diseñador tiene los conocimientos; se puede mostrar la versión adecuada del sitio según el dispositivo que se esté utilizando.