Tres conceptos básicos antes de poner en marcha una web responsive

Como ya hemos visto en más de una ocasión, el diseño responsive ya no es una tendencia; es hablar de la web de hoy. Al afrontar el desarrollo y diseño de un proyecto responsive, conviene tener en cuenta tres aspectos fundamentales para su correcta visualización en todos los navegadores y sistemas, dimensiones y resoluciones de pantalla y velocidades de conexión.

Por tanto, deberemos optimizar nuestro trabajo en esta tres direcciones complementarias para conseguir que  las personas que acceden nuestra web tengan una óptima experiencia de usuario, independientemente del dispositivo de acceso que utilicen.

A continuación,  explicamos cada uno de estos conceptos básicos en el diseño responsive:

Todos los navegadores y sistemas operativos

Los navegadores con los que se accede a Internet ofrecen generalmente algunas diferencias a la hora de mostrarnos el contenido de las páginas, por lo que debemos asegurarnos de que el contenido se represente correctamente en las principales opciones: Chrome, Explorer, Firefox, Safari y Opera.

También los sistemas operativos de los usuarios son diferentes y aunque hace un tiempo el Windows de Microsoft copaba más del noventa por ciento del mercado, el panorama ha cambiado mucho en la actualidad.

Otras opciones, como  Linux o Mac OSX son ahora más populares (especialmente entre algunos usuarios) y hay que añadir los numerosos sistemas operativos propios para teléfonos móviles o tabletas que se usan para navegar y que, dependiendo de los países y perfiles, pueden representar una porcentaje mayoritario del  tráfico en Internet. Por si fuera poco, algunos de esos sistemas operativos pueden tener sus propios navegadores, pero generalmente están basados o son compatibles con las opciones más populares.

Todas las dimensiones y resoluciones de pantalla

Cuando hablamos de responsive, seguramente esta es la característica en la que estamos pensando:  diseñar una web que se adapta a la pantalla de cualquier dispositivo. Por tanto, podemos tener que cambiar algunas formas y técnicas de de nuestro trabajo, como las unidades de medida o las media queries, para garantizar que todos vean la web de manera correcta y con los elementos dispuestos de manera que se facilite la lectura.  Recientemente, hemos hablado de las unidades de medida y en artículos como Cómo hacer una web responsive sin quebraderos de cabeza encontrarás muchas pistas.

Todas las velocidades de conexión

3G, 4G, Wi-Fi…. Las velocidades de conexión varían mucho de la tecnología de acceso y esto repercute (y mucho) en la experiencia del usuario. Por norma general, tenemos que ser conscientes de que el usuario móvil navega con ancho de banda limitado y  un determinado número de megas en alta velocidad que pueden consumir al mes.

Por tanto, tenemos la necesidad de realizar un esfuerzo extra en optimizar nuestra página web, para que tenga poco peso y sea rápida de transferir. Nuestro código HTML, CSS y Javascript, así como las imágenes y cualquier otro elemento que forme parte de la página, deberemos mejorarlo todo lo posible en este sentido. Aunque elegir bien el contenido que deseamos mostrar en cada momento es fundamental para que nuestros usuarios no desistan en el acceso a nuestra web.

Conviene subrayar que necesitamos una clasificación de  contenido preciso, breve, limpio para que sea fácil de descargar, pero lo bastante extenso para que ayude correctamente a vender un producto, una marca o una persona, es una disciplina completa. Existen personas que se han especializado en estudiar el contenido, para así asegurarse de que sea el correcto e incluso hay personas que lo optimizan de cara a la venta, a la comunicación corporativa, etc.

Además de combinar elementos textuales y gráficos, hay técnicas de programación (como Ajax) que pueden ayudar a tener un contenido optimizado para una descarga de la página más breve o la minimización del código Javascript o CSS, que también nos puede mejorar en ese aspecto.

En W3Schools encontrarás estadísticas de uso de navegadores, sistemas operativos, móvilesresolución de pantalla. También te pueden resultar útiles los diferentes artículos que hemos escrito sobre diseño responsive.

Compartir

Share on FacebookTweet about this on TwitterShare on LinkedInEmail this to someoneShare on Google+
0 comentarios

Dejar un comentario

¿Quieres unirte a la conversación?
Siéntete libre de contribuir

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *