Web adaptativa ( RWD): diseño web+ móvil + SEO

19/02/2014 2

PROGRAMA

I. ¿ Qué es WSI?II. Un mundo móvil y multidispositivoIII. ¿ Qué es una web adaptativa?IV. Ventajas de la web adaptativaV. ¿ Qué nos dice Google?VI. Ejemplos prácticosVII.Preguntas

WSI ESPAÑA

• Más de veinte consultores• Formación actualizada

periódicamente• Herramientas de

comunicación interna y con consultores extranjeros

• Acceso a más de 100 proveedores con diferentes especializaciones

19/02/2014 3

CONSULTORÍA PRODUCTOS DIGITALES

Webscan ®

Formación sobre productos digitales

Coaching a gerentes y empleados

FORMACIÓN /COACHING

Analítica Web

Análisis de Competencia

Estrategia de Marketing Digital

Monitoring

IBA ®

Redes Sociales

Mobile Marketing

SEO SEM

Diseño WebE-commerce

Lead Generation, Reputación Online,

Comunicación

Conversión

Modernizar Conocimiento

Definir Políticas

Asesoramiento Continuo en

Estrategias y Políticas de Marketing Digital

SNuestros Servicios

El mundo es móvil

– 30-35% búsquedas on line por móviles, 2015 + 50%– Enorme diversificación de productos: móviles, tabletas

España 2013– Penetración Internet móvil 84% vs 79% mercados maduros– 25% internautas hace compras con móvil– Smartphones 82% vs media 67% mercados maduros– Tabletas 23%, doble que Europa y triple que el mundo

ESPAÑA LIDER EUROPEO EN DISPOSITIVOS MOVILES

19/02/2014 5

Los clientes también

• USA: más de 30% responsables de compras de empresas rechazaron hacer negocios con empresas porque su web no era navegable móvil

• 80% de internautas buscan información para compras desde el móvil, incluso en su casa ( 50%): showrooming, SOPO, ZMOT

• USA: 56% clientes dispuestos a gastarse más en tiendas on line navegables por el móvil, 67% prefiere comprar web optimizada, 74% volvería

• 90% usuarios utilizan dispositivos de forma secuencial: : campañas realzadas de Adwords

19/02/2014 6

…Pero las webs no

– 90% de las webs no navegables por el móvil– Sólo 2 empresas IBEX con web adaptada a móvil– Poca concienciación y no sólo en B2B– Si un cliente potencial no puede utilizar la página web

correctamente en un teléfono inteligente o una tablet, puede interrumpir su ciclo de compra y enviarle directamente hacia la competencia

OPORTUNIDAD PERDIDA¿ SE LO PUEDE PERMITIR?

19/02/2014 7

• Diseño Web Adaptativo :permite ver el contenido de la propia web ajustado a las dimensiones y características técnicas del dispositivo, es decir, adapta automáticamente las páginas web al entorno del usuario

• http://quirktools.com/screenfly/

¿ Qué es el diseño adaptativo?

19/02/2014 8

Ventajas de la web adaptativa

• Adaptación perfecta del contenido de la web al dispositivo desde el que se visita conservando siempre la calidad de la información

• Se evita abandono de clientes y fuga a la competencia• URL única, se evita el problema de los redireccionamientos.• Se gestiona el contenido una sola vez• Mejor solución para el SEO y PPC• Muy eficiente para tiendas on line• Simplifica analítica• https://www.youtube.com/watch?v=hvtTFXWXfKQ&feature=y

outu.be

19/02/2014 9

Qué nos dice Google

• https://developers.google.com/webmasters/smartphone-sites/detailsWhy responsive designWe recommend using responsive web design because it has many good aspects:Using a single URL for a piece of content makes it easier for your users to interact with, share, and link to your content, and a single URL for the content helps Google's algorithms assign the indexing properties for the content.No redirection is needed for users to get to the device-optimized view, which reduces loading time. Also, user agent-based redirection is error-prone and can degrade your site's user experience (see "Pitfalls when detecting user agents" section for details).It saves resources for both your site and Google's crawlers. For responsive web design pages, any Googlebot user agents needs to crawl your pages once, as opposed to crawling multiple times with different user agents, to retrieve your content. This improvement in crawling efficiency can indirectly help Google index more of the site's contents and keep it appropriately fresh.

• Campañas mejoradas de Adwords: dar respuesta a búsquedas multidispositivos• https://www.youtube.com/watch?v=yV9rzYo4Jrk

Requisitos técnicos

• No todas las webs son adaptables a diseño adaptativo

• Muchas veces es mejor empezar web desde 0• Programación HTML5 • CSS3

19/02/2014 11

Tiendas on line

• Fundamental que sean navegables por todo tipo de dispositivos

• Gran ventaja competitiva para SEO y para SEM• Muchas plataformas:– Tiendas con mucho contenido– Tiendas que son un mero catálogo– Tiendas con capacidades ( y precios)muy diversos– Muchas plataformas con posibilidades de adaptar

diseño

19/02/2014 12

Web adapativa vs aplicación

• Funcionalidades diferentes• APP mejor para:– Funcionalidades concretas– Imagen de marca– Presencia permanente en móvil– Más caras de desarrollo y gestión

• RWD mejor para– Funcionalidades estándar– Comunicación e imagen corporativa– Economía de desarrollo y gestión

19/02/2014 13

EJEMPLOS

• www.cositasdeines.com/es/• www.jardinelbotero.com/• www.despedidas-de-soltero.org• www.carmenastete.com

19/02/2014 14

CONTACTENOS

• http://www.wsiluisbroto.com

• Luis Broto: 628 29 05 22

• E-mail: lbroto@wsiluisbroto.com

• www.facebook.com/LuisBrotoWSI

https://twitter.com/WSILuisBroto

• http://es.linkedin.com/in/luisbrotorodriguez

19/02/2014 15

MUCHAS GRACIAS

19/02/2014 16