Minimalist Portfolio Template
Template $49 USD

Minimalist Portfolio Template

Template de portfolio profesional y listo para producción con Astro 6, Tailwind CSS y Cloudflare Pages. Lighthouse 95–100, WCAG 2.2 AA, i18n ES/EN y configuración centralizada en un solo archivo.

Construido con

Astro 6Tailwind CSSTypeScriptCloudflare PagesFontsource

¿Qué incluye?

  • Lighthouse 95–100 en todas las categorías (Performance, A11y, SEO, Best Practices)
  • ThemePicker Pro con +12 paletas premium, modo oscuro/claro adaptativo
  • View Transitions cinematográficas y animaciones reveal con Intersection Observer
  • Sistema i18n completo — ES/EN con diccionario en src/i18n.ts, 100% de la UI traducida
  • Content Collections para proyectos, blog, servicios, testimonios y FAQs
  • SEO avanzado: JSON-LD (FAQPage, Service), Open Graph, Twitter Cards, sitemap automático
  • GEO optimizado con llms.txt para motores de búsqueda con IA (ChatGPT, Claude, Perplexity)
  • Paginación de contenido (/projects/page/[page], /blog/page/[page]) configurable
  • Formulario de contacto con backend real (Formspree / Cloudflare Forms), honeypot anti-spam
  • Configuración centralizada en un solo archivo (src/site-config.ts)
  • Headers de seguridad Cloudflare nativos: HSTS, CSP, X-Frame-Options, Permissions-Policy
  • WCAG 2.2 AA compliant con soporte prefers-reduced-motion
  • PWA-ready con manifest, iconos y soporte offline
  • First Contentful Paint < 0.8s en el edge de Cloudflare

Capturas de pantalla

Descripción completa

El Minimalist Portfolio Template es una solución de portfolio profesional y lista para producción que combina rendimiento extremo, diseño limpio y configuración simplificada. Construido con Astro 6, Tailwind CSS y desplegado en el edge de Cloudflare Pages, alcanza Lighthouse 95–100 en todas las categorías con un First Contentful Paint menor a 0.8 segundos.

¿Para quién es este template?

Perfecto para desarrolladores, diseñadores, freelancers y agencias digitales que necesitan un portfolio de alto impacto. También funciona como base para proyectos de clientes que requieren blog, servicios y proyectos en una sola plataforma bien organizada.

Rendimiento y métricas

  • Lighthouse Performance: 95–100 en todas las categorías
  • First Contentful Paint < 0.8s en el edge de Cloudflare
  • Total JS (homepage) < 15 KB gzipped — ~40% más liviano que equivalentes React/Next.js
  • WCAG 2.2 AA compliant con soporte prefers-reduced-motion

Configuración centralizada

Todo el branding, SEO, navegación e integraciones se controlan desde un único archivo:

src/site-config.ts

Nombre, email, redes sociales, colores de marca, idioma, opciones de tema, items por página, endpoint del formulario de contacto, y más — sin tocar ningún componente.

Sistema de temas adaptativo

  • ThemePicker Pro — interfaz flotante con +12 paletas premium para personalización en tiempo real
  • Dual-mode — colores de marca diferentes para modo claro y oscuro via HSL en site-config.ts
  • Zero FOUC — script bloqueante inline inyecta variables CSS antes del primer paint
  • Botones Copy y Reset en el picker para extraer configuración exacta de HSL
  • Production gate — el picker solo aparece en DEV o cuando showThemeStudio: true

Internacionalización (i18n)

Sistema de traducciones completo con cobertura del 100% de la UI visible:

  • Diccionarios ES/EN/PL en src/i18n.ts con helper t()
  • 100+ claves de traducción cubriendo todos los componentes, páginas y strings dinámicos
  • Idioma controlado por site.lang en site-config.ts — sin configuración extra
  • Fechas localizadas via siteConfig.site.locale

Content Collections

  • projects — casos de estudio con soporte de imagen 16:9 y View Transitions
  • blog — artículos con paginación, autor con avatar y tiempo de lectura
  • services — páginas de servicio con sidebar y CTA estratégico
  • testimonials — testimonios de clientes en formato JSON
  • faq — preguntas frecuentes con JSON-LD FAQPage automático

SEO & GEO avanzado

  • JSON-LDOrganization, WebSite con SearchAction, FAQPage, Service, BlogPosting
  • Sitemap automático via @astrojs/sitemap
  • llms.txt — manifiesto para rastreadores LLM con rutas, schemas y tech stack
  • robots.txt dinámico con directivas allow para GPTBot, CCBot, Google-Extended, anthropic-ai
  • Open Graph y Twitter Cards dinámicos por página
  • Canonical URLs via Astro.url.canonical — sin query params

Infraestructura de seguridad

  • _headers de Cloudflare Pages — HSTS, CSP, X-Frame-Options, Permissions-Policy
  • security.txt en .well-known/ para reporte de vulnerabilidades
  • Honeypot anti-spam en el formulario de contacto
  • Fallbacks CSS para todas las variables de color — UI funcional sin JS

Tech Stack

  • Astro 6 con View Transitions e Islands Architecture
  • Tailwind CSS 3.x — utility-first styling
  • TypeScript con exactOptionalPropertyTypes
  • Cloudflare Pages — SSG por defecto, SSR-capable con swap de adapter
  • Fontsource — fuentes variables self-hosted, sin Google Fonts (privacidad + velocidad)
  • @astrojs/sitemap, astro-icon, @iconify-json/ph
  • @vite-pwa/astro — PWA con soporte offline