1. CASO PRACTICO
Recibimos el encargo de ayudar a una empresa con su posicionamiento móvil. Las premisas son:

Es una empresa de eventos todo tipo, por tanto su negocio está en la venta de ticketing y
merchandising.

Una empresa tradicional pero que adoptó las nuevas tecnologías y no las tiene miedo,
sabedora de que la venta de tickets para eventos es algo que tiene en Internet su canal
principal.

En 2011 realizaron una web dedicada a móviles, que consta de una página principal con
look-and-feel de aplicación, llena de botones que son accesos directos a los espectáculos
o eventos que vende, y al funnel de venta que, aunque optimizado para móviles, lleva 3
años sin tocarse.

Su web de escritorio es activa en contenidos. Cada mes actualizan los eventos que venden
a nivel nacional, tienen páginas dedicadas a grupos, recintos, empresas de eventos,
contenido y páginas dedicadas a estilos de vida (outdoors, deportes extremos donde
suelen organizarse eventos, espectáculos depotivos etc). Tienen una gran cantidad de
visitas mensuales (100.000 visitas al mes aprox), con grandes picos en momentos
puntuales (venta de tickets para un concierto, un gran premio de Moto GP..)

Su web dedicada a móviles está obsoleta. Aunque el usuario puede acceder a todos los
eventos, no tienen capacidad ni flexibilidad para generar contenido para a web móvil. Por
tanto, el usuario ha de entrar a la web móvil, ir a “comprar entradas”, y buscar en u largo
menú desplegable, todos los eventos que la compañía vende. El usuario sólo puede filtrar
por provincia.
La empresa en cuestión tiene presencia en toda Europa occidental, encontrándose con el mismo
problema. Aunque la gestión de la web y web móvil está delegada en cada país, se pretende dar
con una solución que valga para todos. Los problemas encontrados en Europa son los mismos que
en España o peores, con muchos países que no cuentan ni con web adaptada a móviles.
La empresa está dispuesta a gastar lo que haga falta en la estrategia y posicionamiento móvil. No
prevén migrar ni cambiar su actual página web que, aunque puede ser mejorada, les está
funcionando muy bien. Tampoco tienen clara la estrategia a seguir en móvil ni cómo posicionarse
en búsquedas móviles, por lo que recurren a nosotros.
Realiza una propuesta de proyecto a este cliente desde el punto de vista de consultor especialista
en SEO y SEO móvil y siguiendo lo aprendido en las clases.
No olvides que para evaluar el trabajo has de :

Analizar la industria, necesidades de la empresa y objetivos.

Realizar un Keyword Research y Keyword Research Móvil (al tener una semana, no hace
falta que sea muy profundo, pero sí trabajado).

Plantearse todas las opciones, especialmente web dedicada a móvil, Responsive Design y
Dynamic Serving y contestar, para este caso, las siguientes preguntas (las respuestas no
han de ser genéricas, sino ya específicas)

2. 
¿Por qué elegiría una web dedicada a móvil? ¿Qué retos y dificultades me
presentan la web dedicada móvil para este cliente? ¿Cómo los resolvería y qué
probabilidades de éxito, en el largo plazo, tiene esta tecnología tanto para el cliente
como para el posicionamiento?

¿Por qué elegiría una web en Responsive Design? ¿Qué dificultades y retos
presenta esta tecnología para este cliente? ¿Qué probabilidades de éxito para el
cliente tiene esta tecnología a largo plazo?

¿Por qué elegiría una web en Dynamic serving? ¿Qué dificultades y retos presenta
esta tecnología para este cliente? ¿Qué probabilidades de éxito para el cliente
tiene esta tecnología a largo plazo?

Elige por un lado la opción de desarrollo de web móvil que creas más adecuada y razona
por qué, para este cliente, sería la mejor opción para su posicionamiento y consecución de
objetivos móviles.

Crea tu Arquitectura de Información ideal para el posicionamiento móvil (si eliges
Responsive o Dynamic serving, ésta ha de servir para desktop y móvil) y un wireframe de
la home móvil (sólo de la home, sólo para móvil).

Crea un análisis DAFO (SWOT) del proyecto con la tecnología elegida y la estrategia de
SEO móvil.
Objetivos del caso: Que el alumno aplique todos los conocimientos aprendidos en el curso en un
caso que se asemeja a la realidad de la mayoría de empresas no sólo en España, sino en el
mundo. Hacer al alumno pensar, tomar una decisión y razonarla.
Criterios de evaluación para el alumno: El caso presenta problemas y retos se elija la opción
que se elija, no habiendo una solución única o perfecta. Es el plan y la propuesta de proyecto así
como la estrategia lo que determinará la nota. Hacer un buen keyword research (y usar la
herramienta Bing Ads Intelligence), averiguar necesidades únicas del usuario móvil de esta
industria y proveer de respuestas y soluciones adecuadas a esas necesidades determinarán la
evaluación del alumno.

3. Keyword research mobile
De lo observado se deduce el poco interés de parte de Europa, en los eventos deportivos.
Excepto España.

4. ANALISIS FODA
Debilidades
Fortalezas
Oportunidades
Amenazas
Web optimizada hace 3 años
Web obsoleta
Gran cantidad de ventas mes
Venta de tickets y merchadising
Presencia en toda Europa occidental
Aparezca otra empresa para vender tickets
Elegiría Responsive Design , porque hace referencia a las técnicas para construir una
única web auto-adaptable y preparada para ser visualizada en cualquier dispositivo que
haya hoy día en el mercado.Tener siempre la misma URL para todas las páginas.
Adapta y ajusta los contenidos y el interfaz de la web al ancho de un móvil o una
Tablet, evitando siempre que el usuario haga scroll horizontal.
A través del media queries , se logrará ajustar el diseño al ancho de pantalla.
<link rel="stylesheet" media="screen and (max-width: 400px)"href="smallScreen.css" />
Es una buena práctica, meter la Media Query al final del CSS,
Al ser una web hecha exclusivamente para su visualización en móviles, el desarrollo de
la misma es independiente y al margen de la web principal de escritorio. Por tanto los
pasos
a seguir son, en teoría, simples:
Crear el HTML que se adaptará al ancho de un Smartphone.
Crear la carpeta en nuestro servidor que alojará ese nuevo desarrollo.
Configurar el user-agent y los redireccionamientos para mostrar la web móvil cuando
proceda, así como el subdominio (como hemos visto, m.misitio.com).
Configurar la cabecera HTTP Vary a nivel servidor.
Generar el contenido para móviles.
Siendo un estándar relativamente fácil de entender, sin las limitaciones y
consideraciones técnicas que podría suponer el Responsive Design
(admitámoslo,desarrollar en Responsive con el móvil en mente nos puede limitar cierta
creatividad y

5. recursos), no ha sido un recurso muy del agrado del usuario común de Internet y de
teléfonos móviles. ¿Por qué?
Principalmente porque han sido webs que no han tenido prioridad y se las ha considerado
secundarias, estando el foco siempre en la web de escritorio.
Porque han sido versiones “mini” y reducidas de la web principal, ocultando
información o siendo ésta mucho más escasa que la información principal.
Aunque han sido webs hechas para móviles, la experiencia de usuario ha dejado mucho que
desear.
Porque el usuario, ante la mala experiencia de usuario que generalmente han mostrado las
webs dedicadas a móviles, ha preferido irse a la versión de escritorio.
Porque en una Tablet, la web dedicada a móviles no tiene sentido y su visualización es
pobre y mala.
Configuración técnica SEO
Una ventaja de la web dedicada a móvil es el hecho de poder realizar campañas de
posicionamiento específicas, haciendo uso y optimizando las keywords que más utilizan
los usuarios móviles.
El gran reto, no obstante, es que con el móvil el “Long Tail” es, cada vez, más corto.
Al buscar por móvil, los usuarios buscan términos más genéricos debido a lo poco
conveniente que es usar el teclado móvil.
¿Cuál es el objetivo de mi web móvil? ¿Una llamada de teléfono? ¿Mostrar cómo llegar a
mi negocio? ¿Captar un lead? ¿Descarga de información (y captar ese lead)? ¿La llamada
de uno de mis comerciales? Probablemente el objetivo principal de una web dedicada a
móviles sea diferente al de la web Desktop.
Uno de los principales riesgos a la hora de hacer una web dedicada para móviles es caer
en contenido duplicado. Para evitar esta mala práctica así como otros errores de
configuración, hemos de realizar lo siguiente.
Robots.txt
Una web dedicada a móviles no deja de ser una web más, específica, y como tal, ha de
contar con los mismos elementos que su homónima de escritorio.
A la hora de rellenar el fichero robots.txt, hay dos aproximaciones, aunque es errónea.
Bloquear el acceso a Google a nuestra web móvil para evitar que nuestra web pueda ser
penalizada por contenido duplicado (mismo contenido en lo que para google son dos webs
diferentes, la de escritorio y la móvil). La configuración
sería así.
La segunda opción es configurar el robots.txt de una forma estándar, como haríamos con
cualquier otra web.
La recomendación es siempre la segunda opción. Bloqueando el acceso a Google y otros
buscadores a nuestra web móvil no es optimizar ni hacer SEO, sino todo lo contrario.
Por tanto, la opción recomendada es la segunda, pero esto no influye ni nos protege de
poder ser penalizados por contenido duplicado.
evitar caer en contenido duplicado es como veremos a continuación.
Etiquetas Switchboad
Podemos definir las etiquetas Switchboard como aquellas etiquetas que, por un
lado,indican a los buscadores la página adaptada a móvil que corresponde a una
determinada web de escritorio, y por otro lado indican cuál y dónde está el contenido
original que el buscador ha de priorizar.
Son, por así llamarlas, las canónicas del móvil

