Web responsive, ventajas y falsos mitos.

Antes de decir las ventajas, voy a plantear una pregunta.

¿Realmente necesito que mi web sea responsive?

Diseño web responsive

Si, web, blog o lo que sea, mi opinión es que si, por una serie de circunstancias.
Es cierto que, por ejemplo en WordPress, tenemos opción de plugins que adaptan nuestro blog  a los distintos dispositivos aun que el diseño de este no sea responsive, pero siempre nos ceñiremos al diseño del plugin y a sus características o tendremos que retocarlo de propio si tenemos conocimientos para ello.

  • Mantiene la imagen y/o los colores corporativos en cualquier dispositivo, o mejor dicho en cualquier tamaño de pantalla.
  • No hay que recurrir a plungins, aplicaciones externas  o diseños extras adaptados.
  • Evita tener que usar el scroll horizontal, si ya de por si, a veces nos resulta incomodo tener que movernos de arriba abajo en una web para leer sus contenido, el tener que hacerlo también de derecha a izquierda ni os cuento.
  • Facilita y favorece la navegación del usuario por nuestra web, esto  aumenta el tiempo de estancia, ayuda a la conversión y añade tráfico.

Creo que son razones suficientemente buenas para tener un diseño o adaptar el nuestro a responsive.

Ahora vamos con los mitos.

El formato de diseño en porcentajes no es nuevo. Hace tiempo (algo que creo ya he comentado en otros momento y lugares) en las páginas se usaban notas al “internauta” donde se decía: “esta web está diseñada para una resolución de pantalla de xxxx por yyy” o incluso se usaban scrips que detectaban la resolución para advertir al usuario si la suya era la idónea o no.  Algo más tarde se llego a la conclusión que dando los parámetros de ancho en porcentajes la web se ajustaría al total de pantalla fuese cual fuese el tamaño y la resolución del monitor, solo había que ajustar los márgenes laterales si no queríamos que la web llenase toda la pantalla. Esto se empezó haciendo cuan aun se diseñaban webs en tablas.

  • En el diseño web responsive solo se usan porcentajes y no se pueden usar medidas fijas en pixeles. No es correcto.

    Para mantener un ancho lógico en la web se utilizan anchos máximos en pixeles, e incluso para que a partir de un ancho en concreto haya propiedades que cambien o desaparezcan, como la de flotar una columna, que para según anchos de pantalla el parámetro sea

    float: none;
    /*** o simplemente quitarlo ***/
    /* float; right; */

    Incluso podemos crearlo todo en un tamaño fijo en píxeles y en la hoja de estilos, decirle que cuando llegue a un determinado tamaño de resolución, se pase a tamaños menores fijos o a porcentajes de ancho. Es obvio, que en porcentajes simplifica el trabajo de diseño, pero también podemos ir creando los tamaños para los distintos soportes y según su resolución, aun que ciertamente es mucho más laborioso.

  • Los archivos de FLASH no son responsive, no se adaptan a los anchos. No es cierto.

    Los archivos de FLASH pueden tener anchos fijos o en porcentajes, de esta segunda forma se adaptan a cualquier ancho, tanto en formato FLV como en SWF (Scary Web Format) otra cosa es que los importemos de fuera y los parámetros vengan en px con ancho fijo, pero esto no solo nos puede pasar con FLASH, con cualquier cosa que añadamos a nuestra web y haga referencia a una hoja de estilos CSS externa y que tenga los parámetros fijos, bien sean scripts, iframes, marcos… (no recomiendo el uso de marcos en apsoluto, excepto para cosas muy concretas y muy puntuales)
    A parte y a demás, es que el dispositivo necesite un plugin para leer el archivo y no lo tengamos o el sistema no esté adaptado para cargarlo, eso no quiere decir que no sea responsive, simplemente que no podemos verlo.

  • Duplicidad del contenido y diferentes URLs ¿para qué?

    Otra de las cosas que he leído por ahí, es que con el responsive evitamos tener que duplicar el contenido o incluso usar más de una URL. Totalmente falso.
    Y lo digo no porque no lo evitemos, sino porque antes tampoco era necesario hacer eso. Vamos poco talento el de quien le aconseje a una empresa o persona tener dos URLs distintas, una para móvil y otra para ordenador ¿entonces con las tablets, 3 URLs?. Pero es que tampoco es necesario duplicar contenidos. Antes de los iPod y los Smartphones ya se navegaba con móviles más limitados y pantallas más pequeñas, una de las opciones era poner un enlace para cambiar la plantilla, que consistía en un diseño básico sin columnas, de esta forma era más cómodo para elusuario.

  • Los fondos se escalan según los anchos.

    Eso es… ¡¡mentira!! Esta vez no puedo evitar utilizar la palabra mentira. Esto, y algunas cosas más, las leí en una afamada web de marketing donde el titular de la noticia dice “Diseño líquido: Cómo diseñar webs adaptadas a móviles” y ni su web es responsive, ni nos dicen cómo crearla… Pues bueno, yo aún no he encontrado los parámetros para CCS / CSS3 donde pueda escalar los fondos a mi gusto según las resoluciones, ni los conozco, ni los encuentro, ni creo que los encuentre. Los fondos, por el momento hasta CSS3 no son escalables, lo que sí que nos permite es tener distintos fondos, tanto en imágenes como en color, esto es, si ponemos de fondo la imagen1.jpg, a partir de cierto ancho de la resolución del soporte, podemos decirle que use la imagen2.jpg, la misma que la uno pero reducida de tamaño con una herramienta externa, o la imagenx.jpg, una imagen totalmente distinta, o un color en lugar de una imagen… vamos lo que se nos ocurra, todo menos que la imagen se escale por gracia divina (* nota en los comentarios)

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

