Planificación y creación de un sitio móvil habilitado para su sitio principal

Question

Estamos en las etapas iniciales de planificación para crear un sitio móvil para uno de nuestros clientes. Este sitio móvil se agregará al sitio principal que ya hemos creado para ellos. Determinamos que el contenido va a ser una pequeña subsección del sitio principal y se dirigirá a la audiencia principal que se espera que use el sitio.

Al mirar a través de algunos sitios móviles de muestra notamos que una gran cantidad de sitios que tienen WAP en la url son en realidad solo archivos HTML simplificados. http://wap.mlb.com no está realmente habilitado para WAP sino HTML simple.

Mi pregunta es ¿WAP una idea del pasado? Dado que los teléfonos inteligentes y el iPhone tienen la capacidad de representar sitios como lo hacen, debemos preocuparnos por WML y WAP, ¿o será suficiente con una versión html reducida?

También puede recomendar un blog o tutorial o responder a continuación la mejor forma de verificar si hay dispositivos móviles? ¿Es necesario que el programador conozca cada variación del agente de usuario para redirigirlo a nuestro sitio móvil?

Finalmente, ¿podría programar un sitio móvil para el navegador iPhone/Touch Safari o simplemente abandonar el sitio como está?

Answer 1

Los nuevos teléfonos vienen con WAP2 que utiliza HTML Mobil e Profile (XHTML MP), que es bastante similar al HTML normal. Los teléfonos más antiguos usan Wireless Markup Language (WML).

Dependiendo de su público, consideraría hacer una versión amigable para teléfonos móviles del sitio utilizando XHTML MP y soltar WML por completo. Por teléfono amigable quiero decir gráficos claros, poco JavaScript y navegación simple.

Para verificar las capacidades de diferentes teléfonos móviles, observe WURFL.

También, es posible que desee echar un vistazo a Mobile Web Best Practices desde w3c.

Answer 2

Creo que la diferencia principal con los teléfonos 2.5G y los nuevos teléfonos 3G es que mientras los teléfonos 2.5G usan sus propios navegadores, los navegadores en teléfonos 3G se han vuelto mucho más similares/precisos en sus capacidades de renderizado.

Por otro lado, puede usar CSS para renderizar el mismo HTML en formato de pantalla grande o en uno pequeño optimizado para dispositivos móviles, así que supongo que lo que sucedió es que el enfoque de "HTML simple" simplemente parecía ser el camino menos difícil de tomar. Además, los diseños sin mesa permiten que los sitios web escalen mejor, lo que facilita la visualización de un sitio en formatos de pantalla grandes y pequeños.

Así que la pregunta final será la de un mercado objetivo. ¿Está apuntando a un público experto en tecnología que tenderá a tener teléfonos con capacidad 3G? ¿Está apuntando a personas que podrían tener 2.5G como máximo?

Answer 3

Mi experiencia es que realmente depende de lo que estás tratando de hacer y de quiénes/dónde están los usuarios.

Mientras que WAP recibió mucha mala prensa, su punto fuerte es que tiene conexiones de baja latencia de ancho de banda bajo. El contenido WML se optimiza mediante la puerta de enlace del operador para reducir en gran medida la cantidad de datos transmitidos por el aire. Si tiene iPhones y similares, en áreas con una sólida cobertura 3G, puede darse el lujo de obtener contenido más completo, pero si desea que una aplicación siga funcionando bien en áreas más alejadas, WAP tiene una gran ventaja.

Una cosa a tener en cuenta con WAP es que la calidad de la compatibilidad WAP en los teléfonos varía mucho (supongo que también diría lo mismo para los navegadores web de teléfonos inteligentes). La mayoría de ellas muestran las páginas correctamente, pero el manejo de formularios es realmente horrible en algunos navegadores.

Si varía el contenido según el agente de usuario, también debe proporcionar una forma explícita de acceder a un tipo de contenido específico (por ejemplo, URL separadas): la opción automática no siempre es correcta y desea que el cliente pueda anularlo.

