c# - una - Diseño de sitios web para dispositivos móviles

crear pagina web para celulares

Question

Acabo de agregar la capacidad de impresión a un sitio web usando una hoja de estilo (es decir, @media print, etc.) y me preguntaba si podría usar un método similar para agregar soporte para dispositivos móviles.

Si no, ¿cómo detecto un dispositivo móvil? Mis páginas son C # (.aspx) y me gustaría reducir las páginas para facilitar su uso en un dispositivo móvil.

Algún consejo para mi?

EDITAR: Mi esposa tiene un BlackBerry, por lo que en un miminum me gustaría habilitar el sitio web de nuestra compañía para eso.

Answer 1

Es posible que desee utilizar algo como WURFL , que es una base de datos bastante buena que sabe mucho sobre los dispositivos y sus agentes de usuario, si las otras soluciones no funcionan.

Y por favor, recuerda reducir los tamaños de descarga :)

Answer 2

Los navegadores para dispositivos móviles son una verdadera hodge-podge en términos de lo que admiten, ya sea que sigan el atributo "media" en sus estilos, etc.

Diría que apunte a la mejora progresiva (que es uno de una serie de artículos) y asegúrese de que si el navegador solo entiende HTML simple, su contenido aún se puede ver y en el orden correcto; por ejemplo, quiere que su contenido principal aparezca antes la barra lateral en el código, ya que el contenido principal es más importante.

Un recurso de aspecto decente fue mencionado en el artículo anterior.

Answer 3

No estoy seguro de cómo el iPhone / iPod Touch se declaran al solicitar la hoja de estilo, pero para la mayoría, usar

<style type="text/css">
    @media handheld
    {
      /* handheld styles */
    }
</style>

debería hacer el truco. Funciona de la misma manera que @media print (o no).

Para obtener una lista completa de los tipos de medios, consulte aquí.

Answer 4

Querrá echar un vistazo al tipo de agente de usuario que tiene y ver si es un dispositivo móvil. El siguiente código sería un ejemplo de esto:

public static bool IsMobile(string userAgent)
{
    userAgent = userAgent.ToLower();

    return userAgent.Contains("iphone") |
         userAgent.Contains("ppc") |
         userAgent.Contains("windows ce") |
         userAgent.Contains("blackberry") |
         userAgent.Contains("opera mini") |
         userAgent.Contains("mobile") |
         userAgent.Contains("palm") |
         userAgent.Contains("portable");
}

Eso debería funcionar en la mayoría de los casos! Este enlace también puede ayudarte a ser más específico.

Answer 5

La mejor manera de hacer todo esto es hacerlo a nivel de servidor.

Use un servicio web para verificar si el visitante es un dispositivo móvil y entregue su resultado de acuerdo con esto. Use la misma URL y realice la misma lógica comercial en su aplicación: simplemente cambie la capa de visualización de su aplicación.

Una gran opción es Wapple Architect (http://wapple.net): le permite hacer estas comprobaciones a nivel de servidor con algunos servicios web y luego realizar lógica y agregar código si se trata de un dispositivo móvil.

Definitivamente vale la pena mirar.

Answer 6

¡Mira esto! ¡Es genial! http://mobstac.com/developer/

¡La plataforma API MobStac es la forma más rápida de crear y administrar sitios móviles! Usted obtiene acceso a la documentación del desarrollador y las claves de API.