Cómo Redirigir A Los Usuarios Móviles En Su Sitio Web
¿Alguna vez ha intentado escribir la URL m.facebook.com ¿en tu escritorio? Pruébelo, y verá que el sitio se ve raro en la pantalla grande.
Del mismo modo, intente abrir un sitio web local aleatorio en su dispositivo móvil. Es posible que te encuentres con algunos sitios que no están optimizados para dispositivos móviles y, por lo tanto, te desconcierta a primera vista. Estos sitios tienen una tendencia a perder sus audiencias móviles a sus competidores.
Diseño web adaptable
En estos días, todas las buenas plataformas CMS le permiten crear sitios web utilizando un diseño adaptable, que se adapta según el tamaño de la pantalla.
Es importante revisar cómo aparece tu sitio web en diferentes dispositivos , esto puede significar la diferencia entre mantener a tus visitantes comprometidos en tu sitio web y perderlos para nunca regresar.
También es importante mencionar que, dado que Google se mudó a mobile first indexing, la versión móvil de su sitio web es lo que cuenta para Google, lo que significa que es poco probable que funcione bien en las búsquedas si causa que los visitantes tengan una mala experiencia de usuario.
Sitios web móviles
Aunque cada vez es más raro, algunas empresas siguen prefiriendo tener un sitio web separado para usuarios móviles. Esto viene con muchos problemas potenciales que se pueden evitar fácilmente.
Compruebe que su sitio web es compatible con dispositivos móviles
Puede comprobar que su sitio web se ha configurado correctamente para dispositivos móviles ejecutando una revisión gratuita de WooRank.
Al recorrer la ruta separada del sitio web móvil, hay dos cosas importantes que deben tenerse en cuenta para garantizar una excelente experiencia de navegación móvil para sus usuarios móviles:
- Crea un sitio web móvil que proporcione una gran experiencia de usuario
- Redirige tu sitio para usuarios móviles
Por supuesto, si tienes un sitio web móvil creado con herramientas de diseño web adaptable, no tendrás que preocuparte por redirigir a tus visitantes móviles.
Redirigir su sitio web móvil
Si crea un sitio web móvil separado, pero no lo configura para redirigir a sus usuarios móviles de la manera correcta, todo el tiempo y esfuerzo invertido en crear un sitio web móvil se desperdiciaría.
Por lo tanto, hoy vamos a discutir las diferentes formas en que puede redirigir a los usuarios móviles a su sitio móvil. Las redirecciones solo son aplicables si tiene un sitio web móvil separado.
¿Cómo puedo Redirigir a un sitio Móvil?
Ahora que está a punto de aprender a redirigir a sus usuarios móviles a su sitio web móvil, vamos a explicar cómo funciona la redirección.
Existe el navegador de escritorio para usuarios de escritorio y los navegadores móviles para usuarios de dispositivos móviles. Ambos tipos de navegadores envían datos en forma de ‘agente de usuario’ al servidor web donde reside su sitio web. Este’ agente de usuario ‘ contiene información que le indicará al servidor web el tipo de dispositivo en el que se abre el navegador. Esta información incluye el nombre del navegador, la versión y otra información sobre su sistema operativo.
Por ejemplo, intente ingresar la siguiente URL en su teléfono inteligente: detectmobilebrowser.com. La información que ve allí es algo similar a la información enviada a su servidor web desde todos los dispositivos móviles desde los que se accede a su sitio web.
Aparte del método de detección de «agente de usuario», hay un factor más que ayuda a detectar a los usuarios móviles. Ese factor es la resolución de la pantalla. Sin embargo, con los dispositivos modernos, las resoluciones de pantalla son más altas para pantallas de teléfonos inteligentes incluso más pequeñas. Por lo tanto, el factor usuario-agente es el método más común utilizado para identificar a los usuarios móviles.
Ahora, vayamos al grano y hablemos de los diversos métodos por los que puede aplicar un redireccionamiento a su sitio para sus usuarios móviles.
- El Plugin Método
- El Método de Javascript
- El Método PHP
- El .Método htaccess
- El Nuevo Método CSS @ media
El Método Plugin
Si está utilizando una plataforma de Sistema de Gestión de Contenidos (CMS) como WordPress o Joomla, está de suerte. Tienen complementos listos para usar que ayudan a redirigir a los usuarios móviles a su sitio web móvil.
Algunos de estos complementos de redirección móvil específicos de CMS son los siguientes:
Para WordPress-Redirección de URL móvil Simple, WordPress Mobile Pack
Para Joomla-Detección móvil simple
Para Magento-Redirecciones de URL
Para Drupal-Redirección Móvil Simple, Redirección JS móvil
Si su sitio web se crea en cualquier otro CMS, intente buscar en Google un complemento que ayude con redirección móvil para ese CMS en particular.
El método JavaScript
Mediante un código JavaScript, puede redirigir a sus visitantes móviles a su sitio móvil. Este código JS puede detectar el tamaño de la pantalla o el agente de usuario.
El código JS que utiliza el tamaño de pantalla se puede encontrar en el siguiente artículo: Cómo redirigir su sitio web a su versión móvil.
El código JS que utiliza el agente de usuario: este código en el siguiente artículo: Redireccionar dispositivos móviles.
Puede aplicar ambos conjuntos de códigos a su sitio. Sin embargo, ambos métodos tienen desventajas.
En el método de tamaño de pantalla, está definiendo la resolución de pantalla, pero en estos días tenemos pantallas de dispositivos portátiles más pequeñas con mayor resolución. Esto puede terminar en una detección incorrecta de los usuarios móviles.
En el método de agente de usuario, es difícil realizar un seguimiento de cada agente de usuario nuevo y próximo y agregarlos al código JS. Hay muchos agentes de usuario y esto cambia constantemente con las tecnologías en desarrollo. Por ejemplo, eche un vistazo a esta extensa lista de agentes de usuario.
Y el mayor inconveniente de todos es para los usuarios que no tienen JavaScript instalado en sus teléfonos. Aunque, la mayoría de los teléfonos están equipados con JavaScript, algunos optan por desactivarlo. Algunos modelos antiguos de Blackberry no admiten JavaScript. Para superar estos obstáculos, puede usar la redirección del lado del servidor para sitios codificados en PHP o ASP.
El método PHP
Si su sitio está codificado en PHP, puede usar este método para redirigir a sus usuarios móviles. La ventaja de usar este método es que no está limitado a navegadores que se ejecutan en JavaScript. Sin embargo, tendrá que enumerar varios agentes de usuario.
Para que este script funcione, las extensiones de página deben serlo .php y su cuenta de alojamiento deben admitir PHP. Agregue el siguiente código a la sección
de su sitio web.
<?php $iphone = strpos($_SERVER,"iPhone"); $android = strpos($_SERVER,"Android"); $palmpre = strpos($_SERVER,"webOS"); $berry = strpos($_SERVER,"BlackBerry"); $ipod = strpos($_SERVER,"iPod"); if ($iphone || $android || $palmpre || $ipod || $berry == true) { echo "](https://s3.amazonaws.com/woocms.woorank.com/2020/05/poor-mobile-optimization.png"; } ?>Puede encontrar este código en el siguiente artículo: Código de Redirección de sitio Web Móvil PHP Simple.
Reemplaza http://m.site.com por la URL de tu sitio móvil.
El .Método htaccess
Otro método alternativo para redirigir al usuario móvil a su sitio web móvil, basado en el tipo MIME que admite el navegador, es el .método htaccess. Por ejemplo, si el tipo de navegador admite el tipo MIME que incluye WML (Lenguaje de marcado inalámbrico), el navegador es de un dispositivo móvil.
Puede colocar el código recomendado en este artículo titulado Redireccionar a un sitio móvil con .htaccess.
Pero antes de pegar este código, asegúrese de hacer una copia de seguridad de su código existente .archivo htaccess. Instalando el .el código htaccess incorrectamente puede causar problemas en su sitio. Si no está seguro de cómo hacerlo usted mismo, solicite la ayuda de un desarrollador web.
Reemplaza http://m.example.com por la URL de tu sitio web móvil.
El nuevo método CSS @media
CSS tiene un método integrado para detectar navegadores móviles. A continuación, muestra los estilos CSS basados en el tamaño de la ventana del navegador. Para ello, no necesita un sitio móvil separado. Necesita dos hojas de estilo dentro de una página web, la primera para el tipo de medio «pantalla» (para monitores de escritorio) y la otra para el tipo de medio «portátil» (para teléfonos inteligentes).
Para implementar este método, debe pegar el siguiente conjunto de códigos en la etiqueta
de su documento HTML.
<br /> /* Smartphones (portrait and landscape) ----------- */<br /> @media only screen<br /> and (min-device-width : 320px)<br /> and (max-device-width : 480px)<br /> /* Styles */<br />Encontrará este código y muchas otras variaciones en esta página titulada Consultas de medios para dispositivos estándar.
Este método tiene muchas desventajas. Requiere agregar un gran conjunto de código CSS al sitio. Todavía hay algunos dispositivos que no son compatibles con los tipos de medios «portátiles» y representan las páginas con la configuración de visualización «pantalla» en su lugar.
Por lo tanto, hay muchas formas de redirigir a los usuarios móviles a su sitio móvil, como se indica anteriormente. Puede colocar varios scripts en la sección principal de su sitio web, por ejemplo, el script que detecta el tamaño de la pantalla y los agentes de usuario.
Pero su trabajo no está terminado hasta que sus redireccionamientos móviles también funcionen bien para los bots de motores de búsqueda. Especialmente, en el caso de Google, hay algunas configuraciones que debes hacer para que diferencien entre la URL de escritorio y la URL móvil.
Para obtener más información, lea el blog de Google webmastercentral sobre los cambios en la clasificación de los resultados de búsqueda de teléfonos inteligentes e información sobre las técnicas de redirección compatibles con Google.
Necesitas agregar una URL canónica a tu sitio web móvil, para que Google entienda la relación entre tu URL móvil y la URL de escritorio.
Para ayudar a Googlebot a descubrir la ubicación de las páginas móviles de su sitio, Google recomienda que los sitios web deben:
Agregar una etiqueta rel=»alternate» en la página de escritorio que apunte a la URL móvil correspondiente.
Agregue una etiqueta rel = «canonical» en la página móvil que apunte a la URL de escritorio correspondiente.
Esto permite a los rastreadores de Google comprender la relación entre las dos URL: de escritorio y móvil.
Una vez que haya colocado redirecciones adecuadas en su sitio para sus usuarios móviles, es hora de probar si las redirecciones funcionan bien para diferentes dispositivos. Probarlo manualmente en cualquier dispositivo de teléfono inteligente disponible es una forma de hacerlo. Pero también puede usar estos emuladores móviles para probar la representación correcta de su sitio móvil en diferentes dispositivos móviles.
Recuerde, el uso correcto de las redirecciones móviles es un paso crítico para garantizar que su sitio web móvil sea amigable con los motores de búsqueda. Si su sitio web no se redirige bien para sus usuarios móviles, también puede estar perdiendo muchos negocios valiosos. Por lo tanto, tanto para SEO como para cambios positivos en las tasas de conversión, debe tomar medidas inmediatas para redirigir su sitio web a sus usuarios móviles utilizando uno de los métodos anteriores.
Esta entrada de blog se actualizó el 15 de enero de 2020