¿Te gusta esto?... Entonces que no se te olvide compartirlo ;)

Utiliza heading tags en tu blog

Las heading tags ordenan las publicaciones desde lo m√°s importante hasta lo de menor relevancia, casi todos los buscadores de Internet las toman en cuenta para poder mostrar los mejores resultados en base a las b√ļsquedas que hagan las personas, estas etiquetas indican como debe estructurarse el contenido y que t√≠tulos, subt√≠tulos y encabezados son m√°s importantes que otros. En el caso de Blogger tenemos el t√≠tulo, el encabezado principal, el subencabezado y el encabezado secundario.

Por defecto las plantillas de Blogger vienen con las heading tags desordenadas ya que le dan relevancia a cosas que no las deber√≠an tener como los widget y las fechas de publicaci√≥n de las entradas, esto desde el punto de vista SEO impide que el blog tenga un buen posicionamiento en los motores de b√ļsqueda debido a que es una mala optimizaci√≥n ya que los buscadores muestran los mejores resultados en base a las palabras claves que contienen los t√≠tulos, descripciones y encabezados m√°s no por los widget, gadgets y fechas en las cuales se public√≥ la entrada.

Los encabezados son de mucha importancia para poder tener un buen posicionamiento en los buscadores, más allá de que el contenido sea el rey si el blog no cuenta con un buen SEO trabajado las publicaciones que posea no podrán ser encontrado por las personas, por lo cual se debe optimizar el sitio correctamente y dar un buen orden al texto de las entradas. Blogger no es como Wordpress que todo se pueda solucionar en base a diversos plugin que arreglan los encabezados, sin embargo particularmente me gusta hacer todas las modificaciones en el código fuente de la plantilla ya sea que esté trabajando en Blogger o Wordpress porque al usar plugins para todo no se aprende nada y de paso desmejora el procesamiento de la página haciendo que su carga sea cada vez más lenta

Afortunadamente el orden de las heading tags se puede corregir f√°cilmente ya que no representa un gran problema poder hacerlo, una vez aclarado esto proceder√© a explicar c√≥mo implementar la mejora: (En este blog la funci√≥n copiar y pegar esta desactivada por lo cual dejare un cuadro de texto por cada paso a realizar y para poder optar a copiar su contenido debes pulsar Ctrl+C, tambi√©n recuerda que ante de hacer cualquier modificaci√≥n en la plantilla tienes que hacer una copia de seguridad por si te equivocas en algo).

Optimiza el título principal del blog


El título principal del blog es importante cuando se está en la página principal pero es menos relevante cuando las personas se encuentran en una publicación del mismo, por lo cual se debe optimizar para que las heading tags estén ordenadas correctamente en base al lugar donde se encuentre el lector.

El t√≠tulo principal del Blogger puede verse en diferentes presentaciones, puede estar: "Detr√°s del t√≠tulo y la descripci√≥n""En lugar del t√≠tulo y la descripci√≥n" o se puede ver desde la forma: "Colocar la descripci√≥n despu√©s de la imagen". Para todas las vistas del nombre del blog existe una optimizaci√≥n diferente, as√≠ que presta mucha atenci√≥n y optimiza el t√≠tulo en base a cual de todas estas tengas:

Detrás del título y la descripción


Si tienes seleccionada esta vista del título debes proceder de la siguiente forma para optimizar el nombre del blog:

  1. Debes ir a "Tema" y dar clic en el bot√≥n "Editar HTML".
  2. Una vez all√≠ has presiona las teclas "Ctrl+F" y busca div class='titlewrapper'
  3. Te aparecerá esta línea de código dos veces:


<h1 class='title' style='background: transparent; border-width: 0px'>
              <b:include name='title'/>
            </h1>

En ambas ocasiones en las cuales te salga debes sustituir esa línea de HTML por esta otra:


Si tienes seleccionado: En lugar del t√≠tulo y la descripci√≥n o Colocar la descripci√≥n despu√©s de la imagen


Si tienes seleccionada esta otra vista del título debes proceder de la siguiente manera para poder optimizar el nombre del blog:

