Para que te encuentren

Para que te encuentrenTécnicas de Accesibilidad, estándares y buenas

prácticas para buscadores

diciembre, 2012

Silvia Da [email protected]

Juan [email protected]

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 Googlehttp://docencia.colef.mx

Posicionarse en buscadores

¿Por qué es importante?

• Mayor difusión de políticas de estado• Mayor participación e involucramiento de los ciudadanos

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

Motores de búsqueda más usados

http://gs.statcounter.com/#search_engine-ww-monthly-201110-201210-bar

¿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

SEO (Optimización para buscadores)

Conjunto de técnicas para

mejorar el posicionamiento de un sitio frente a buscadores

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

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 recursoo 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

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 clavehttp://webconfs.com/keyword-density-checker.php

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 duplicadoshttp://copyscape.com

5 tips para que te encuentren

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



•Estas optimizaciones afectan los resultados orgánicos

oNo los pagos o “sponsored” como Google AdWords.



(October 3, 2010)

•Basado en :


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…

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


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)

Planea la estructura del sitio y deja migas 1

Planea la estructura del sitioCómo llegará el usuario hasta cada páginaCrea 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

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


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 destinoUsar 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 Flasho Menús drop-down, imágenes, animaciones

Usuarios y buscadores prefieren enlaces comprensibles


Optimiza los enlaces 1

Que se diferencien los enlaces del texto normalQue 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 internosPuede 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


Elije URLs para humanos 1

Usa palabras en las URLsUsa 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


URLs para humanos: en los resultados

•Se muestran en los resultados de búsquedaoSe muestra en negrita las palabras que coinciden con la clave de búsqueda


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

Imágenes: lo que ves cuando no se ve

alt = “Mafalda escuchando música en la radio”


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


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


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



Imágenes: Buenas Prácticas 2

Describe las imágenesUsa 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 paracontenido importante

si tienes una opción de solo texto que cumple lamisma función


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

¿Por qué estándares? 3


¿Si aunque el HTML no sea válido el sitio se ve bien?


Beneficios del uso de Estándares 3


Las páginas serán más livianasSe verá bien en la mayoría de los navegadoresGarantiza 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


Agrega valor semántico

4

Incluye información semántica para informar acerca del contenido de la página

http://www.regoremor.comhttp://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

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.


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


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


Elije buenos títulos de páginas 1

Usa títulos breves, descriptivos y únicosTítulo que comunique el contenido de la página, puedes incluir el nombre del sitioSi el titulo es muy largo, se mostrara solamente una parteTí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 importante


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 cocinaPascualinaIngredientes• Masa• AcelgaPreparación1.Poner la masa en la asadera.

Recetas de cocinaPascualinaIngredientes• Masa• AcelgaPreparación1.Poner la masa en la asadera.


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!


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

Accesibilidad: ¿Cómo hacerlo?

eXaminator: http://examinator.ws

TAW para WCAG2.0: http://www.tawdis.net


Ej. www.ute.com.uywww.bps.com.uyOtro sitio?

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



Ej. LYNXwww.ancap.edu.uywww.bps.gub.uyOtro sitio?


Lynx: www.ancap.com.uy 55 tips para que te encuentren > Ten en cuenta la accesibilidad

www.bps.gub.uy 55 tips para que te encuentren > Ten en cuenta la accesibilidad

Lynx: www.bps.gub.uy 55 tips para que te encuentren > Ten en cuenta la accesibilidad

•Selección de palabras clave

•Técnicas de de búsqueda avanzadas

•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%

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)

Analizando palabras clave

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

Herramienta para palabras clave de AdWords

Permite investigar palabras clave por:

• Competencia• Relevancia• Búsquedas globales• Búsquedas locales• Sugiere palabras

relacionadas• Costo aproximado

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)

Ciclo de mejora continua de palabras clave

Seguimento con Analytics,A/B testing, etc.

Obtención “manual”BrainstormingLista tentativa

Sinónimos

Uso de herramientasy esquemas de investigación

AdWords tool, TrendsLong tail etc.

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

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

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

Fragmentos enriquecidos

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.

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>

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

Referencias

• Herramientas para webmasters de Google

https://support.google.com/webmasters/?hl=es

• Search Engine Starter Guidehttps://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

Muchas gracias

www.agesic.gub.uy

Education

Para que te encuentren