For years, web design was based on a very clear premise: people mainly browsed the internet from desktop computers. However, that scenario has changed completely, and today most web traffic comes from mobile devices. This has forced a rethink of how websites are designed, giving rise to the mobile-first approach.

What is mobile first?

Mobile first is a web design and development approach that proposes creating the version of a site for mobile devices—such as smartphones and tablets—first and then progressively adapting it to larger screens, such as those of laptops. More than a visual trend, it responds to the evolution of user behavior and key changes in search engines, such as Google, which now prioritize mobile indexing to evaluate and rank websites.

The increasing use of mobile devices made it clear that designing only for desktops was no longer enough. For years, the solution was to cut desktop versions to make them work on small screens, but many of those elements did not adapt properly: long texts, complex menus, small buttons, or heavy images ended up affecting the user experience. Faced with this scenario, the mobile-first approach, also known as progressive enhancement, emerged, which proposes building from the essentials and gradually improving the experience according to the capabilities of the device.

Key principles of the mobile-first approach

1. Prioritize content

On mobile devices, there is no room for the unnecessary. Every element on the screen must serve a clear purpose. This requires identifying what information is truly important and what actions should be immediately available to the user.

2. Design from the smallest screen up

The process begins with mobile design and then scales up to tablets and desktops. This ensures a clear, focused foundation that is easy to adapt to different screen sizes.

3. Responsive design

The site should automatically adapt to the size of the screen from which it is accessed. This means that the content, images, and structure of the site are adjusted to look and function well on a cell phone, tablet, or computer. The goal is to provide a consistent, comfortable, and easy-to-use experience on any device.

4. Touch-friendly interface

Mobile devices are not navigated with a mouse, but with your fingers. Therefore, buttons and links should be easy to identify, adequately sized, and well spaced to avoid accidental touches.

Mobile-first design best practices

• Keep it simple: white space is also a design resource. It helps reduce distractions and improve content comprehension.
• Clear visual hierarchy: mobile-first design prioritizes content first. The most important information should be highlighted and appear first.
• Optimize text for scanning: people don't read, they scan. Use short paragraphs, key information at the top, and structures that are easy to scan visually.
• Think like an app: use familiar gestures and avoid effects that don't work on mobile, such as hover.
• Optimize images and graphics: avoid awkward cuts and leave more complex visual elements for the desktop version.
• Design for fingers, not a mouse: interactive elements should have a minimum adequate size (ideally 44px) to avoid tapping errors.

Advantages of a mobile-first approach

Adopting mobile-first not only improves design, it also has direct benefits for the business:

• Better user experience.
• Better SEO performance, aligned with Google's mobile-first indexing.
• Faster loading times.
• Greater accessibility and reach.
• Long-term cost reduction, as the site is designed from the outset to work properly on mobile devices and does not require subsequent redesigns.
• Preparation for continued growth in mobile traffic.
• Clear focus on essential content.
• Easier scalability to large screens.

Is mobile first always the best option?

Not necessarily. In cases involving complex web applications or highly specific tools, a mobile version may not be sufficient. In such scenarios, it may be more appropriate to develop a native app, even if this involves greater technical effort and maintenance.

An approach that changed the way we design the web

The concept of mobile first was proposed in 2009 by Luke Wroblewski, Product Director at Google, who argued that designing for desktop first no longer made sense in a world dominated by mobile devices.

Since then, the mobile-first approach has forced designers to simplify, prioritize, and put content and user experience at the center, resulting in clearer, more accessible sites that are better suited to the real needs of those who use them. 

Durante años, el diseño web partió de una premisa muy clara: las personas navegaban principalmente desde computadores de mesa. Sin embargo, ese escenario cambió por completo y hoy la mayoría del tráfico web proviene de dispositivos móviles. Eso obligó a replantear la forma en la que se conciben los sitios web: de ahí surge el enfoque mobile first

¿Qué es mobile first?

Mobile first es un enfoque de diseño y desarrollo web que propone crear primero la versión de un sitio para dispositivos móviles —como smartphones y tablets— y adaptarlo progresivamente a pantallas más grandes, como la de un portátil. Más que una tendencia visual, responde a la evolución del comportamiento de los usuarios y a cambios clave en los motores de búsqueda, como Google, que hoy priorizan la indexación móvil para evaluar y posicionar los sitios web.

El uso cada vez mayor de dispositivos móviles dejó en evidencia que diseñar solo para escritorio ya no era suficiente. Durante años, la solución fue recortar versiones de escritorio para que funcionaran en pantallas pequeñas, pero muchos de esos elementos no se adaptaban correctamente: textos extensos, menús complejos, botones pequeños o imágenes pesadas terminaban afectando la experiencia de uso. Frente a este escenario surge el enfoque mobile first, también conocido como progressive enhancement, que plantea construir desde lo esencial y mejorar la experiencia de forma gradual según las capacidades del dispositivo.

Principios clave del enfoque mobile first

1. Priorizar el contenido

En móvil no hay espacio para lo innecesario. Cada elemento en pantalla debe cumplir una función clara. Esto obliga a identificar qué información es realmente importante y qué acciones deben estar al alcance inmediato del usuario.

2. Diseñar desde la pantalla más pequeña

El proceso comienza con el diseño para móvil y luego se escala hacia tablets y escritorio. Esto garantiza una base clara, enfocada y fácil de adaptar a distintos tamaños de pantalla.

3. Diseño responsive

El sitio debe adaptarse automáticamente al tamaño de la pantalla desde la que se accede. Esto significa que los contenidos, las imágenes y la estructura del sitio se ajustan para verse y funcionar bien tanto en un celular como en una tablet o un computador. El objetivo es ofrecer una experiencia coherente, cómoda y fácil de usar en cualquier dispositivo.

4. Interfaz pensada para el tacto

En los dispositivos móviles no se navega con mouse, sino con los dedos. Por eso, los botones y enlaces deben ser fáciles de identificar, tener un tamaño adecuado y estar bien separados entre sí para evitar toques accidentales.

Buenas prácticas de diseño mobile first

• Mantenerlo simple: el espacio en blanco también es un recurso de diseño. Ayuda a reducir distracciones y mejora la comprensión del contenido.
• Jerarquía visual clara: el diseño mobile first es content-first. La información más importante debe destacarse y aparecer primero.
• Optimizar el texto para escaneo: las personas no leen, escanean. Usa párrafos cortos, información clave arriba y estructuras fáciles de recorrer visualmente.
• Pensar como una app: utiliza gestos conocidos y evita efectos que no funcionan en móvil, como el hover.
• Optimizar imágenes y gráficos: evita cortes incómodos y deja los elementos visuales más complejos para la versión de escritorio.
• Diseñar para dedos, no para mouse: los elementos interactivos deben tener un tamaño mínimo adecuado (idealmente 44px) para evitar errores al tocar.

Ventajas de un enfoque mobile first

Adoptar mobile first no solo mejora el diseño, también tiene beneficios directos para el negocio:

