← volver_a_proyectos

$ cat ~/projects/pilu-garcia.md

Pilu García

Web porfolio para una fotógrafa profesional, con galerías autogestionables desde Strapi y una estética inspirada en las tiendas de moda.

may 2025

  • Astro
  • Strapi
  • Umami
  • Cloudflare CDN

Un regalo

Pilu García es la web porfolio de una fotógrafa profesional. El proyecto fue un regalo que quise hacerle para ayudarla con su carrera, así que id a echarle un ojo: es muy buena. Además, salgo yo en una de las colecciones :P

Desde el principio, la idea era que ella misma pudiera modificar la web a medida que fuera haciendo sesiones y quisiera enseñarlas al mundo, sin depender de nadie.

Tecnología

La web está hecha con Astro en modo standalone y usa Strapi como CMS headless. Desde Strapi se configura toda la web: las fotos de la home, el texto y la foto de la página “sobre mí” y, por supuesto, las colecciones de fotografías.

Diseño: moda y fotografía

Antes de diseñar, investigué las webs de otros fotógrafos para ver si había alguna tendencia a la hora de mostrar su trabajo o algo común que tuviera que tener en cuenta. Para mi sorpresa, los fotógrafos más conocidos tienen webs de contacto, con muy pocas fotos y nada que mostrara sus sesiones.

Como no encontré ningún referente claro, decidí tirar por mi propia vía. El diseño está basado en las tiendas de ropa como Zara y en estéticas similares como la de Zara Home. A ella le apasiona la moda, así que me pareció bonito unir esa estética con su vocación: la fotografía.

Galerías autogestionables

El foco de la funcionalidad estuvo en que pudiera publicar sus galerías de forma autónoma. Para ello, programé en Strapi todo lo necesario:

  • Galerías: creación y publicación de colecciones de fotos.
  • Compresión automática: las fotos se comprimen para la web al subirlas, para no afectar al rendimiento.
  • Modos de visualización: distintas formas de presentar las fotos de cada galería, para darle un toque más a lo que quiere transmitir.
  • Punto focal: elección del focal point de cada imagen, para que el encuadre sea el correcto en cualquier tamaño.
  • Vídeos: aunque sea una web de fotografía, también se pueden publicar vídeos. Se pueden ver en la colección Un verano más sano.

SEO

Además de cuidar la visualización de las galerías, quise profundizar en el SEO, y esa fue una de las razones para elegir Astro. Aun funcionando en modo standalone, el HTML se genera en el servidor, de modo que los rastreadores pueden indexarlo sin problemas.

El SEO está presente en toda la web: cuando se publica una galería nueva, sus metadatos se generan automáticamente gracias a Astro y a la lógica que programé para ello.

Rendimiento

Aunque los archivos multimedia ya se comprimen al subirlos, toda la web pasa por Cloudflare para aprovechar su CDN y servir el contenido lo más rápido posible.

Analítica

Para conocer el tráfico de la web uso Umami, una alternativa a Google Analytics que cumple con la normativa europea. Está configurado en modo no intrusivo, así que no hace falta mostrar avisos al visitante. Además, si el navegador del usuario indica que no quiere ser rastreado, Umami no se activa.

Gracias a ello, puede saber qué colecciones llaman más la atención, desde dónde la visitan, etc. Y lo que más me gusta a mí: es self-hosted! :D

Echadle un ojo

Pasaos por pilugarcia.com, y si necesitáis una sesión de fotos profesional, ya sabéis con quién contactar!

*click* [◉¯]