Microformatos ¿Por qué usarlos? Miguel Valero

Slides:



Advertisements
Presentaciones similares
Posicionamiento Web Campaña de posicionamiento para páginas web
Advertisements

UD 4:Instalación y administración de servicios Web Introducción Jorge De Nova Segundo.
HTML (Historia) Rogelio Ferreira Escutia. 2 HTML, septiembre 2010 ¿Qué es? HTML, siglas de HyperText Markup Language.
TRABAJO DE FLICKR Y YOUTUBE -Andrea Gutiérrez Vidal -Ulyana Zablotska.
Mercado Libre - Subidas Producción
Enlaces con variables en la URL en PHP Programación en Internet II.
¿Cómo leer tus sitios web favoritos en menos tiempo? ¡Fácil! Tan solo debes usar un agregador de noticias y suscribirte a los sitios web que prefieras.
Servicios de Internet (1)World Wide Web [WWW] (2)Transferencia de ficheros (FTP)
IDEA Business Center Universidad Complutense de Madrid MÓDULO 8: WEB & SOCIAL DESIGN Microformatos y datos estructurados en la Web.
INTRODUCCION A CSS.
Sindicación de contenidos: RSS. Introducción La necesidad de información Internet nos proporciona una ingente cantidad de información. Cada vez nos interesa.
WWW (World Wide Web) Pedro José López Javier Díaz
Buscador Es un sistema informático que busca archivos almacenados en servidores web HERRAMIENTAS DE COMPUTACION I.
La evolución de la WEB Web 1.0 Web 2.0 Web 3.0.
Estructura de Documento Atributos 1. Atributos Básicos id, class, style, title 2. Atributos para Internacionalización lang, xml:lang, dir 3. Atributos.
TALLER DE HTML5. Clase 01 – Prof. Germán RODRÍGUEZ.
Comunicación en la web  Buscador: Página web en la cual se ofrece al usuario consultar una base de datos en la que.
HTML HyperText Markup Language (Lenguaje de Marcas de Hipertexto)
1 Search Engine Optimization. 22 Objetivo Adquirir conceptos básicos de SEO y herramientas de uso.
Hyper Text Markup Language Área de Programación y Metodologías de Desarrollo de Software Departamento de Informática Universidad Nacional de San Luis.
InfoPath Ventajas y Uso.
Recursos de Información y Presentaciones Digitales Integrantes: Alison Caiguan Carla Escobar Claudia Opazo Sebastian Santander.
Escuela: Colegio de bachilleres 20 del valle Materia: tecnología de la información y comunicación.
SEO Los términos posicionamiento en buscadores, posicionamiento web u optimización de motores de búsqueda engloban todos los procesos que se encargan de.
JOHAN ALEJANDRO SALAZAR MANUELA OCHOA 11 C  Una página web es un documento electrónico diseñado para el World Wide Web (Internet) que contiene.
Internet y Navegadores Unidad 5. Fecha: 1 de agosto de 2011 Periodo# : 2 Objetivo: identificar el contenido de una dirección web Tema: Elementos de una.
Conceptos básicos sobre Internet
PAGINAS WEB.
Introducción a XML por Joel Candia C Universidad Técnica Federico Santa María Departamento de Electrónica ELO-330 Programación de Sistemas.
Guía fácil del RSS.
EDWIN ACOSTA PINILLA DIEGO FERNANDO CASTRO JHON SEBASTIAN CASTRO.
Yusley Contreras COD: Lizeth Fuente Rico COD:
Servicio de sindicación
Gabriel Montañés León. RSS es el acrónimo de Really Simple Sindication (Sindicación Realmente Simple). Es un formato basado en el lenguaje XML que permite.
INFORMATICA TEMA: MAUAL DE USO DEL WORDPRESS ANDREA SALINAS 1° D.
Web Semántica La Web Semántica es la nueva generación de la Web, que intenta realizar un filtrado automático preciso de la información. Para ello, es necesario.
CRISTIAN MATEO NOREÑA MELIZA OSPINA MORENO 11 C TECNOLOGIA INFORMATICA LA SALLE DE CAMPOAMOR 2013.
Servicio de Internet http Pagina Web (blog). ¿ Que es una página Web? Documento en la World Wide Web que es visto a través de un navegador como Internet.
Anthony Villalba 1° “A”. ¿Qué es WordPress? Es un sistema de gestión de contenidos o CMS (por sus siglas en inglés, Content Management System) enfocado.
WORD WIDE WEB Nace a principios de los años 90 en Suiza. Su función es ordenar y distribuir la información que existe en internet. La World Wide Web se.
HTML.
Juan Pablo Arango Tatiana Zapata L 11C IE LA SALLE DE CAMPOAMOR.
Tema 6 – Servicio de Correo Electrónico
Navegación y comunicación en Internet y uso de las redes sociales
- Parámetros de apariencia y uso Luis Villalta Márquez.
Navegadores Web..
DIRECCIONES URL Las siglas URL corresponden a las palabras inglesas Universal Resource Locator, que en español viene a significar algo así como "Localizador.
MOTORES DE BUSQUEDA.
CÓMO HACER UN GRAN POST lanzados.wordpress.com Instrucciones para los miembros del Grupo de Colaboración Profesional Lanzados 02/02/15 Enrique Martínez.
Internet y Navegadores Unidad 5. Fecha: 1 de agosto de 2011 Periodo# : 2 Objetivo: identificar el contenido de una dirección web Tema: Elementos de una.
Web 2.0 Herramientas aplicadas a la educación.
Que es un Blog?  La Wikipedia define blog como “un sitio web periódicamente actualizado que recopila cronológicamente textos o artículos de uno o varios.
UD 9: “Instalación y administración de otros servicios de red e Internet” Servicio de sindicación Luis Alfonso Sánchez Brazales.
Una Red Sociales un sitio en internet donde compartir información, mensajes, ideas, fotos, etc., con amigos, conocidos y desconocidos. Para acceder a.
ROBERTO PARDO PÉREZ.  Blog, weblog, bitá… sin duda una palabra de moda, uno de esos términos que de la noche a la mañana hemos comenzado a ver repetido.
Servicio de sindicación Tema 8 SRI Vicente Sánchez Patón I.E.S Gregorio Prieto.
Herramientas de Comunicación Grace Lucía Moctezuma Zuñiga Lic. En Educación Preescolar.
World Wide Web. ¿ Que es la world wide web ?  La world wide web o www, nació a principios de los 90 en suiza Su función es ordenar y distribuir la información.
la publicidad en las paginas web han sido de gran impacto en nuestros tiempos modernos ya que ella han logrado atraer a publico en general, ha demás.
Posicionamiento Web Campaña de posicionamiento para páginas web. SEO/SEM
Es una web en donde se muestran varias direcciones de páginas que contienen el tema que se está buscando. Sus orígenes se remontan al año de 1994, cuando.
Repasando… Mi perfil en wordpress Personal Settings.
Web y Multimedia II Integrantes: Piero Álvarez Mayra Atience Jhonney Bermeo Johanna Cabrera Gabriela Cango.
¿Internet? Es un conjunto descentralizado de redes de comunicación interconectadas que utilizan la familia de protocolos TCP/IP, garantizando que las redes.
Sitemap – Acceso robots Primer nivel – Piramide SEO.
URL Structure – url amigables Primer nivel – Piramide SEO.
Primer nivel – Piramide SEO
CURSO DE FORMACIÓN AL PORTAL WEB DE LA UNIVERSIDAD CARLOS III DE MADRID ORACLE PORTAL Manual disponible en:
HTML. HTML 5 Características –Es una versión basada en HTML 4 –Manejo de la aplicación y multimedia. –Tags específicos para diferentes contenidos.
1.ª Parte: Dónde y cómo buscar información.  Cuando se busca información sobre un tema, es necesario emplear una «estrategia de búsqueda» para optimizar.
Transcripción de la presentación:

