Transcript Diapositiva 1

Microformatos
¿Por qué usarlos?
Miguel Valero
Twitter: @miguelvaleroseo
Móvil: 654 666 900
Skype: mavalecu
Email: [email protected]
Web: www.miguel-valero.es
Índice
1. Orígenes web semántica
2. Microformatos
1. Especificaciones
2. Borradores
3. Microformatos para el SEO
1. Rel=“nofollow”
2. Contenidos duplicados por
paginación con parámetros I
3. El chantaje rel=“author”
4. Algunos Rich Snippets con
microformatos
4. Microdatos Schema.org - RDFa
1. Ejemplo: RDFa 1.0 + XML
2. Ejemplo: Schema.org
5.
6.
7.
8.
El grafo del conocimiento de Google
Fuentes
Debate - ¿Preguntas?
Gracias
1. Orígenes
 1989 Tim Berners Lee crea el protocolo HTTP,
URL, HTML. Nace el internet que conocemos.
1994 Tim Berners Lee crea el W3C.
1994-1999. La guerra de navegadores provoca
sucesivas versiones de HTML. Los principales
navegadores en esta época Internet Explorer que
seguía usando comando propietarios y Netscape
Navigator que cumplía los estándares definidos
por W3C.
1997 Diciembre surge HTML4
1998. Surge CSS1
1999-2004 W3C crea Resource Description
Framework (RDF), OWL y la primera
recomendación sobre XML (sería una adaptación
a internet del SGML de IBM) . Surgen aquí los
primeros microdatos aplicados a internet
! Nace la Web semántica!
2. Microformatos
Un microformato es una forma simple de agregar significado semántico a un contenido legible
por un humano mientras que para una máquina puede ser sólo texto plano.
Los microformatos son mantenidos y especificados por Microformats.org y básicamente se
expresan a través de los siguientes atributos del marcado html: class, rel, rev.
2.1. Especificaciones
hCalendar
hCard
Rel-license
XOXO
Especificaciones
actuales
Relnofollow
XMDP
rel-tag
XFN
votelinks
Especificaciones II
rel-license: Propuesto por technorati y valorando el atributo “rel”, indica que el enlace conduce a
una página que dispones los término de licencia de la página emisora del enlace.
XOXO : eXtensible Open Xhtml Outlines (listas).
hCard - hCard creator: normativiza la información de las personas, nombre (given-name),
apellido (aditional-name), calle (street-address), etc. Con la herramienta web hCard creator
podemos instanciar este microformato con facilidad, misma observación para hCalendar creator y
XFN creator por cierto.
hCalendar -hCalendar creator: un evento determinado suele incluir fechas (dtstart – fecha de
inicio), descripción (summary) y adicionalmente: localización, url, geo, etc.
rel-nofollow: Al añadir rel="nofollow" com atributo de un enlace se indica a los buscadores que
no se se conceda peso adicional o ranking a ese enlace.
Especificaciones III
VoteLinks: Propuesto por technorati como medio de apoyar (vote-for), abstenerse (voteabstain), o estar en contra de la página enlazada (vote-against). Debe usarse el atributo rev y no
rel.
XFN - XFN creator: Las páginas web se relacionan mediante enlaces y podemos aprovechar
estos para establecer relaciones entre las personas en el caso de páginas de tipo personal o
profesional (pero donde se referencia a una persona en concreto). Estas relaciones se expresan
instanciando el atributo rel con el valor pertinente ( met, friend, me, sweetheart, co-worker, etc).
Muy usado en los blogrolls y encontraréis plugins o temas que ya lo soporten.
XMDP: Xhtml Meta Data perfiles. Lo encontraréis prácticamente sólo en los blogs de
wordpress. Sus posibles valores son author, keywords, copyright, date, identifier (identifica un
recurso único) y rel. Pero como nombre de identificadores, el elemento contenedor ha de
valorarse con “class=“profile”.
rel-tag: Muy usado en los blogs, pues su función es remarcar que el destino del enlace es una
página
cuyo
contenido
versa
en
función
de
dicha
etiqueta:
<a
href="http://technorati.com/tag/tech" rel="tag">tech</a>
2.2. Borradores (Drafts)
Estos microformatos están en camino de convertirse en especificaciones, pero aunque actualmente
son borradores . Pero Google ya lo tiene en cuenta en su mayoría.
adr
geo
hAtom
hAudio
hListing
hMedia?
Robots
exclusion
xFolk
hNews
Se usa schema.org para los vídeos en lugar
del microformato hMedia
En negrita los mas usados en los richs snippets
hProduct
relpayment
Relhome
Relenclosure
reldirectory
hReview
hRecipe
Borradores (Drafts) I
Adr : para publicar la dirección de la información pero si se conoce también el nombre es mejor
usar hCard
geo :coordenadas geográficas (latitud; longitud)
hAtom: actualmente se usa mucho en blogs, sobre todo wordpress. Hay valores opcionales
(hfeed, feed category), pero en el caso de los posts suelen ser requeridos: hentry( entry-title,
entry-content, entry-summary, updated, published, author).
hAudio: Si hay audio en la página, sirve para proporcionar la información habitual. Algunos
valores son: fn, album, durationposition, category, photo, description, price, payment, etc.
hListing : Si como veremos más adelante, hReview sirve para decir lo que pensamos de un
producto o servicio. hListing sirve para decir lo que queremos hacer con él, venta, alquiler, etc.
Está orientado pues al comercio electrónico. Valores (lister, dtexpired, price, summary,
description, permalink, etc).
hMedia : Orientado a contenido multimedia (player – tipo de reproductor, photo, etc).
Borradores (Drafts) II
hNews : Enfocado a las noticias extiende hAtom añadiendo más campos. (source-org
y dateline usando hCard), geo (usando geo), item-licencense, principles.
hProduct: Obviamente dedicado al comercio electrónico pretende normativizar los
atributos usuales de un producto. Valores típicos: brand, category, price, description,
photo, url, review, listing, identifier, etc.
hRecipe: También hay un microformato para normativizar las recetas de cocina. Datos
obvios son: ingredient (al menos uno, …) duration, intructions, photo, summary,
author, published, etc.
hResume: normativiza la información de un CV. Valores: summary, contact info,
experience, education, skills, etc.
hReview - hReview creator. Normativiza las opiniones. Valores: summary, item type,
item info, reviewer, rating, description, etc.
xFolk : Orientado a servicios de marcadores sociales.
Borradores (Drafts) III
rel-directory - Mediante la adición de ‘directory ‘ a el atributo rel de un enlace, la página
indica que el destino del enlace es una lista de directorios que
contiene una entrada para la página actual. <a rel="directory"
href="http://dmoz.org/Computers/Internet/">Computers/Internet</a>
rel-enclosure Al añadir rel="enclosure" en un enlace, una página indica que el destino de
ese enlace está destinado a ser descargado y almacenado en caché. <a
href="http://homepage.mac.com/kevinmarks/wwdc2005.pdf" rel="enclosure"> Keynote
WWDC 2005 con los capítulos </ a>
rel-home –La página enlazada es la página de inicio del sitio, se debe usar una URL
absoluta . <a href="http://technorati.com" rel="home">Home</a>
rel-payment – Se marca con este atributo los enlaces a páginas que proveen algún medio
de pago o soporte financiero, por ejemplo Paypal. <a href="[url]" rel="payment"
title=“Donar dinero mediante Paypal">
robots exclusion. Permite contenedores donde no se sigan y/o indexen las páginas
destinatarias de los enlaces de dicho contenedor.
3. Microformatos para el SEO
Llevas un buen
microformatos …
rato
enumerando
¿Pero cuales son los
microformatos más
interesantes para el Seo?
Vale, vale, veamos … daremos
elementos al debate, …
3.1. Rel=“nofollow”
Este microformato incorporado por Google en el 2005
sirve para luchar contra el Webspam. Como atributo
de un enlace no concede peso adicional o ranking a
ese enlace y que tampoco se pase anchor text.
¿El enlace “nofollow” cuenta? Según Matt Cutts. No. Pienso que cuentan muy poco pero en
cantidad si posicionan y pasan anchor text, ahora bien con Google Penguin Update este es un
punto a revisar. Google dice que ocasionalmente se producen fallos que permiten este “efecto”
pero el valor es 0. ¿Tú que opinas?
 ¿Traspasa Page Rank? No
Google recomienda no usar “nofollow” en enlaces internos. Pues no sé pensó para esto. Opino
que si es bueno marcar con “follows” los enlaces a páginas no relevantes, vamos creo en el
PageRank Scuplting.
En general aconsejo marcar todo enlace saliente como “nofollow”, no obstante siempre puedes
tener algunos enlaces follow en el contenidos. Pero en general puedes observar que grandes sitios
como la wikipedia, flickr, etc. Usan “nofollow” en el marcado de enlaces salientes.
3.2. *rel=“next”, *rel=“canonical”, *rel=“prev”
*Nota previa: No están declarados en microformats.org pero son microformatos usados por Google
Contenidos duplicados por paginación con parámetros I
Si tienes una página donde muestras toda la información y esta carga en un tiempo razonable
además de la serie de páginas con parámetros de paginación*
Page-all.php
Nota*: Además de las páginas
con parámetros de paginación,
pueden considerarse una serie
aquella que por cualquier
motivo se ha dividido en una
serie y que por tanto no
presenta parámetros de
paginación.
Page.php?page=1; En el head;
<link rel=”canonical” href=”http://www.dominio.com/page-all.php” />
<link rel=”next” href=”http://www.sudominio.com/page.php?page=2″ />
Page.php?page=2; En el head;
<link rel=”canonical” href=”http://www.dominio.com/page-all.php” />
<link rel=”prev” href=”http://www.dominio.com/page.php?page=1″ />
<link rel=”next” href=”http://www.sudominio.com/page.php?page=3″ />
Page.php?page=3; En el head;
<link rel=”canonical” href=”http://www.sominio.com/page-all.php” />
<link rel=”prev” href=”http://www.dominio.com/page.php?page=2″ />
*rel=“next”, *rel=“canonical”, *rel=“prev”
Contenidos duplicados por paginación con parámetros II
Si la página donde toda la información no carga en un tiempo razonable y además
tienes la serie de páginas. No necesitas declarar rel=“canonical”
Page.php?page=1; En el head;
<link rel=”next” href=”http://www.sudominio.com/page.php?page=2″ />
Page-all.php
(no index)
Page.php?page=2; En el head;
<link rel=”prev” href=”http://www.dominio.com/page.php?page=1″ />
<link rel=”next” href=”http://www.sudominio.com/page.php?page=3″ />
Page.php?page=3; En el head;
<link rel=”prev” href=”http://www.dominio.com/page.php?page=2″ />
*rel=“next”, *rel=“canonical”, *rel=“prev”
Contenidos duplicados por paginación con parámetros III
Si sólo tienes la serie de páginas. No es necesario declarar rel=“canonical”
Page.php?page=1; En el head;
<link rel=”next” href=”http://www.sudominio.com/page.php?page=2″ />
Page.php?page=2; En el head;
<link rel=”prev” href=”http://www.dominio.com/page.php?page=1″ />
<link rel=”next” href=”http://www.sudominio.com/page.php?page=3″ />
Page.php?page=3; En el head;
<link rel=”prev” href=”http://www.dominio.com/page.php?page=2″ />
3.3 El chantaje: rel=author
 Es necesario pertenecer a una Red Social determinada (Google +) para destacar en
los resultados de búsqueda. (Idem para la dupla Facebook – Bing)
 Aquí ya cuentan los google +1 de tus contactos. (Algunos Seos gritaban yo no
estaré nunca en google + …)
 Google con su amplia cuota de mercado claramente está deslealmente
compitiendo con el resto de redes sociales
 una de cada 5 búsquedas de Google muestra la marca de autor en los primeros
100 resultados.
Nota: no figura como especificación o borrador en microformats.org. He encontrado Richs snippets de autor
con más de 300 caracteres en la descripción.
Algunos Rich Snippets con microformatos
Con microformatos podemos hacer más visibles Todavía no hay muchos sitios webs que los
nuestros resultados en las SERPS. Lograremos
usan. (Oportunidad).
más clics (CTR +)
 Cuidado con los hReviews falsos. Hay
 El uso de microformatos no es la opción
formularios de denuncia.
recomendada por Google para todos los Rich
El porcentaje de rebote disminuye.
Snippets.
 Revisa la página con Rich snippet testing tool
 En Mayo 2009 se anunciaron.
Personas (hCard) ->
<- Events (hCalendar)
Recetas (hRecipe) ->
3.4. Ejemplo SERP
¿Dónde clicarías para
obtener una receta de
croquetas de bacalao?
Lo siento Javi pero no
clicaré en tu primer
puesto…
Por cierto. El primer
resultado es del 2008.
4. Microdatos: Schema, RDFa
Schema
 Iniciativa de Google, Bing y Yahoo (02-06-11)