• Mejor experiencia de usuario.
• Mejor rendimiento SEO, alineado con la indexación mobile-first de Google.
• Tiempos de carga más rápidos.
• Mayor accesibilidad y alcance.
• Reducción de costos a largo plazo, ya que el sitio se diseña desde el inicio para funcionar correctamente en dispositivos móviles y no requiere rediseños posteriores.
• Preparación para el crecimiento continuo del tráfico móvil.
• Enfoque claro en el contenido esencial.
• Escalabilidad más sencilla hacia pantallas grandes.

¿Mobile first es siempre la mejor opción?

No necesariamente. En casos donde se trata de aplicaciones web complejas o herramientas muy específicas, una versión móvil puede no ser suficiente. En esos escenarios, puede ser más adecuado desarrollar una app nativa, aunque eso implique mayor esfuerzo técnico y de mantenimiento.

Un enfoque que cambió la forma de diseñar la web

El concepto de mobile first fue propuesto en 2009 por Luke Wroblewski, Product Director de Google, quien planteó que diseñar primero para escritorio ya no tenía sentido en un mundo dominado por dispositivos móviles.

Desde entonces, el enfoque mobile first ha obligado a simplificar, priorizar y poner el contenido y la experiencia de uso en el centro, dando lugar a sitios más claros, accesibles y preparados para las necesidades reales de quienes los utilizan.

Throughout 2025, the conversation about technology was marked by discovery. Artificial intelligence surprised us; it was tested, integrated experimentally, and raised questions in all sectors. But 2026 marks a turning point: it is no longer about exploring possibilities, but about making real decisions. Governments, companies, and institutions are beginning to use these technologies to act, not just to analyze.

Rather than talking about new tools, 2026 forces us to embrace a key idea: technology is moving from promise to performance.

Artificial intelligence crosses the screen

Artificial intelligence will continue to be the dominant technological force in 2026, but with one clear difference from previous years: its impact will no longer be limited to the digital realm. It will cease to be a tool that merely answers questions and become a system capable of perceiving its environment, making decisions, and acting.

In this context, the integration of AI into the physical world (physical AI or embodied AI) is becoming increasingly relevant, where artificial intelligence is no longer just code but is incorporated into tangible objects. Robots, autonomous devices, and industrial systems are beginning to perceive their environment, make decisions, and act in spaces shared with people.

Added to this evolution is the advance towards multi-agent systems, a model in which multiple specialized agents collaborate to execute complex workflows. Instead of a centralized model, organizations are beginning to work with ecosystems of agents that coordinate, monitor, and act dynamically.

Beyond the technology itself, the most profound impact of artificial intelligence by 2026 will be on humans. AI does not abruptly eliminate jobs, but it does redefine tasks and transform work, automating the repetitive, accelerating the complex, and forcing people and organizations to rethink their role in an increasingly collaborative environment with technology.

When technology moves on its own

Autonomous transport is no longer a futuristic promise but is gradually becoming an everyday reality. Driverless vehicles are already operating in some cities around the world, and their adoption will continue to grow through 2026. Although their mass deployment will still take time, the direction is clear: autonomous mobility is beginning to become part of everyday life.

But the biggest impact is not only on private cars. Autonomous logistics is already transforming freight transport on a global scale: ships, trucks, and distribution systems that operate for longer hours, optimize routes, and reduce human error.

Infrastructure at its limits: energy, computing, and sustainability

The rapid growth of artificial intelligence has brought an uncomfortable reality to light: current technological infrastructure is beginning to fall short. The energy consumption of data centers and the demand for computing capacity are growing at a rate that challenges electrical grids and current sustainability models.

That is why, by 2026, the technological conversation will also revolve around how to sustain what we are building. It is no longer just a question of polluting less, but of developing solutions that allow us to repair and regenerate some of the accumulated environmental damage.

At the same time, the industry is committed to more efficient AI infrastructure models: distributed computing systems, intensive use of each unit of capacity, and new ways to concentrate power without triggering energy consumption. Efficiency is becoming as important as innovation.

Security and trust in an increasingly digital life

As more information, processes, and decisions migrate to digital environments, cybersecurity is becoming one of the most critical trends of 2026. Not as an add-on, but as a basic condition for operating.

Technologies such as confidential computing seek to protect data not only when it is stored or in transit, but even while it is being processed. This approach is key in a context of stricter regulations, data sovereignty, and intensive use of artificial intelligence in hybrid and multicloud architectures.

Trust also comes into play strongly. Digital provenance—verifying the origin and integrity of software, data, and AI-generated content—becomes key to combating misinformation, deepfakes, and hidden risks in increasingly complex technology chains.

2026: fewer promises, more decisions

The year 2026 will not be remembered for a specific technology, but rather for a change in mindset. The question is no longer what technology can do, but rather what we are willing to delegate to it. Artificial intelligence, infrastructure, and security no longer exist in the laboratory, but rather in daily operations.

Technology is starting to deliver. And with that, it also forces us to take on clearer responsibilities about how, why, and for whom we use it. 

Durante 2025, la conversación tecnológica estuvo marcada por el descubrimiento. La inteligencia artificial sorprendió, se probó, se integró de forma experimental y abrió preguntas en todos los sectores. Pero 2026 marca un punto de quiebre: ya no se trata de explorar posibilidades, sino de tomar decisiones reales. Gobiernos, empresas e instituciones comienzan a usar estas tecnologías para actuar, no solo para analizar.

Más que hablar de nuevas herramientas, 2026 nos obliga a asumir una idea clave: la tecnología deja de prometer y empieza a ejecutar.

La inteligencia artificial cruza la pantalla

La inteligencia artificial seguirá siendo la fuerza tecnológica dominante en 2026 , pero con una diferencia clara frente a años anteriores: su impacto ya no se limita a lo digital. Deja de ser una herramienta que solo responde preguntas para convertirse en un sistema capaz de percibir su entorno, decidir y actuar.

En este contexto gana relevancia la integración de la IA en el mundo físico (IA física o Embodied AI), donde la inteligencia artificial deja de ser únicamente código y se incorpora en objetos tangibles. Robots, dispositivos autónomos y sistemas industriales comienzan a percibir su entorno, decidir y actuar en espacios compartidos con las personas.

A esta evolución se suma el avance hacia sistemas multiagente, un modelo en el que múltiples agentes especializados colaboran entre sí para ejecutar flujos de trabajo complejos. En lugar de un modelo centralizado, las organizaciones comienzan a trabajar con ecosistemas de agentes que se coordinan, se supervisan y actúan de forma dinámica.

Más allá de la tecnología en sí, el impacto más profundo de la inteligencia artificial hacia 2026 será humano. La IA no elimina empleos de forma abrupta, pero sí redefine tareas y transforma el trabajo, automatizando lo repetitivo, acelerando lo complejo y obligando a personas y organizaciones a replantear su rol en un entorno cada vez más colaborativo con la tecnología.

Cuando la tecnología se mueve sola

El transporte autónomo deja de ser una promesa futurista para convertirse, poco a poco, en una realidad cotidiana. En algunas ciudades del mundo ya operan vehículos sin conductor y hacia 2026 su adopción continuará creciendo. Aunque su despliegue masivo aún tomará tiempo, la dirección es clara: la movilidad autónoma empieza a integrarse en el día a día.

Pero el mayor impacto no está solo en los autos particulares. La logística autónoma ya está transformando el transporte de mercancías a escala global: barcos, camiones y sistemas de distribución que operan durante más horas, optimizan rutas y reducen errores humanos.