Microformatos ¿Por qué usarlos? Miguel Valero Twitter: @miguelvaleroseo Email: miguel@miguel-valero.es Móvil: 654 666 900 Web: www.miguel-valero.es Skype: mavalecu

Índice Orígenes web semántica El grafo del conocimiento de Google Microformatos Fuentes Especificaciones Debate - ¿Preguntas? Borradores Gracias Microformatos para el SEO Rel=“nofollow” Contenidos duplicados por paginación con parámetros I El chantaje rel=“author” Algunos Rich Snippets con microformatos Microdatos Schema.org - RDFa Ejemplo: RDFa 1.0 + XML Ejemplo: Schema.org

1. Orígenes ! Nace la Web semántica! 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 actuales Rel-nofollow 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 (vote-abstain), 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>

En negrita los mas usados en los richs snippets 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 Se usa schema.org para los vídeos en lugar del microformato hMedia En negrita los mas usados en los richs snippets hNews xFolk hProduct rel-payment hRecipe Rel-home Rel-enclosure rel-directory hReview

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 rato enumerando microformatos … ¿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.

Contenidos duplicados por paginación con parámetros I 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.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-all.php 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″ /> 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=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″ />

Contenidos duplicados por paginación con parámetros II *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.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-all.php (no index) Page.php?page=3; En el head; <link rel=”prev” href=”http://www.dominio.com/page.php?page=2″ />

Contenidos duplicados por paginación con parámetros III *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 nuestros resultados en las SERPS. Lograremos más clics (CTR +) Todavía no hay muchos sitios webs que los usan. (Oportunidad). Cuidado con los hReviews falsos. Hay formularios de denuncia. El uso de microformatos no es la opción recomendada por Google para todos los Rich Snippets. El porcentaje de rebote disminuye. 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 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 Compatible con XHTML y HTML5 No es la opción recomendada por Google RDFa 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 -> actors Person Un miembro del elenco de la película, serie o episodio. director El director de la película, Episodio de TV, o una serie. duration Duration La duración de la partida (película, grabación de audio, eventos, etc) en ISO 8601 date format. musicBy Person or MusicGroup El compositor de la banda sonora de la película o programa de TV. producer 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

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-de-todo-el-contenido-en.html http://googlewebmaster-es.blogspot.com.es/2011/12/paginacion-con-relnext-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-knowledge-graph-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!