Metadatos SEO para Blazor
Gestiona los metadatos SEO de Blazor en un solo componente
Mantenga títulos, descripciones, URL canónicas, enlaces hreflang, etiquetas Open Graph, directivas de robots y JSON-LD en un componente Blazor reutilizable.
Revise los ejemplos y luego compre la implementación completa para aprox. 5 € cuando desee el mismo patrón en su propia aplicación.
Resumen
Utilice una fuente de metadatos para cada página
Una aplicación Blazor puede representar muchas páginas con el mismo diseño. Un componente central de metadatos mantiene alineados el título de cada página, la descripción, la URL canónica, los enlaces de idioma, la vista previa social y la carga útil del esquema.
Comprobación de ajuste
Los metadatos centrales superan al marcado principal copiado y pegado
Copiar etiquetas principales en cada página funciona por un tiempo, luego pequeñas diferencias crean títulos duplicados, URL canónicas obsoletas, enlaces hreflang faltantes o esquemas que ya no coinciden con la página visible. Un componente mantiene la regla en un solo lugar.
Utilice un componente cuando las páginas compartan reglas de SEO
- Muchas páginas comparten el mismo título, descripción, reglas canónicas, hreflang, Open Graph y robots.
- Las páginas localizadas necesitan vínculos culturales coherentes y un manejo predeterminado.
- Los artículos, preguntas frecuentes, productos o páginas de software necesitan JSON-LD que coincida con el contenido visible.
- Los editores o desarrolladores deben actualizar los metadatos sin editar el marcado de diseño.
Evite marcas de cabeza dispersas
- Cada página escribe sus propias etiquetas de encabezado a mano.
- El H1, el título y la meta descripción repiten la misma frase.
- Las URL canónicas apuntan a rutas antiguas después de mover una página.
- El esquema de preguntas frecuentes permanece en línea después de que se eliminan las preguntas frecuentes visibles.
Índice
Señales SEO
Mantenga la identidad de la página consistente
Los motores de búsqueda, las plataformas sociales y los rastreadores de inteligencia artificial leen señales ligeramente diferentes. Aún así deberían describir la misma página en un lenguaje sencillo.
Nombra la página claramente
Utilice un título breve que contenga el tema principal sin copiar el H1 palabra por palabra.
Invitar a la siguiente acción
Escriba una meta descripción natural que explique el beneficio y brinde a los usuarios una razón para abrir, revisar o comprar.
Elija una URL preferida
La URL canónica debe apuntar a la página que desea indexar, no a un enlace de seguimiento, redireccionamiento o ruta obsoleta.
Enlace de versiones de idiomas
Las páginas con conciencia cultural necesitan enlaces hreflang que coincidan con URL reales e incluyan una página x-default sensata.
Controlar las vistas previas compartidas
Las vistas previas sociales deben utilizar el mismo título de página, descripción, URL canónica e imagen preparada que el resto de los metadatos.
Establecer reglas de rastreo deliberadamente
Utilice robots y directivas de IA por página para que la indexación, los fragmentos, los archivos y el uso de la IA coincidan con la política de contenido.
Datos estructurados
Generar esquema a partir de los metadatos de la misma página.
JSON-LD no debería contar una historia diferente a la de la página. Utilice el mismo título, descripción, URL canónica, fecha de publicación, imagen, rutas de navegación y datos de preguntas frecuentes que ya utiliza el artículo visible.
Schema de artículo
Utilice el esquema de artículo cuando la página tenga un título real, una fecha de publicación, una fecha de modificación, una imagen y una estructura de sección.
Schema de preguntas
Utilice la página de preguntas frecuentes solo cuando las mismas preguntas y respuestas estén visibles en la página.
BreadcrumbList
Cree rutas de navegación a partir de la misma jerarquía que los usuarios pueden entender a través de enlaces y navegación.
Software o producto
Agregue un esquema de producto o software solo cuando el precio, la oferta, el nombre y la descripción sean visibles para los usuarios.
Errores comunes
La mayoría de los errores de metadatos son pequeñas discrepancias
El componente es útil porque convierte comprobaciones repetidas en un patrón repetible. El objetivo no es más etiquetas. El objetivo es menos contradicciones.
No copie H1 en el título y la descripción.
El título, H1 y la meta descripción pueden utilizar el mismo tema, pero cada uno debe tener una función diferente.
No olvides las URL traducidas
Si una página existe en varias culturas, los metadatos y hreflang deben apuntar a la ruta cultural coincidente.
No reutilice imágenes compartidas obsoletas
Las imágenes Open Graph y JSON-LD deben representar esta página, no el último artículo que utilizó el componente.
No marques contenido oculto
Las preguntas frecuentes y el esquema del producto deben describir el contenido que los usuarios realmente pueden ver en la página.
Implementación
Conecte el componente una vez y luego aliméntelo con datos de página.
El patrón sigue siendo aburrido a propósito: define un objeto de metadatos de página, representa el componente en el diseño o la página y pasa JSON-LD coincidente cuando la página necesita datos estructurados.
Definir metadatos de página
var metadata = new PageMetaData(culture)
{
Name = PageLinks.BlazorSEOMetaDataComponent,
Title = "Blazor SEO Metadata Component for Blazor Apps",
Description = "Keep title, description, canonical, hreflang, Open Graph, and JSON-LD aligned.",
ImageUrl = "/images/blazor/metadatacomponente/opengraph/hero-1200.png",
Url = PageLinks.BlazorSEOMetaDataComponent,
Robots = RobotsMetaTagExtensions.Join(RobotsMetaTagEnum.Index, RobotsMetaTagEnum.Follow),
AllowAiIndexing = true
};Renderizar metadatos en un layout
@inherits LayoutComponentBase
<MetadataComponent MetaData="@PageMeta"
JsonLd="@Schema?.JsonLd"
RenderArticleMeta="@Schema?.RenderArticleMeta" />
@BodyAdjunte JSON-LD en la página
@page "/{Culture}/guide/"
@inherits PageBase
<MetadataComponent MetaData="@PageMeta"
JsonLd="@Schema?.JsonLd"
RenderArticleMeta="@Schema?.RenderArticleMeta" />
<ArticleFaq Id="faq" FAQ="@FAQs" />Validación
Verifique el resultado antes de publicar
Un componente de metadatos sólo es útil cuando el HTML renderizado es correcto. Inspeccione el origen de la página, pruebe las vistas previas compartidas, valide el esquema y rastree las URL localizadas antes del lanzamiento.
Ver fuente
Verifique el encabezado HTML renderizado, no solo el archivo Razor. Los rastreadores leen la respuesta final.
Validar esquema
Ejecute una validación de esquemas o resultados enriquecidos y corrija las advertencias que indican que falta contenido visible.
Compartir pruebas
Utilice depuradores de vista previa social para verificar el título, la descripción, la imagen y el comportamiento de la caché.
Localizaciones de rastreo
Rastree las URL culturales para detectar enlaces canónicos, hreflang o x-default rotos antes del lanzamiento.
Comenzar
Compre el componente cuando se repitan sus reglas de metadatos
Si ya está escribiendo el mismo título, la misma lógica canónica, Open Graph y JSON-LD en varias páginas, compre la implementación completa para aprox. 5 € y mantenga la regla en un solo lugar.
Recursos relacionados
Próximas guías para metadatos de Blazor SEO
Utilice estas guías cuando necesite más detalles sobre enrutamiento, datos estructurados, vistas previas sociales o la propia plataforma Blazor.
Preguntas frecuentes
¿Qué hace el componente de metadatos de Blazor?
Representa metadatos de página a partir de una fuente escrita: título, descripción, URL canónica, enlaces hreflang, etiquetas Open Graph, directivas de robots y JSON-LD opcional.
¿Por qué el título, el H1 y la meta descripción deberían ser diferentes?
Aparecen en diferentes lugares. El título ayuda a las pestañas de búsqueda y del navegador, el H1 nombra la página visible y la descripción debe invitar a la siguiente acción.
¿El componente evita el contenido duplicado?
Ayuda a mantener coherentes las URL canónicas y los enlaces hreflang. Aún necesita textos de página únicos y descripciones para páginas dirigidas a diferentes intenciones o idiomas.
¿Cómo encaja JSON-LD en el componente?
La página crea JSON-LD a partir de los mismos metadatos y contenido visible utilizados por el artículo, las preguntas frecuentes, la ruta de navegación, el producto o la sección de software.
¿Puedo controlar las etiquetas del rastreador de IA por página?
Sí. Utilice robots a nivel de página y opciones de IA para que las reglas de indexación, fragmentos, archivos, noai y noimageai coincidan con la política de contenido de esa página.
¿Puedo usar esto en Blazor WebAssembly?
Sí, pero los metadatos de SEO son más potentes cuando las etiquetas están presentes en la respuesta HTML inicial. La renderización o prerenderización del servidor suele ser la opción más segura.