6. Opción 1 (recomendado porque es más fácil no cometer errores)
Introducimos la siguiente etiqueta HTML en una página de escritorio
<link rel=”alternate” media=”only screen and (max-width: 640px)”
href=”http://m.example.com/page-1″ >
Introducimos la URL canónica en la página móvil que correspondería en el ejemplo de
arriba
<link rel=”canonical” href=”http://www.example.com/page-1” >
Opción 2
En el fichero sitemap.xml, introducimos el siguiente código.
<?xml version=”1.0″ encoding=”UTF-8″?>
<urlset xmlns=”http://www.sitemaps.org/schemas/sitemap/0.9″
xmlns:xhtml=”http://www.w3.org/1999/xhtml”>
<url>
<loc>http://www.example.com/page-1/</loc>
<xhtml:link
rel=”alternate”
media=”only screen and (max-width: 640px)”
href=”http://m.example.com/page-1″/>
</url>
</urlset>
Hay que repetir este código tantas veces como páginas webs móviles haya y tengan su
contra-partida en escritorio.
Igualmente, hay que añadiendo la URL canónica en cada página móvil.
Sitemap.xml
Al igual que necesitamos tener el archivo robots.txt, debemos tener y configurar el
sitemap.xml.
En este caso, el archivo sitemap.xml debería tener esta estructura para una correcta
optimización:
<?xml version=”1.0″ encoding=”UTF-8″ ?>
<urlset xmlns=”http://www.sitemaps.org/schemas/sitemap/0.9″
xmlns:mobile=”http://www.google.com/schemas/sitemap-mobile/1.0″>
<url>
<loc>http://movil.example.com/articulo100.html</loc>
<mobile:mobile/>
</url>
</urlset>
A partir de ahí, hemos de ir añadiendo a nuestro sitemap.xml todas las URL de nuestro
site móvil, llegando a tener algo parecido a esto.
<url><loc>http://www. movil.example.com/page-1.html</loc>
<mobile:mobile/>
</url>
<url><loc>http://www. movil.example.com/page-2.html</loc>
<mobile:mobile/>
</url>
<url><loc>http://www. movil.example.com/page-3.html</loc>
<mobile:mobile/>

