Successfully reported this slideshow.
Tendencias 2013
Maquetación en diferentes browsers y dispositivos | Responsive vs. Adaptive
TENDENCIAS
▐ Consideraciones para diferentes browsers
▐ Viabilidad en cada browser
▐ Dispositivos (mobile y tabletas)
CONSIDERACIONES PARA DIFERENTES BROWSERS
|Tradicionalmente los websites o plataformas online se verifican para los
siguien...
CONSIDERACIONES PARA DIFERENTES BROWSERS
|Sobre Explorer 9
CONSIDERACIONES PARA DIFERENTES BROWSERS
|Sobre Explorer 7
DISPOSITIVOS: MOBILE Y TABLETAS
| Mediante las mismas herramientas de medición y estadísticas, resulta
necesario analizar ...
DISPOSITIVOS: MOBILE Y TABLETAS
|Ejemplo de estructura responsive
DISPOSITIVOS: MOBILE Y TABLETAS
|Ejemplo de implementación responsive
DISPOSITIVOS: MOBILE Y TABLETAS
|Ejemplo de implementación adaptive
CASO: Provincia NET. Aplicación para geolocalización d...
DISPOSITIVOS: MOBILE Y TABLETAS
|Ejemplo de implementación adaptive
CASO: Provincia NET. Aplicación para geolocalización d...
DISPOSITIVOS: MOBILE Y TABLETAS
|Ejemplo de implementación adaptive
CASO: Buenas Vibras Viajes. Web mobile
DISPOSITIVOS: MOBILE Y TABLETAS
|Algunas estadísticas de usos
Referencia: Online Marketing Day, Julio de 2013
DISPOSITIVOS: MOBILE Y TABLETAS
|Algunas estadísticas de usos
Referencia: Online Marketing Day, Julio de 2013
DISPOSITIVOS: MOBILE Y TABLETAS
|Algunas estadísticas de usos
Referencia: Online Marketing Day, Julio de 2013
Luciana Monaco
Vanesa Gambirazio
www. id4you.com
Monroe 4181 PB A | CABA | Argentina
Upcoming SlideShare
Loading in …5
×

Tendencias de maquetacion

545 views

Published on

Presentación que compara los tipos de maquetación cunpliendo con standares de Responsive design y Adaptive Design según tipo de proyecto o dispositivo en el que vaa ser navegado un sitio web o plataforma.

Published in: Design
  • Be the first to comment

Tendencias de maquetacion

  1. 1. Tendencias 2013 Maquetación en diferentes browsers y dispositivos | Responsive vs. Adaptive
  2. 2. TENDENCIAS ▐ Consideraciones para diferentes browsers ▐ Viabilidad en cada browser ▐ Dispositivos (mobile y tabletas)
  3. 3. CONSIDERACIONES PARA DIFERENTES BROWSERS |Tradicionalmente los websites o plataformas online se verifican para los siguientes exploradores en una pc: Explorer (8, 9 y 10), Chrome, Firefox, Safari. | Es indispensable definir, mediante herramientas de medición y estadísticas (por ejemplo, Google Analytics) si también se debe verificar dicha plataforma en Explorer 7. Esta versión del explorador suele restringir las elecciones del tipo de desarrollo a proponer. | Por ejemplo, ciertas formas en el diseño (bordes redondeados, sombras aplicadas por css) no se ven. Por ejemplo: http://www.krikos.com.ar/facturasdemo/Home/login
  4. 4. CONSIDERACIONES PARA DIFERENTES BROWSERS |Sobre Explorer 9
  5. 5. CONSIDERACIONES PARA DIFERENTES BROWSERS |Sobre Explorer 7
  6. 6. DISPOSITIVOS: MOBILE Y TABLETAS | Mediante las mismas herramientas de medición y estadísticas, resulta necesario analizar las plataformas, dispositivos sobre las cuales va a ser requerimiento replantear la plataforma. | Para ello se debe plantear, a su vez, si la maquetación a utilizar será Responsive o Adaptive. Maquetación Responsive: Este tipo de maquetación se realiza a través del uso de una grilla que permita adaptar una misma estructura maquetada a diferentes dispositivos. Se utiliza un solo css que divide por módulos la estructura y los adapta a, visualización en PC, tabletas y dispositivos móviles. Maquetación Adaptive: Este tipo de maquetación se realiza adaptando un css para cada dispositivo específico (con diferentes anchos y altos de pantalla).
  7. 7. DISPOSITIVOS: MOBILE Y TABLETAS |Ejemplo de estructura responsive
  8. 8. DISPOSITIVOS: MOBILE Y TABLETAS |Ejemplo de implementación responsive
  9. 9. DISPOSITIVOS: MOBILE Y TABLETAS |Ejemplo de implementación adaptive CASO: Provincia NET. Aplicación para geolocalización de sucursales
  10. 10. DISPOSITIVOS: MOBILE Y TABLETAS |Ejemplo de implementación adaptive CASO: Provincia NET. Aplicación para geolocalización de sucursales
  11. 11. DISPOSITIVOS: MOBILE Y TABLETAS |Ejemplo de implementación adaptive CASO: Buenas Vibras Viajes. Web mobile
  12. 12. DISPOSITIVOS: MOBILE Y TABLETAS |Algunas estadísticas de usos Referencia: Online Marketing Day, Julio de 2013
  13. 13. DISPOSITIVOS: MOBILE Y TABLETAS |Algunas estadísticas de usos Referencia: Online Marketing Day, Julio de 2013
  14. 14. DISPOSITIVOS: MOBILE Y TABLETAS |Algunas estadísticas de usos Referencia: Online Marketing Day, Julio de 2013
  15. 15. Luciana Monaco Vanesa Gambirazio www. id4you.com Monroe 4181 PB A | CABA | Argentina

×