Hello world

Lo faccio, non lo faccio, lo faccio, non lo faccio?

Lo faccio!

E così è stato, dopo anni di continui rimandi (soprattutto per pigrizia) in cui mi dicevo:

“Sì un giorno lo farò”

“Nah, oggi non mi va”

“A che serve? Non ho molto di cui parlare”

“Ma chi verrà a leggere questo articolo che sto scrivendo?!”

mi son deciso non solo a rifare (o forse fare per davvero) il mio sito web, ma anche ad aprire un blog.

“A Gennaio dieta e palestra” (cit.)

Cosa ci scriverò ancora non lo so. O meglio lo so, voglio dire sono un front end developer appassionato di usabilità, interaction design, accessibilità, design engineering, design system e quindi mi piace ascoltare e parlare di questi temi, questa volta però voglio sforzarmi anche di scrivere qualcosa a riguardo.

Chiamiamolo se vogliamo, un esercizio per uscire dalla zona di comfort.

Un po’ come quando dopo le abbuffate natalizie, ti spaparanzi sul divano e dici “Dal mese prossimo mi metto a dieta e vado in palestra”. Tra l’altro siamo a ridosso del Natale e non manca molto per sentirlo dire da qualcuno puntualmente. Appena lo sento bevo uno shot 🥃.

E quindi eccomi qua, mentre scrivo questo post mi dico “Sarà il primo e ultimo post che scrivi”, forse sarà così, ma voglio pensare che non lo sia. “Sbaglierò? Amen” (cit.)

Non solo cose da nerd

Come già detto, gli argomenti principali che voglio trattare sono su HTML, CSS, usabilità, accessibilità, design system, interaction design ecc. ma mi piacerebbe anche usare questo spazio come raccoglitore di pensieri, esperienze, racconti di viaggio e…insomma miscellanee. Cose da “Caro diario” ecco.

Come ho realizzato questo sito

Ti racconto brevemente di come ho messo a terrà questo sitarello.

Design

Nel mio lavoro come front end developer ho sempre utilizzato Figma in modalità di lettura per analizzare l’handoff dei designer al fine di trasformare in codice

• gli elementi di styleguide come tipografia, colori, spaziature, elevations, griglie ecc. (design tokens)
• i componenti UI e
• i template.

Adesso invece, per necessità e anche per esercizio ho realizzato un file Figma in cui creare esattamente le 3 cose sopracitate.

Ho provato fare le cose per bene finché è iniziato lo sclero con Auto Layout.

Come famiglia tipografica ho scelto il font Figtree (Google Fonts), mentre la palette cromatica è sostanzialmente composta da 3 colori

• #EEE2DA come colore principale di sfondo (io lo chiamo sabbia, ma ho sentito anche chiamarlo salmone 🤷‍♂️)
• un banalissimo bianco #FFF
• e un nero pieno #000.

Front end

Il sito è sviluppato con l’approccio Jamstack utilizzando

• Eleventy per il front end
• Netlify per il deploy
• Netlify CMS per la gestione dei contenuti.

Ho anche usato Utopia come strumento per un design fluido e responsive non basato su media queries CSS. L’ho usato principalmente per tipografia e spacing responsive. Molto interessante e pratico, lo consiglio e credo lo userò anche su altri progetti.

Per il resto ho usato Vanilla CSS e Vanilla JS.

Tracciamenti

Non traccio niente.

Ok finisco

Se sei ancora qui e non hai abbandonato dopo tutto questo pippone, ti ringrazio e ti voglio bene. Ti devo un birra, sperando di non doverne pagare troppe 🥲.

A presto!