Infraestructura al límite: energía, cómputo y sostenibilidad

El crecimiento acelerado de la inteligencia artificial ha puesto sobre la mesa una realidad incómoda: la infraestructura tecnológica actual empieza a quedarse corta. El consumo energético de los centros de datos y la demanda de capacidad computacional crecen a un ritmo que desafía a las redes eléctricas y a los modelos actuales de sostenibilidad.

Por eso, hacia 2026, la conversación tecnológica gira también en torno a cómo sostener lo que estamos construyendo. Ya no se trata solo de contaminar menos, sino de desarrollar soluciones que permitan reparar y regenerar parte del daño ambiental acumulado.

En paralelo, la industria apuesta por modelos de infraestructura de IA más eficientes: sistemas de cómputo distribuidos, uso intensivo de cada unidad de capacidad y nuevas formas de concentrar potencia sin disparar el consumo energético. La eficiencia se vuelve tan importante como la innovación.

Seguridad y confianza en una vida cada vez más digital

A medida que más información, procesos y decisiones migran a entornos digitales, la ciberseguridad se convierte en una de las tendencias más críticas de 2026. No como un complemento, sino como una condición básica para operar.

Tecnologías como la computación confidencial buscan proteger los datos no solo cuando están almacenados o en tránsito, sino incluso mientras están siendo procesados. Este enfoque resulta clave en un contexto de regulaciones más estrictas, soberanía de datos y uso intensivo de inteligencia artificial en arquitecturas híbridas y multicloud.

La confianza también entra en juego con fuerza. La procedencia digital —verificar el origen y la integridad del software, los datos y el contenido generado por IA— se vuelve clave para combatir la desinformación, los deepfakes y los riesgos ocultos en cadenas tecnológicas cada vez más complejas.

2026: menos promesas, más decisiones

El año 2026 no será recordado por una tecnología específica, sino por un cambio de mentalidad. La pregunta deja de ser qué puede hacer la tecnología y pasa a ser qué estamos dispuestos a delegarle. La inteligencia artificial, la infraestructura y la seguridad ya no viven en el laboratorio, sino en la operación diaria.

La tecnología empieza a ejecutar. Y con ello, también nos obliga a asumir responsabilidades más claras sobre cómo, para qué y para quién la usamos.

The arrival of artificial intelligence models such as ChatGPT, Gemini, Perplexity, and Claude is radically transforming the way people find information on the internet. Increasingly, users are moving away from browsing lists of links and receiving direct, synthesized, and contextualized answers.

This change is redefining the rules of digital visibility: it is no longer enough to appear in the top search results. Now, the key question is whether your content is chosen by response engines as the most reliable source for answering a query.

What is Answer Engine Optimization (AEO)?

Answer Engine Optimization (AEO) is a set of strategies and techniques aimed at optimizing content so that it is selected by AI-based answer engines and conversational assistants.

Unlike traditional SEO, which focuses on improving positioning within search results, AEO prioritizes the creation of clear, accurate, and well-structured answers that AI models can use directly.

AEO does not replace SEO: it complements it. While SEO remains essential for content indexing and authority, AEO allows you to maintain and amplify visibility in an ecosystem where direct answers are gaining prominence.

How do response engines read and select content?

AI-based response engines do not work like traditional search engines. They do not simply index pages and rank them by incoming links, but analyze content to understand its meaning, context, and actual usefulness for a specific question.

To select a source, language models evaluate multiple combined signals:

• Authority and thematic consistency: sites that address a topic in a deep, consistent, and recurring manner are more likely to be considered as a reference.
• Semantic clarity: well-formulated questions and direct answers, without beating around the bush or ambiguous language, make it easier for AI to identify key information.
• Content structure: clear headings, logical hierarchy, and well-defined blocks help models interpret and reuse content.
• Context and relationships between concepts: Content is not analyzed in isolation; AI understands how ideas are connected within a single site.
• Freshness and maintenance: content that is regularly updated and reviewed generates greater trust than obsolete pages.

In this scenario, writing for AEO does not mean oversimplifying, but rather explaining better.

AEO: the convergence of SEO, content, UX, and data

Implementing AEO requires a comprehensive vision. It is no longer just about keywords, but how information is presented and organized.

AEO requires the integration of:

• SEO, to ensure indexing and authority.
• Content focused on real questions and useful answers.
• UX, to ensure clarity, hierarchy, and readability.
• Structured data that facilitates interpretation by AI.

Organizations that adopt this approach will not only maintain their visibility but will also be able to actively influence the narrative of their sector by becoming the source recommended by AI.

Key points for adapting your content to AEO

1. Audit existing content

Review your current content and identify which questions in your sector are already being answered and which are not. Gaps in frequently asked questions represent clear opportunities for AEO.

2. Structure content for humans and machines

Content should be easy to read, with clear sections, well-defined headings, and direct answers. Implementing structured data, such as Schema Markup, is key to helping answer engines interpret the information.

3. Continuously monitor and adjust

AEO is not static. It is essential to observe how your content appears in answer engines, analyze which questions are being covered, and adjust content in real time.

AEO and brand visibility

Although the rise of direct answers might cut down on traditional clicks, AEO boosts brand visibility and credibility. Being cited as a source by an AI engine positions the organization as a reference and authority, even when the user doesn't visit the site directly.

Instead of competing solely for blue links, the new goal is to appear as the source that feeds the answers generated automatically by language models.

From appearing in search engines to being the answer

Answer Engine Optimization is not a passing trend, but a natural evolution of how we access information. Preparing for AEO means understanding how AI thinks, better structuring content, and taking a more strategic and comprehensive approach to digital visibility.

Brands that start today will not only adapt to change: they will lead the conversation tomorrow.

La irrupción de modelos de inteligencia artificial como ChatGPT, Gemini, Perplexity o Claude está transformando radicalmente la forma en que las personas encuentran información en internet. Cada vez más, los usuarios dejan de navegar por listas de enlaces y reciben respuestas directas, sintetizadas y contextualizadas.

Este cambio redefine las reglas de la visibilidad digital: ya no basta con aparecer en los primeros resultados de búsqueda. Ahora, la pregunta clave es si tu contenido es elegido por los motores de respuesta como la fuente más confiable para responder una consulta.

¿Qué es el Answer Engine Optimization (AEO)?

El Answer Engine Optimization (AEO) es el conjunto de estrategias y técnicas orientadas a optimizar contenidos para que sean seleccionados por motores de respuesta y asistentes conversacionales basados en inteligencia artificial.

A diferencia del SEO tradicional, que se enfoca en mejorar el posicionamiento dentro de los resultados de búsqueda, el AEO prioriza la creación de respuestas claras, precisas y bien estructuradas que los modelos de IA puedan utilizar directamente.

El AEO no reemplaza al SEO: lo complementa. Mientras el SEO sigue siendo fundamental para la indexación y autoridad del contenido, el AEO permite mantener y amplificar la visibilidad en un ecosistema donde las respuestas directas ganan protagonismo.

¿Cómo leen y eligen contenido los motores de respuesta?

