Diseño Responsive

Diseño Responsive

Web 0

 

Hoy en día millones de personas se conectan a internet desde dispositivos moviles, smartphones y tablets y la navegación en estos dispositivos es muy diferente con respecto a un ordenador.
A pesar de esto muchas empresas solo se centran en tener una web que funcione bien en ordenadores, sin preocuparse de los demás dispositivos. Y es por esto que cuando estas webs se visualizan en smartphone se presentan algunos problemas como:

  • tiempos de carga demasiado largos debido a que los contenidos no están optimizados para moviles
  • formato de la pagina demasiado pequeno, obligando al uso del zoom para ver los detalles

 

¿En qué consiste el diseño responsive?

El diseño web responsive, o adaptativo, es una técnica de diseño web que busca la correcta visualización de una misma página en distintos dispositivos:

  • Ordenadores de escritorio
  • Tablets
  • Smartphone

Una Web Responsive será por lo tanto capaz de adaptarse a cualquier dispositivo donde se visualice.
Esto se consigue con una estructura de la página flexible, es decir, el diseño deberá permitir que los anchos de pantalla sean modificables, en función del tamaño de la pantalla del dispositivo desde el que se acceda.

También habrá que tener en cuenta los elementos de navegación de la página, por ejemplo el menú de navegación no se mostrará de la misma forma en la versión de escritorio que en la versión móvil. La razón es, por un lado y de nuevo, el tamaño de la pantalla, y por otro, que para hacer click, en smartphone, utilizamos nuestros dedos y no un ratón. Esta diferencia de tamaños nos obliga a que, por ejemplo, si un menú de navegación se ha diseñado de forma horizontal, en este caso se muestre de forma vertical. Además, como utilizamos nuestros dedos tendremos que diseñar botones lo suficientemente grandes para que se puedan clickar con facilidad. En relación al contenido hay que señalar además que cuanto más pequeña es la pantalla más relevancia adquieren los contenidos en comparación con los elementos de navegación. Es decir, los elementos de navegación cambian de posición para dejar paso al contenido, el usuario debe encontrarse con contenido útil cuando entra en la versión móvil de un sitio web.

 

Diseño responsive y posicionamiento en Google
Creando una página web responsive se cubren todas las resoluciones de pantalla y se evita crear una página web específica para cada dispositivo,
Desde el punto de vista del SEO esto es muy positivo ya que sólo aparecerá una URL en los resultados de búsqueda, evitando tener páginas duplicadas o tener que hacer redirecciones.
Las estadísticas muestran el creciente tráfico web que se genera desde dispositivos móviles, pero además Google penaliza en su buscador a aquellas webs que no sean responsive.
Google ha incluido una nueva metodología a la hora de elaborar su ranking de posiciones. Esta nueva indexación se conoce como Mobile First Index. Hasta ahora Google utilizaba la versión escritorio (desktop) de nuestras webs para elaborar su índice de posiciones, pero, a través de esta implementación, tendrá en cuenta la versión móvil de la página web.
Este hecho hará que se premie a las páginas que cuidan su versión móvil y, en especial, las webs que reciben la gran mayoría de su tráfico a través de dispositivos móviles.

 

Beneficios de una Web Responsive

  • Mejoras la experiencia del usuario ya que la web estará adaptada a las características del dispositivo.
  • Ahorro de costes de mantenimiento, ya que cuando se incluyen contenidos nuevos se realiza una sola actualización para todas las versiones de la web.
  • Ahorro de costes de desarrollo, ya que el coste de desarrollo de una web responsive adaptada a todos los dispositivos es menor que el coste de desarrollo de una versión de la web para cada dispositivo o de aplicaciones para móviles

 

Abrir chat
Powered by