» tutoriales » Como hacer un XHTML Blogger plantilla SEO valido

Como hacer un XHTML Blogger plantilla SEO valido

por PCSencilla , en domingo, agosto 24, 2014
Como hacer un XHTML Blogger plantilla SEO valido

Como hacer un XHTML Blogger plantilla SEO valido
Reducir el Error en plantillas Blogspot. Tal vez muchos de los que han discutido sobre cómo crear un blog plantilla xhtml válido o inválido html5 reduciendo el número de errores en las plantillas y widgets. Donde el disminuir el número de errores en la plantilla, será más fácil para el robot navegar nuestro blog y afectaría a la calidad de la SEO de un blog.

Para verificar que la validación de una plantilla de blog puede utilizar las herramientas del servicio de validación W3C Markup visitando http://validator.w3.org/ allí, nos introduce la url del blog y puede determinar la cantidad de errores de nuestro blog. Antes de realizar la validación, es preferible utilizar otros blogs a juicio, si no eliminar los resultados de widget en el error de percepción o copiar todo el contenido del widget del Bloc de notas.

Cómo hacer un Blog plantilla  XHTML Valido / HTML5 válido

1. Ingresar a tu Blogger > Plantillas > Editar HTML > ampliar Widget plantillas comprobar configuración

2. Cambio declaración 'DOCTYPE, encontrar el código de abajo

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
  3. <head>


Quite todo el código anterior y reemplazarlo por el siguiente código

  1. <!DOCTYPE html>
  2. <HTML>
  3. <head>
  4. <meta charset='utf-8'/>


Después del cambio del código de</html> a</HTML>

3. Elimine el comentario existente en la declaración de CSS, búsque de código guion como (-) y eliminarlos. ejemplo:

  1. /* ----------------------
  2. Name: Leet Blogger Responsive Template
  3. Date : 16 Jan 2014
  4. Url : https://www.facebook.com/sec.researcher
  5. -------------------------*/


Resultados se convierten en

  1. /* Name: Leet Blogger Responsive Template
  2. Date : 16 Jan 2014
  3. Url : https://www.facebook.com/sec.researcher */


4. Retire la etiqueta meta <b:include data='blog' name='all-head-content'/>

5. Quitar la barra por defecto blogger, de exploración <body>código de búsqueda y agregue el código siguiente en primer lugar

  1. <!-- <body><div></div> -->


6. quitar icono QuickEdit imágenes destornillador, mira para el código <b:include name='quickedit'/>
Si usted ha encontrado todo limpio, no olvide si añades más tarde un nuevo widget para quitar el código de nuevo.

7. Eliminación del icono del Post, busque el siguiente código

  1. <span class='post-icons'>
  2.         <!-- email post links -->
  3.         <b:if cond='data:post.emailPostUrl'>
  4.           <span class='item-action'>
  5.           <a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
  6.               <img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/>
  7.           </a>
  8.           </span>
  9.         </b:if>
  10.         <!-- quickedit pencil -->
  11.         <b:include data='post' name='postQuickEdit'/>
  12.       </span> <div class='post-share-buttons'>
  13.         <b:include data='post' name='shareButtons'/>
  14.       </div> </div>


Eliminar y sustituir por el siguiente código

  1. <span class='post-icons'>
  2. <!-- email post links -->
  3. <b:if cond='data:post.emailPostUrl'>
  4. </b:if>
  5. </span>
  6. </div>


8. Añadir tipos type = "text/javascript" en todo tipo de código JavaScript y tipo de  type = "text/css" para todo el css existente, ya sea en las plantillas, Entradas o en un widget. ejemplo:

  1. <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
  2. <script src="http://example.com/style.css"></script>


Cambie a

  1. <script type="text/javascript" src="https://code.jquery.com/jquery-1.10.2.js"></script>
  2. <script type="text/css" src="http://example.com/style.css"></script>


9. Esconder navegación de página en la Página principal, mira el código <b:include name='nextprev'/> reemplazar con el código siguiente

  1. <b:if cond='data:blog.homepageUrl != data:blog.url'>
  2. <!-- navigation -->
  3. <b:include name='nextprev'/>
  4. </b:if>


10. Agregar atributos Alt en todas las imágenes, ejemplos

  1. <img height='75' src='http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg' width='75'/>


El cambio se convierte como abajo

  1. <img alt='no image' height='75' src='http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg' width='75'/>


11. Retire todas las etiquetas meta que resulten Error en plantilla de blog. Uso meta etiquetas consiguiendo un HTML 5 válido.

  1.  <b:if cond=’data:blog.pageType == &quot;item&quot;’>
  2. <title><data:blog.pageName/> | <data:blog.title/></title>
  3. <b:else/>
  4. <title><data:blog.pageTitle/></title>
  5. </b:if>
  6. <b:if cond=’data:blog.url == data:blog.homepageUrl’>
  7. <meta content='Your Blog Description' name='description'/>
  8. <meta content=’Keywords of your blog’ name=’keywords’/></b:if>
  9. <link href=’http://pcsencilla.blogspot.com/atom.xml’ rel=’alternate’ title=’Atom’ type=’application/atom+xml’/>
  10. <link href=’http://pcsencilla.blogspot.com/feeds/posts/default’ rel=’alternate’ title=’RSS Feeds’ type=’application/atom+xml’/>
  11. <link href=’http://pcsencilla.blogspot.com/openid-server.g’ rel=’openid.server’/>
  12. <link href=’http://pcsencilla.blogspot.com/favicon.ico’ rel=’icon’ type=’image/x-icon’/>
  13. <meta content=’verification code from google webmaster’ name=’google-site-verification’/>
  14. <meta content=’alexa verification code’ name=’alexaVerifyID’/>
  15. <meta content=’verification code from bing’ name=’msvalidate.01′/>
  16. <meta content=’your Name’ name=’Author’/>


12. Resolver error css plantillas bundle, eliminar código <b:skin><![CDATA[
vuelva a colocar el siguiente código

  1.  <link type='text/css' rel='stylesheet' href='//www.blogger.com/static/v1/widgets/3950009988-widget_css_bundle.css' /> &lt;style type=&quot;text/css&quot;&gt; &lt;!-- /*<b:skin><![CDATA[*/]] <style>


13. Ocultar widgets en la Página principal. 

  1. <b:if cond='data:blog.homepageUrl != data:blog.url'>
  2. El widget oculto que quieras
  3. </b:if>


14. Poner bajo el siguiente script justo debajo de <head>

  1. <!--[if IE]><script type='text/javascript' src='http://html5shiv.googlecode.com/svn/trunk/html5.js'></script><![endif]-->


15. En el momento de publicar fotos quitar atributos Anchor='1' y border='0' y agregar el atributo title y alt. El siguiente ejemplo es un blogspot de formato de imagen estándar.

  1. <div class="separator" style="clear: both; text-align: center;">
  2. <a href="http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg" /></a></div>


Cambiarlo a

  1.  <div class="separator" style="clear: both; text-align: center;">
  2. <a href="http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="Blogger" title="Blogger" src="http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg" /></a></div>


16. Nunca use etiqueta <center> para hacer un uso centrado, escribir o dibujar el siguiente código si no quieres ocasionar tampoco un error html en la entrada o en el widget html.

  1. <div style="text-align: center;">Fill Widget</div>



Como hacer un XHTML Blogger plantilla SEO valido
Sobre el articulo
Como hacer un XHTML Blogger plantilla SEO valido - escrito por PCSencilla , publicado el domingo, agosto 24, 2014, categorizado en blogger , tutoriales
comparte este articulo Facebook Twitter Google+ Linkedin Technorati Digg

0 Comments