Saltar al contenido principal

Inspección, calibración y medición de tanques de almacenamiento · Petróleo & Gas (ISO 17020) · Chile y Uruguay · Desarrollo Web

BZ Consulting

Primer proyecto web entregado por IngSimple, hoy con más de dos años en producción. Un sitio institucional bilingüe ultra-liviano sobre Astro, con un flujo de publicación de noticias semanales que el equipo de BZ usa para sostener su presencia digital sin depender de un CMS ni de un developer cada vez que sale una novedad.

Astro 4React 18TypeScriptTailwind CSSRadix UIMDX@astrolicious/i18nEmbla CarouselCloudflare PagesCloudflare WorkersResend
Vista del sitio de BZ Consulting

Cliente

BZ Consulting

Duración

≈4 semanas de desarrollo inicial (abril–mayo 2024). Mantenimiento continuo desde el lanzamiento.

En producción

Mayo 2024 — en producción y mantenimiento activo, con publicación de noticias semanal sostenida hace más de 2 años.

El problema

BZ Consulting es un organismo de inspección certificado ISO 17020 con clientes pesados del sector petróleo y gas (ENAP, ENEX, SONACOL, ANCAP, operadores portuarios) y presencia en Chile —Quintero, Talcahuano, San Vicente— y Uruguay. A pesar del peso técnico de la operación, no tenían un canal digital institucional que reflejara ni la trayectoria del equipo ni el nivel de los proyectos que ejecutan.

El requerimiento se planteó simple en superficie pero exigente en práctica: un sitio bilingüe (español e inglés), rápido, sobrio, que comunicara servicios, certificaciones y centro de operaciones, con un canal de contacto operativo para clientes corporativos. Y, sobre todo, una sección de noticias que el equipo de BZ pudiera alimentar con frecuencia para mantener al sitio vivo — sin necesidad de aprender un CMS ni pagar uno.

Era además el PRIMER proyecto web de IngSimple, así que las decisiones técnicas tenían que envejecer bien: stack mantenible por una sola persona, costos operativos cercanos a cero y un flujo de publicación que sobreviviera dos años sin reescribir nada.

La solución

Sitio construido en Astro como SSG puro: cada página se precompila a HTML estático, React solo se hidrata en las islas que lo necesitan (formulario de contacto, selector de idioma, carrusel). El resultado es un sitio que rinde como un sitio del 2010 y se ve como uno del 2026.

La sección de noticias se modela como content collection de Astro con esquema Zod (título, cover, lang, fecha): cada noticia es un archivo MDX dentro del repo. Para publicar, basta con sumar un par de archivos (uno en ES, uno en EN), commitear, y Cloudflare Pages dispara el deploy automático. Sin CMS, sin login, sin costos extra — y con todo el historial editorial versionado en git.

El formulario de contacto va a un Cloudflare Worker que reenvía vía Resend, manteniendo el modelo 100% serverless y permitiendo hostear todo el sitio en el tier gratuito de Cloudflare Pages. El multilenguaje (ES/EN) se resuelve con @astrolicious/i18n, con URLs traducidas por idioma (/empresa ↔ /company, /noticias ↔ /news, etc.) para SEO limpio en ambos mercados.

Dos años después, el flujo sigue intacto: BZ pide la noticia, IngSimple agrega los dos MDX, push a main, y Cloudflare Pages publica. Más de 190 artículos publicados de esta forma — sin tocar una línea de código.

En números

190+

noticias publicadas

95 ES + 95 EN — pareadas, publicadas semanalmente durante 2 años.

100%

Core Web Vitals en verde

LCP P75 = 872ms según Cloudflare Web Analytics (últimos 30 días).

2+ años

en producción

Desde mayo 2024, con mantenimiento y publicación semanal sostenida.

2

idiomas con URLs traducidas

Español e inglés vía @astrolicious/i18n, SEO limpio en ambos.

Arquitectura

Astro 4 en modo Static Site Generation puro, sin adapter SSR. React 18 solo en las islas interactivas (formulario de contacto, selector de idioma, carruseles con Embla). Tailwind CSS + Radix UI siguiendo el patrón shadcn (componentes accesibles, estilo propio). Multilenguaje con @astrolicious/i18n y URLs traducidas por locale. Las noticias viven como content collections MDX con validación Zod en el frontmatter — el bilingüismo se modela como dos archivos por noticia (uno con lang: es, otro con lang: en). Sitemap generado con @astrojs/sitemap, robots.txt dinámico, ViewTransitions nativas de Astro para navegación sin recargar. Hosting en Cloudflare Pages con auto-deploy desde main; el formulario de contacto delega en un Cloudflare Worker que reenvía a Resend, manteniendo el costo operativo cercano a cero. Imágenes servidas en AVIF + WebP con fallback.