Los motores de respuesta basados en inteligencia artificial no funcionan como los buscadores tradicionales. No se limitan a indexar páginas y ordenarlas por enlaces entrantes, sino que analizan el contenido para entender su significado, contexto y utilidad real para una pregunta específica.

Para seleccionar una fuente, los modelos de lenguaje evalúan múltiples señales combinadas:

• Autoridad y consistencia temática: sitios que abordan un tema de forma profunda, coherente y recurrente tienen más probabilidades de ser considerados como referencia.
• Claridad semántica: preguntas bien formuladas y respuestas directas, sin rodeos ni lenguaje ambiguo, facilitan que la IA identifique la información clave.
• Estructura del contenido: encabezados claros, jerarquía lógica y bloques bien definidos ayudan a los modelos a interpretar y reutilizar el contenido.
• Contexto y relaciones entre conceptos: el contenido no se analiza de forma aislada; las IA entienden cómo se conectan las ideas dentro de un mismo sitio.
• Frescura y mantenimiento: contenidos actualizados y revisados periódicamente generan mayor confianza que páginas obsoletas.

En este escenario, escribir para AEO no significa simplificar en exceso, sino explicar mejor.

AEO: la convergencia entre SEO, contenidos, UX y datos

Implementar AEO requiere una visión integral. Ya no se trata solo de palabras clave, sino de cómo se presenta y organiza la información.

El AEO obliga a integrar:

• SEO, para asegurar indexación y autoridad.
• Contenidos con enfoque en preguntas reales y respuestas útiles.
• UX, para garantizar claridad, jerarquía y legibilidad.
• Datos estructurados que faciliten la interpretación por parte de las IA.

Las organizaciones que adopten este enfoque no solo mantendrán su visibilidad, sino que podrán influir activamente en la narrativa de su sector al convertirse en la fuente que las IA recomiendan.

Claves para adaptar tu contenido al AEO

1. Auditar el contenido existente

Revisa tu contenido actual e identifica qué preguntas de tu sector ya estás respondiendo y cuáles no. Los huecos en preguntas frecuentes representan oportunidades claras para AEO.

2. Estructurar el contenido para humanos y máquinas

El contenido debe ser fácil de leer, con secciones claras, encabezados bien definidos y respuestas directas. La implementación de datos estructurados, como Schema Markup, es clave para ayudar a los motores de respuesta a interpretar la información.

3. Monitorear y ajustar continuamente

El AEO no es estático. Es fundamental observar cómo aparece tu contenido en motores de respuesta, analizar qué preguntas están siendo cubiertas y ajustar el contenido en tiempo real.

AEO y visibilidad de marca

Aunque la proliferación de respuestas directas puede reducir la cantidad de clics tradicionales, el AEO fortalece la visibilidad y credibilidad de marca. Ser citado como fuente por un motor de IA posiciona a la organización como referencia y autoridad, incluso cuando el usuario no visita directamente el sitio.

En lugar de competir únicamente por los enlaces azules, el nuevo objetivo es aparecer como la fuente que alimenta las respuestas generadas automáticamente por los modelos de lenguaje.

De aparecer en buscadores a ser la respuesta

El Answer Engine Optimization no es una tendencia pasajera, sino una evolución natural de la forma en que accedemos a la información. Prepararse para el AEO implica entender cómo piensan las IA, estructurar mejor el contenido y asumir un enfoque más estratégico e integral de la visibilidad digital.

Las marcas que comiencen hoy no solo se adaptarán al cambio: liderarán la conversación mañana.

In headless architectures, sitemap generation is no longer entirely dependent on the CMS. Although the backend continues to manage the content, the final routes are built on the frontend (Next.js, Nuxt, Gatsby, etc.). Therefore, generating a sitemap that correctly reflects the final URLs requires a different approach than a traditional site. If you want to have a clear understanding before moving forward, here we explain what an XML sitemap is and its relevance to SEO.

Generating a sitemap from the frontend (Next.js + headless CMS)

When pages exist as entries within a headless CMS (Contentful, Sanity, Strapi, Drupal in JSON:API mode, etc.), the most common approach is:

• Query the CMS via API
• Build the pages on the frontend
• Generate a sitemap dynamically with the final information (slugs, structure, update date)

Example: Sitemap in Next.js

First, we define a special page sitemap.xml.tsx:

// pages/sitemap.xml.tsx
export default class Sitemap extends Component {
  static async getInitialProps({ res }: GetServerSidePropsContext): Promise<void> {
    const pages = await getPages()
    res.writeHead(200, { 'Content-Type': 'text/xml' })
    res.write(createSitemap(pages))
    res.end()
  }
}

This endpoint:

• Gets the pages from the CMS (getPages)
• Generates the XML (createSitemap)
• Serves it directly as sitemap.xml

Define the CMS data type

export type ContentfulPage = {
  title: string
  slug: string
  header: ContentfulOrHeader
  blocks?: ContentfulBlock[]
  footer: ContentfulOrFooter
  updatedAt?: string
}

This type represents how a page arrives from Contentful, but the concept applies equally to any CMS: title, slug, components, and metadata such as updatedAt.

Función para generar el sitemap XML

const createSitemap = (pages: ContentfulPage[]) => {
  return `<?xml version="1.0" encoding="UTF-8"?>
  <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
    ${generateLinks(pages)}
  </urlset>`
}

All it does is wrap the items inside the <urlset>.

Generar los items individuales del sitemap

const generateLinks = (pages: ContentfulPage[]) => {
  const pageItems = pages.map((page) => {
    const slugPath = page.slug === '/' ? '' : `/${page.slug}`
    const url = `${process.env.ORIGIN_URL}${slugPath}`
    return `
        <url>
          <loc>${url}</loc>
          <changefreq>daily</changefreq>
          <lastmod>${page.updatedAt}</lastmod>
          <priority>0.8</priority>
        </url>
      `
  })
  return pageItems.join('')
}

This is where the action happens: building real URLs from CMS slugs and metadata.

Getting pages from the CMS

import { client } from 'services/contentful'

export const getPages = async (): Promise<ContentfulPage[]> => {
  const collection = await client.getEntries({ 'content_type': 'page' })
  const pages = collection?.items?.length ? collection.items : null

  if (pages) return pages.map((page) => ({
    title: page.fields.title,
    slug: page.fields.slug,
    header: page.fields.header,
    blocks: page.fields.blocks,
    footer: page.fields.footer,
    updatedAt: page.sys.updatedAt,
  }))

  return []
}

Contentful (and most headless CMSs) deliver data like this:

{
  "fields": { "...": "..." },
  "sys": { "updatedAt": "2023-01-04T00:50:34.525Z" }
}

This is enough to build correct URLs.

Using a Drupal-generated sitemap (and serving it in Node.js/Express)

On headless sites with Drupal as the backend, it is sometimes more efficient to let Drupal generate the sitemap using the XML Sitemap module and simply expose that file from the frontend.

This approach avoids having to replicate logic on the frontend or develop custom generators.

Steps for the Drupal → Node.js approach

1. Install and configure XML Sitemap in Drupal

Drupal automatically generates:

• /sitemap.xml
• Configurable content items
• Automatic regeneration when changes occur

2. In Node.js/Express, stream the sitemap

