Entendido.

Este sitio utiliza cookies para analizar la navegación. Si continúa navegando se entiende que acepta su uso. Ver más detalles.";

Logo

Aprende Web

Crea y diseña tus sitios en la Web.

Versión móvil

Adaptar una página a una versión para poder verla en un móvil


Y ahora tambien aprende a programar en C++ con Aprende Web C++

logo rss RSS. Suscribir canal.

Buscar en Aprende Web

Traducir página

Visita nuestro blog:

bolg.aprende-web.net

y entérate de las novedades o deja un comentario.

Dudas y sugerencias:

aprendeweb@aprende-web.net





logo
WEB-GRAFÍA

Mi agradecimiento a las siguientes páginas Web. en las cuales me he basado para la elaboración de este manual:


Diseño web para dispositivos móviles
Desarrollo Web
Consejos sobre usabilidad de móviles: W3C
The World Wide Web Consortium (W3C)
Recursos de diseño para web móvil
webdebolsillo.com/recursos
Tutorial: crea una versión móvil de tu web o blog
Blog de David Alayón (pisitoenmadrid.com)

Donativos

Si este sitio te parece interesante puedes contribuir con una pequeña aportación.




Version móvil (I)

Características

imagen movil
Sobre ésta página

Ültima modificación: 29-01-2016.

Visitas este mes: 54

Visitas el mes pasado: 92

La versión para móviles

La web en un principio fue diseñada para poder ver las páginas o archivos web en un ordenador, ya sea este fijo o portátil. Esto supone que el diseño de la página está estrucurado para poder verse en un tipo de pantalla determinada, con unas ciertas medidas.

Sin embargo cada vez es más frecuente visitar las web desde otro tipo de soportes, como pueden ser los las tablets o los teléfonos móviles de todo tipo. El uso de internet desde el movil es un hecho, y las páginas web que están diseñadas para verse en ordenador convencional muchas veces no se adaptan a un formato de teléfono móvil.

El auge de los telefónos móviles (Smartphone, I-Phone, BlackBerry, etc), hace que cualquier sitio web que quiera tener un poco de prestigio tenga que tener también una versión para móviles. Un sitio con versión para móviles debe poder verse de forma distinta según lo abramos en un ordenador o en un móvil. Tendrá por lo tanto dos versiones, una para ordenador y otra para móvil. Al abrir el sitio se detecta cual es el dispositivo que lo abre, de manera que nos envie a una versión o a otra. Trataremos más adelante este tema.

En los siguientes apartados veremos las principales diferencias que tenemos entre una página para ordenador de sobremesa y una página para ser vista en un móvil.


El usuario

Debemos tener en cuenta en principio que el usuario que se conecta a Internet con el móvil se comporta de diferente manera que el que se conecta en un ordenador. veamos las principales diferencias:

Se están haciendo otras cosas: Cuando nos conectamos a Internet con un móvil generalmente estamos haciendo otras cosas al mismo tiempo, como pasear, hablar con otras personas, etc. La mayoría de las veces la conexión a Internet no es el centro de atención. Al contrario que con el ordenador personal, que cuando lo usamos solemos centrar nuestra atención en lo que hay en la pantalla, con el móvil ésto es distinto, ya que normalmente solemos estar pendientes de otras cosas a la vez.

Buscar algo concreto: La mayoría de los usuarios se conectan con el móvil para buscar algo concreto, y lo que quieren es inmediatez en la respuesta. Esto es así porque el que usa el móvil suele tener el tiempo limitado para encontrar una respuesta a un problema, una duda, etc.,


La conexión

El tipo de conexión también es diferente. Aunque últimamente ha mejorado mucho, y es más que aceptable, la conexión a Internet desde un móvil suele ser un poco más lenta que desde un ordenador que tengamos en nuestro hogar o en la oficina.