Decisiones técnicas

Astro 4 (SSG)

Para un sitio institucional con noticias, Astro es la decisión obvia: HTML estático prerenderizado, JavaScript opcional, y un modelo mental simple. Cero runtime overhead, deploys que caben en el tier gratuito de cualquier hosting estático, y un Lighthouse alto sin tener que pelearlo. Para el primer proyecto de IngSimple, era la apuesta más conservadora y a la vez la más correcta.

Content Collections + MDX

Cada noticia es un archivo MDX con frontmatter validado por Zod. El cliente no necesita un CMS: para publicar, se commitea un par de archivos y Cloudflare Pages despliega solo. Dos años después, el historial editorial completo vive en git, sin migraciones de base de datos ni dependencia de un proveedor de CMS.

@astrolicious/i18n

Multilenguaje con URLs traducidas por locale (/empresa ↔ /company, /noticias ↔ /news), routing transparente y soporte para contenido bilingüe a nivel collection. SEO limpio en ambos idiomas sin duplicar páginas a mano.

React 18 (solo en islas)

Astro permite hidratar React solo donde hace falta. En este sitio, React se carga únicamente para el formulario de contacto, el selector de idioma y el carrusel — el resto es HTML puro. Menos JS shipped, mejor performance.

Tailwind CSS + Radix UI

Patrón shadcn-like: Radix aporta accesibilidad por defecto (foco, ARIA, teclado) y Tailwind da control total del estilo. Sistema reutilizable que después aplicamos en proyectos posteriores de IngSimple.

Cloudflare Pages

Hosting estático con CDN global, auto-deploy desde main y tier gratuito generoso. Cada commit dispara una build y un nuevo deploy con preview URL. Para un sitio con publicación semanal, el flujo git → deploy automático es la mitad del producto.

Cloudflare Worker + Resend

El formulario de contacto reenvía a un Worker que hace el POST a Resend. Sin servidor propio, sin SMTP, sin costos fijos. Resend maneja deliverability y el Worker queda como capa fina de validación y CORS.

Embla Carousel

Carrusel headless, accesible por teclado y muy liviano. Control completo del markup y los estilos, sin la carga de una librería opinada.

Imágenes AVIF + WebP

Refactor de imágenes a formatos modernos con fallback. Esto explica buena parte del LCP en P75 de 872ms — el LCP suele ser una imagen, y entregarla en AVIF la achica a una fracción del peso.

Funcionalidades

Sitio bilingüe (ES/EN) con URLs traducidas

Cada ruta tiene su versión traducida por locale (/empresa ↔ /company, /noticias ↔ /news, /contacto ↔ /contact). Resuelto con @astrolicious/i18n a nivel de routing, sin duplicar páginas.

Publicación semanal de noticias sin CMS

Cada noticia es un par de archivos MDX (uno ES, uno EN) en el repo. Commit + push a main = deploy automático en Cloudflare Pages. Más de 190 artículos publicados con este flujo en 2 años.

Formulario de contacto serverless

Validación en cliente con React, envío a un Cloudflare Worker que reenvía vía Resend al equipo comercial de BZ. Sin backend propio, sin SMTP, dentro del tier gratuito.

Performance medida y validada

100% de las URLs en zona verde de Core Web Vitals según Cloudflare Web Analytics. LCP en P75 = 872ms, tiempo de carga promedio = 1025ms. SSG + AVIF + CDN de Cloudflare hacen el trabajo.

SEO técnico cuidado

Sitemap automático, robots.txt, OG tags, favicon webp, ViewTransitions para navegación SPA-like, y URLs traducidas por idioma. Base limpia para cualquier estrategia de posicionamiento futura.

Línea de tiempo

  1. Abril 2024

    Kickoff

    Primer proyecto web de IngSimple. Definición de scope, arquitectura sobre Astro y configuración multilenguaje en los primeros días.

  2. Abr – May 2024

    Desarrollo

    ≈4 semanas de build: páginas institucionales, sección de noticias con content collections, formulario de contacto vía Cloudflare Worker, multilenguaje y optimización de imágenes.

  3. Mayo 2024

    Lanzamiento a producción

    Deploy en Cloudflare Pages, publicación en bzconsulting.cl y arranque del flujo de publicación semanal de noticias.

  4. Hoy

    2+ años de mantenimiento activo

    Más de 190 noticias publicadas, performance Core Web Vitals 100% en verde, sin un solo cambio de stack desde el lanzamiento original.

¿Tienes un proyecto similar?

Construyo sistemas a medida de extremo a extremo. Conversemos.