After testing different NPM modules, request is usually the quickest way to implement the stream:

app.get('/sitemap.xml', function (req, res) {
  var sitemap = request(sitemapxml);
  req.pipe(sitemap);
  sitemap.pipe(res);
});

/sitemap.xml from the frontend directly serves the version generated by Drupal.

This approach works especially well because it avoids duplicating route logic between the backend and frontend: Drupal manages the content, and the sitemap is always kept in sync with any updates. In addition, Google only needs to query a single endpoint (https://frontend.com/sitemap.xml), which simplifies crawling. It is a very efficient solution for lightweight frontends, sites with a large volume of pages, or projects where it does not make sense to maintain two systems generating URLs.

Which method to choose?

Choosing the right method depends on how routes are managed on your site:

• Frontend defines the final routes: generate the sitemap directly from the frontend.
• Drupal controls the structure and URLs: serve the sitemap generated by Drupal.
• Highly dynamic sites with static generation (Next.js, Gatsby): the frontend can handle the sitemap.
• Lower budget or avoiding custom development: using Drupal's XML Sitemap is usually more convenient.

Both methods are valid; the final choice depends on the routing model and where the URLs are actually built.

Focus on implementation

On a headless site, generating a sitemap involves choosing correctly where the actual routes live.
If the frontend builds the URLs, it should generate the sitemap.
If Drupal controls the structure, it can generate it, and the frontend only exposes it.

The important thing is that the sitemap reflects the final URLs that Google can crawl.
Without that, any headless architecture loses indexing capability.

En arquitecturas desacopladas (headless), la generación del sitemap deja de depender por completo del CMS. Aunque el backend sigue administrando el contenido, las rutas finales se construyen en el frontend (Next.js, Nuxt, Gatsby, etc.). Por eso, generar un sitemap que refleje correctamente las URLs finales requiere un enfoque distinto al de un sitio tradicional. Si quieres tener la base clara antes de avanzar, aquí explicamos qué es un sitemap XML y su relevancia en SEO.

Generar un sitemap desde el frontend (Next.js + CMS headless)

Cuando las páginas existen como entradas dentro de un CMS headless (Contentful, Sanity, Strapi, Drupal en modo JSON:API, etc.), lo más común es:

• Consultar el CMS vía API
• Construir las páginas en el frontend
• Generar un sitemap dinámicamente con la información final (slugs, estructura, fecha de actualización)

Ejemplo: Sitemap en Next.js

Primero definimos una página especial sitemap.xml.tsx:

// pages/sitemap.xml.tsx
export default class Sitemap extends Component {
  static async getInitialProps({ res }: GetServerSidePropsContext): Promise<void> {
    const pages = await getPages()
    res.writeHead(200, { 'Content-Type': 'text/xml' })
    res.write(createSitemap(pages))
    res.end()
  }
}

Este endpoint:

• Obtiene las páginas desde el CMS (getPages)
• Genera el XML (createSitemap)
• Lo sirve directamente como sitemap.xml

Definir el tipo de datos del CMS

export type ContentfulPage = {
  title: string
  slug: string
  header: ContentfulOrHeader
  blocks?: ContentfulBlock[]
  footer: ContentfulOrFooter
  updatedAt?: string
}

Este tipo representa cómo llega una página desde Contentful, pero el concepto aplica igual a cualquier CMS: título, slug, componentes y metadatos como updatedAt.

Función para generar el sitemap XML

const createSitemap = (pages: ContentfulPage[]) => {
  return `<?xml version="1.0" encoding="UTF-8"?>
  <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
    ${generateLinks(pages)}
  </urlset>`
}

Lo único que hace es envolver los items dentro del <urlset>.

Generar los items individuales del sitemap

const generateLinks = (pages: ContentfulPage[]) => {
  const pageItems = pages.map((page) => {
    const slugPath = page.slug === '/' ? '' : `/${page.slug}`
    const url = `${process.env.ORIGIN_URL}${slugPath}`
    return `
        <url>
          <loc>${url}</loc>
          <changefreq>daily</changefreq>
          <lastmod>${page.updatedAt}</lastmod>
          <priority>0.8</priority>
        </url>
      `
  })
  return pageItems.join('')
}

Aquí ocurre lo clave: construir URLs reales desde los slugs y metadatos del CMS.

Obtener las páginas desde el CMS

import { client } from 'services/contentful'

export const getPages = async (): Promise<ContentfulPage[]> => {
  const collection = await client.getEntries({ 'content_type': 'page' })
  const pages = collection?.items?.length ? collection.items : null

  if (pages) return pages.map((page) => ({
    title: page.fields.title,
    slug: page.fields.slug,
    header: page.fields.header,
    blocks: page.fields.blocks,
    footer: page.fields.footer,
    updatedAt: page.sys.updatedAt,
  }))

  return []
}

Contentful (y la mayoría de los CMS headless) entregan la data así:

{
  "fields": { "...": "..." },
  "sys": { "updatedAt": "2023-01-04T00:50:34.525Z" }
}

Con esto basta para armar URLs correctas.

Usar un sitemap generado por Drupal (y servirlo en Node.js/Express)

En sitios desacoplados con Drupal como backend, a veces es más eficiente dejar que Drupal genere el sitemap usando el módulo XML Sitemap y simplemente exponer ese archivo desde el frontend.

Este enfoque evita tener que replicar lógica en el frontend o desarrollar generadores personalizados.

Pasos del enfoque Drupal → Node.js

1. Instalar y configurar XML Sitemap en Drupal

Drupal genera automáticamente:

• /sitemap.xml
• Items de contenido configurables
• Regeneración automática cuando hay cambios

2. En Node.js/Express, “streamear” el sitemap

Después de probar diferentes NPM modules, request suele ser la forma rápida de implementar el stream:

app.get('/sitemap.xml', function (req, res) {
  var sitemap = request(sitemapxml);
  req.pipe(sitemap);
  sitemap.pipe(res);
});

/sitemap.xml del frontend sirve directamente la versión generada por Drupal.

Este enfoque funciona especialmente bien porque evita duplicar la lógica de rutas entre backend y frontend: Drupal gestiona el contenido y el sitemap se mantiene siempre sincronizado con cualquier actualización. Además, Google solo necesita consultar un único endpoint (https://frontend.com/sitemap.xml), lo que simplifica el rastreo. Es una solución muy eficiente para frontends ligeros, sitios con gran volumen de páginas o proyectos donde no tiene sentido mantener dos sistemas generando URLs.

¿Qué método elegir?

Para elegir el método adecuado, depende de cómo se gestionan las rutas en tu sitio:

• Frontend define las rutas finales: genera el sitemap directamente desde el frontend.
• Drupal controla la estructura y las URLs: sirve el sitemap que genera Drupal.
• Sitios muy dinámicos con generación estática (Next.js, Gatsby): el frontend puede encargarse del sitemap.
• Menor presupuesto o evitar desarrollos custom: usar el XML Sitemap de Drupal suele ser más conveniente.

Ambos métodos son válidos; la elección final depende del modelo de enrutamiento y de dónde se construyen realmente las URLs.

Foco en la implementación

En un sitio desacoplado, generar un sitemap implica elegir correctamente dónde viven las rutas reales.
Si el frontend construye las URLs, él debe generar el sitemap.
Si Drupal controla la estructura, puede generarlo y el frontend solo lo expone.

Lo importante es que el sitemap refleje las URLs finales que Google puede rastrear.
Sin eso, cualquier arquitectura headless pierde capacidad de indexación.

PHP 8.5 arrived on November 20, bringing improvements that enhance the development experience, code readability, and debugging capabilities. It is an update designed to solve practical problems: less repetitive code, more control over errors, and better support for modern environments and multilingual applications.

In this entry, we'll tell you about the most important new features and how they impact daily work on PHP projects.

1. New URI extension: native URL handling

PHP 8.5 incorporates a built-in extension for parsing, normalizing, and manipulating URLs according to the RFC 3986 and WHATWG URL standards. This improvement reduces dependence on external libraries and avoids common errors when handling paths or parameters. It also provides greater consistency when working with applications that consume APIs, simplifying URL processing in complex projects.

2. Pipe operator (|>): a more expressive and functional code

One of the most eagerly awaited new features is the |> operator, which allows functions to be chained together and values to be passed between them without using intermediate variables. The result is cleaner and more readable code, especially in transformation pipelines.

$result = $data
    |> sanitize(...)
    |> validate(...)
    |> transform(...);

Although it has some limitations (such as requiring callables with a single mandatory parameter and not accepting parameters by reference), its impact on clarity is significant. This new syntax favors a more functional and fluid programming style, especially in projects that process data in several stages.

3. New array_first() y array_last() functions

PHP 8.5 introduces array_first() and array_last(), two simple but highly anticipated functions for obtaining the first and last values of an array, even if it is associative. If the array is empty, they return null. This avoids writing repetitive logic and makes the intent of the code more explicit, allowing for clearer and more concise operations when working with data structures.

4. Clone with: copy objects and update properties easily

The update adds an extension to the use of clone() that allows you to clone an object and modify properties in the same expression. This feature is especially useful for classes with immutable or readonly, simplifying patterns that previously required several steps and helping to keep code more declarative and tidy.

5. #[\NoDiscard] attribute: goodbye to silent errors

This attribute generates a warning if the return value of a function marked as critical is ignored. This helps prevent errors that can go unnoticed, especially in methods that affect the state of the application or validate sensitive information. It also reinforces good development practices and improves the clarity of the program flow.

6. Improvements in debugging and error handling

One of the most valuable improvements for everyday use is that fatal errors now display a complete stack trace, facilitating diagnosis even in environments where it was previously difficult to identify the root cause. Added to this are two new functions: get_error_handler() and get_exception_handler(), which allow you to inspect currently active handlers. This capability is especially useful for frameworks, libraries, or systems that temporarily modify the error handling configuration.

7. Better support for localization and RTL languages

PHP 8.5 incorporates functions such as locale_is_right_to_left() and Locale::isRightToLeft() to detect whether a language is written from right to left, such as Arabic or Hebrew. This allows interfaces, CSS classes, and visual behaviors to be adjusted more precisely. For multilingual applications, this improvement represents an important step toward more complete internationalization.

8. cURL extension: more efficient handling of multiple sessions

The new curl_multi_get_handles() feature allows you to retrieve all handles associated with a multi-handle, making it easier to manage multiple concurrent requests. In addition, cURL handles can now persist between PHP requests, reducing initialization costs and improving performance in applications that frequently interact with the same hosts.

9. More powerful CLI: php --ini=diff

The console incorporates the php --ini=diff option, which displays only the INI directives that have been modified from the standard configuration. This feature simplifies comparison between environments and allows for faster configuration auditing, especially on computers that handle multiple development environments.

10. PHP_BUILD_DATE constant

The new PHP_BUILD_DATE constant allows you to know the compilation date of the PHP binary, which is useful for audits, version verification, and diagnostics in environments where multiple builds of the language coexist.

11. Closures and callables in constant expressions

PHP now allows static closures and first-class callables to be used within const expressions, even as attribute parameters. This expands the language's configuration possibilities, making the code more declarative and allowing complex behaviors to be defined at compile time.

12. Performance and security improvements

The version also brings significant internal optimizations. BCMath now uses a stack instead of a heap, which improves performance. XMLWriter receives adjustments that reduce resource consumption. In addition, new opcache directives (such as opcache.file_cache_read_only) help optimize cache behavior. Added to this are critical bug fixes, such as memory leaks, overflows, and UAF cases, which strengthen the stability of the language.

A release focused on practicality

PHP 8.5 does not transform the language from the ground up, but it does offer practical improvements that make development cleaner, more expressive, safer, and more efficient. For teams looking to maintain modern codebases or prepare for the jump to PHP 9.0, this release represents a solid and timely step forward.

El 20 de noviembre llegó PHP 8.5, una versión que trae mejoras que elevan la experiencia de desarrollo, la legibilidad del código y la capacidad de depuración. Es una actualización pensada para resolver dolores reales: menos código repetitivo, más control sobre errores y un mejor soporte para entornos modernos y aplicaciones multilingües.
En esta entrada te contamos las novedades más importantes y cómo impactan el trabajo diario en proyectos PHP.

1. Nueva extensión URI: manejo de URLs de forma nativa

PHP 8.5 incorpora una extensión integrada para analizar, normalizar y manipular URLs siguiendo los estándares RFC 3986 y WHATWG URL. Esta mejora reduce la dependencia de librerías externas y evita errores comunes al manejar rutas o parámetros. También aporta mayor consistencia al trabajar con aplicaciones que consumen APIs, simplificando el procesamiento de URLs en proyectos complejos.

2. Operador pipe (|>): un código más expresivo y funcional

Una de las novedades más esperadas es el operador |>, que permite encadenar funciones y pasar valores entre ellas sin usar variables intermedias. El resultado es un código más limpio y legible, especialmente en pipelines de transformación.

$result = $data
    |> sanitize(...)
    |> validate(...)
    |> transform(...);

Aunque tiene algunas limitaciones (como requerir callables con un único parámetro obligatorio y no aceptar parámetros por referencia), su impacto en claridad es significativo. Esta nueva sintaxis favorece un estilo de programación más funcional y fluido, especialmente en proyectos que procesan datos en varias etapas.

3. Nuevas funciones array_first() y array_last()

PHP 8.5 introduce array_first() y array_last(), dos funciones sencillas pero muy esperadas para obtener el primer y el último valor de un arreglo, incluso si es asociativo. Si el array está vacío, devuelven null. Esto evita escribir lógica repetitiva y hace más explícita la intención del código, permitiendo operaciones más claras y concisas al trabajar con estructuras de datos.

4. Clone with: copiar objetos y actualizar propiedades fácilmente

La actualización incorpora una extensión al uso de clone() que permite clonar un objeto y modificar propiedades en la misma expresión. Esta posibilidad es especialmente útil para clases con propiedades inmutables o readonly, simplificando patrones que antes requerían varios pasos y ayudando a mantener un código más declarativo y ordenado.

5. Atributo #[\NoDiscard]: adiós a errores silenciosos

Este atributo genera una advertencia si se ignora el valor de retorno de una función marcada como crítica. Esto ayuda a evitar errores que pueden pasar desapercibidos, especialmente en métodos que afectan el estado de la aplicación o validan información sensible. Además, refuerza buenas prácticas de desarrollo y mejora la claridad del flujo del programa.

6. Mejoras en depuración y manejo de errores

Una de las mejoras más valiosas para el día a día es que los errores fatales ahora muestran un stack trace completo, facilitando el diagnóstico incluso en entornos donde antes era difícil identificar la causa raíz. A esto se suman dos nuevas funciones: get_error_handler() y get_exception_handler(), que permiten inspeccionar los handlers actualmente activos. Esta capacidad es especialmente útil para frameworks, librerías o sistemas que modifican temporalmente la configuración de manejo de errores.

7. Mejor soporte para localización y lenguajes RTL

PHP 8.5 incorpora funciones como locale_is_right_to_left() y Locale::isRightToLeft() para detectar si un idioma se escribe de derecha a izquierda, como árabe o hebreo. Esto permite ajustar interfaces, clases CSS y comportamientos visuales de forma más precisa. Para aplicaciones multilingües, esta mejora representa un paso importante hacia una internacionalización más completa.

8. Extensión cURL: manejo más eficiente de múltiples sesiones

La nueva función curl_multi_get_handles() permite recuperar todos los handles asociados a un multi-handle, lo que facilita la gestión de múltiples peticiones concurrentes. Además, los handles de cURL ahora pueden persistir entre peticiones PHP, reduciendo el costo de inicialización y mejorando el rendimiento en aplicaciones que interactúan frecuentemente con los mismos hosts.

9. CLI más poderosa: php --ini=diff

La consola incorpora la opción php --ini=diff, que muestra únicamente las directivas INI que fueron modificadas respecto a la configuración estándar. Esta capacidad simplifica la comparación entre entornos y permite auditar configuraciones de forma más rápida, especialmente en equipos que manejan múltiples ambientes de desarrollo.

10. Constante PHP_BUILD_DATE

La nueva constante PHP_BUILD_DATE permite conocer la fecha de compilación del binario de PHP, lo cual es útil para auditorías, verificación de versiones y diagnóstico de entornos en los que conviven múltiples builds del lenguaje.

11. Closures y callables en expresiones constantes

PHP ahora permite utilizar closures estáticas y first-class callables dentro de expresiones const, incluso como parámetros de atributos. Esto amplía las posibilidades de configuración del lenguaje, haciendo el código más declarativo y permitiendo definir comportamientos complejos desde el tiempo de compilación.

12. Mejoras de rendimiento y seguridad

La versión también trae optimizaciones internas importantes. BCMath ahora utiliza stack en lugar de heap, lo que mejora el rendimiento. XMLWriter recibe ajustes que reducen el consumo de recursos. Además, nuevas directivas de opcache (como opcache.file_cache_read_only) ayudan a optimizar el comportamiento del caché. A esto se suman correcciones de bugs críticos, como fugas de memoria, overflows y casos de UAF, que fortalecen la estabilidad del lenguaje.

Una versión que apunta a lo práctico

PHP 8.5 no transforma el lenguaje desde cero, pero sí ofrece mejoras prácticas que hacen que el desarrollo sea más limpio, expresivo, seguro y eficiente. Para equipos que buscan mantener bases de código modernas o prepararse para el salto hacia PHP 9.0, esta versión representa un avance sólido y oportuno.

When working on your website's SEO, one of the most important (and often overlooked) elements is the sitemap. This file serves as a map for search engines, helping them discover and index all relevant pages on your site.

Although ideally Google should be able to crawl all pages through internal links, in practice, many are left out of that crawl: new pages, sections with few links, or content hosted deep within the site. That's where the sitemap comes in.

A sitemap allows search engines to find every important page on your website faster, even those that don't have direct internal links. In other words, it speeds up the content discovery process and improves indexing coverage.

What is a sitemap and why is it important?

A sitemap is a file that contains a structured list of a website's pages. Its main purpose is to facilitate the work of web crawlers, allowing them to identify what content exists, when it was last updated, and how relevant it is within the site.

Additionally, it helps search engines index your website more efficiently, increasing the likelihood that your pages will appear in results when people search for terms related to your content or services.

Although Google does not consider sitemaps a mandatory requirement, it does recommend them as a best practice, especially for large sites with many internal pages or few links. In general, having a sitemap makes the work of search engines easier and helps your content be discovered and indexed faster.

Types of sitemaps and their differences

There are different types of sitemaps, each with a specific purpose:

• Visual sitemap: mainly used during the web design process to plan the site structure, but has no direct impact on SEO.
• HTML sitemap: designed for site visitors. It functions as an index that brings together the main links on a single page, facilitating navigation, and is usually located in the menu or footer.
• XML sitemap: this is the format preferred by search engines because it brings together all the important URLs on the site along with useful metadata, such as the date of the last update, the frequency of changes, or the priority of each page.

Although the three types serve different purposes, XML has the greatest impact on SEO, as it directly communicates to Google how your site is structured. It also allows extensions to include additional metadata (for example, information about images, videos, news content, or localized versions of pages), making it the best option when you need to communicate extra details to search engines.

How to create an effective XML sitemap

Before generating your sitemap, it's a good idea to define which pages to include. Not all URLs should appear in it. The rule is simple: if you don't want a page to appear in search results, don't include it in the sitemap.

For example, avoid including test pages, duplicate content, thank you pages, or internal search results. Instead, prioritize sections that are relevant to your users: product pages, services, blog articles, or categories.

A basic XML sitemap looks like this:

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://www.example.com/services/</loc>
    <lastmod>2024-01-01</lastmod>
  </url>
</urlset>

In this fragment:

• <?xml version="1.0" encoding="UTF-8"?> indicates the file type..
• <urlset> defines the set of URLs.
• <loc> shows the exact page address.
• <lastmod> indicates the date of the last modification.

Once created, you can check it by typing the following into your browser: https://yoursite.com/sitemap.xml

And, to facilitate indexing, it is recommended that you send it directly to Google Search Console.

How to do it in Drupal step by step

If your site is developed in Drupal, creating an XML sitemap is easier than it seems, thanks to the Simple XML Sitemap module. Here are the steps to configure it:

Before continuing, it is important to clarify that this approach mainly applies to traditional Drupal sites, where the CMS directly controls the final URLs.

In projects with decoupled (headless) architectures, sitemap generation requires a different approach, as the paths are defined outside of Drupal. If this is your case, here we explain how to manage sitemaps on headless sites and what options exist depending on the project architecture.

Step 1: Log in to Drupal.

Step 2: Install the Simple XML Sitemap module from the official website.

Step 3: Activate the necessary submodules

• Simple XML Sitemap
• Simple XML Sitemap (Search engines)
• (Optional) Simple XML Sitemap (Views) if you use the Views module.

Step 4: Go to Configuration → Search and metadata → Simple XML Sitemap.

Step 5: Select Rebuild queue & generate to create your first sitemap.

In the Settings tab, you can adjust how often the file is regenerated and define whether the sitemap will be displayed with an XSL stylesheet to make it more readable.

From the Inclusion tab, you can also add custom links, comments, images, or other elements that add value depending on your content type.

At Seed EM, we often use this module as part of the basic SEO configurations for Drupal projects, as it allows us to generate accurate sitemaps and keep them updated automatically.

The impact of an XML sitemap

An XML sitemap not only organizes your site for search engines but also improves how Google understands the hierarchy and relevance of your content. Although indexing also depends on other factors (such as content quality and internal links), a good sitemap is a solid foundation for your website to be discovered faster and more accurately.

Drupal simplifies this process with tools such as Simple XML Sitemap, which automate the generation and updating of the file, ensuring that every new relevant page is visible to search engines.

Creating and maintaining an XML sitemap may seem like a technical detail, but it is actually a key part of any modern SEO strategy. And with flexible platforms such as Drupal, doing it well is within everyone's reach.

Cuando trabajas en el posicionamiento de tu sitio web, uno de los elementos más importantes (y muchas veces olvidados) es el sitemap. Este archivo actúa como un mapa que guía a los motores de búsqueda, ayudándoles a descubrir e indexar todas las páginas relevantes de tu sitio.

Aunque lo ideal es que Google pueda rastrear todas las páginas a través de los enlaces internos, en la práctica muchas quedan fuera de ese recorrido: páginas nuevas, secciones con poca vinculación o contenido alojado en niveles profundos del sitio. Ahí es donde entra en juego el sitemap.

Un sitemap permite que los motores de búsqueda encuentren más rápido cada página importante de tu web, incluso aquellas que no tienen enlaces internos directos. En otras palabras, acelera el proceso de descubrimiento de contenido y mejora la cobertura de indexación.

Qué es un sitemap y por qué importa

Un sitemap (o mapa del sitio) es un archivo que contiene una lista estructurada de las páginas de un sitio web. Su principal objetivo es facilitar el trabajo de los rastreadores web, permitiéndoles identificar qué contenido existe, cuándo fue actualizado por última vez y cuál es su relevancia dentro del sitio.

Además, ayuda a que los motores de búsqueda indexen tu web de forma más eficiente, aumentando la probabilidad de que tus páginas aparezcan en los resultados cuando las personas buscan términos relacionados con tu contenido o servicios.

Aunque Google no considera los sitemaps un requisito obligatorio, sí los recomienda como una buena práctica, especialmente en sitios grandes, con muchas páginas internas o poco enlazado. En general, contar con un sitemap facilita el trabajo de los motores de búsqueda y ayuda a que tu contenido sea descubierto e indexado más rápido.

Tipos de sitemap y sus diferencias

Existen distintos tipos de sitemaps, cada uno con un propósito específico:

• Sitemap visual: se usa principalmente durante el proceso de diseño web para planificar la estructura del sitio, aunque no tiene impacto directo en el SEO.
• Sitemap HTML: está pensado para los visitantes del sitio. Funciona como un índice que reúne los enlaces principales en una sola página, facilitando la navegación y ubicándose normalmente en el menú o en el pie de página.
• Sitemap XML: es el formato preferido por los motores de búsqueda porque reúne todas las URL importantes del sitio junto con metadatos útiles, como la fecha de la última actualización, la frecuencia de cambios o la prioridad de cada página.

Aunque los tres tipos cumplen funciones diferentes, el XML es el que más influye en el SEO, ya que comunica directamente a Google cómo está estructurado tu sitio. Además, permite extensiones para incluir metadatos adicionales (por ejemplo, información sobre imágenes, vídeos, contenido de noticias o versiones localizadas de las páginas), lo que lo convierte en la mejor opción cuando necesitas comunicar detalles extra a los motores de búsqueda.

Cómo crear un sitemap XML eficaz

Antes de generar tu sitemap, conviene definir qué páginas incluir. No todas las URL deberían aparecer en él. La regla es simple: si no quieres que una página aparezca en los resultados de búsqueda, no la incluyas en el sitemap.

Por ejemplo, evita incluir páginas de prueba, contenido duplicado, páginas de agradecimiento o resultados de búsqueda internos. En cambio, prioriza las secciones relevantes para tus usuarios: páginas de productos, servicios, artículos de blog o categorías.

Un sitemap XML básico se ve así:

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://www.ejemplo.com/servicios/</loc>
    <lastmod>2024-01-01</lastmod>
  </url>
</urlset>

En este fragmento:

• <?xml version="1.0" encoding="UTF-8"?> indica el tipo de archivo.
• <urlset> define el conjunto de URL.
• <loc> muestra la dirección exacta de la página.
• <lastmod> indica la fecha de la última modificación.

Una vez creado, puedes comprobarlo escribiendo en tu navegador: https://tusitio.com/sitemap.xml

Y, para facilitar la indexación, es recomendable enviarlo directamente a Google Search Console.

Cómo hacerlo en Drupal paso a paso

Si tu sitio está desarrollado en Drupal, crear un sitemap XML es más fácil de lo que parece gracias al módulo Simple XML Sitemap . A continuación te mostramos los pasos para configurarlo.

Antes de continuar, es importante aclarar que este enfoque aplica principalmente a sitios Drupal tradicionales, donde el CMS controla directamente las URLs finales.

En proyectos con arquitecturas desacopladas (headless), la generación del sitemap requiere un enfoque distinto, ya que las rutas se definen fuera de Drupal. Si este es tu caso, aquí explicamos cómo gestionar sitemaps en sitios headless y qué opciones existen según la arquitectura del proyecto

Paso 1: Inicia sesión en Drupal.

Paso 2: Instala el módulo Simple XML Sitemap desde la página oficial.

Paso 3: Activa los submódulos necesarios:

• Simple XML Sitemap
• Simple XML Sitemap (Search engines)
• (Opcional) Simple XML Sitemap (Views) si usas el módulo Views.

Paso 4: Ve a Configuración → Búsqueda y metadatos → Simple XML Sitemap.

Paso 5: Selecciona Rebuild queue & generate para crear tu primer sitemap.

En la pestaña Settings puedes ajustar cada cuánto se regenera el archivo y definir si el sitemap se mostrará con una hoja de estilo XSL para hacerlo más legible.

Desde la pestaña Inclusion, también puedes agregar enlaces personalizados, comentarios, imágenes u otros elementos que aporten valor según tu tipo de contenido.

En Seed EM, solemos utilizar este módulo como parte de las configuraciones SEO básicas de los proyectos Drupal, ya que permite generar sitemaps precisos y mantenerlos actualizados de forma automática.

El impacto real de un sitemap XML

Un sitemap XML no solo organiza tu sitio para los motores de búsqueda, sino que mejora la manera en que Google entiende la jerarquía y relevancia de tu contenido. Aunque la indexación también depende de otros factores (como la calidad del contenido y los enlaces internos), un buen sitemap es una base sólida para que tu web sea descubierta más rápido y con mayor precisión.

Drupal simplifica este proceso con herramientas como Simple XML Sitemap, que automatizan la generación y actualización del archivo, asegurando que cada nueva página relevante sea visible para los motores de búsqueda.

Crear y mantener un sitemap XML puede parecer un detalle técnico, pero en realidad es una pieza clave en cualquier estrategia SEO moderna. Y con plataformas flexibles como Drupal, hacerlo bien está al alcance de todos.