Además también debemos de tener en cuenta la cuota de transferencia mensual que tiene el usuario, (normalmente entre 500Mb y 2Gb). Aunque también debemos tener en cuenta que el usuario puede conectarse a internet mediante Wi-Fi.

Teniendo en cuenta esto debemos pensar que al crear una versión para móviles debemos de economizar el peso del sitio, tratando de eliminar todo lo superfluo, de manera que, sin dejarnos lo esencial, eliminemos todo lo superfluo.


Usabilidad

Por usabilidad entendemos esas buenas costumbres que debemos seguir para poder diseñar sitios que sean fáciles de usar en dispositivos móviles. Daremos aquí unos cuantos consejos para poder construir las páginas adaptadas a los dispositivos móviles.

En estas normas de usabilidad se ha tenido en cuenta todo lo dicho anteriormente sobre el uso del móvil por parte del usuario y sus características. Estas normas están avaladas por sitios como The World Wide Web Consortium (W3C), o desarrolloweb.com (ver la webgrafía adjunta).


Regla fundamental: Menos es más

Aunque parezca un tópico se ajusta perfectamente a lo que debe ser un diseño web para móvil. cuanto menos elementos superfluos y decorativos pongamos en la página más interés tendrá ésta en el usuario.

Recordemos que normalmente el usuario busca algo concreto y con inmediatez, no podemos entretenerle con otra serie de elementos que no sea lo esencial. Los móviles, además, suelen tener pantallas pequeñas, por lo que no caben muchas cosas. Debemos por tanto poner los elementos de la página de forma clara y sólamente los imprescindibles.


Diversidad de pantallas

Debemos tener en cuenta la diversidad de tipos de pantalla que tienen los móviles. Si en una página para ordenador de mesa ya hay que tenerlo en cuenta, aquí mucho más, ya que la variedad es mucho mayor.


El foco de atención.

Tal como se ha explicado antes, cuando un usuario abre una página con su móvil, ésta no es el único centro de atención. Normalmente se hacen otras cosas a la vez que se consulta la página. Debemos tener esto en cuenta también al diseñar nuestra página.


Estructura o layout para móvil

La estructura o layout de la página debe estar diseñada para verse en un móvil. Esto supone una serie de cambios, que hacen la página diferente, entre ellos podemos señalar:


El uso de imágenes

Hacer un uso responsable de las imágenes, es otro punto a tener en cuenta. Procuremos que estas no sean demasiado grandes en la pantalla, ni que tengan mucho peso.


Pantallas táctiles

El ratón es sustituido por los dedos. Esto es fundamental a la hora de poner enlaces, ya que la precisión de un toque con el dedo no es la misma que la de un click de ratón. Debemos por tanto poner los enlaces o botones de un tamaño mayor, y si es necesario, dejar mayor espacio entre ellos.

Las pantallas táctiles también crean otros tipos de eventos como pueden ser el deslizamiento, el zoom, girar la pantalla, etc.


El teclado

El teclado en un móvil es un teclado virtual, o mediante el uso de teclas de tamaño muy pequeño, y que no siempre son de tipo alfanumérico. Esto hay que tenerlo en cuenta, de manera que evitemos que el usuario tenga que utilizar el teclado, y en caso de que tenga que hacerlo, su uso sea el mínimo posible.


No hay plugins

El uso de plugins como "Flash" o "Java", no está disponible en todos los dispositivos, por lo que debemos evitar en lo posible utilizar estos elementos.




En la siguiente página veremos como construir una página diseñada para móviles, y las principales diferencias que existen respecto a las páginas diseñadas para un ordenador de sobremesa.

La página



Versión móviles

Anterior siguiente ... Siguiente siguiente


imprimir esta página

Página creada por ANYELGUTI.

Sugerencias: aprendeweb@aprende-web.net. Envia un manda un correo

Visita nuestro blog par saber en qué estamos trabajando: Aprende Web Blog

Más sobre anyelguti en http://anyelguti.16mb.com