Ahora la gente ver las páginas web en todo, desde pequeñas pantallas de teléfonos celulares a los proyectores que iluminan el lado de un granero. Las limitaciones que enfrenta en el diseño web móvil para la pantalla del iPhone pequeños pueden sentirse como pintar huevos de Pascua en una camisa de fuerza. E incluso los profesionales experimentados encuentran el diseño de sitios web para móviles que parecen grandes en las pantallas de todos los tamaños y dimensiones desafiantes - incluso en la pantalla del iPhone mancha de aspecto.
Uno de los aspectos más interesantes de la creación de sitios web para el iPhone, iPad y iPod touch es que te ofrecen la oportunidad de replantear por completo la forma en que el diseño para Internet.
El diseño es muy subjetivo - que sea el amor de color rosa o te odian y probablemente no es mucho lo que podemos hacer para cambiar de opinión. Pero más allá de las opciones de color y preferencias de fuentes (que dejamos de usted), aquí hay dos enfoques para el diseño web móvil para el iPhone y el iPad:
Crear varios diseños para una visualización óptima en el iPhone, iPad y iPod touch. Esta estrategia le permite hacer el mejor uso de la pantalla, ya sea en modo retrato o paisaje. También puede tomar ventaja de la pantalla del iPad más grande, mientras que la pervivencia de un diseño de una sola columna que mejor funciona en el iPhone e iPod touch. La creación de estos diseños es, por supuesto, más mano de obra que la creación de una página Web o una página web para móviles. Si su público utiliza los dispositivos móviles como el iPhone y el iPad para visitar su sitio web, sin embargo, el trabajo vale la pena el esfuerzo.
El diseño de un diseño de página flexible que puede adaptarse a las diferencias de tamaño de un iPhone, iPad y los ordenadores portátiles y los monitores incluso gente todavía mantener en sus escritorios. Si elige esta estrategia de diseño web móvil, usted no tiene la flexibilidad que dirigen diseños ofrecen. Puede ofrecer un sitio web que cumpla con las necesidades de sus visitantes y funciona bien en una gama de dispositivos por pegar a algunas pautas. En primer lugar, no utilice Flash en su diseño de sitios web, ya que Flash no funciona en el iPhone o el iPad. También, usted quiere que su sitio para llenar la pantalla en un iPad en modo vertical, por lo que no cortó la longitud de la página en 600 píxeles. En su lugar, el tamaño de la página a 980 píxeles de ancho por lo menos 980 píxeles de largo. Por último, pero no menos importante, al probar, ver su sitio en los dispositivos más importantes para su público, asegurándose de que las imágenes se cargan rápidamente y buscar clara, no importa lo que los tamaños de las pantallas de sus visitantes son.
Optimización de Diseños Web Móvil para el iPhone
Sí, la pantalla del iPhone es pequeño, pero usted debe dejar de pensar en las limitaciones y empezar a centrarse en las increíbles nuevas oportunidades iPhone ofrece diseño web - como atraer a un público de personas en movimiento, las personas que puedan estar de pie justo afuera de su restaurante, por ejemplo, mientras miran a su menú en sus iPhones y considerar si para comer allí.
Al diseñar un sitio web para el iPhone, recuerde los siguientes puntos clave:
Cada pixel cuenta. Usted no tiene mucho espacio para jugar, así que asegúrese de no perder un solo píxel en sus diseños web para móviles.
Crear diseños móvil iPhone con sólo una columna de información. Diseños de varias columnas simplemente no encajan bien en las pequeñas pantallas como la pantalla del iPhone.
Cuando se crea un diseño especial para el iPhone, asegúrese de incluir un enlace a la versión de escritorio de su sitio web. Los visitantes a su sitio web para móviles ya pueden estar familiarizados con la versión de escritorio y pueden preferir visitar la versión que ya es familiar para ellos, incluso si están usando un iPhone. La versión móvil del navegador Safari tiene como objetivo mostrar cualquier sitio de escritorio, así como una computadora de escritorio hace, y con la excepción del tamaño de la pantalla más pequeña, se trata de cerca maldita.
Cómo crear iPad-Friendly Mobile Web Designs
El iPad, con su hermosa pantalla grande, puede llevar a creer que no es necesario hacer nada especial en el diseño de su web móvil, pero las mejores técnicas de diseño web para el iPad no son los mismos que para el escritorio.
Aunque el iPad ofrece mucho más espacio en pantalla que el iPhone, todavía crea nuevos retos para los diseñadores web para móviles. Recuerde la siguiente hora de diseñar sitios web para móviles para el iPad:
Diseñar para ambas orientaciones: La capacidad de convertir el iPad de modo horizontal a vertical altera drásticamente el espacio de pantalla para sus diseños web.
Aproveche al máximo HTML5 y CSS 3: Cuando usted está diseñando para el IPAD, usted no tiene que preocuparse de todos los navegadores web que aún se utilizan en equipos de escritorio, para que puedas aprovechar al máximo la última de estas tecnologías de diseño web.
IPad Prueba diseña en un iPad: Al crear contenido para el iPad, es probable que el uso de una máquina que es muy diferente de la del iPad. No pruebe su trabajo en el mismo lugar que la desarrolla. Usted todavía puede tener que hacer la mayor parte del diseño y codificación de sus sitios iPad mientras está sentado en un ordenador de sobremesa o portátil, pero cuando haya terminado, levantarse, estirarse, y ir a sentarse en una silla cómoda para ver cómo su sitio web se ve y funciona en un iPad.
Pon a prueba tus páginas web diseños en diferentes situaciones de iluminación. Tome el iPad fuera para ver cómo sus páginas se ven en la luz del sol, y llevar el iPad a la cama con usted para ver cómo el diseño de su web móvil se ve cuando se oculta en la oscuridad debajo de las sábanas. (¿No te encanta no tener una linterna para leer en el iPad, como lo hicimos cuando nos queríamos quedarnos hasta tarde para leer libros como los niños?)
Crear diseños web específicas para iPhone y iPad
Crear diseños web para el ipad
Imágenes del diseño para el iphone y el ipad
¿Cómo los usuarios a navegar en un mundo de la pantalla táctil
Optimizar diseños web para el iphone
Diseños de página para vista horizontal y vertical
Prueba iphone diseños con safari