Estándares SEO para desarrolladores web frontend y backend (parte 1)

6 min read
7 de septiembre de 2018

Un buen SEO empieza desde la planeación de un proyecto web. Actualmente, en el mundo existen alrededor de mil millones de sitios web y se realizan más de 3 billones de búsquedas diarias a través de internet.  

Según gs.statcounter.com en lo corrido de este año, el 96.5 por ciento de las búsquedas totales en Colombia fueron realizadas a través de Google; el segundo buscador utilizado fue Yahoo! con el 2 por ciento, y el tercero, bing con el 1.31 por ciento.

Es así como Google se convierte en el motor de búsqueda más importante para establecer los lineamientos de desarrollo que nos permitan lograr los primeros resultados de búsqueda.

No es solo trabajo del equipo de marketing, los desarrolladores juegan un papel fundamental en este objetivo, ya que son los encargados de darle el primer impulso a los sitios web ante los motores de búsqueda y establecer los lineamientos en los que será administrado un sitio una vez esté publicado.

Descarga gratis la guía sobre buenas prácticas de SEO y posicionar tu sitio web en motores de búsqueda

A continuación, conocerás algunos consejos que debes tener en cuenta al momento de empezar a desarrollar un sitio web.

Desarrolla para los motores de búsqueda de Google

Al ser el motor de búsqueda más utilizado a nivel mundial con alrededor de 2 billones de búsquedas anuales, establece estándares bastante estrictos al momento de competir por los primero lugares en el SERP.

Google cuenta con decenas de variables en su bot que cubren los parámetros de evaluación de otros buscadores. Por esta razón, los especialistas buscan satisfacer los deseos de Google primero que los de otros motores de búsqueda.

Muchas de las variables que mencionaremos a continuación están enfocadas a determinar factores técnicos que principalmente permiten al usuario tener una buena experiencia de navegación en el sitio web lo que, a grandes rasgos, ayuda a nuestro sitio a generar mayor engagement con los usuarios.

La arquitectura

La definición de una buena arquitectura nos permite la utilización de recursos enfocados a solucionar problemas específicos como el almacenamiento de información, ancho de banda, manejo de bases de datos, peticiones al servidor, velocidad de procesamiento, etc.

Debemos conocer muy bien la necesidad del proyecto y sus características antes de realizar la arquitectura de un proyecto web, de esta forma nos enfocamos en solucionar posibles imprevistos de manera fácil y acertada en el futuro.

Bien planeada, la arquitectura puede llegar a mejorar el rendimiento de un sitio web de manera sustancial, además que le permite a los sitios escalabilidad y fácil adaptación al cambio.

La velocidad de carga

Uno de los criterios de evaluación principales en el posicionamiento web es la velocidad de carga de un sitio.

Actualmente, Google solo considera este factor en términos de tiempos de carga de una página en un computador de escritorio, pero, con las crecientes búsquedas desde dispositivos móviles el gigante de la internet anunció que a partir de julio de 2018 este criterio se extenderá también a smartphones y tablets por medio del algoritmo llamado “Google Speed update”.

Para Google el tiempo medio de carga total de una página no debería superar los 22 segundos que representan el tiempo máximo en el cual Google Analytics reporta la métrica de tasa de rebote, lo que resulta un poco paradójico ya que según los informes de comportamiento de usuario, el 53 por ciento abandona el sitio si este se demora en cargar mas de 4 segundos en promedio.

Google Analytics

Para evitar ese comportamiento, es recomendable optimizar al máximo todos los recursos ya que a mayor velocidad de carga, mejor oportunidades tenemos de obtener alto tráfico a nuestro sitio y por ende,  mejor posicionamiento en los resultados de búsqueda.

Consejos para mejorar la velocidad de carga de un sitio desde el desarrollo

  • Evite duplicar código.
  • Evite usar comentarios de código innecesarios o demasiado largos.
  • Evite dejar fragmentos de código comentado al momento de hacer el paso a producción.
  • Evite llamados innecesarios a bases de datos.
  • Utilice patrones de diseño, evita la creación de nuevo código por otros desarrolladores en proyectos colaborativos.
  • Simplifique lo más posible el código y asegúrese de validarlo en buenas prácticas.
  • Reduzca el peso, ofusque y/o modifique el código para el paso a producción de javascript, css, imágenes, y pdfs.
  • Utilice la menor cantidad de archivos para realizar menos peticiones de descarga al servidor.
  • Evite que las primeras consultas a la base de datos sean muy complejas de resolver.
  • Monitoree los TTFB (Time To First Byte) con ayuda de la consola de Chrome y solucione los problemas con ficheros que presenten un tiempo de carga alto.
  • Evite utilizar frameworks completos por necesidad de una funcionalidad específica.

Arquitectura de información

La arquitectura de información es uno de los pilares más importantes en la construcción de un sitio web enfocado al usuario. Normalmente la responsabilidad de crear la arquitectura de información es del equipo de experiencia de usuario pero hay ciertos temas que le competen directamente al equipo de desarrollo.                                             

 URLs Amigables   

En la arquitectura de información se define entre otras cosas el flujo de navegación de un sitio web, desde los contenidos principales a enlazar desde el menú principal, hasta los contenidos internos a los que se ingresa por menús secundarios.

Todo contenido debe estar identificado por una URL, y cada URL dentro del sitio debe tener una jerarquía que establece el tipo de contenido para los buscadores. Es de ahí que google siempre prefiera una url amigable al usuario y que está semánticamente pueda ser entendible y vincule las palabras claves al contenido que está mostrando.

Es deber del desarrollador backend programar que la estructura de navegación sea limpia, simple y fácil de rastrear, para ello debe tener en cuenta:

  • Evitar el uso de variables de sesión &, id, y # siempre que sea posible
  • Crear una estructura jerárquica entre contenidos padre e hijos
  • No incluir palabras en las URLs que no corresponden al contenido del sitio como home, web, archivos, página,  etc.

Si una URL se hace de manera adecuada, los usuarios y los motores de búsqueda van a saber qué contienen las páginas al momento de presentar la URL en los resultados.

Si quieres posicionar tu sitio web en Google, lee 11 consejos de SEO para hacer visible tu sitio web

Jerarquía de contenido

Además de las etiquetas mencionadas anteriormente debemos también identificar el contenido con etiquetas que ayudan a Google a conocer el valor que tiene cada texto para el usuario, a esto le llamamos jerarquía de contenido.

El lenguaje html nos permite establecer diferentes etiquetas de encabezado, de h1 hasta h6, de esta manera podemos crear una jerarquía de información que además de permitirle al usuario conocer la relevancia del contenido, también ayuda al usuario de nuestro sitio a leer y navegar mejor el contenido.

  • Etiqueta h1

Es utilizada para identificar el título de la página del sitio, es la etiqueta más importante ya que es la que los motores de búsqueda utilizan para establecer una relación semántica entre el contenido presentado y la intención de búsqueda de los usuarios.

Es importante tener presente que se debe evitar el uso de esta etiqueta más de una vez en la misma página, ya que mientras menos veces se utilice, mayor relevancia le darán los motores de búsqueda a las palabras que incluimos dentro de ella.

<h1>Título principal de la página</h1>

  • Etiqueta h2

La etiqueta h2 es menor  en jerarquía que la etiqueta h1, es utilizada para los subtítulos y los motores de búsqueda le tienen muy en cuenta cuando es bien utilizada. En una sola página podemos utilizar cuantas h2 sean necesarias.

<h2>Subtítulo o títulos secundarios de la página </h2>

  • Etiqueta Párrafo

Puede parecer obvio que la etiqueta párrafo deba ser utilizada, sin embargo, algunos desarrolladores olvidan el valor de esta etiqueta al momento de utilizar lenguajes como php o consumo de servicios en javascript.

Uno de los errores más comunes en desarrollos a la medida es que el texto se renderice en el explorador sin la etiqueta <p>, algunos exploradores como Chrome o Firefox la interpretan desde el DOM  y por eso para el usuario no representa ningún error, sin embargo, para SEO puede significar la diferencia entre ser o no el candidato para aparecer en los resultados de búsqueda de un usuario.

Métricas y analítica web

La analítica es uno de los factores más importantes al momento de implementar una estrategia digital. Aunque no es responsabilidad del desarrollador, es una buena práctica implementar cada uno de los ficheros necesarios para que el equipo de analítica y SEO pueda tener datos desde la primera salida a producción del sitio.

Los ficheros más importantes de implementar para SEO son:

  • Robots.txt
  • Sitemap.xml
  • Google analytics
  • Google Tag Manager
  • Google Search Console

Hasta este momento hemos hablado de varios de los parámetros importantes a nivel técnico que influyen sobre el posicionamiento de un sitio web en motores de búsqueda.

Para los desarrolladores muchos de ellos han sido desconocidos y durante su proceso no son tenidos en cuenta.

En la continuación de este artículo veremos la manera en que influye el HTML y el marcado de etiquetas en el posicionamiento web, y las correctas prácticas que deben ser utilizadas para lograr posicionar nuestro sitio entre los primeros resultados de búsqueda.

Estándares SEO para desarrolladores web frontend y backend (parte 2)

Nuevo llamado a la acción

Suscríbete al
Blog Pragma

Recibirás cada mes nuestra selección de contenido en Transformación digital.

Imagen form