Colophon
Come è fatto questo sito, perché è fatto così, e cosa produce. Un resoconto onesto di metodo, strumenti e risultati.
Metriche
PageSpeed Insights, rilevato il 23 maggio 2026.
Ricerca e analisi
Ogni progetto inizia prima degli strumenti (Figma, in questo caso). L'analisi del contesto, la definizione del posizionamento, la scelta del tono: decisioni che non si recuperano a valle. Questo è un sito personale — il perimetro è piccolo — ma l'approccio e il metodo restano invariati a prescindere dalla grandezza del progetto. Il punto di partenza è sempre il manifesto: cosa deve comunicare, a chi, con quale registro.
Design system atomico
Il sistema visivo è costruito dal basso: token prima, componenti dopo. In Figma, una collection di variabili native organizzate per gruppo — colore, tipografia, spaziatura, border — ciascuna definita in modalità light e dark. L'approccio atomico garantisce coerenza senza rigidità: cambiare un token si propaga ovunque, senza eccezioni.
Accessibilità e normative
WCAG 2.1, EAA, A11y non sono checklist finali — sono vincoli progettuali che entrano nel processo dall'inizio. Il contrasto dei colori è calcolato in fase di definizione dei token, non verificato a posteriori. Il risultato è un punteggio Lighthouse di 100 in accessibilità — non per ottimizzazione, ma per costruzione.
Dal design al codice
La traduzione da Figma al foglio di stile è diretta e deliberata: ogni variabile diventa una CSS custom property con lo stesso nome e la stessa struttura gerarchica. color/text/tertiary in Figma è --color-text-tertiary nel foglio di stile. Nessuna perdita di informazione, nessun livello di astrazione intermedio. Il design system non è un documento di specifiche — è il codice stesso.
La dark mode è gestita con prefers-color-scheme: i token cambiano valore, i componenti non cambiano struttura. È la separazione corretta tra forma e contenuto applicata al colore.
Claude supporta la fase implementativa — scrittura del codice, revisione delle scelte tecniche, produzione dei contenuti — senza sostituire il giudizio progettuale.
Stack e deploy
HTML statico, CSS vanilla, JavaScript minimo. Nessun bundler, nessun framework, nessun processo di build. Il file che vedi nel browser è il file che esiste sul server.
I font — Geist per i titoli e gli elementi display, Source Serif 4 per il corpo, GT Flexa Mono per le credenziali e gli elementi documentari — sono self-hosted. Zero dipendenze da Google Fonts o da qualsiasi CDN di terze parti. Il sistema tipografico è una scelta progettuale, non una convenienza: tre famiglie con ruoli distinti, ciascuna al posto giusto.
L'unico JavaScript presente è il typewriter sulle credenziali nell'header — una ventina di righe, nessuna libreria. Tutto il resto è CSS: layout, animazioni, transizioni, dark mode.
Il deploy avviene oggi via FTP su Serverplan, con Cloudflare come CDN e DNS. La migrazione prevista è verso Astro 5 — framework statico-first con islands architecture — con versionamento su GitHub e deploy su Cloudflare Pages. La struttura dei file è già progettata per quella transizione: gli URL resteranno invariati.
Perché così
Un sito personale non ha bisogno di essere un'applicazione. Ha bisogno di essere veloce, leggibile, accessibile — e di durare. La complessità tecnica non aggiunge valore a un testo ben scritto. La toglie.
C'è una contraddizione diffusa nel design contemporaneo: si parla di accessibilità come valore e si costruiscono interfacce che richiedono megabyte di JavaScript per mostrare del testo. Questo sito è un tentativo di coerenza. Non un manifesto — una scelta operativa.
Il risultato è misurabile: FCP a 0.7 secondi su desktop, TBT a zero millisecondi su mobile. Non perché si sia ottimizzato — perché non si è aggiunto nulla che richiedesse ottimizzazione.