SEO para desarrolladores: checklist de HTML, performance y datos estructurados que sí mueven el ranking

Resumen ejecutivo

• Gran parte del SEO técnico lo implementa quien programa: el HTML, la velocidad, las URLs, el sitemap y los datos estructurados dependen del código.

• Esta checklist cubre lo que un developer puede controlar sin ser especialista: title y headings, meta description, URLs, imágenes, Core Web Vitals, sitemap, robots.txt y un ejemplo de JSON-LD.

• Todo se puede chequear con herramientas gratuitas como PageSpeed Insights, Lighthouse y Search Console.

• Al final, qué pedirle al equipo de contenidos para que tu trabajo técnico rinda.

Te pasaron un ticket que dice «mejorar el SEO del sitio» y no sabés por dónde empezar. Es normal: el SEO suele explicarse con lenguaje de marketing, pero muchas de las decisiones que más pesan en cómo un buscador rastrea, entiende y muestra una página se toman en el código. Un title mal generado, un sitio que tarda en cargar o una página que no se puede rastrear no se arreglan escribiendo mejores textos.

Por qué ahora: los buscadores y los asistentes de IA que responden con fuentes dependen de páginas rápidas, bien estructuradas y fáciles de interpretar. Saber SEO técnico se volvió una habilidad diferencial para perfiles frontend y full stack, y es de lo primero que se nota en un proyecto de portfolio. Si querés el contexto de cómo cambió el posicionamiento con la IA, mirá qué es el SEO para IA.

Cómo funciona un buscador, en versión developer

Según la guía de optimización de Google Search Central, el proceso tiene tres etapas: el buscador rastrea (descarga tus páginas siguiendo links y sitemaps), indexa (interpreta el contenido y lo guarda) y muestra resultados según relevancia y calidad. Tu código influye en las tres: si una página no se puede rastrear, no se indexa; si el HTML es confuso, se interpreta mal; si la experiencia es mala, compite peor.

Checklist de HTML

Title único por página

Cada página necesita un <title> único, descriptivo y que incluya el tema principal. En frameworks como Next.js, Nuxt o Astro, asegurate de que se genere dinámicamente por ruta y no quede el mismo title en todo el sitio.

Un H1 claro y una jerarquía de headings lógica

Un solo H1 por página que describa el contenido, y H2/H3 en orden, sin saltos por razones de estilo. Si necesitás un texto grande que no es título, resolvelo con CSS, no con un heading.

Meta description

No es un factor directo de posicionamiento, pero suele usarse como fragmento en los resultados y afecta el clic. Generala por página a partir del contenido, no la dejes vacía ni repetida.

URLs limpias

Rutas legibles y estables: /blog/seo-para-desarrolladores en lugar de /post?id=8347&ref=x. Si cambiás una URL, configurá una redirección 301 desde la anterior.

Canonical

Si el mismo contenido es accesible desde varias URLs (con parámetros, con y sin barra final), definí una URL canónica con <link rel="canonical">.

Imágenes con alt y peso razonable

Todas las imágenes de contenido con atributo alt descriptivo, formatos modernos como WebP o AVIF, dimensiones definidas (para evitar saltos de diseño) y loading="lazy" en las que están debajo del primer pantallazo.

Links rastreables

Los buscadores siguen links <a href>. Navegaciones hechas solo con eventos de JavaScript (un div con onClick) pueden no rastrearse bien.

Checklist de performance: Core Web Vitals

Google mide la experiencia de carga con las Core Web Vitals, documentadas en web.dev. Los umbrales de «bueno» son:

• LCP (Largest Contentful Paint): 2,5 segundos o menos. Mide cuánto tarda en aparecer el elemento principal. Mejoralo optimizando la imagen principal, usando precarga y reduciendo el tiempo de respuesta del servidor.

• INP (Interaction to Next Paint): 200 milisegundos o menos. Mide qué tan rápido responde la página a las interacciones. Mejoralo dividiendo tareas largas de JavaScript y cargando menos scripts de terceros.

• CLS (Cumulative Layout Shift): 0,1 o menos. Mide cuánto «salta» el diseño mientras carga. Mejoralo definiendo tamaños de imágenes y reservando espacio para anuncios o embeds.

Para sitios con mucho JavaScript, considerá renderizado del lado del servidor o generación estática en las páginas que necesitan posicionar, así el contenido principal llega en el HTML inicial.

Checklist de rastreo: sitemap y robots.txt

• Sitemap XML: generalo automáticamente con todas las URLs indexables y envialo desde Search Console. La documentación de sitemaps de Google explica formatos y límites.

• robots.txt: sirve para controlar el rastreo, no para ocultar páginas del índice. Para que una página no aparezca en resultados, usá noindex en la meta etiqueta robots.

• Cuidado con los entornos de prueba: un Disallow: / o un noindex que se copia de staging a producción es uno de los errores más caros y más comunes.

Datos estructurados: un ejemplo simple

Los datos estructurados ayudan a los buscadores a entender de qué trata una página y pueden habilitar resultados enriquecidos. Se agregan con JSON-LD usando el vocabulario de schema.org. Un ejemplo para un artículo:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "SEO para desarrolladores: checklist técnico",
  "author": { "@type": "Person", "name": "Nombre Apellido" },
  "image": "https://tusitio.com/img/portada.webp",
  "datePublished": "AAAA-MM-DD"
}
</script>

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "SEO para desarrolladores: checklist técnico",
  "author": { "@type": "Person", "name": "Nombre Apellido" },
  "image": "https://tusitio.com/img/portada.webp",
  "datePublished": "AAAA-MM-DD"
}
</script>

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "SEO para desarrolladores: checklist técnico",
  "author": { "@type": "Person", "name": "Nombre Apellido" },
  "image": "https://tusitio.com/img/portada.webp",
  "datePublished": "AAAA-MM-DD"
}
</script>

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "SEO para desarrolladores: checklist técnico",
  "author": { "@type": "Person", "name": "Nombre Apellido" },
  "image": "https://tusitio.com/img/portada.webp",
  "datePublished": "AAAA-MM-DD"
}
</script>

Generá estos datos desde el mismo origen que el contenido visible (el CMS o tus archivos), para que siempre coincidan. Validalos con la Prueba de resultados enriquecidos de Google. Y si trabajás con salidas de modelos de IA que tienen que respetar un formato, la lógica es parecida a la de los structured outputs en IA.

Cómo chequearlo con herramientas gratis

• PageSpeed Insights: datos de campo y de laboratorio de Core Web Vitals para cualquier URL.

• Lighthouse (en Chrome DevTools): auditoría de performance, accesibilidad y SEO básico mientras desarrollás.

• Google Search Console: indexación, errores de rastreo, sitemaps, Core Web Vitals reales y consultas por las que aparecés.

• Ver el código fuente (no solo el inspector): confirmá que el title, los headings y el contenido principal están en el HTML que recibe el buscador.

Qué pedirle al equipo de contenidos

Tu trabajo técnico rinde cuando el contenido acompaña. Pedí:

• La keyword o tema principal de cada página, para el title y el H1.

• Meta descriptions redactadas o reglas para generarlas.

• Textos alternativos para las imágenes importantes.

• Avisar antes de cambiar URLs, para preparar las redirecciones.

Si este cruce entre código y posicionamiento te interesa como salida laboral, mirá cuánto gana un especialista en SEO y complementalo con esta checklist de SEO on-page para principiantes.

Curso recomendado de Coderhouse

Para entender el posicionamiento completo, en buscadores y en respuestas de modelos de lenguaje, el Curso de SEO para AI te da la mirada de SEO y GEO que complementa lo técnico. Si todavía estás armando tu base de HTML y CSS, empezá por el Curso de Desarrollo Web.

Preguntas frecuentes

¿Un desarrollador tiene que saber SEO? No hace falta ser especialista, pero sí conocer lo técnico: HTML semántico, performance, rastreo y datos estructurados. Muchas mejoras de SEO dependen directamente del código.

¿Las aplicaciones hechas en React posicionan mal? No necesariamente, pero si el contenido depende solo del renderizado en el navegador puede indexarse más lento o con problemas. El renderizado del lado del servidor o la generación estática ayudan.

¿El robots.txt sirve para sacar una página de Google? No. Controla el rastreo. Para que una página no aparezca en resultados, usá la directiva noindex y dejá que el buscador pueda rastrearla para verla.

¿Cada cuánto conviene revisar las Core Web Vitals? Después de cada cambio importante de diseño, scripts o infraestructura, y de forma periódica en el informe de Search Console.