.erwinAndrés

La anatomía del post es el esqueleto que lo conforma y le da formato y sentido al contenido de éste dentro de tu blog y para los buscadores y lectores de texto.

Como sabrán, el editor de entradas de Blogger tiene dos opciones: Redactar y HTML. La primera te muestra un editor de texto enriquecido o RTE (Rich Text Editor) y la segunda te muestra un editor de texto plano donde puedes escribir tu HTML directamente.

Yo hace años dejé de usar la pestaña redactar y recomiendo a todo el mundo dejar de usarla porque está dañada, siempre lo ha estado y al parecer siempre lo estará. ¡NO SIRVE!

Tudú es una pequeña y simple aplicación web para crear listas TO-DO de manera rápida y efectiva.

Para las imágenes de entradas lo más importante es agregar los atributos titley alt y nombrar de manera correcta y legible la imagen.

Las imagenes son una buena fuente de tráfico. Es muy común que las personas encuentren tu blog a travez del buscador de imágenes de Google y tener imágenes optimizdas facilitará las cosas.

Si hablamos de lo que ven los buscadores tenemos que hablar del título de la entrada, que es lo primero que ven, y no hablo del texto del título sino del HTML.

Las etiquetas de <h1> a <h6> se utilizan para marcar títulos y subtítulos, siendo <h1> el título de mayor importancia y <h6> el de menor importancia.

El alma de un blog son sus entradas, sin estas no sería un blog y sin estas se haría más difícil encontrar el blog para los buscadores. A mayor número de entradas, mejor posicionamiento para el blog y si esas entradas están bien estructuradas, mucho mejor.

No sé realmente qué se debe escribir en el blog para captar la atención de los visitantes, pero sí tengo una idea (más o menos) de cómo debe estar estructurado el HTML de lo que escribes para ser visto por los buscadores.

Hace algunos meses atrás me puse en el trabajo de mejorar los meta-tags de uno de los otros blogs que administro (también en blogger), con el fin de lograr una pequeña mejor en el SEO del blog.

«Sólo unos pequeños detalles, nadie lo notará»

Primero modifiqué las etiquetas de Open Graph y las "Twitter Cards" para hacer el blog un poco más compatible con redes sociales. Todo bien hasta aquí, no tuve ningún problema importante con esto. El problema fue cuando cambié la etiqueta de descripción <meta name='description'/>.

Utilizaba una descripción general para todo el blog, no importaba si se trataba del home o de una página estática o de una página de entrada, la descripción era la misma. Para corregir esto hice uso de la expresión data:blog.metaDescription que devuelve la descripción de búsqueda de cada entrada. Luego la condicioné para que sólo se muestre en las páginas de entradas que tengan descripción de búsqueda y utilicé una descripción general para las que no.

El problema llegó unos días después cuando me di cuenta que el promedio de visitas diario se iba cuesta abajo rápidamente, aunque curiosamente, el número de "me gusta" en la página de facebook del blog ha aumentado desde este cambio en los metas.

¿Entonces, cómo una supuesta mejora en el SEO del blog puede estar disminuyendo el número de visitantes? La respuesta está en el aumento de likes en la página de facebook. Al usar una descripción individual para cada entrada menos personas encuentran el blog, pero aquellos que sí lo hacen probablemente han encontrado exactamente lo que estaban buscando. Esto ayuda a crear visitantes más fieles llevándolos a seguir el blog en las redes sociales, a diferencia de utilizar la misma descripción para todo el blog, que atrae más visitantes que abandonan la página en segundos por no haber encontrado lo que buscaban. Al final, tuve que explicarle al otro administrador del blog, que lo que estábamos haciendo aquí era preferir calidad de visitantes antes que cantidad.

La página de los Oscars en la sección dónde está la lista de nominados me ha llamado la atención este año y he decidido copiarla.

El año pasado hicieron algo parecido utilizando (me parece) enlaces remotos con CSS. Pero el de este año me ha gustado más, así que me puse a husmear en el código de la página. Estas son mis notas:

Hace algún tiempo las "Plantillas de diseño" de Blogger fueron actualizadas para incluir html5 en su código, lo usan moderadamente, pero lo usan. Y si hablamos de las más nuevas, las de "Vistas Dinámicas", también están hechas en html5 y, aunque aún no son editables, algún día lo serán y hay que estar preparados.

En una entrada anterior explicaba las nuevas etiquetas del html5, sus funciones y cómo implementarlas. Es algo muy básico, solo explica las etiquetas más relevantes con definiciones que parecen sacadas del diccionario. Pero mientras la escribía me surgieron unas preguntas:

¿Qué tanto soporta Blogger el html5? ¿Cómo puedo implementarlo en mi blog? ¿Qué limitaciones hay?

Con motivo de responder estas preguntas, decidí crear una plantilla usando html5. Porque para aprender, nada mejor que la experiencia propia.

HTML5 es la versión más reciente del estándar HTML que ha llegado para quedarse. Es más simple, más rápido y mucho más fácil de implementar. Esta es una breve guía para introducirse en HTML5.

Primero lo primero: El "doctype"

El doctype en HTML5 es bastante sencillo. En versiones anteriores se trataba de un código largo y difícil de recordar. Por ejemplo la versión anterior: