HOME / BLOG / Desarrollo web

Cómo adaptar mi web a las pantallas de los dispositivos móviles

A la hora de adaptar las páginas web a las pantallas móviles tendremos que tomar algunas decisiones. Crear un único proyecto o varios, usar la misma url o no, adaptar el código y la navegación…

Podemos elegir entre el Responsive Design o crear un nuevo proyecto. Tendremos que adaptar el código de nuestros sitios web.

En España se ha duplicado la penetración de los Smartphones en tan solo dos años. Esto es lo que se desprende del estudio ‘Somos Digitales’, llevado a cabo por Ametic y Accenture.

Tipos de dispositivos a los que adaptar la web

Si hablamos de tipos de dispositivos, el mismo estudio desgrana que los teléfonos móviles se llevan la palma. Los teléfonos móviles agrupan un 96%, aunque seguidos muy de cerca por los ordenadores personales, con un 93%. Estos datos no hacen más que demostrar el crecimiento de uso de este tipo de dispositivos móviles.

El crecimiento de los móviles nos obliga a las marcas a adaptarnos a este tipo de pantallas. Estos dispositivos tienen interfaces diferentes y un tamaño de pantalla más pequeño.

A continuación, veremos algunas decisiones oportunas a la hora de adaptar nuestra página web a este tipo de dispositivos.

Pasos para adaptar web a móviles

1.º La primera idea es decidir si se desea crear un nuevo proyecto para cada sitio web, hecho que optimizará mucho más la navegación desde los dispositivos móviles, aunque también conllevará mucho más trabajo, o bien si se utiliza lo que se conoce como Responsive Design. Esto consiste en adaptar el formato de la página web actual a los distintos tipos de pantalla. Dicho de otra manera, adaptar la web a móviles.

Cómo adaptar mi web a las pantallas de los dispositivos móviles 📲 #WebResponsive #WebFriendly Click To Tweet

2.º Url: en este punto nos tocará decidir si hacemos uso de la misma estructura para todos los formatos de webs (aconsejada por Google y más óptima para el SEO) o si utilizan url diferentes (con dominios o subdominios).

Se trata de pensar en el uso que hacemos de nuestros dispositivos móviles y de las limitaciones para la navegación que pueden acarrear. Y, con estas ideas, adaptar las versiones de nuestros sitios web.

3.º Adaptar el código a los dispositivos móviles. Aunque evoluciona a pasos agigantados, este tipo de dispositivo todavía es más lento que los ordenadores, por eso debemos optimizar el código de nuestro sitio web y hacerlo más eficiente. Reducir el tamaño, evitar el uso de estilos inline o evitar por todos los medios el flash son algunos de los requisitos que debemos cumplir.

4.º Usabilidad. Si nuestra navegación no es utilizable, perderemos a los usuarios de dispositivos móviles en pocos minutos. Debido a esto, se trata de uno de los puntos más importantes.

Por el tamaño reducido de la pantalla y su uso táctil, tendremos que facilitar todavía más la navegación. Así, podremos: duplicar los menús de navegación, hacer uso de la geolocalización, evitar hacer escribir demasiado a los usuarios, etc.

Se trata, en definitiva, de pensar en el uso que hacemos de nuestros dispositivos móviles y de las limitaciones para la navegación que pueden acarrear. Y, con estas ideas, adaptar las versiones de nuestros sitios web.

Alejandro López

Director Creativo Ejecutivo

Se dice pronto, pero llevo 20 años participando de un modo u otro en el desarrollo de proyectos web, especialmente en la parte de diseño UI/UX. Lo cierto es que estoy medio sordo, pero tengo una vista biónica y una mente cuadriculada que me permiten ver rápidamente un píxel desajustado.

Yo nací con la tara del «pixel perfect», y básicamente esta es mi filosofía: hacer diseños prácticos, usables, viables técnicamente y por supuesto, bonitos y exclusivos para cada cliente.

Así que… ¿por qué no nos cuentas nuestro próximo proyecto?.

Suscríbete

Y recibe antes que nadie los consejos, novedades y técnicas que te ayudarán a hacer crecer tu negocio.