7. </url>
</urlset>
Configurar tu servidor para incluir la cabecera VARY HTTP
Explicamos esta configuración un poco más adelante cuando nos adentramos en el Dynamic
Serving, ya que es algo fundamental al usar esta tecnología y también cuando creamos
páginas webs dedicadas a móviles.
Malas prácticas a evitar. Redirecciones erróneas.
Es muy fácil caer en pequeños errores al desarrollar para móviles. Los errores más
comunes que afectarán a nuestro posicionamiento son los siguientes.
Redirecciones erróneas. Es una mala práctica habitual cuando se recibe una visita vía
móvil, redirigir al usuario de nuestra página web de escritorio a la home de la web
móvil, venga desde donde venga el usuario. Es una mala práctica detectada que ya ha
empezado a penalizar Google.
En este ejemplo, si el usuario accede a la web de escritorio desde su móvil y no tenemos
la página correspondiente en versión móvil, Google recomienda mostrar la web de
escritorio incluso si no está optimizada para móviles, ya que la frustración del usuario
será mayor al entrar en la
web móvil y no encontrar el contenido que esperaba
Páginas de error “404 – Not Found” para móviles. Parecido al anterior, al no
encontrar la página móvil correspondiente a la web de escritorio, algunos webmaster
prefieren mostrar el código de error “404 – Not Found”.
No tener en cuenta la velocidad de carga de la página. Si desarrollar para móviles,
tienes un mayor control sobre esto, así que es un error grave. Asegúrate de que...
Tus páginas se cargan en menos de 1 segundo.
Tu página web móvil es rápida, con contenido, código e imágenes
optimizadas al dispositivo.
Hay dos hándicaps principales a la hora de desarrollar webs dedicadas a móviles.
Es muy fácil cometer el más mínimo error de configuración, corriendo el riesgo de que
nuestra web móvil (e incluso la de escritorio) sean penalizadas, como es un hecho según
leemos aquí.
Las labores de optimización, mantenimiento y generación de contenido casi se doblan,
haciendo un mayor trabajo (y más costoso) la estrategia SEO y el mantenimiento web.

8. Wireframe para Website
CODIGO FUENTE PARA TICKETS ARGENTINA, WEB MOVIL
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Tickets Argentina</title>
<link href="/rcss?SiteID=251" type="text/css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximumscale=1.0, user-scalable=0">
<meta content="True" name="News">
<link type="image/x-icon" href="/brokers/m.ticketsargentina.com/favicon.ico" rel="icon"><script
type="text/javascript"
src="/brokers/m.ticketsargentina.com/ticketsargentinamobile.analytics.min.js"></script></head>
<body onload="setTimeout(scrollTo, 100, 0, 1);">
<div class="header">
<div id="logo"><a href="/"><img src="brokers/m.ticketsargentina.com/ticketsargentina.png" alt="Tickets
Argentina" /></a></div>
<div class="search">
<form method="get" action="/search">
<input type="hidden" name="id" value="251" />
<input id="search_txt" type="text" name="query" />
<input type="submit" value="Search" />

9. </form>
</div>
</div>
<div class="title">Browse</div>
<div class="browse">
<ul class="iphone_list">
<li><a href="/category?CategoryID=Concert">Conciertos</a></li>
<li><a href="/category?CategoryID=Sport">Deportes</a></li>
</ul>
</div>
<script>
function $(i) { return document.getElementById(i) }
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(gpsSuccess, gpsFail);
} else if (window.blackberry && blackberry.location.GPSSupported) {
blackberry.location.onLocationUpdate("locationCB()");
blackberry.location.setAidMode(2);
blackberry.location.bbLocation();
}
}
function bbLocation() {
location.href = '/?lat='+blackberry.location.latitude+'&lon='+blackberry.location.longitude;
}
function gpsSuccess(position) {
location.href = '/?lat='+position.coords.latitude+"&lon="+position.coords.longitude;
}
function gpsFail() {}
window.onload = getLocation;
</script>
<div class="bottom_menu">
<ul id="more_list" class="iphone_list">
<li><a href="wtai://wp/mc;8008172820">Call (800) 817-2820</a></li><li><a
href="http://www.ticketsargentina.com/?mobile=0">View Full Site</a></li>
</ul>
</div>
<div class="preload">
<img src="/images/loading.gif" alt="" />
<img src="/images/check.png" alt="" />
</div></body>
</html>