Web adaptable

La conexión a internet desde teléfonos móviles o tabletas no para de aumentar. Es por ello que las páginas webs deben adaptarse a este nuevo perfil de usuarios y a su conexión. La velocidad de conexión de estos dispositivos puede variar dependiendo de la localización ya sea un 3g, 4g, wifi y por lo tanto la velocidad de carga de una web debe adaptarse a esta limitación. Además los dispositivos portátiles suelen tener una gran variedad de tamaños de pantalla y resoluciones, por lo tanto hacen que la visualización de una web varie de un dispositivo a otro.

Esto implica  la manera de enfocar la creación de un sitio web para anticipar mejor las diferentes limitaciones relacionadas a cada soporte. El diseño web adaptativo o “responsive design” es actualmente la solución para afrontar este problema si se quiere mantener la uniformidad de la web a lo largo de diferentes pantallas.

Adaptable

Las ventajas del diseño web adaptable

Las ventajas del diseño web adaptativo son considerables. Esta técnica permite ofrecer más versaltilidad al sitio web que se adapta a las diferentes resoluciones de pantallas disponibles. Esta técnica permite universalizar la visualización de un sitio web utilizando las nuevas reglas y las propiedades de CSS 3 (media Queries, micro formatos, etc.), aceptadas por la gran mayoría de los navegadores. También se pueden utilizar medios de detección de dispositivos mediante php o javascript.

La anchura y las imágenes se ajustan, se redimensionan y se desplazan automáticamente según lo exige la resolución de pantalla. Esta técnica permite una visualización óptima evitando la pérdida de la información vital de la web.
El diseño web adaptativo es una solución estratégica a largo plazo porque permite responder a una búsqueda de manera más rápida visualizando sólo los elementos más pertinentes a los internautas móviles.

Con el diseño web adaptativo ya no hay preocupación por la redirección de los enlaces. Una vez implementado el diseño web adaptativo, sólo hay poco mantenimiento que realizar y el costo de desarrollo es más interesante que un sitio móvil especializado. Al fin y al cabo estamos usando gran parte del código en vez de reprogramar desde cero.

Con el diseño web adaptativo se tiene la seguridad de que la URL no varia, lo cual es perfecto para campañas de marketing. De hecho, el no adaptar el sitio web al soporte de navegación del usuario puede afectar grandemente la experiencia de navegación de usuarios móviles, repercutiendo de manera negativa en el tráfico de visitantes o en la pérdida de ventas en un ecommerce.

El enlace único con el sitio web original permite al soporte móvil respetar la misma estructura de información que el sitio web completo reduciendo el tiempo necesario de adaptación al nuevo formato. El sitio web se visualiza automáticamente en función de la pantalla sin preguntar al usuario de qué manera desea navegar. Por supuesto, la versión clásica de la web debe estar disponible para los usuarios acostumbrados a la visualización original.

Los inconvenientes del diseño web adaptable

Aunque las ventajas del sitio web con diseño web adaptativo son numerosas, sin embargo existen ciertos inconvenientes. Se trata particularmente del tiempo de carga de la web.

La mayoría de las veces, los usuarios se encuentran en la obligación de descargar de manera inútil un código HTML/CSS. De igual manera, las imágenes son a menudo simplemente alargadas y redimensionadas provocando un impacto negativo en el tiempo de descarga. Si el código está bien optimizado, esta descarga de información extra será imperceptible para el usuario. Las imágenes si que deben adecuarse en tamaño y sobre todo en peso (kb) para reducir la máximo su carga con velocidades de conexión lentas.

Por otra parte, el diseño web adaptativo no permite ajustar fácilmente los títulos, las descripciones y otros contenidos en los teléfonos móviles. Además, el desarrollo del sitio web adaptativo exige más tiempo. Obliga a una descarga de todos los elementos que constituyen la página pudiendo ocasionar un rendimiento menor. Existen definitivamente más dificultades en cargar el contenido de un sitio web adaptativo que el contenido de un sitio móvil especializado. Al trabajar con diseños webs adaptables deberemos olvidarnos de las anchuras y tamaños en píxeles y pensar en %. Lo mismo pasa con los tamaños de letra. Ya no podrán tener un tamaño definido sino que deberán crecer y reducirse en función de la pantalla.

El diseño web adaptable y el posicionamiento

El posicionamiento del sitio web adaptativo no genera problemas. Es la opción ideal si se desea ofrecer su sitio web en diferentes versiones. Las previsualizaciones de las imágenes de un cierto ancho en las páginas de los resultados de un motor de búsqueda representan una ventaja considerable para el posicionamiento natural.

Además, la indexación es mucho mejor con el diseño web adaptativo, este último se adapta a todos los soportes de visualización. Además, como cada página del sitio se enlaza a una dirección única poca importancia tiene la versión del dispositivo. Los enlaces entrantes se dirigen todos hacia la misma URL que facilita el posicionamiento web. Esto permite un ahorro, ya que las modificaciones se realizan en único sitio web y no en varios.

El diseño web adaptativo es definitivamente una solución eficaz con el fin de ofrecer una experiencia óptima al usuario. Es una evolución superior del diseño web que invita a los diseñadores a un nuevo desafío y asegura a los usuarios una experiencia enriquecida. En cuanto a los inconvenientes de esta técnica, se solucionan con una mayor inversión al nivel del diseño y al nivel del desarrollo del sitio web.

Sin embargo, es necesario saber qué alternativas hay. Existen sitios alternativos para móviles que dirigen a los visitantes en posesión de un smartphone hacia el sitio móvil o a aplicaciones móviles nativas que aunque son mejores para controlar la experiencia del usuario y respuesta en cuanto a velocidad, son costosasde desarrollar y no permiten posicionamientos, necesitan de una descarga previa y no cuantifican las visitas reales.