Con esta meta etiqueta en el HTML lo que podemos es evitar que los dispositivos móviles hagan el zoom que tienen predeterminado que se usa para ver las webs, pero no mucho más.

  • Un mito, que voy a dejar en el aire es el del posicionamiento SEO.

    He buscado, he preguntado, he vuelto a buscar y a preguntar, SEOs, diseñadores-desarrolladores, webmasters, social medias… pero nada, no he conseguido entre todos una posición ni afirmativa ni negativa. Entonces dejo aquí mi agnosticismo, no lo creeré hasta que no me lo demuestren con fiabilidad, ni lo negaré, por el mismo motivo.
    Lo que si tengo claro, es que las “arañas” de los buscadores ven las páginas sin los estilos, como si fuesen un texto (vita en vivo)  por lo tanto lo ven siempre con un ancho del 100%. Pero también es cierto, que Google, reconoce cuando una web se adapta.
    Lo dicho, tengo mis reservas a la hora de pensar que este sistema o formato (y no nueva tecnología como he leído por ahí) mejora sustancialmente el posicionamiento, pero no puedo negarlo ni tampoco afirmarlo.

Muchas gracias por llegas hasta aquí.
Si lo deseas puedes dejar un comantario o puedes hacerme cualquier pregunta en el apartado Preguntame

7 Comentarios
  1. Jesus AF 8 años

    * Hablo de mentiras y la primera es la mía.
    Tras un toque de atención muy bien dado, y muy oportuno, por Beatriz Manzanero, en Twitter @BManzanero , he de rectificar y decir que los fondos si son escalables en porcentajes a trabes del parámetro
    background-size: 100%;

    Lo que más me duele es que este tremendo error no es por desconocimiento, sino más bien por olvido, ya que no lo uso nunca, no le he visto jamás una utilidad inmediata ni me he visto en la necesidad de usarlo.

    Si sirve de algo en mi favor (que no es escusa) diré que no es una exclusividad del responsive.

    Así que no me queda más que pedir perdón a los lectores por mi fatal error, la próxima vez me centraré más e intentaré estar más atento a la hora de publicar. Además, darle las gracias sinceramente y de corazón a Beatriz por su interés y su puntualización.

    Saludos y gracias a todos.

    • Beatriz Manzanero 8 años

      No tienes que dar las gracias por nada. Es un artículo muy bueno y esto no es un error es sólo un matiz porque como bien dices es una propiedad css3 muy poco usada , desde luego no es exclusiva del body.background y además hay ocasiones que en ninguno de sus parámetros (contain, cover, lenght, porcentaje) consigue un escalado medio decente de la imagen. Es esos casos y como bien dices no queda mas opción que usar más de una imagen.
      Tu sigue escribiendo así que yo estaré encantada de leerte.
      Un abrazo

      • Jesus AF 8 años

        Las cosas como son, Beatriz, y de bien nacidos es ser agradecidos. Más aun cunado se aportan conocimientos y valor a lo publicado.
        Si tu estarás encantada de leerme, yo de que lo hagas, comentes y más aun de que sigas aportando información y valor.

        Realmente un placer.

  2. juan toro 7 años

    Qué lindo!

    Leer un poco de experiencia, de decir lo que se sabe y obvio también saber que nadie sabe todo…. Esto muy dinámico, cambia todo el tiempo!

    Muchas gracias por tus artículos, muy buen blog!

    • Jesus AF 7 años

      Hola Juan, muchas gracias por tu comentario y encantado de que te haya gustado.
      Para eso estamos para compartir los conocimientos y aprender de los que nos pueden dar más, desde luego como tu dices, nadie lo sabemos todo, pero podemos compartir experiencias.
      Un saludo e insisto en las gracias por el comentario.

  3. Juan Carlos Cervantes 7 años

    Muy buen articulo ciertamente he tenido las mismas dudas sobre varios mitos del responsive, y existen cientos de articulos que se contradicen el uno al otro yo creo que todo se basa en utilidad y usabilidad de la web que desarrollemos para darle la mejor solución.

    • Jesus AF 7 años

      Hola Carlos, muchas gracias por leer el post y también por tu comentario.
      La verdad es que si, que se llegan a leer cosas increíbles en la red, no solo en el tema web, también en SEO, Social Media, tecnología… y nombro estos temas por que son los que más miro, pero seguro que los hay en todos. Como tu dices, hay que estudiar cada caso y ver las necesidades concretas de este, pero hay que tener en cuanta que siempre hay unas bases ineludibles para todos, muy bien aclarado que todo se basa en la usabilidad para todos y en todos los dispositivos.

      Me alegra que te haya gustado. Un saludo.

Contesta

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

*

©2013 - 2021 Jesús AF - WEB

Uso de cookies

Este sitio web utiliza cookies, tanto propias como de terceros (Google Analytics), para recopilar información estadística sobre su navegación generada a partir de las pautas de esta. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.plugin cookies

- SÁQUEME DE AQUÍ - ACEPTAR

Aviso de cookies

Inicia Sesión con tu Usuario y Contraseña

o    

¿Olvidó sus datos?

Create Account