Si va con el desarrollo WAP echa un vistazo a WinWAP - un navegador WAP basado en Windows.

Answer 4

Recomiendo encarecidamente que consulte Cameron Molls' libro Mobile Web Design. No es tanto una forma técnica de construir sitios optimizados para dispositivos móviles, sino que le hace pensar en las diversas opciones disponibles y resume los pros y los contras de cada uno.Definitivamente te hará pensar en qué enfoque estás tomando y si es el correcto. Creo que también tiene algunos consejos sobre los recursos que ayudan a detectar las solicitudes de dispositivos móviles a su sitio, existen varias opciones.

Answer 5

Si quiere gastar una cantidad muy pequeña de dinero, puede encontrar una copia usada de mi libro "Palm OS Web Application Developer's Guide" en Amazon por menos de $ 1. Si bien los consejos específicos sobre los viejos dispositivos Palm VII ya no se aplican, hay algunas secciones sobre cómo hacer que los sitios web móviles aún se apliquen. Mi consejo básico es este: hacer páginas pequeñas con información relevante primero, luego enlaces de navegación; empujar contenido genérico/repetitivo a otras páginas; intente optimizar para reducir la cantidad de tiempo que un usuario pasa en una sola página; y evite la descarga de muchos objetos (imágenes, archivos JavaScript) de una página para reducir la latencia.

Answer 6

Aquí hay dos cosas que puede hacer para mejorar el apoyo para los iPhones y sin hacer mucho trabajo:

página Realizar desplazamiento hacia arriba para ocultar la barra de direcciones:

<script type="application/x-javascript"> 

    if (navigator.userAgent.indexOf('iPhone') != -1) { 
    addEventListener("load", function() { 
     setTimeout(hideURLbar, 0); 
    }, false); 
    } 

    function hideURLbar() { 
    window.scrollTo(0, 1); 
    } 

</script> 

Y establecer la escala para el ancho de página (mejor hacer algunas pruebas y jugar con esto, también buscan otros ejemplos que pueden utilizar user-scalable=true):

<meta name="viewport" content="width=320; user-scalable=false" /> 

Answer 7

El código: Hace que el validador w3 devuelva 11 errores cuando lo uso. Aquí está la página de índice en la que se intentó: No usará varias líneas, no se usará. Son líneas de plantilla.

<!DOCTYPE HTML> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> 
<title>Photography Aerial Commercial Portrait Underwater Wedding Tom Szabo</title> 
<meta name="description" content="A Thomas Image professional photography serving Cleveland 
Northeast Ohio Chagrin Falls Chardon Kirtland Madison Mentor Painesville Perry and Willoughby"> 
<meta name="keywords" content="A Thomas Image, professional, photography, cleveland, northeast ohio, chagrin falls, chardon, concord, kirtland, madison, mentor, painesville, perry, willoughby,commercial, marketing, advertising, executive, head shot, portrait, baby, children, family, high school senior, family reunion, underwater, scuba diving, pool party, wedding, bride, groom,"> 
<meta name="y_key" content="7b00158550200c1c"> 
<meta name="y_key" content="b5a3e0c1d778ff8a"> 
<meta name="msvalidate.01" content="7C6C4CEC2EB84051B1DCFEC558B77724" /> 
<meta name="verify-v1" content="G4nmk0aesZsCjneBo0W6kVlv5NpImVnTfsQ+fXEk1fA=" /> 
<meta name="viewport" content=”width=320,user-scalable=false”> 

Answer 8

A partir de ahora (2014)

Es posible que no necesite sitio separado para dispositivos móviles en lugar podemos ir para libaries front-end como Twitter Bootstrap que utiliza sensible representación por lo que se adapta sitio en sí al tamaño de pantalla ya sea Tablet o dispositivo móvil o escritorio

Una de las principales ventajas es que requiere menos mantenimiento en comparación con tener sitios web separados para dispositivos móviles y de escritorio.

saber más sobre Twitter Bootstrap clic here