Ayudando al posicionamiento SEO sin modificar diseño gracias al CSS

En este artículo vemos como mejorar el posicionamiento SEO sin que afecte al diseño gracias al conocimiento del código CSS.

posicionamiento, seo

Este artículo surge a raíz del comentario que hizo Señor Muñoz a mi tweet

Conversación en twitter

En el directo «Señor Muñoz – Deja de poner links aleatorios en tus plugins y temas» que dió en la iniciativa #yomequedoencasa creada por mowomo, comentaba que uno de los errores más comunes es poner un enlace, y dentro de él, primero una imagen, y luego un título a causa del diseño.

Para conseguir el diseño de este bloque, lo normal es que se ponga este HTML y luego aplicarle un estilo.

Según Señor Muñoz, para mejorar el link tenemos que poner primero el texto que nos interese posicionar, en este caso el título para relacionarlo con el link.

Por lo que el HTML nos quedaría así.

Y el resultado sería el siguiente :

Es indiferente dónde se encuentre la imagen, siempre que sea después del título según este ejemplo.

Situar la imagen al principio es muy sencillo con la propiedad FLEX de CSS, añadiendo al contenedor DIV el siguiente código:

Y a la imagen le asignamos el order: -1 para situarla al inicio. Quedaría así el código final CSS:

Aquí os dejo el vídeo para que veáis el resultado.

Resultado final.

Conclusión

Gracias al conocimiento del CSS se puede mejorar el posicionamiento de la página, sin que afecte al diseño.

y gracias a Sr.Muñoz por sus tips sobre posicionamientos…. y a Mowomo por los 40 días de eventos sobre WordPress.