Lun–Vie 9:00–18:00

Blog · Tema

Tema: #astro

Artículos etiquetados con «astro». Las etiquetas conectan artículos de distintas categorías que comparten un mismo asunto.

Las etiquetas son una segunda capa de organización, transversal a las categorías: un mismo tema (por ejemplo, «astro» o «markdown») puede aparecer en guías y en novedades. Agrupar por etiqueta ayuda a quien busca algo muy específico a encontrar todo lo relacionado, sin importar la sección.

Esta página se genera sola desde la colección: lista los artículos que incluyen esta etiqueta. Conviene usar pocas etiquetas consistentes —no inventar una nueva por artículo— para que cada archivo tenga contenido suficiente y valor real.

Archivo de etiqueta

Artículos con «astro»

41 artículos con esta etiqueta.

Las etiquetas cruzan las categorías: relacionan contenidos por un asunto puntual aunque vivan en secciones distintas. Bien usadas, tejen una red de enlaces internos que ayuda tanto a la persona como al rastreo del buscador.

La clave es la disciplina: un conjunto corto y estable de etiquetas vale más que decenas de etiquetas únicas. Cada una debe agrupar varios artículos para justificar su página de archivo.

Astro 6 Fonts API: fuentes web correctas sin dolor de cabeza

La Fonts API de Astro 6 automatiza self-hosting, preloads y fallbacks de fuentes. Análisis honesto de qué resuelve y qué sigue siendo tu responsabilidad.

Content Layer en Astro 5: el fin de las colecciones rígidas

El Content Layer de Astro 5 unifica cualquier fuente de datos en un store tipado. Una revisión honesta de qué cambia, por qué importa y qué sigue roto.

Auditar y migrar un sitio existente al estándar, página a página

Método para llevar un sitio ya publicado al estándar de la plantilla sin big-bang: inventario por nivel, auditoría contra la vara y un bucle de mejora.

CategoryFeature: el spotlight de categoría que convierte en Astro

Aprende a construir un bloque de 2 columnas con bullets, pills de marcas y galería 1+2 para destacar una categoría en la home sin crear componentes extra.

FAQ + formulario: patrón de 2 columnas con CTA sticky

Cómo construir un módulo FAQ + contacto WhatsApp en 2 columnas con tarjeta sticky — el CTA siempre a la vista mientras el visitante lee las preguntas.

Live Content Collections: el CMS que actualiza sin rebuild

Astro 6 estabiliza Live Collections para contenido en tiempo real. Análisis honesto de cuándo los necesitas y cuándo el rebuild sigue siendo la respuesta.

Migrar un blog legacy (HTML suelto) a Content Collections

Cómo convertir cientos de posts en HTML plano a una colección Astro tipada: conversor, frontmatter Zod-válido, exclusión de stubs y taxonomías.

Páginas legales en México: aviso de privacidad y términos

Estructura canónica del aviso de privacidad LFPDPPP (con derechos ARCO) y de los términos de servicio para un sitio de negocio mexicano en Astro.

Portafolio honesto en Astro: proyectos vs casos

Por qué separar la colección proyectos (CreativeWork) de casos (testimonios): mostrar trabajo real con schema correcto y sin métricas ni reseñas inventadas.

Compilador Rust y Sätteri: Astro abandona JS en su core

Astro 6 reescribe su compilador en Rust y estrena Sätteri para Markdown. Qué ganas, qué pierdes y qué significa esta apuesta para el ecosistema.

Server Islands: páginas estáticas con personalización real

Cómo Astro resuelve el dilema de CDN vs contenido personalizado con Server Islands, cuándo usarlos y cuándo no, con análisis honesto de tradeoffs reales.

Sitio servicios-céntrico: retirar el andamiaje de catálogo

La plantilla nace catálogo-céntrica (productos tejidos en footer, menú y CTAs). Guía para convertirla a un negocio de servicios sin romper el build.

Fichas de detalle en Astro: rutas dinámicas y schema

Cómo construir la ficha (L3) en Astro: una ruta dinámica con getStaticPaths, el cuerpo desde Markdown, migas de dos niveles y el schema específico sin duplicar.

Anatomía de una home en Astro: hero, LCP y velocidad

Cómo construir la home (L1) en Astro: el hero con un solo H1, LCP por debajo de 2.5 s, vitrina data-driven desde site.ts y el Organization JSON-LD sin duplicar.

Índices de sección en Astro: getCollection e ItemList

Cómo construir un índice de sección (L2) en Astro: rejilla data-driven con getCollection, ItemList como emisor único de schema y migas de un nivel.

Los 4 niveles de un sitio: de la raíz a la hoja

La arquitectura de información de un sitio de negocio en cuatro niveles —inicio, índice, ficha, variante—: qué hace cada uno, cómo se enlazan y cuándo usarlos.

Variantes (L4) en Astro: canonical y ProductGroup

Cómo modelar el nivel más profundo (L4) en Astro: rutas anidadas o variantes en frontmatter, canonical anti-duplicado y ProductGroup, sin generar thin content.

Construir un sitio Astro+Markdown: 12 módulos

Tesis técnica: cómo se construye un sitio profesional con Astro y Markdown encadenando 12 módulos como referencia industrial. Mapa, decisiones y enlaces.

Tracking de CTAs con data-cta-id, sin invasión

Cómo medir clicks de CTAs en Astro con data-cta-id: instrumentación ligera, analytics respetuoso del usuario y reporting sin scripts pesados.

CTAs honestos: copy, jerarquía, anti dark-patterns

CTAs honestos en Astro: copy del botón, jerarquía visual primary/secondary y por qué los dark-patterns dañan más conversión de la que aparentan ganar.

Form backend con Cloudflare Pages Functions

Del HTML nativo a Cloudflare Pages Function: backend pragmático para tu contact form Astro, sin servidor propio, con email transactional y rate-limit.

Contact form Astro: WCAG, honeypot y es-MX

Formularios de contacto en Astro accesibles WCAG 2.2, con honeypot anti-spam y validación HTML5 nativa para inputs en español de México.

Footer multi-columna data-driven en Astro

Cómo construir un footer multi-columna data-driven en Astro desde site.ts, con grid CSS moderno, cierre legal y patrones de responsive sin hacks.

Footer SEO global: NAP y schema Organization

El footer como activo SEO global en Astro: NAP consistente, schema Organization único y por qué cada página debe servir la misma ficha de marca.

Reviews en Astro: estrellas y aggregate honestos

Cómo emitir Review schema en Astro de forma honesta: estrellas reales, aggregate solo con datos verificables y por qué la confianza vale más que el snippet.

FAQAccordion en Astro: details nativo + FAQPage

Del estado nativo de details/summary al schema FAQPage: cómo construir un FAQAccordion accesible en Astro sin JavaScript y con SEO bien resuelto.

Catálogo de servicios data-driven en Astro

Cómo armar un catálogo de servicios data-driven en Astro: iconos por categoría, mapping desde la colección y un solo grid que crece sin tocar el JSX.

Service card con CTA dual: ficha vs WhatsApp

Tarjetas de servicio en Astro con CTA dual: cuándo enviar a la ficha del servicio y cuándo abrir WhatsApp para no perder el lead caliente.

Schema Product en cards: regla del emisor único

Cuándo emitir Product+Offer JSON-LD en una card y cuándo no, por qué la regla del único emisor B3 evita penalizaciones y duplicados en Google.

Product card en Astro: catálogo desde Markdown

Cómo armar una vitrina de productos performante en Astro: del frontmatter Markdown a la ProductCard, con loaders, reference() y precios honestos.

CategoryDetail vs CategoryCard: árbol de decisión

Cuándo usar CategoryDetail y cuándo CategoryCard en Astro: árbol de decisión por contexto, intent del visitante y profundidad del catálogo.

Detalle de categoría: bloques profundos en Astro

Cómo armar páginas de detalle de categoría con CategoryDetail en Astro: bloques info + galería que educan al visitante y mantienen el ritmo de lectura.

Grid responsive de categorías en Astro

Del mobile-first al desktop con Astro y tokens.css: cómo armar un grid de CategoryCard que sobrevive a 380px, 768px y 1024px sin reflujos.

Category card: anatomía y data-driven en Astro

Tarjetas de categoría que convierten: anatomía, variantes y enfoque data-driven con Content Collections de Astro para escalar sin tocar el JSX.

SectionHeading: layout duo, simple y dark

Árbol de decisión para elegir entre layout duo, simple y dark en SectionHeading: cuándo se usa cada uno y por qué la consistencia importa.

Section headings: jerarquía visual y SEO Astro

Cómo diseñar section headings que enganchen sin romper la jerarquía H1-H6 ni la legibilidad para buscadores, con ejemplos de Astro y tokens CSS.

Del menú de sección a la conversión

Patrones de cierre para artículos y landings con SectionMenu: cómo convertir el final de la página en el inicio de una acción del visitante.

Menú de sección en Astro: anclas y cierre

Diseñando un menú de sección efectivo: anclas internas, cierre de página y enfoque data-driven con Astro para guiar al visitante al siguiente paso.

Breadcrumbs y SEO: BreadcrumbList JSON-LD en Astro

Por qué tu sitio Astro necesita un BreadcrumbList JSON-LD bien construido, dónde emitirlo y los errores que provocan que Google ignore tu jerarquía.

Migas de pan en Astro: guía paso a paso

Cómo implementar migas de pan en Astro para fortalecer la navegación, evitar duplicar JSON-LD y mantener la jerarquía coherente en cada página.

Cómo usar esta plantilla de Ejemplos.mx

Guía para construir un sitio Astro desde esta plantilla: configurar datos en site.ts, agregar contenido en Markdown y publicar.

¿Necesitas ayuda?