Introducción

¿Qué es SEO?

• SEO las siglas de Search Engine Optimization (optimización para motores de búsqueda).
• Normalmente nos referiremos a SEO como posicionamiento web.
• Estrategia a seguir para obtener enlaces entrantes desde otras páginas.
• Su objetivo es posicionar paginas en los primeros resultados de búsqueda para determinadas palabras clave.

¿Qué es SEM?

• Search Engine Marketing o marketing en buscadores.
• El SEM abarca todo lo que es publicidad PPC (Pago por click) pagada en los buscadores a través de herramientas como Google AdWords.
• Su objetivo es conocer las estrategias y técnicas con las que gestionar estos anuncios para atraer el mayor número de clics, que supongan el menor coste y máxima calidad de visita.

¿Qué es SMM?

• Social Media Marketing o Marketing en Medios Sociales.
• Surge con el boom de los medios sociales en Internet.
• El SMM implica la interacción entre la empresa/cliente con los usuarios finales con los que se quiere comunicar/hablar, utilizando plataformas en las que se encuentran los perfiles de cliente perfectos para debatir, opinar, sugerir, hablar….

¿Qué es SMO?

• Social Media Optimization. Es el posicionamiento en Medios Sociales.
• Su objetivo es conocer las distintas plataformas en las que se pueda realizar la promoción de unos contenidos (videos, blogs, perfiles) en la red de medios sociales.

Los dominios

¿Cuánto cuesta un dominio?

• Desde 5 o 6€ por su registro anual hasta...
• Sex.com se vendió en el 2006 por 13 millones de dólares
• [www.sedo.com Sedo:] The world's leading domain marketplace

Ejemplo CSS Mobile First

• Las media queries en ems en vez de pixeles para asegurarnos que el layout se adaptará al cambio del tamaño de las fuentes, además de al ancho de pantalla.
• Para calcular la anchura en ems, se divide en ancho de nuestro objetivo entre 16px (tamaño de letra por defecto)
• Aplicaciones Web accesibles via navegador

/* Start with core styles outside of a media query that apply to mobile and up */
/* Global typography and design elements, stacked containers */
body { font-family: Helvetica, san-serif; }
H1 { color: green; }
a:link { color:purple; }
 
/* Stack the two content containers */
.main,
.sidebar { display:block; width:100%; }
 
/* First breakpoint at 576px */
/* Inherits mobile styles, but floats containers to make columns */
@media all and (min-width: 36em){
	.main { float: left; width:60%; }
	.sidebar { float: left; width:40%; }
}
 
/* Second breakpoint at 800px */
/* Adjusts column proportions, tweaks base H1 */
@media all and (min-width: 50em){
	.main { width:70%; }
	.sidebar { width:30%; }
 
	/* You can also tweak any other styles in a breakpoint */
	H1 { color: blue; font-size:1.2em }
}

Tipo de aplicaciones Web con PhoneGap

• PhoneGap sirve para realizar aplicaciones que utilicen las características del dispositivo:
  

Camara, GPS, libreta de teléfonos....

• La mayoría de las aplicaciones web basadas en PhoneGap consumirán mediante javascript servicios web
• Ejemplos de aplicaciones de este tipo serían Google Maps, FourSquare...

Necesidades en desarrollos web para móviles

• Desarrollo de la aplicación para varias plataformas
• La experiencia de usuario en la aplicación debe ser consistente entre plataformas:

Un usuario puede migrar de SO incluso utilizar varios

La experiencia de usuario podría variar entre dispositivos en función de las características y capacidades de los dispositivos

• Varios equipos de desarrollo no siempre es la mejor opción, por las necesidades de coordinación inherentes.

PhoneGap

• Se basa en la parte común de todos los dispositivos móviles: el navegador
• Los nuevos navegadores se adhieren a estándares como HTML5/CSS3.
• HTML5 nos da mucha funcionalidad: procesos en background mediante web workers, soporte offline, base de datos...
• CSS3 permite que nos despidamos de flash para realizar gradientes, bordes redondeados, páginas responsivas, vistas de impresión, etc.
• Todas las plataformas móviles excepto Windows 7 Phone utilizan un navegador basado en webkit

Webviews

• Piensa en una aplicación PhoneGap como un navegador embebido dentro de la aplicación y que ejecuta HMTL5/CSS.
• Estos navegadores embebidos es lo que se conoce como webview
• Cada una de las pantallas de nuestra aplicación será un webview.
• Desde el webview ejecutaremos código JavaScript que comunicará con código nativo del dispositivo.
• Todos los dispositivos permiten al código en JavaScript hacer llamadas a código nativo en Java/C++/Objective C y al revés.