1.- Debes ir a "Tema" y dar clic en el botón "Editar HTML".
2.- Una vez all√≠ has presiona las teclas "Ctrl+F" y busca <!--Show the image only-->
3.- Te aparecer√° esto una sola vez:
<div id='header-inner'>
        <a expr:href='data:blog.homepageUrl' style='display: block'>
          <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
        </a>
        <!--Show the description-->
        <b:if cond='data:imagePlacement == &quot;BEFORE_DESCRIPTION&quot;'>
          <b:include name='description'/>
        </b:if>
      </div>

La línea de código HTML que ves en color rojo debes eliminarla y colocar esta otra:


 

Sin imagen en el título del blog

En caso tal de que el título de tu blog no tenga ninguna imagen y sea 100% texto debes seguir los siguientes paso:
  1. Debes ir a "Tema" y dar clic en el botón "Editar HTML".
  2. Una vez allí has presiona las teclas "Ctrl+F" y busca <!--No header image -->
  3. Te aparecer√° esto una sola vez:
 
<!--No header image -->
<div id='header-inner'>
  <div class='titlewrapper'>
    <h1 class='title'>
      <b:include name='title'/>
    </h1>
  </div>
  <b:include name='description'/>
</div>
Ese código HTML debes sustituirlo por este otro


Si aplicas la optimizaci√≥n se√Īalada anteriormente dependiendo del tipo de vista que tenga el t√≠tulo principal de tu blog, cuando los lectores se encuentre en la p√°gina principal el nombre del sitio llevara la etiqueta H1 y los t√≠tulos de las publicaciones tendr√°n la H2, cuando el lector este en una publicaci√≥n el t√≠tulo de la entrada llevara la H1 y el nombre del blog tendr√° la H2.

Dependiendo de la vista que se haya selecciona los títulos se verán bien o no sin tener que tocar el CSS pero en algunos casos estos se salen de proporción y desmejora la calidad visual, si este es tu caso una vez que aplicas la optimización deberás cambiar los estilos de cascada:

  1. Busca: ".Header h1 {" en los estilos y sustituye esa línea por esta otra ".Header h1, .Header h2 {"
  2. Busca: ".Header h1 a {" en los estilos CSS y sustituye esa línea de código por esta otra ".Header h1 a, .Header h2 a {"
  3. Una vez que cambies las líneas de estilo mencionadas anteriormente la visualización se verá bien.

El título de la publicación, los encabezados y subencabezados son lo más importante por lo cual debe llevar las heading tags de mayor peso


Lo más importante de cualquier publicación es el título que esta tenga ya que a través de él se puede encontrar la entrada en los buscadores, en pocas palabras allí se encuentran las palabras claves por la cual una persona llega a una entrada del blog y por ese motivo se debe asignar la etiqueta con mayor peso, dicha etiqueta es la "H1", seguidamente se tienen los encabezados que deben tener la etiqueta "H2" y los subencabezados que deben contener la etiqueta "H3".

  1. Primero se debe iniciar sesión en la cuenta de Blogger y seleccionar el blog que se optimizara.
  2. Luego se debe ir a "Tema" y posteriormente tienes que hacer una copia de seguridad por si te equivocas en el proceso.
  3. Una vez que hayas hecho la copia de seguridad debes hacer clic en "Editar HTML".
  4. Una vez que est√©s en el c√≥digo fuente de la plantilla debes pulsar las teclas "Ctrl+F" y escribir: post-title entry-title

Una vez que escribes la l√≠nea se√Īalada anteriormente te saldr√° este c√≥digo dos veces:

<h3 class='post-title entry-title' itemprop='name'>
              <b:if cond='data:post.link'>
                <a expr:href='data:post.link'><data:post.title/></a>
              <b:elseif cond='data:post.url and data:blog.url != data:post.url'/>
                <a expr:href='data:post.url'><data:post.title/></a>
              <b:else/>
                <data:post.title/>
              </b:if>
            </h3>

En ambas ocasiones que te aparezcan deber√°s reemplazarlo por este otro que esta optimizado:

Cuando se hace este cambio no se verán bien los encabezados porque los estilos están configurados para el HTML anterior, pero no te preocupes solo debes cambiar dos líneas de lenguaje CSS para que todo vuelva a la normalidad:
  1. Busca: h3.post-title, .comments h4 { y sustituye esa l√≠nea de estilo por esta otra: h1.post-title, h2.post-title, .comments h4 {
  2. Busca: .mobile h3.post-title { y sustituye esa línea de estilo por esta otra: .mobile h3.post-title, .mobile h2.post-title {

Una vez que realices los pasos se√Īalados anteriormente ya tendr√°s optimizado el T√≠tulo principal de cada entrada", los "Encabezados" y los "Subencabezados" de las publicaciones con las etiquetas correspondientes, pero aun no te vayas que todav√≠a falta.

Optimiza los widgets y gadgets de tu blog correctamente


Las plantillas de Blogger por defecto definen los encabezados y cajas de los widgets y gadgets que se encuentran en el header, sidebar derecho, sidebar izquierdo o footer del blog con la etiqueta H2, desde el punto de vista del posicionamiento web esto afecta el raking en los resultados y por tal motivo se debe cambiar la etiqueta que define esto.

  1. Debes ir a "Tema" y dar clic en el bot√≥n "Editar HTML".
  2. Una vez all√≠ has presiona las teclas "Ctrl+F" y busca <h2><data:title/></h2>
  3. Debes sustituir esa l√≠nea por esta otra: <h5><data:title/></h5>, tantas veces como aparezca.
  4. Luego debes buscar <h2 class='title'><data:title/></h2> y sustituirla por <h5 class='title'><data:title/></h5>, tantas veces como aparezca igualmente.
Una vez que realices los cambios habrás bajado la relevancia de los widgets que no influyen en el posicionamiento del blog y les habrás asignado una etiqueta de menor importancia pero que da un orden correcto al contenido del sitio, sin embargo no se verán correctamente los títulos debido al código CSS, así que deberás de igual forma cambiar ciertos estilos:

  1. Debes ir a "Tema" y dar clic en el bot√≥n "Editar HTML"
  2. Una vez all√≠ has presiona las teclas "Ctrl+F" y busca div.widget &gt; h2, sustituyes ese estilo por este otro div.widget &gt; h5,
  3. Busca: div.widget h2.title y sustituye ese estilo por este otro: div.widget h5.title

Baja la relevancia de las fechas de publicación de las entradas

Las fechas de publicaci√≥n de una entrada no son muy relevantes en el posicionamiento de un blog debido a que las personas buscan informaci√≥n que pueda haber sido publicada en cualquier fecha y por tal motivo estas no son importantes para los motores de b√ļsqueda, por lo cual debes bajar la relevancia de estas que por defecto vienen con la etiqueta H2 e igualmente afectan el raking del blog en Google y otros buscadores.

  1. En "Tema" da clic en el bot√≥n "Editar HTML".
  2. Una vez all√≠ has presiona las teclas "Ctrl+F" y busca <h2 class='date-header'><span><data:post.dateHeader/></span></h2> esta aparece dos veces y en ambas ocasiones debes sustituir esa l√≠nea de estilo por esta otra: <h6 class='date-header'><span><data:post.dateHeader/></span></h6>
  3. Igualmente debes buscar el estilo CSS y modificarlo para que no se vea mal, busca h2.date-header y sustituye esa l√≠nea de c√≥digo CSS por esta otra por h6.date-header

No es necesario optimizar los encabezados secundarios


Los encabezados secundarios no hace falta optimizarlos debido a que ya tiene asignada por defecto la etiqueta H4 y por tal motivo se debe dejar así, una vez que hayas realizado todas las optimizaciones de heading tags en tu blog el sitio quedara de la siguiente forma:

Mejora los encabezados de tu blog
Usamos cookies propias y de terceros que recogen datos sobre sus h√°bitos de navegaci√≥n. Si contin√ļa navegando se considerar√° que acepta su uso. OK M√°s informaci√≥n aqu√≠