Optimizar el posicionamiento con microdata

Si has llegado aquí a través de un buscador, espero que éste post sea de tu agrado, en cambio, si has llegado porque ya lo seguías previamente, gracias!

He estado viendo videos de Matt Cutts en su canal de youtube, donde aconseja el uso de los microdata ó microformatos (también podemos encontrarlo como rich snippet), lo he visto importante para tener en cuenta, habrá que ver si realmente optimiza el posicionamiento tanto como dice.

Para aquellos que no sepan lo que es, no son más que etiquetas HTML, concretamente HTML5, que facilitan muchísimo el trabajo de los buscadores, siendo capaces de obtener resultados más precisos. Todo ésto no es por arte de mágia, sino porque con éstas etiquetas, le estamos etiquetando ó dicho de otra forma, encasillando el tipo de contenido para que los buscadores puedan "entender" el contenido.

Los distintos tipos de microformatos están recogidos en la web de schema.org.
Existe un generador online de microdata en ésta url, aunque está un poco limitado, pero vamos, si se quieres añadir cualquier propiedad que no esté, bastaría con ver como se montan el resto de propiedades.
Para terminar, puedes testear el código, puedes hacerlo con ésta herramienta que Google ha creado.


He visto una url que me ha gustado mucho donde explica paso a paso el proceso de etiquetar el contenido, la url a la que me refiero es ésta primera, ésta segunda o ésta otra, en inglés.

Ejemplo de código con microdata:

 <div itemscope itemtype="http://schema.org/Product"> <a itemprop="url" href="http://siguemeaquicuandoquieras.blogspot.com.es/"><div itemprop="name"><strong>Web Artesana</strong></div></a><div itemprop="description">web artesana, hecha a mano 100%, tecleando todas y cada una de las palabras escritas</div></div>  

La salida sería ésta:

Web Artesana

web artesana, hecha a mano 100%, tecleando todas y cada una de las palabras escritas

Crear presentaciones con html5

 Me ha surgido la necesidad de crear una presentación en inglés, el caso es que no tengo instalado el PowerPoint, no se si habrá alguna versión para linux, mirando un poco por la nube, he encontrado que existe el Power Point viewer, pero como su nombre indica, no creo que deje crearlas, tampoco voy a instalarme dicho programa en la máquina virtual, cuando luego no le voy a dar uso. Y la pregunta que me hago es, después de estar todo el día programando, con las mejoras que trae el HTML 5, ¿sería muy complicado crear algunas funciones con jQuery y CSS para crear efectos que simulen las presentaciones?
Oh...wait... antes de nada, vamos a mirar un poco por Google, que seguro que alguién que tuviese que hacer varias presentaciones ya lo ha pensado... Efectivamente, hay ya creadas varias librerías creadas con propósito.

Explico aquí un poco lo que he encontrado:

Impress.js
Es el que más me ha llamado la atención y más me ha impresionado, ahora entiendo el porqué del nombre, vamos que me ha impactado, siendo posible crear efectos 3D, es un framework de javascript que hace uso de las mejoras de CSS 3 a nivel de efectos en las animaciones. No hace falta recordar que, para que se vean dichas animaciones, se debe usar un navegador que soporte el CSS3 y HTML5. El inconveniente que veo es que no hay estilos ni plantillas definidas, sino que tienes la página en blanco y ahí vas añadiendo a mano las transparencias en el lugar que desees, para que luego te genere el efecto, de tal manera que si éstas las pones muy seguidas, el efecto es pequeño, mientras que alejándolas consigues que el efecto llegue incluso a marear.

Link de ejemplo de presentación aquí
Link de descarga del código fuente aquí

Reveal.js

Es el que más me ha llamado la atención por sus efectos visuales, de primeras no parece muy difícil de cambiar los CSS y añadir tus propios efectos, aunque luego haciendo pruebas, el contenido no aparecía donde tocaba y había que pelearse más de la cuenta con los css para que aparezcan centrados. Si entras a la página de http://www.rvl.io, una vez registrado puedes crear la presentación sin necesidad de tocar código fuente, aunque ahí estaríamos en las mismas que con el PowerPoint, las transparencias están separadas en tags llamados section.

Ejemplo aquí: http://lab.hakim.se/reveal-js/
https://github.com/hakimel/reveal.js/tree/master --> descargar la librería reveal.js
http://foundation.zurb.com/docs/reveal.php --> documentation here

Link para descargar el reveal.js aquí.

Google Slides Template
Como no, Google tiene su propia plantilla de presentaciones HTML5. Es bastante más básico comparado con el anterior, Reveal.js. Está restringido a transicciones de diapositivas de derecha a izquierda y efectos de fade-in, aún así, tiene muy buena pinta. Las transparencias están separadas en tags llamados article y parece bastante sencillo añadir nuevos efectos CSS. Link para descargar el Google Slides Template aquí.

http://slides.html5rocks.com/#drag-out -- muy buenos efectos

http://luiscanada.com/blog/pase-de-diapositivas-con-html5/ -- web donde está muy bien explicado

HTML Slidy

Plantilla de presentaciones de w3c, entiendo que cumplirá los estándares xD. Si dijimos que el anterior era ya algo más básico... este aún le gana, si las comparamos con las anteriores son un poco más sosas, aunque tiene pinta de ser bastante sencillo de usar.

Link de un ejemplo aquí.

Fathom.js
Se basa en jQuery, y está muy clara la documentación, diría que es la más rápida para crear una presentación, quedando bastante decente sin que te quite mucho tiempo. Luego muy buena en relación calidad/tiempo dedicado.

Link de ejemplo aquí
Código fuente aquí