Opción recomendada para Google para
implementar Rich snippets. No todos los Rich
snippets pueden implementarse con microformatos
pero si con schema.org
Pensado para HTML5. Dispone de amplios
vocabularios
RDFa
RDFA
Compatible con XHTML y HTML5
No es la opción recomendada por Google
XHTML
Microformatos
Schema.org
HTML5
4.1. Ejemplo: XHTML+ RDFa 1.0
about and src – identificador
único de recursos.
rel and rev – Indica la relación o
relación inversa con otro recurso
href and resource – Especifica el
recurso asociado
property – Especifica la
propiedad del contenido de un
elemento
content – opcional. Reemplaza el
contenido del elemento cuando
se instancia el atributo
propiedad.
datatype – atributo opcional que
especifica el tipo de datos de
texto especificado para su uso
con el atributo de la propiedad
typeof – opcional. Específica el
tipo de RDF de la materia tratada.
4.2. Ejemplo: Schema.org
Avatar ->
Un miembro del elenco de la
película, serie o episodio.
actors
Person
director
Person
duration
Duration
musicBy
Person or MusicGroup
producer
Person
El productor de la película, serie o
episodio, o el vídeo.
productionCompany
Organization
La productora o un estudio que hizo
la película, o episodio.
trailer
VideoObject
El trailer de la serie de películas o
televisión o episodio
El director de la película, Episodio de
TV, o una serie.
La duración de la partida (película,
grabación de audio, eventos, etc) en
ISO 8601 date format.
El compositor de la banda sonora de
la película o programa de TV.
5. El grafo de conocimiento de Google
Las búsquedas de Google cada vez serán más semánticas y menos probabilísticas.
En lugar de preguntarse por la frecuencia del término, se preocupará por las
conexiones de dicho término.
The Knowledge Graph
Google lo lanzó a mediados de mayo. Sólo disponible en
Google.com. Un ejemplo para la búsqueda “Andreu Buenafuente”
6. Fuentes
http://www.w3c.es/Prensa/2004/nota040210.html
http://es.wikipedia.org/wiki/Extensible_Markup_Language
http://www.w3.org/TR/rdf-primer/#rdfmodel
http://es.wikipedia.org/wiki/RDF_Schema
http://www.matem.unam.mx/~grecia/semantic_web/rdf.html
http://www.w3.org/TR/2004/REC-owl-semantics-20040210/
http://microformats.org/wiki/Main_Page
http://googlewebmaster-es.blogspot.com.es/2011/12/visualizacion-detodo-el-contenido-en.html
http://googlewebmaster-es.blogspot.com.es/2011/12/paginacion-conrelnext-y-relprev.html
http://www.miguel-valero.es/seo-adictos-24h/
http://en.wikipedia.org/wiki/RDFa
http://googleblog.blogspot.com.es/2012/05/introducing-knowledgegraph-things-not.html
7. Debate - ¿Preguntas?
Los microdatos, en
especial Schema.org
han venido para
quedarse.
El futuro semántico ya
es presente. ¿Cómo
cambiará el SEO a
media que Google vaya
aumentando el número
de relaciones entre “las
cosas”?
Imagen de contratapapopular.blogspot.com
8. Gracias
¡Gracias!