Movil Marketing

    judith
    • Público
    Por judith hace 27 días

    Cómo saber si un sitio es adaptativo o receptivo


    A veces, puede ser complicado determinar qué configuración móvil está usando un sitio. Afortunadamente, el columnista Bryson Meunier comparte varios métodos para discernir sitios receptivos y adaptables.


    Como la mayoría de los SEO  como un consultor seo ya conocen, existen tres técnicas principales para brindar contenido de sitios web móviles: diseño receptivo, diseño adaptativo (también llamado servicio dinámico) y URL móviles independientes.

    Si bien es fácil identificar URL para dispositivos móviles por separado con tan solo mirar la barra de direcciones de su navegador, contar sitios receptivos y adaptables puede llevarnos a investigar un poco más.

    En mis talleres móviles con Shari Thurow en SMX West y SMX Advanced a principios de este año, muchos de los participantes estaban confundidos en cuanto a cómo distinguir las configuraciones móviles receptivas y adaptables. Entonces, realicé el ejercicio que describiré hoy. Con suerte, ayudará a algunos de ustedes a hacer la distinción.

    Si no está seguro de si el sitio que está mirando responde o se adapta, hágase estas preguntas:

    ¿Cambia de forma cuando cambias el tamaño de tu navegador desde una computadora de escritorio?
    Los sitios receptivos están diseñados para cambiar el diseño en función del tamaño de la ventana del navegador (independientemente del dispositivo), mientras que los sitios adaptativos detectan cuándo se encuentra en un dispositivo móvil y presentan diferentes HTML en consecuencia. Por lo tanto, si sabe que un sitio no usa URL separadas para su configuración móvil, a menudo puede diferenciar la capacidad de respuesta y adaptación visitando el sitio en el escritorio y viendo qué sucede cuando cambia el tamaño de la ventana de su navegador.

    ¿Quieres probar esto? Sigue los siguientes pasos:

    Abra WebMD.com o m-w.com en el navegador de su elección (los videos a continuación usan Chrome). Asegúrese de que la ventana de su navegador no sea de pantalla completa; en otras palabras, debería poder ver el escritorio detrás de ella.
    Coloque el cursor sobre el borde derecho de la ventana del navegador y redimensione la ventana hasta el tamaño de la pantalla de un teléfono móvil.( consultor seo freelance)

    Como puede ver, el diseño cambia según el tamaño de la ventana de su navegador, incluso en un escritorio. Eso significa que estos sitios son receptivos.
    Por el contrario, si haces lo mismo con Amazon.com en un escritorio, que es adaptativo, el contenido en el lado derecho de la pantalla simplemente se oculta en lugar de cambiar de tamaño o mover a otra parte.

    ¿Puedes encontrar la palabra "receptivo" o "@media" en el código fuente de la página de inicio?
    Los sitios receptivos tienen elementos específicos dentro de su código fuente HTML que los sitios adaptables no tienen. Para verificar estos elementos, siga los siguientes pasos:

    Abra WebMD.com en Chrome, en un dispositivo móvil o de escritorio.
    Si está en un escritorio, puede presionar CTRL + U (Windows) u Opción + ⌘ + U (Mac) para ver el código fuente de la página. Para los usuarios de dispositivos móviles, puede ir a la barra de direcciones y agregar view-source: antes del dominio raíz (por ejemplo, view-source: www.webmd.com) y presionar Enter para abrir el código fuente.
    Busque en la página la palabra "receptivo", que existe en la página para llamar a las plantillas y hojas de estilo que responden. Haga clic en la hoja de estilo receptiva, que debería ser un enlace en el que se pueda hacer clic.

    En la página de CSS, busque "@media"; la presencia de estos indica que son consultas de medios de CSS, que potencian los sitios receptivos.

    ¿El sitio muestra contenido diferente o un diseño diferente en un dispositivo móvil (o cuando usa un agente de usuario móvil como el teléfono inteligente Googlebot)?
    Los sitios adaptativos generan HTML diferentes para una página según el dispositivo del usuario, independientemente del tamaño de la pantalla. Esto significa que si está buscando un sitio adaptable en un dispositivo móvil, incluso uno con una pantalla grande, se le proporcionará contenido móvil específico.

    Podemos verificar las páginas móviles adaptables a través del navegador de escritorio. Esto se logra utilizando una extensión de navegador que le permite ver un sitio como si estuviera usando un dispositivo móvil.

    A continuación, le mostramos cómo probar una página adaptable con una extensión de cambio de usuario-agente en Chrome:

    Abra Chrome en el escritorio, luego descargue e instale una extensión de conmutador de usuario-agente. Recomiendo User-Agent Switcher para Google Chrome.
    Una vez que haya instalado la extensión, navegue a www.amazon.com.
    Haga clic en el icono de la extensión en la esquina superior derecha, luego use el menú desplegable para cambiar el agente de usuario a un agente de usuario móvil popular, como Chrome en Android Mobile./ seo barcelona

    Observe que la navegación ha cambiado una vez que cambió el agente de usuario, y la imagen del encabezado disminuyó de tamaño. Cuando cambia el tamaño de la ventana del navegador, incluso cuando la hace muy grande, no cambia de forma fluida, sino que crea más espacio en blanco alrededor de la misma imagen. Este es un sitio adaptable que cambia su diseño en función del usuario-agente.
    Tenga en cuenta que muchos sitios almacenan cookies para recordar su tipo de dispositivo, por lo que es una buena práctica cuando use agentes de usuario borrar el historial de su navegador después de cambiar los agentes de usuario.
    Preguntas adicionales
    Aquí hay algunas preguntas relacionadas que he recibido sobre el tema que también pueden ser de interés:

    ¿Puedes usar las herramientas de desarrollo de Chrome para decir adaptativo de sitios receptivos?
    Sí, pero asegúrese de borrar su historial de navegación antes de alternar devi