Desde hace años, los expertos han estado diciendo que el tráfico a los sitios web de los visitantes en dispositivos móviles ha aumentado dramáticamente. Por esta razón, muchas empresas han comenzado a adoptar una estrategia móvil para su presencia en línea, creando experiencias que se adaptan al teléfono y otros dispositivos móviles.
Una vez que haya pasado el tiempo aprendiendo a diseñar páginas web para teléfonos móviles e implementando su estrategia, también querrá asegurarse de que los visitantes de su sitio puedan ver esos diseños. Hay muchas maneras de hacer esto y algunas funcionan mejor que otras. A continuación, le ofrecemos un vistazo al método que puede usar para implementar el soporte móvil en sus sitios web, junto con una recomendación casi al final sobre cuál es el mejor método para lograrlo en la web de hoy.
Proporcionar un enlace a otra versión del sitio
Este es, de lejos, el método más fácil para manejar usuarios de teléfonos celulares. En lugar de preocuparse por si pueden o no ver sus páginas, simplemente coloque un enlace en algún lugar cerca de la parte superior de la página que apunte a una versión móvil separada de su sitio. Luego, los lectores pueden seleccionar por sí mismos si desean ver la versión móvil o continuar con la versión "normal".
El beneficio de esta solución es que es fácil de implementar. Requiere que cree una versión optimizada para dispositivos móviles y luego agregue un enlace en algún lugar cerca de la parte superior de las páginas normales del sitio.
Los inconvenientes son:
- Debe mantener una versión separada del sitio para los usuarios móviles. A medida que su sitio se haga más grande, puede olvidarse de mantener esa segunda versión y sus sitios podrían no estar sincronizados.
- ¿También creas una tercera versión para tablets? ¿Qué tal una cuarta versión para wearables? Este concepto de versiones específicas del dispositivo puede salirse de control muy rápidamente.
- Debe colocar un enlace feo en la parte superior de la página que los lectores no móviles pueden ver (y posiblemente hacer clic en).
En última instancia, este enfoque es obsoleto y es poco probable que forme parte de una estrategia móvil moderna. A veces se usa como una solución de interferencia mientras se está desarrollando una mejor solución, pero en realidad es una curita a corto plazo en este punto.
Usar JavaScript
En una variación del enfoque mencionado anteriormente, algunos desarrolladores usan algún tipo de script de detección del navegador para detectar si el cliente está en un dispositivo móvil y luego redirigirlos a ese sitio móvil separado. El problema con la detección del navegador y los dispositivos móviles es que hay miles de dispositivos móviles por ahí. Intentar detectarlos todos con un JavaScript podría convertir todas sus páginas en una pesadilla de descarga, y todavía está sujeto a muchos de los mismos inconvenientes que el enfoque mencionado anteriormente.
Usar CSS @media Handheld
El comando CSS @media handheld parece ser una forma ideal de mostrar estilos CSS solo para dispositivos de mano, como los teléfonos celulares. Esto parece ser una solución ideal para mostrar páginas para dispositivos móviles. Usted escribe una página web y luego crea dos hojas de estilo. El primero para los tipos de medios de "pantalla" en su página para monitores y pantallas de computadora. El segundo para la "computadora de mano" diseña su página para dispositivos pequeños como los teléfonos móviles. Suena fácil, pero en realidad no funciona en la práctica.
La mayor ventaja de este método es que no tiene que mantener dos versiones de su sitio web. Simplemente mantén una, y la hoja de estilo define cómo debe verse, lo que en realidad se está acercando a la solución final que queremos.
Un problema con este método es que muchos teléfonos no admiten el tipo de medios; en su lugar, muestran sus páginas con el tipo de medios de la pantalla. Y muchos teléfonos celulares y dispositivos de mano más antiguos no admiten CSS en absoluto. Al final, este método no es confiable y, por lo tanto, rara vez se utiliza para entregar versiones móviles de un sitio web.
Utilice PHP, JSP, ASP para detectar el agente de usuario
Esta es una forma mucho mejor de redirigir a los usuarios móviles a una versión móvil del sitio web porque no se basa en un lenguaje de scripting o CSS que el dispositivo móvil no usa. En su lugar, utiliza un lenguaje del lado del servidor (PHP, ASP, JSP, ColdFusion, etc.) para mirar al agente de usuario y luego cambiar la solicitud HTTP para que apunte a una página móvil si es un dispositivo móvil.
Un simple código PHP para hacer esto se vería así:
stristr ($ ua, "Windows CE") ostristr ($ ua, "AvantGo") ostristr ($ ua, "Mazingo") ostristr ($ ua, "Mobile") ostristr ($ ua, "T68") ostristr ($ ua, "Syncalot") ostristr ($ ua, "Blazer")) {$ DEVICE_TYPE = "MOBILE";}if (isset ($ DEVICE_TYPE) y $ DEVICE_TYPE == "MOBILE") {$ location = 'mobile / index.php';encabezado ('Ubicación:'. $ ubicación);salida;}?>
El problema aquí es que hay muchos otros agentes de usuario potenciales que utilizan los dispositivos móviles. Este script capturará y redirigirá muchos de ellos, pero no todos de ninguna manera. Y se agregan más todo el tiempo.
Además, al igual que con las otras soluciones anteriores, ¡aún tendrá que mantener un sitio móvil separado para estos lectores! Este inconveniente de tener que administrar dos (o más) sitios web es razón suficiente para buscar una mejor solución.
Utilizar WURFL
Si aún está decidido a redirigir a sus usuarios móviles a un sitio separado, entonces WURFL (Archivo de recursos universales inalámbricos) es una buena solución. Este es un archivo XML (y ahora un archivo de base de datos) y varias bibliotecas DBI que no solo contienen datos de agentes de usuario inalámbricos actualizados, sino también qué características y capacidades son compatibles con esos agentes de usuarios.
Para usar WURFL, descargue el archivo de configuración XML y luego elija su idioma e implemente la API en su sitio web. Existen herramientas para usar WURFL con Java, PHP, Perl, Ruby, Python, Net, XSLT y C ++.
La ventaja de usar WURFL es que hay muchas personas que actualizan y agregan archivos de configuración todo el tiempo. Entonces, si bien el archivo que está utilizando está desactualizado casi antes de que termine de descargarlo, es probable que si lo descarga una vez al mes, tendrá todos los navegadores móviles que sus lectores utilizan habitualmente sin ningún tipo de descarga. problemas. La desventaja, por supuesto, es que tiene que descargar y actualizar continuamente esto, todo para que pueda dirigir a los usuarios a un segundo sitio web y los inconvenientes que genera.
La mejor solución es diseño responsivo
Entonces, si mantener diferentes sitios para diferentes dispositivos no es la respuesta, ¿cuál es? Diseño web adaptable.
El diseño responsivo es donde se utilizan consultas de medios CSS para definir estilos para dispositivos de varios anchos. El diseño responsivo le permite crear una página web para usuarios móviles y no móviles. Entonces, no tiene que preocuparse por el contenido que se muestra en el sitio móvil o recuerde transferir los últimos cambios a su sitio móvil. Además, una vez que haya escrito el CSS, no tiene que descargar nada nuevo.
Es posible que el diseño responsivo no funcione perfectamente en dispositivos y navegadores extremadamente antiguos (la mayoría de los cuales se usan muy poco hoy en día y no deberían ser una gran preocupación para usted), sino porque es aditivo (agrega estilos al contenido, en lugar de tomar contenido de distancia) estos lectores aún podrán leer su sitio web, simplemente no se verá ideal en su antiguo dispositivo o navegador.
