Ignasi Capella · Desarrollador front-end

Proyectos

Dos webs publicadas. Las dos se pueden abrir, medir y auditar.

Concepto

Velàlia

Restaurante de alta cocina · Tres idiomas

La web de un restaurante de este nivel falla casi siempre por lo mismo: la carta es un PDF que no se lee en el móvil, los alérgenos no están escritos, la reserva la lleva un widget de otra empresa que tarda en aparecer y trae cookies, y todo está en un solo idioma en una costa donde media mesa no habla castellano.

53 KB: la portada, en 4 peticiones y sin una sola imagen
0: incumplimientos de axe-core en 6 páginas × 5 entornos
3: idiomas con las rutas traducidas, no prefijadas

Ver la ficha — Velàlia Abrir Velàlia (se abre en una pestaña nueva)

Proyecto propio En producción

DoesItLast

Guía de conservación de alimentos · Inglés y castellano

Saber si algo que lleva días en la nevera aún se puede comer termina en foros que se contradicen. La información fiable es pública —FDA y USDA— pero vive en documentos que nadie abre con la nevera delante.

166: alimentos publicados en inglés y castellano
369: URLs estáticas e indexables en el sitemap
0: cuentas, cookies y peticiones a terceros

Ver la ficha — DoesItLast Abrir DoesItLast (se abre en una pestaña nueva)

Cómo trabajo

Cuatro afirmaciones y, al lado de cada una, el número que la sostiene. Sin número no habría fila.

01
Accesibilidad

No es una casilla que se marca al final. axe-core pasa por todas las páginas en cuatro entornos —móvil y escritorio, con movimiento normal y reducido—, y las páginas salen del sitemap compilado, así que se audita lo que se publica y no una lista que alguien se acuerde de actualizar.

Medido Velàlia: 0 incumplimientos en 6 páginas × 5 entornos. Esta web: 0 en 7 × 4.
02
Rendimiento

El presupuesto se decide antes de escribir, no se optimiza después. Sin framework en el navegador, sin librería de animación y sin una sola petición a un tercero. Lo que no se manda no hay que optimizarlo.

Medido Esta web: 6 peticiones y 59 KB sin comprimir, LCP 1,3 s en móvil, CLS 0. Velàlia: 53 KB sin una imagen.
03
Internacionalización

Rutas traducidas, no prefijadas: en inglés esta ficha vive en /en/projects/velalia, no en /en/proyectos/velalia. De una sola tabla salen el selector de idioma, las hreflang recíprocas y el sitemap, así que no pueden descuadrarse entre ellos.

Medido Velàlia en tres idiomas con 13 páginas. DoesItLast en dos, con 166 fichas en cada uno.
04
SEO técnico

Una página estática e indexable por cada cosa que alguien puede buscar, con su canónica, sus datos estructurados y su entrada en el sitemap. Lo que la gente escribe en un buscador es una pregunta concreta, y tiene que aterrizar en la respuesta, no en un buscador vacío.

Medido DoesItLast: 369 URLs en el sitemap, una por alimento y por idioma.

Stack

Agrupado por para qué sirve cada cosa. Todo lo de esta lista está en un proyecto que se puede abrir: lo que no, no está.

Construir la interfaz

Astro
TypeScript
JavaScript
HTML semántico
CSS moderno

Que sirva a todo el mundo

Accesibilidad WCAG 2.2 AA
Rendimiento y Core Web Vitals
Internacionalización
PWA y sin conexión

Que se encuentre

SEO técnico
Datos estructurados
AVIF, WebP y srcset

Comprobar que es verdad

Playwright
axe-core
Lighthouse

Publicar

Cloudflare Pages
Cloudflare Functions
Git

Lo que no está en esta lista

React y Node: los estoy aprendiendo y no aparecen arriba porque todavía no tengo nada publicado con ellos. El próximo proyecto del portfolio será en React.

Sobre mí

Vengo del diseño multimedia. Grado en Multimedia por la UOC, terminado en febrero de 2025.

Por el camino dejé de querer entregar un diseño para que lo construyera otro. Entre un archivo de diseño y el navegador siempre se pierde lo mismo —el detalle—, y el detalle es el trabajo: el foco que no se ve, el texto que salta al cargar la fuente, el filtro que deja de funcionar cuando no llega un archivo. Esas cosas no se arreglan en una revisión; se evitan decidiéndolas mientras se construye.

Desde diciembre de 2021 trabajo en remoto para Mitek Systems verificando documentos de identidad: comprobar que un documento es auténtico, extraer sus datos y encontrar lo que no cuadra. No es desarrollo. Pero son cuatro años mirando despacio algo que casi está bien hasta dar con lo que falla, que es exactamente lo que se hace revisando una interfaz.

Formación: Grado en Multimedia
Universitat Oberta de Catalunya (UOC) · Febrero de 2025
Experiencia: Revisor manual de documentación
Mitek Systems · Remoto · 2021—
Idiomas: Castellano (Nativo) · Catalán (Nativo) · Inglés (B2 acreditado) · Alemán (A2)
Ubicación: Tarragona, España

Descargar CV

Contacto

Escríbeme y te contesto.