Durante años, los expertos han estado diciendo que el tráfico a los sitios web de los visitantes en dispositivos móviles ha aumentado drásticamente. Por esta razón, muchas empresas han comenzado inteligentemente a adoptar una estrategia móvil para su presencia en línea, creando experiencias que se adaptan a los teléfonos y otros dispositivos móviles.
Una vez que haya pasado el tiempo aprendiendo a diseñar páginas web para teléfonos móvilese implementando su estrategia, también querrá asegurarse de que los visitantes de su sitio puedan ver esos diseños. Hay muchas formas de hacer esto y algunas funcionan mejor que otras. Aquí hay un vistazo al método que puede utilizar 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 actual.
Proporcionar un enlace a otra versión del sitio
Este es, con mucho, el método más fácil de manejar a los usuarios de teléfonos móviles. En lugar de preocuparse de 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 quieren 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 usuarios de dispositivos móviles. A medida que su sitio se hace más grande, es posible que olvide mantener esa segunda versión y sus sitios podrían desincronizarse.
- ¿También creas una tercera versión para tabletas? ¿Qué tal una cuarta versión para usables? Este concepto de versiones específicas del dispositivo puede salirse de control muy rápidamente.
- Tienes que poner un enlace feo en la parte superior de la página que los lectores que no utilizan dispositivos móviles puedan ver (y posiblemente hacer clic).
En última instancia, este enfoque está desactualizado y es poco probable que forme parte de una estrategia móvil moderna. A veces se usa como una solución provisional mientras se desarrolla una mejor solución, pero en realidad es una curita a corto plazo en este momento.
Utilice JavaScript
En una variación del enfoque mencionado anteriormente, algunos desarrolladores utilizan algún tipo de detección del navegador script para detectar si el cliente está en un dispositivo móvil y luego redirigirlo a ese dispositivo móvil separado sitio. El problema con navegador detección y dispositivos móviles es que existen miles de dispositivos móviles. Intentar detectarlos todos con un solo JavaScript podría convertir todas sus páginas en una pesadilla de descarga, y aún 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 CSS estilos solo para dispositivos portátiles, como teléfonos móviles. Esta parece una solución ideal para mostrar páginas para dispositivos móviles. Escribe una página web y luego crea dos hojas de estilo. El primero para el tipo de medio "pantalla" diseña 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 esos teléfonos móviles. Suena fácil, pero realmente 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. Solo mantienes el uno, y el hoja de estilo define cómo debería verse, 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 medio; en su lugar, muestran sus páginas con el tipo de medio de pantalla. Y muchos teléfonos móviles y dispositivos de mano más antiguos no son compatibles con CSS en absoluto. Al final, este método no es confiable y, por lo tanto, rara vez se usa 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 de dispositivos móviles a un version móvil del sitio web porque no se basa en un lenguaje de secuencias de comandos o CSS que el dispositivo móvil no utiliza. En su lugar, utiliza un lenguaje del lado del servidor (PHP, ASP, JSP, ColdFusion, etc.) para mirar el agente de usuario y luego cambiar el Solicitud HTTP para apuntar a una página móvil si es un dispositivo móvil.
Un código PHP simple para hacer esto se vería así:
El problema aquí es que hay muchísimos otros agentes de usuario potenciales que son utilizados por dispositivos móviles. Este script detectará y redirigirá a muchos de ellos, pero no a 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 motivo suficiente para buscar una solución mejor.
Utilice WURFL
Si aún está decidido a redirigir a sus usuarios móviles a un sitio separado, entonces WURFL (Archivo de recursos universal inalámbrico) es una buena solución. Este es un archivo XML (y ahora un archivo DB) y varias bibliotecas DBI que no solo contienen datos de agente de usuario inalámbricos actualizados, sino también qué características y capacidades admiten esos agentes de usuario.
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, XSLTy C ++.
El beneficio de usar WURFL es que hay muchas personas actualizando y agregando al archivo de configuración todo el tiempo. Entonces, si bien el archivo que está utilizando está desactualizado casi antes de que haya terminado de descargarlo, es probable que si descárguelo una vez al mes más o menos, tendrá todos los navegadores móviles que sus lectores usan habitualmente sin ningún tipo de problemas. La desventaja, por supuesto, es que debe descargar y actualizar esto continuamente, todo para que pueda dirigir a los usuarios a un segundo sitio web y los inconvenientes que genera.
La mejor solución es el diseño receptivo
Entonces, si mantener diferentes sitios para diferentes dispositivos no es la respuesta, ¿cuál es? Diseño web adaptable.
El diseño receptivo es donde utiliza consultas de medios CSS para definir estilos para dispositivos de varios anchos. El diseño receptivo le permite crear una página web para usuarios móviles y no móviles. Entonces no tiene que preocuparse por qué contenido mostrar en el sitio móvil o recordar transferir los últimos cambios a su sitio móvil. Además, una vez que haya escrito el CSS, no tiene que descargar nada nuevo.
El diseño receptivo puede no funcionar perfectamente en dispositivos y navegadores extremadamente antiguos (la mayoría de los cuales se usan hoy en día y no deberían ser una gran preocupación para usted), pero porque es aditivo (agregando estilos al contenido, en lugar de quitar contenido) estos lectores aún podrán leer su sitio web, simplemente no se verá ideal en su dispositivo anterior o navegador.