• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Joomla!day2013 Albacete Spain, Responsive, Adaptive y la tundra
 

Joomla!day2013 Albacete Spain, Responsive, Adaptive y la tundra

on

  • 513 views

En esta charla realizada en el Joomla!Day 2013 Albacete, Hablo sobre Responsive, Adaptive , apps a nivel conceptual con el objetivo de diferenciar las diferentes técnicas para adaptar la web a los ...

En esta charla realizada en el Joomla!Day 2013 Albacete, Hablo sobre Responsive, Adaptive , apps a nivel conceptual con el objetivo de diferenciar las diferentes técnicas para adaptar la web a los diferentes dispositivos.

El incremento de acceso a webs vía dispositivos móviles está en aumento. El ratio de conversión de compras vía app desde tableta es más alto que vía ordenador. Las webs tienden a ser multidispositivo: la misma web se puede visualizar en ordenador, móvil, tablet, Smart TV.

Statistics

Views

Total Views
513
Views on SlideShare
356
Embed Views
157

Actions

Likes
1
Downloads
3
Comments
0

4 Embeds 157

http://www.webactualizable.com 131
http://www.arambee.com 15
https://twitter.com 9
http://20.arambee.com 2

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Joomla!day2013 Albacete Spain, Responsive, Adaptive y la tundra Joomla!day2013 Albacete Spain, Responsive, Adaptive y la tundra Presentation Transcript

    • Jordi Catà – arambee.com - @jordicata Responsive, adaptive ...y la tundra (de apps)
    • Ingeniero Informático > 12 años de experiencia Web, programación 3D: motores gráficos, ... Empecé con Mambo en el 2005 y luego Joomla ... El día a día: Ecommerce, Joomla, Symfony 2, Prestashop, Scrum... Conferenciante – Joomla!Day 2009, 2010, 2012, Hoy :-) – PHPConference 2009 – EcommRetail (2010, 2011), Eshow Madrid 2012 – Jornadas de Software Libre – Yuzz Girona (2011, 2012) www.arambee.com Mobile Commerce www.webactualizable.com Expertos en Joomla www.animalesadopcion.com Adóptalo y cuídalo Reviewer de: Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce Sobre mi: Jordi Catà
    • ¿ Conoceis el concepto Responsive ? ¿ Y adaptive ? ¿ cuantos developers ? ¿ cuantos diseñadores ? Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • NO ES UNA CHARLA TÉCNICA, ... al menos lo interaré
    • HABLAREMOS/DEBATIREMOS SOBRE Tendenciasmobile... “Conceptos” sobre Estrategias de “movilización”: Responsive, adaptive, WebApp, App, ... Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • ¿ que uso haceis del móvil ? ¿ y de la tablet ? ¿ realizais compras vía móvil/tablet ? Desde donde ? Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • 22% de las búsquedas en Google son desde dispositivos móviles Más del 30% de les visitas son a traves de dispositivos móviles Constante crecimientode les compras via móvil, sobretodo tablets 1 de cada 3 europeos compra desde móviles TENDENCIAS GENERALES Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • 63% penetración dispositivos móviles 24% penetración de tablets 44% de internatuas entre 16 y 55 años compra online recurrentemente ¿Y qué compramos? Fuente: I estudio anual eCommerce IAB Spain TENDENCIAS ESPAÑA
    • 90 cm es la distancia máxima entre usuario y su móvil Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • – ¿Desde dónde se compra? 40% sala de estar 23% dormitorio 19% cocina 14% exterior 10% baño 63% compra via tables -> En 2017 subirá hastael 78% TENDENCIAS ESPAÑA
    • En España se preve un crecimiento anual hasta 2017 del 18%, llegando a los 9.100 M € España es el cuarto país de Europa en número compradores en internet. En 2012 el volúmen global de venta en e-commerce fue de: 447.058 M € Fuente: http://www.marketingdirecto.com/actualidad/digital/el-e-commerce-crecera-un-183-a-nivel-mundial-este-2013/ MERCADO ECOMMERCE -> mobile commerce Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • piensa en una web a la que hayas accedido con un móvil y/o tablet ... ¿ Que experiencias habeis tenido ? Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • Qué les pasa a nuestros clientes con ecommerce? > 30% visitas via móbiles y tablet Tiendas no optimizadas para estos dispositivos. Sólo el 20% de las empresas adaptan su web al móvil Se pierden el 40% de potenciales transacciones NECESIDADES A RESOLVER Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • Sólo el 20% empresas adaptan su web al móvil 62% abandonos cuando accedemos a una web no adaptada a dispositivos móviles Tendencia al alza de uso de dispositivos móviles !!! Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce ¿ INTERESANTE, NO ?
    • Como afrontamos la “movilización”, estrategias ● Responsive ● Adaptive ● App ● WebApp Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • RESPONSIVE WEB DESIGN podríamos definir el diseño Responsive como aquel que se ajusta de forma fluida a los cambios y responde para ajustarse a cualquier tamaño de pantalla o dispositivo Se basa en: -Fluid Grids -Flexible Media -Media Queries Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce ¿ como lo veis ?
    • Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce Créditos: Beyond Media Queries: Anatomy of an Adaptive Web Design – Brad Frost UNA WEB PARA GOVERNARLOS A TODOS...
    • Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce Créditos: Beyond Media Queries: Anatomy of an Adaptive Web Design – Brad Frost UNA WEB PARA GOVERNARLOS A TODOS...
    • RESPONSIVE WEB DESIGN: 1W– N DISPOSITIVOS WEB 500KB para todos los dispositivos !!!!
    • Créditos: Designing for mobile devices – Ester Serrano UNA WEB PARA GOVERNARLOS A TODOS... Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • ¿ RESPONSIVE WEB DESIGN PARA TODO ? -Imágenes flexibles -Videos flexibles -todo flexible Supongamos que la web envia 500 KB Esto es para todos los dispositivos Un movil puede gestionar tanta información ? Como gestiona el móvil el “formato” via jQuery ? No podemos definir estratégia móvil para cada dispositivo... Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • Créditos: Beyond Media Queries: Anatomy of an Adaptive Web Design – Brad Frost PERO EL RWD ES SOLO EL PRINCIPIO RESPONSIVE ADAPTIVE Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce PERO EL RWD ES SOLO EL PRINCIPIO Créditos: Beyond Media Queries: Anatomy of an Adaptive Web Design – Brad Frost
    • ADAPTIVE WEB DESIGN Se basa en la Mejora Progresiva (Progressive enhancement: PE) se basa en tres capas: -Content layer = rich semantic HTML markup -Presentation layer = CSS and styling -Client-side / server side scripting layer = JavaScript or jQuery behaviors Podríamos definir el Adaptive Web design como aquel que cambiará para ajustarse a un conjunto de tamaños de pantalla y dispositivos predefinidos. Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce 82% de los top 100 Site en Alexa usa algun tipo de detección de móbiles en el servidor
    • ADAPTIVE WEB DESIGN Ideal para mejorar la experiencia de usuario en su dispositivo y no sobrecargar Servimos el layout y medias especificos para cada dispositivo Dispositivo 1 -layout 1, imagenes 1 Dispositivo 2 -layout 2, imagenes 2 Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • RESS: RESPONSIVE + SERVER SIDE Detección del navegador Detección de prestaciones del dispositivo Mejora progresiva: Imagenes, videos, css Joomla! Day Albacete – spain 2013 Arambee.com: Mobile CommerceJoomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce AD A PTIVE ? 82% de los top 100 Site en Alexa usa algun tipo de detección de móviles en el servidor
    • RESS: RESPONSIVE + SERVER SIDE EJEMPLO Joomla! Day Albacete – spain 2013 Arambee.com: Mobile CommerceJoomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • APPs Notoriedad e imagen de marca Fidelización con el cliente Generación de ingresos Canal de venta Alta experiencia de usuario Joomla! Day Albacete – spain 2013 Arambee.com: Mobile CommerceJoomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce ¿ para vuestra web una web responsive, adaptive, app ?
    • DIFERENCIAS ENTRE WEB - APP Créditos: Mobile Commerce & Payment – Miriam Peláez Joomla! Day Albacete – spain 2013 Arambee.com: Mobile CommerceJoomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • LA WEBAPP EVOLUCIÓN Convina lo mejor de los dos mundos -App nativa para acceso a hardware y experiencia de usuario -Web responsive/adaptive para el resto Joomla! Day Albacete – spain 2013 Arambee.com: Mobile CommerceJoomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • Diseño responsive y adaptive para que la tienda se adapte a cualquier dispositivo Arquitectura y estructura específica para cada dispositivo Contenidos y comunicación enfocada a cada dispositivo Desktop Tablet Movil Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • Cada aproximación: Responsive, Adaptive, WebApp o Apps tienes tiene ventajas e inconvenientes Hay que valorar la mejor opción en cada proyecto. Concepto: mobile first Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • Una posible aproximación -Responsive para webs estandars -Adaptive para webs cuya experiencia de usuario/interacción sea importante y diferente para cada dispositivo -Web app, para aplicaciones que requieran acceso hardware y el resto Web responsive/adaptive -Apps para fidelización, compras recurrentes, imágen de marca, acceso a hardware y experiencia Joomla! Day Albacete – spain 2013 Arambee.com: Mobile Commerce
    • Una posible aproximación -Responsive para webs estandars -Adaptive para webs cuya experiencia de usuario/interacción sea importante y diferente para cada dispositivo -Web app, para aplicaciones que requieran acceso hardware y el resto Web responsive/adaptive -Apps para fidelización, compras recurrentes, imágen de marca, acceso a hardware y experiencia
    • Jordi Catà – jordi.cata@arambee.com Responsive, adaptive ...y la tundra (de apps) JOOMLA + GRACIAS = JOOMLACIAS