Taller sobre posicionamiento en buscadores y accesibilidad realizado en el Evento de Gobierno Electrónico de AGESIC.
Original publicado en: www.agesic.gub.uy
http://www.agesic.gub.uy/innovaportal/file/2423/1/taller_para_que_te_encuentren_posicionamiento_en_buscadores.pdf
Los avatares para el juego dramático en entornos virtuales
Para que te encuentren
1. Para que te encuentren
Técnicas de Accesibilidad, estándares y buenas
prácticas para buscadores
diciembre, 2012
Silvia Da Rosa
silvia.darosa@agesic.gub.uy
Juan Juambeltz
juan.juambeltz@agesic.gub.uy
2. Aparecer en buscadores
¿Por qué es importante?
•Búsquedas anuales en 2011
•1.722.071.000.000
•Promedio de búsquedas diarias 2011
•4.717.000.000
•Documentos indexados en 2012
•de 35 a 55 billones
Datos de Google
http://docencia.colef.mx
3. Posicionarse en buscadores
¿Por qué es importante?
• Mayor difusión de políticas de estado
• Mayor participación e involucramiento de los ciudadanos
4. Posicionarse bien en buscadores
• 42% de los usuarios accede exclusivamente al primer resultado
• 73 % ve los primeros 5 resultados solamente
• Solo el 10% de los usuarios ve la 2da página de resultados
5. Motores de búsqueda más usados
http://gs.statcounter.com/#search_engine-ww-monthly-201110-201210-bar
6. ¿Cómo funciona un buscador?
Operaciones básicas
• Web Crawler
o Rastrea enlaces
• Indexación
o Procesa documentos
• Ranking
o Otorga “puntaje”
• Serving
o Arroja resultados
8. Primera
aparición
Febrero de 2011 Abril de 2012
Qué penaliza •Contenidos de baja calidad o
duplicados
•“content farms”
•Alto porcentaje de “rebotes”
•Links de mala calidad
•Alta densidad de palabras
clave
•Anchor texts sobre-optimizados
Cómo superarlo Con contenido natural,
creativo y original que
relevante para terceros
Con links de calidad
Actualizaciones 13 1
Panda Penguin
9. Link building
•¿Qué es?
• Un serie de técnicas a través de las cuales se pretende que un sitio
obtenga links entrantes
• Algunas técnicas de link building son:
o Links recíprocos (intercambio de links)
o Links como recurso
o Links desde directorios temáticos, blogs, foros, redes sociales, etc.
o Links comprados (link farms, content farms)
•¿Para qué lo hacen?
• Google considera un link como un voto hacia la pagina y se piensa que
cuantos más links reciba mayor pagerank se le adjudica (se vera que
esto es relativo).
•¿Cómo actúan los update de Google?
• Google entiende que el uso abusivo de estas técnicas afecta la
relevancia y beneficia a sitios con contenidos irrelevantes por lo que
intenta disminuir la incidencia de este tipo de técnicas
10. Keyword stuffing
•¿Qué es?
•Incluir muchas veces una palabra clave en un documento
•Ejemplos
“Vendemos mamparas para baño esmeriladas. Nuestras
mamparas para baño esmeriladas estan diseñadas con los mejores
materiales de plaza. Si está pensando en comprar mamparas para
baño esmeriladas contacte a nuestros especialistas en instalación de
mamparas para baño esmeriladas …”
•¿Para qué lo hacen?
•Para que el buscador interprete que el documento es relevante para las
búsquedas que se realicen a partir de esa palabra clave.
•¿Cómo actúan los update de Google?
•Decide si la densidad de palabras clave es natural o forzada y en caso
que lo sea penaliza al sitio
Ej. Densidad de palabras
clave
http://webconfs.com/keyword-
density-checker.php
11. Contenido duplicado
•¿Qué es?
•Se trata de contenidos que son compartidos por varios documentos
al mismo tiempo
•¿Para qué lo hacen?
•Muchas veces la existencia de sitios con contenido duplicado es
consecuencia de la avidez por la obtención de links. Este interés ha
propiciado el desarrollo “granjas de contenido” que producen páginas
de forma casi industrial y en los cuales los contenidos generalmente se
repiten o se transforman.
•¿Cómo actúan los update de Google?
•Detecta los contenidos duplicados y penaliza al sitio
Ej. Herramienta para
detectar sitios duplicados
http://copyscape.com
13. Pero primero… el “disclaimer” (1)
•NO garantiza
primera página
en resultados
•Facilitará que los motores de búsqueda puedan
recorrer, indexar y comprender contenidos
http://bargains4business.com.au/first-page-google-competitive-keyword
10 tips para que te encuentren
14. Pero primero… el “disclaimer” (2)
•Estas optimizaciones afectan los resultados
orgánicos
oNo los pagos o “sponsored” como Google AdWords.
10 tips para que te encuentren
15. Pero primero… el “disclaimer” (3)
(October 3, 2010)
•Basado en :
10 tips para que te encuentren
https://support.google.com/webmasters/?hl=es
www.google.com/en/us/webmasters/docs/search-engine-optimization-starter-
guide.pdf
•Elegimos buenas prácticas de estándares y accesibilidad
•Hay más recomendaciones…
16. Facilita la navegación
1
Usuarios: encontrar lo que quieren
Buscadores: entender qué contenido es
importante, rol que juega cada pagina en el
sitio
http://www.bdp.org.ar
10 tips para que te encuentren
WCAG 2.0 – Operable
- Propósito de los enlaces (2.4.4 - A)
- Múltiples vías (2.4.5 - AA)
- Ubicación (2.4.8 - AAA)
17. Planea la estructura del sitio y deja migas
1
Planea la estructura del sitio
Cómo llegará el usuario hasta cada página
Crea una jerarquía natural que facilite que los usuarios lleguen de lo general a lo
particular
Evita:
•Crear navegaciones complejas (muchos enlaces en una página)
•Dividir demasiado el contenido (se necesitan muchos clics para
llegar)
Incluye "migas de pan"
Saber donde está y navegar hacia atrás
Foco:
simplicidad y
facilidad de
uso
5 tips para que te encuentren > Facilita la navegación
18. Incluye dos mapas del sitio
Incluye mapa del sitio HTML y
archivo XML
•Usuarios: Pagina con la estructura del sitio
mediante una lista jerárquica de enlaces a las
aéreas principales del sitio
•Buscadores: Mapa XML para facilitar el
rastreo de paginas (Google's Webmasters Tools)
1
Evita
•Mapa HTML no actualizado o
con enlaces rotos
•Mapa HTML que simplemente
liste todas las páginas
5 tips para que te encuentren > Facilita la navegación
19. Elije textos de enlaces descriptivos
1Elije textos de enlace descriptivos y concisos
Provee suficiente información para brindar una idea básica sobre la temática de la
página destino
Usar texto facilita el rastreo y comprensión del sitio
<a href="http://www.dominio.com/renovarcedula.html">Cómo renovar la cédula</a>
Evita
• Texto que no tiene relación con la página destino
• Texto genérico
o "página", "artículo", "click aquí", "leer más"
• Textos largos como una oración o frases
• Elementos que no sean de texto:
o JavaScript o Flash
o Menús drop-down, imágenes, animaciones
Usuarios y
buscadores
prefieren enlaces
comprensibles
5 tips para que te encuentren > Facilita la navegación
20. Optimiza los enlaces
1Que se diferencien los enlaces del texto normal
Que los usuarios distingan fácilmente el texto normal de los enlaces
Evita
•Usar CSS o estilos de texto que los enlaces no se vean como
enlaces
Piensa en enlaces internos
Puede ayudar al buscador y a los usuarios a navegar mejor
el sitio
Evita
•Usar muchas palabras claves como enlaces
solamente para los buscadores
•Crear enlaces innecesarios que no ayudan en la
navegación
Usuarios y
buscadores
prefieren enlaces
comprensibles
5 tips para que te encuentren > Facilita la navegación
21. Elije URLs para humanos
1
Usa palabras en las URLs
Usa palabras relevantes que sean amigables.
•Categorías y nombres de archivos descriptivos
ayuda a que el sitio este mejor organizado,
puede mejorar el rastreo de los buscadores,
ayuda a los usuarios a inferir el contenido
Evita
• Usar URL largas
o parámetros innecesarios y IDs de sesión
• Nombres de páginas genéricas
o "pag1.html"
• Muchas palabras clave
o "baseball-tarjetas-baseball-tarjetas-tarjetasbaseball.html“
Elige URL
fáciles de
comprender
para usuarios
y buscadores
5 tips para que te encuentren > Facilita la navegación
22. URLs para humanos: en los resultados
•Se muestran en los resultados de búsqueda
oSe muestra en negrita las palabras que coinciden con la clave de búsqueda
1
5 tips para que te encuentren > Facilita la navegación
23. Usa las imágenes sabiamente
2
Asegúrate de describir las imágenes.
Prefiere siempre utilizar texto en lugar
de imágenes.
http://webmuseum.mit.edu
WCAG 2.0 – Perceptible
- Contenido no textual (1.1.1 - A)
- Imágenes de texto (1.4.5 - AA)
5 tips para que te encuentren > Usa imágenes sabiamente
24. Imágenes: lo que ves cuando no se ve
alt = “Mafalda escuchando música
en la radio”
2
5 tips para que te encuentren > Usa imágenes sabiamente
25. Imágenes: “alt” y nombre de archivo
Opción muy mala:
<img src=“DSC00123.jpg" />
Opción mala:
<img src=“cachorro.jpg" />
Opción mediocre:
<img src="cachorro.jpg" alt=""/>
Opción buena:
<img src=“cachorro.jpg" alt="cachorro"/>
Opción muy buena:
<img src=“cachorro.jpg" alt="cachorro jugando a traer pelota">
Opción malísima:
<img src="puppy.jpg" alt="cachorrito perrito cachorritos perritos mascota mascotas camada perro
retriever labrador galgo irlandés setter pointer cachorro jack russell terrier cachorros comida de perro
barata pienso comida para cachorros"/>
2
https://support.google.com/webmasters/bin/answer.py?hl=es&answer=114016
http://gtadiestramientocanino.blogspot.com
5 tips para que te encuentren > Usa imágenes sabiamente
26. Imágenes en enlaces
•El texto alternativo (“alt”) es tratado como texto del enlace
•No se recomienda usar imágenes como enlaces cuando enlaces de texto pueden
cumplir el mismo propósito
2
5 tips para que te encuentren > Usa imágenes sabiamente
27. Imágenes de texto
Evita insertar texto importante en imágenes:
•encabezados de páginas
•elementos del menú
•enlaces
“(…) utilice el formato HTML habitual. (…)
El rastreador de Google no reconoce el texto
integrado en imágenes.”
2
https://support.google.com/webmasters/bin/answer.py?hl=es&answer=114016
5 tips para que te encuentren > Usa imágenes sabiamente
28. Imágenes: Buenas Prácticas
2
Describe las imágenes
Usa nombres de archivos y textos alternativos (alt) breves y descriptivos
Evita:
•Usar textos genéricos
o "image1.jpg", "DSC00034.jpg", etc.
o Imagen, logo, foto
•Escribir textos largos como una oración o frase
•Llenar de palabras claves
Los buscadores
somos
inteligentes,
pero todavía no
comprendemos
imágenes
Evita usar imágenes para
contenido importante
si tienes una opción de
solo texto que cumple la
misma función
5 tips para que te encuentren > Usa imágenes sabiamente
29. Valida estándares
3
WCAG 2.0 – Robusto
-Interpretación (4.1.1 - A)
-Nombre, rol, valor (4.1.2 - A)
5 tips para que te encuentren > Valida estándares
30. ¿Por qué estándares? 3
https://support.google.com/webmasters/bin/answer.py?hl=es&answer=100782
¿Si aunque el HTML no sea válido el sitio se ve bien?
5 tips para que te encuentren > Valida estándares
31. Beneficios del uso de Estándares 3
https://support.google.com/webmasters/bin/answer.py?hl=es&answer=100782
Las páginas serán más livianas
Se verá bien en la mayoría de los navegadores
Garantiza compatibilidad futura
Google recomienda validar estándares
aunque reconoce que no afecta
directamente el rastreo e indexación
•Cómo validar:
• Validador HTML [http://validator.w3.org/]
• Validador CSS [http://jigsaw.w3.org/css-validator/]
Si el código HTML tiene valor semántico, agrega información
relevante sobre la página
5 tips para que te encuentren > Valida estándares
32. Agrega valor semántico
4
Incluye información semántica para informar acerca
del contenido de la página
http://www.regoremor.com
http://blog.webconsultic.com/
WCAG 2.0 –Perceptible / Operable
-Información y relaciones (1.3.1 - A)
-Titulado de páginas (2.4.2 - A)
-Encabezados y etiquetas (2.4.6 - AA)
-Encabezados de sección (2.4.10 - AAA)
5 tips para que te encuentren > Agrega valor semántico
33. Titula las páginas 4
•Utiliza la etiqueta <title> dentro del <head>
http://www.cmat.edu.uy/cmat/posgrado/seminarios/sistemas-dinamicos/charlas/condiciones-volumetricas-para-rigidez-suave
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>Condiciones volumétricas para rigidez suave - Centro de
Matemática</title>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>Condiciones volumétricas para rigidez suave - Centro de
Matemática</title>
Informa a los motores de búsqueda y a los usuarios cual es el tema
de la página.
5 tips para que te encuentren > Agrega valor semántico
34. Títulos de páginas: usado en resultados 4
•Palabras que coinciden con palabras buscadas se muestran en
negrita
•Ayuda a decidir si es relevante
Título de la página
5 tips para que te encuentren > Agrega valor semántico
35. Títulos de páginas: ayuda a los usuarios 4
•Se muestra en la pestaña del navegador
•Y en la lista de favoritos
http://www.cmat.edu.uy/cmat/posgrado/seminarios/sistemas-dinamicos/charlas/condiciones-volumetricas-para-rigidez-suave
5 tips para que te encuentren > Agrega valor semántico
36. Elije buenos títulos de páginas
1
Usa títulos breves, descriptivos y únicos
Título que comunique el contenido de la página, puedes incluir el nombre del sitio
Si el titulo es muy largo, se mostrara solamente una parte
Títulos únicos ayudan a saber que una página es diferente a otra
Evita
•Títulos que no tengan relación con el contenido
•Usar valores por defecto o vagos
o"Untitle", "New Page 1"
•Usar títulos muy largos
•Agregar palabras clave innecesarias
•Usar un solo título en todas las páginas o un grupo de paginas
Titular las
páginas
es
important
e
5 tips para que te encuentren > Agrega valor semántico
37. Encabezados
•Se usan para marcar la estructura del documento
•Hay 6 niveles: <h1> ... <h6>
•Visualmente dan claves al usuario sobre la estructura
4
<h1>Recetas de cocina</h1>
<h2>Pascualina</h2>
<h3>Ingredientes</h3>
<ul>
<li>Masa</li>
<li>Acelga</li>
</ul>
<h3>Preparación</h3>
<ol>
<li>Poner la masa en la asadera.</li>
<h1>Recetas de cocina</h1>
<h2>Pascualina</h2>
<h3>Ingredientes</h3>
<ul>
<li>Masa</li>
<li>Acelga</li>
</ul>
<h3>Preparación</h3>
<ol>
<li>Poner la masa en la asadera.</li>
Recetas de cocina
Pascualina
Ingredientes
• Masa
• Acelga
Preparación
1.Poner la masa en la asadera.
Recetas de cocina
Pascualina
Ingredientes
• Masa
• Acelga
Preparación
1.Poner la masa en la asadera.
5 tips para que te encuentren > Agrega valor semántico
38. Usa encabezados adecuadamente
4Usa encabezados que sean útiles para el usuario
Imagina que estás describiendo el esquema de contenidos, detecta títulos principales y
subtítulos.
Úsalos cuando tengan sentido
Evita
•Poner texto como encabezado que no sea de útil para definir la estructura del
sitio
•Usar encabezados para enfatizar cuando <em> o <strong> sean más
apropiados
•Usar encabezados en un orden no apropiado
•Muchos encabezados
•Usarlos solamente para darle estilo al texto
Los
encabezados
son
importantes,
úsalos con
cuidado!
5 tips para que te encuentren > Agrega valor semántico
39. Ten en cuenta la accesibilidad
5
“La visión de Google es exactamente la misma
que la de una persona ciega. Google es un
usuario ciego. Un usuario ciego millonario, con
millones de amigos que escuchan cada una de sus
palabras. Si un usuario ciego no puede ver
tu sitio, entonces Google, tampoco.”
S. Pemberton
http://www.informationweek.com
5 tips para que te encuentren > Ten en cuenta la accesibilidad
WCAG 2.0
40. Accesibilidad: ¿Cómo hacerlo?
eXaminator: http://examinator.ws
TAW para WCAG2.0: http://www.tawdis.net
5
5 tips para que te encuentren > Ten en cuenta la accesibilidad
Ej.
www.ute.com.uy
www.bps.com.uy
Otro sitio?
41. Accesibilidad: Navegadores solo texto
LYNX: La mayoría de los buscadores verán el sitio de forma similiar
Si el uso de funciones avanzadas
(como JavaScript, cookies, identificadores de sesión, marcos, DHTML o Flash)
impide la visualización en Lynx, lo impedirán para buscadores.
•Instalar como navegador
•Para Firefox
•Para IE
•Lynx online: http://www.yellowpipe.com/yis/tools/lynx/lynx_viewer.php
5
https://support.google.com/webmasters/bin/answer.py?hl=es&answer=114016
5 tips para que te encuentren > Ten en cuenta la accesibilidad
Ej. LYNX
www.ancap.edu.uy
www.bps.gub.uy
Otro sitio?
42. 5
5 tips para que te encuentren > Ten en cuenta la accesibilidad
47. •En la mayoría de las búsquedas se utilizan entre una y tres palabras
clave.
•El largo promedio de una consulta es de 2.9 palabras.
Cantidad de palabras usadas en búsquedas
Cantidad de palabras Porcentaje de búsquedas
1 25.32%
2 24.96%
3 19.80%
4 13.17%
5 7.53%
48. Elección de palabras clave
Obtención “manual” inicial:
– Análisis “hacia adentro” de la organización (brainstorming)
– Hacer un listado de mis productos o servicios
– Producir una lista de palabras (frases) tentativas
– Identificar sinónimos para esas palabras (frases)
– Identificar términos para categorías que incluyan las palabras clave
– Identificar términos usados por sitios afines y por la competencia
– “Ponerse en el lugar del usuario” (de ser posible realizar cuestionarios)
– Investigar términos en artículos de prensa o sitios especializados,
Incorporar técnicas y herramientas de análisis:
– Esquema Long-tail short-tail
– Google Trends
– Google adWords keyword tool
– Wordtracker (pago)
50. Frecuencia de
Búsqueda
Alta Baja
Cantidad de
palabras clave
usadas
Entre 1 y 3 > = 3
Competencia Alta Baja
Posibilidad de
conversión
Baja Alta
Costos
(patrocinadas)
Alto Bajo
Ejemplos Celulares Celulares 3g dual sim
Short tail Long tail
51. Herramienta para palabras clave de AdWords
Permite investigar palabras
clave por:
• Competencia
• Relevancia
• Búsquedas globales
• Búsquedas locales
• Sugiere palabras
relacionadas
• Costo aproximado
52. Google Trends
Analiza comparativamente
varias palabras clave
• Mapa de impacto
geográfico de palabra
• Búsquedas más frecuentes
con las palabras clave
usadas
• Filtros por tipo de
• busqueda (web,
imagen, noticia etc)
• Geográfico
• Rango de Fecha
• Categorias (sector o
industria)
53. Ciclo de mejora continua de palabras clave
Seguimento con Analytics,
A/B testing, etc.
Obtención “manual”
Brainstorming
Lista tentativa
Sinónimos
Uso de herramientas
y esquemas de investigación
AdWords tool, Trends
Long tail etc.
54. Tecnicas avanzadas de búsqueda
Los motores de búsqueda poseen una rica colección de comandos
que pueden ser utilizados para conducir búsquedas avanzadas.
•[ - palabra clave]
• Excluye la palabra clave de los resultados de búsqueda
• por ejemplo: [ prestamos - hipotecarios] (va a seleccionar documentos que
contengan “prestamos” y excluyan “hipotecarios)
•“la frase exacta”
• Muestra la frase exacta incluida dentro de las comillas. Funciona igual que
la+frase+exacta
55. Operadores Google de búsqueda avanzada
Google soporta usa serie de operadores avanzados de búsqueda. La
siguiente es una guía abreviada del los mismos:
operador aplicaciones ejemplos
site: Restringe búsqueda al sitio o
dominio indicado
site:www.agesic, site:org.uy
inurl: / allinurl: Busca documentos con la
clave en la url
inurl:uruguay
intitle: Busca documentos con la
palabra clave en el título
Intitle:vacaciones
inanchor: Busca documentos con la
palabra clave en el anchor
inanchor:chocolate
intext: Busca documentos con la
palabra clave en texto
intext:alpargata
ext: Restringe búsqueda a la
extensión indicada
ext:pdf
56. Operadores de búsqueda combinados
Existe la posibilidad que tanto comandos como operadores sean
combinados para conducir una búsqueda refinada. Veamos ejemplos.
•[intitle:agesic site:.gub.uy ext:pdf -site:agesic.gub.uy
-site:presidencia.gub.uy]
• Busca documentos en sitios con dominio de primer nivel “.gub.uy” que posean
extensión pdf, contengan “agesic” en el título pero excluye de la búsqueda los
sitios agesic.gub.uy y presidencia.gub.uy
•[intitle:"empanadas de *" intitle:queso -albahaca -jamon -frit* -frei*
intext:picante]
• Busca documentos que contengas la frase “empanada de” en el titulo. Tambien
debe contener queso en el título y que no contenga albahaca ni jamón ni sea
frita e incluya la palabra picante en el texto
58. Fragmentos enriquecidos (rich snippets)
– Mas desarrollado en la versión .com de Google
– Aproximación a la búsqueda “semántica”
– Google detecta el “sentido” del recurso y permite filtrar resultados de
acuerde a criterios específicos de la categoría a la que pertenece el
recurso.
– Google soporta fragmentos enriquecidos para distintos tipos de
contenidos (personas, eventos, música, recetas).
– Funcionan gracias a la inclusión de “Microdata” en el código html
– La organización schema.org (nucléa a Google, Yahoo y Microsoft)
contribuye a establecer los “esquemas de codificación” que permiten a
los buscadores “comprender” la información contenida en los
documentos para arrojar resultados mas relevantes.
59. Como se usa la microdata en el html
– Html común
<div> Me llamo Luis Suarez pero casi todos me dicen Lucho, soy
futbolista…</div>
– Html enriquecido
<div itemscope itemtype="http://data-vocabulary.org/Person“ > Me
llamo <span itemprop="name“ >Luis Suarez</span> pero casi
todos me dicen <span itemprop="nickname“ >Lucho</span>,
soy <span itemprop="title"> futbolista</span>……</div>
60. Ejemplos de búsquedas enriquecidas
– buscamos por TABLET en
www.google.com
– Seleccionamos el tipo de
búsqueda por “SHOPPING”
– Nos permite filtrar de acuerdo a
los siguientes criterios
• Condiciones de envío
• Rango de precios
• Marca
• Sistema operativo
• Conectividad
• Peso
• Autonomía
– buscamos por PAELLA en
www.google.com
– Seleccionamos el tipo de
búsqueda por “RECIPES”
– Nos permite filtrar de acuerdo a
los siguientes criterios
• Ingredientes
• Tiempos de cocción
• Valor calórico
61. Referencias
• Herramientas para webmasters de Google
https://support.google.com/webmasters/?hl=es
• Search Engine Starter Guide
https://static.googleusercontent.com/external_content/untrusted_dlcp/www.google.com/e
n/us/webmasters/docs/search-engine-optimization-starter-guide.pdf
• The Art of SEO
Enge, Spencer,Fishkin & Stricchiola