Desarrollo web

Cómo crear un portfolio web rápido para un estudio de arquitectura

Imágenes pesadas, galerías infinitas y proyectos sin contexto: por qué los portfolios de arquitectura cargan lento y cómo montarlos para que no pase.

Respuesta directa

Los portfolios de arquitectura son de las webs más lentas que existen, y no por mala suerte: se construyen con imágenes enormes que nadie ha adaptado. El problema casi nunca es la tecnología elegida, sino cuántos megabytes se envían al navegador antes de que se vea nada.

De dónde viene el peso

Un estudio trabaja con renders y fotografía profesional en máxima calidad. Es lo correcto para imprimir o para presentar en una reunión. Es un desastre servirlo tal cual en una web.

La secuencia habitual: se sube el archivo original, la plantilla lo muestra a pantalla completa y la portada acaba pesando quince o veinte megabytes. En una oficina con fibra parece que va bien. En el móvil de un cliente potencial, no carga.

Qué hay que hacer con las imágenes

Tres cosas, y las tres se pueden automatizar:

  1. Generar varios tamaños de cada imagen y dejar que el navegador elija según la pantalla. Nadie necesita 3.000 píxeles de ancho en un móvil.
  2. Servir formatos modernos como AVIF o WebP, con una versión de reserva. La diferencia de peso frente a un JPEG es grande y no se nota en calidad.
  3. Declarar ancho y alto en el HTML. Sin eso, la página da saltos mientras carga y la experiencia es desagradable además de penalizar en las métricas de Google.

Si el sistema que usas no hace esto solo, lo estás haciendo a mano o no lo estás haciendo. En una web construida con Astro estas tres cosas ocurren en la compilación, sin intervención.

Carga diferida, pero con cabeza

Las imágenes que no se ven al entrar deben cargarse cuando se acercan a la pantalla. Las que sí se ven, no: si difieres la imagen principal, retrasas justo lo que el visitante espera.

Es un error frecuente en plantillas que aplican carga diferida a todo por defecto.

Las fichas de proyecto son lo que posiciona

Una galería sin texto es invisible para un buscador y poco útil para un cliente. Cada proyecto debería tener su página con:

  • Qué encargo era y quién lo hacía.
  • Dónde y de qué superficie o escala.
  • Qué problema había que resolver.
  • Qué decisiones se tomaron y por qué.
  • En qué año y en qué fase está.

Ese texto es lo que hace que el proyecto aparezca en búsquedas y lo que convence a alguien de que entendéis su tipo de encargo. Las imágenes acompañan al argumento, no lo sustituyen.

Selección, no archivo

Publicar toda la obra construida desde 2009 no ayuda. Un portfolio es una declaración de qué queréis hacer a partir de ahora.

Si buscáis vivienda unifamiliar, que la vivienda unifamiliar domine. Si queréis dejar de hacer reformas pequeñas, no las pongáis en primer plano por mucho que os hayan dado de comer. La web filtra el tipo de encargo que llega.

Astro o WordPress

Depende de una sola cosa: con qué frecuencia vais a publicar y quién lo va a hacer.

Si añadís obra cada pocos meses y no os importa editar archivos de texto, Astro genera HTML estático, procesa las imágenes en la compilación y la web queda muy rápida con poco mantenimiento. Si hay varias personas subiendo proyectos a menudo, el panel de WordPress compensa aunque haya que mantenerlo.

Lo he desarrollado con más detalle en Astro o WordPress para una web corporativa. En un portfolio el criterio es el mismo, solo que el peso de las imágenes inclina un poco más la balanza hacia lo estático.

Antes de rehacer nada, medir

Si ya tenéis portfolio y va lento, la primera pregunta no es qué tecnología usar sino qué está pesando. Muchas veces basta con reprocesar las imágenes y quitar un par de complementos para ganar segundos, sin rehacer la web.

Es lo que hago en una optimización de velocidad: medir, arreglar lo que de verdad pesa y volver a medir con los mismos criterios.

Siguiente paso

Puedes ver cómo planteo estos proyectos en webs para arquitectura, inmobiliaria y construcción, o contarme el vuestro en el estudio de proyecto.

Preguntas frecuentes

¿Cuántos proyectos debo publicar?

Menos de los que tienes. Ocho o diez proyectos bien contados funcionan mejor que cuarenta con tres fotos cada uno. El portfolio no es un archivo histórico: es una selección que argumenta qué tipo de encargo buscas.

¿Astro o WordPress para un portfolio?

Si publicas proyectos cada pocos meses y no te importa editar archivos, Astro rinde mejor y cuesta menos mantener. Si vas a subir obra con frecuencia o hay varias personas actualizando, compensa el panel de WordPress aunque exija mantenimiento.

¿Y si mis imágenes vienen del render en alta resolución?

Ese es justo el origen del problema. Un render de 8 MB no debe llegar al navegador tal cual: hay que generar versiones adaptadas a cada tamaño de pantalla durante la compilación. El original se conserva, pero no se sirve.

¿Es mala idea un scroll infinito de imágenes?

Suele serlo. Obliga a cargar mucho antes de que el visitante entienda qué hace el estudio, y complica que Google indexe los proyectos como páginas propias. Una rejilla con fichas individuales rinde mejor en ambos sentidos.