A differenza di tutti gli altri post del sito, questa pagina verrà continuamente aggiornata, per tenere traccia di tutte le migliorie che di volta in volta andrò ad apportare. So che a livello è una specie di suicidio premeditato, ma poco mi importa. L'idea di avere una timeline unica, dedicata interamente alla parte sviluppo sito mi gusta e mi piace. Trattandosi di una timeline a scorrimento verticale (almeno in questa fase) gli aggiornamenti più recenti saranno pubblicato in alto (ad esclusione dell'antefatto). Ogni singolo aggiornamento avrà data di messa live delle modifiche fatte. Magari nel mentre mi viene qualche idea carina per organizzare il tutto per topic.
Il sito, oltre ad essere estremamente personale e personalizzato, ha 3 requisiti chiave:
Ho sempre avuto in testa l'ìdea di avere un sito personale dove poter scrivere liberamente delle mie passioni e di tutto quello che mi passa per la testa; una sorta di rivisitazione digitale di un diario di bordo. Un luogo virtuale tutto mio che mi rappresenti sia nella forma (colori, UX&UI, chicche) che nella sostanza (argomenti trattati, tono di voce, topic e via discorrendo). L' idea di sviluppare il tutto partendo da un foglio bianco e di evitare l'utilizzo del solito Wordpress mi è venuta durante il lockdown. Non volevo più avere a che fare con mille plugin e mille limitazioni, per cui ho approfittato delle lunghe nottate (non sono mai riuscito ad andare a letto presto) per provarci. Era il 28 febbraio 2020, il giorno in cui venne annunciata, almeno per la Lombardia, l'inizio della zona rossa e di conseguenza la chiusura di tutto.
Ho deciso di lasciare così la parte tecnica, al netto di qualche lieve miglioramento a livello codice per questioni di velocità caricamento e rendering delle pagine. Ho in cantiera la sezione Podcast, di prossima pubblicazione, che sarà probabilmente con un layout diverso (e quindi css diverso e separato). Ho finito lo sviluppo della BIO (anche questa con css separato) e pubblicato gli ultimi articoli. Ne ho alcuni però molti interessanti in bozze, che spero di riuscire a pubblicare quanto prima. Per il momento vi lascio con il Wrapped 2022 scritto da me e illustrato da DALL-E. Buon anno e buon 2023.
I primi mesi del 2022 sono partiti sotto una buona stella. Ho implementato diverse modifiche, snellito di parecchio il codice e riscritto buona parte della sezione about e degli articoli. Ho inoltre sviluppato un nuovo menù, decisamente più comodo e funzionale e aggiunto diverse chicche. Ho deciso di sviluppare anche questa timeline, per avere traccia di tutti i cambiamenti fatti e delle diverse evoluzioni, così da avere sempre disponibile tutto lo storico. Ho deciso di rimuovere defitivamente tutti i tracciamenti e di rendere il sito ancora più fluido e veloce. Ho finalmente deciso le tematiche e organizzato di conseguenza tutti gli articoli del blog e creato una nuova struttura a cartelle, che rende più facile e snella sia fase di upload sia la gestione complessiva dei file. Ho ridotto drasticamente il numero di foto presenti e sto sviluppando una nuova gallery. Ho anche in mente di inserire la possibilità di ascoltare gli articoli, ma prima di pubblicare il tutto, devo ancora studiare un paio di cosette. Ho ripreso dei vecchi articoli, tutti terminati e messo live la nuova versione. Ci sono ancora tante ottimizzazioni da fare, ma al momento credo di aver ottenuto un buon compromesso, ed ho seriamente voglia di concentrarmi sulla scrittura. Il codice al momento può aspettare. Aggiunto nuovo logo nell'header, creata la progressive WebApp e sistemate altre piccole cosette a livello visivo.
Il 2021 era partito nel migliore dei modi, specialmente a livello di scrittura. Tanti articoli scritti in bozze, tante idee ma poi alla fine, per un motivo o per un altro, i contenuti pubblicati sono stati pochi. Ho dedicato buona parte del 2021 a studiare e migliorare alcune miei conoscenze legate al mondo della sicurezza e dell'educazione digitale. Ho letto tanto e così il tempo da dedicare al blog è andato via via scemando. Mi sono anche incagliato o per meglio dire incaponito a ridisegnare in mille modi la sezione blog e la sezione articoli, ho perso davvero tanto tempo a cercare di capire come implementare una dark mode che mi soddisfacesse completamente, salvo poi abbandonare l'idea e tornare al layout classico. In sostanza, non un buon anno, anche se mi ha lasciato in eredità maggiore conoscenza a livello coding, maggiore conoscenza a livello sicurezza e diversi nuovi gadget hardware in dotazione. E ovviamente tantissime idee da approfondire.
Sono passati 7 mesi circa, da quanto ho messo online il sito. All'inizio devo ammettere che ho trovato un buon bilanciamento a livello di pubblicazione articoli, ma poi sono tornato nuovamente in fase sviluppo. Ho iniziato a sperimentare gallery e nuovi metodi per snellire e ottimizzare il codice. Sto testando diverse soluzioni e nel mentre sto anche cercando di definire bene quali argomenti trattare e come organizzare tutti i topic. Ho anche deciso di rimuovere completamente qualsiasi tracciamento o altro, ma continuare a lavorare per migliorare l'indicizzazione di alcuni contenuti e alcune sezioni e ovviamente riprendere a scrivere in maniera più continua e più fruttifera. Non a livello di risultati, ma a livello di soddisfazione personale.
Dopo aver finito le ultime ottimizzazioni, ho configurato l'hosting, creato e installato il certificato SSL e infine iniziato l'upload di tutto via Filezilla. Ovviamente, trattandosi di pochi file, l'operazione è durata in tutto meno di un minuto. Finalmente il sito è live, in tutto il suo splendore, almeno per me. Non appena messo live, ho giusto verificato che tracciamenti, url e struttura del sito funzionassero correttamente. Ho poi impostato, all'interno di Bracket, l'upload automatico delle modifiche, così da avere tutto sincronizzato tra locale e online ed evitare diversi upload. Ho al tempo stesso impostato i vari backup, così da avere sempre una copia di sicurezza. Il sito sembra abbastanza veloce e reattivo anche nella versione live, foto e gallery funzionano in maniera abbastanza fluida. Ho rifatto i test con Google Page Speed Index per riverficare le perfomance e ottimizzato alcuni pezzi di codice, onde evitare un carico eccesso lato server. Ho anche pubblicato i primi articoli, ovviamente dedicati a mia figlia (giusto in tempo direi). Finalmente la struttura è live, ora non resta che continuare a scrivere e riuscire a trovare una buona costanza nella pubblicazione. A livello tecnico, ci sono già dei cambiamenti, anche a livello di struttura cartelle e funzionamento da molbile (menù a discesa) che voglio ulteriormente ottimizzare e cambiare, ma prima devo capire bene che strada prendere. Il deploy è andata tutto abbastanza liscio, ho dovuto solo modifcare, rispetto ai test fatti e sulla base dei risultati ottenuti su Search Console, la dimensione del testo da mobile e il resize complessivo del container (effettivamente troppo piccolo). Ma avevo comunque messo in conto alcune modifiche post go live. Ben fatto.
Per andare live, dopo diverse serate passate a ipotizzare articoli e argomenti, ho deciso al momento di pubblicare le prime 4 pagine: home, about e 2 articoli. In questo dopo riesco a concentrarmi maggiormente sui test e sulle ottimizzazioni da fare (immagini, codice, velocità complessiva) e nel frattempo continuare a studiare su come sviluppare la gallery. Per la gestione delle immagini e velocizzare il loro caricamente ho notato che è da circa qualche settimana, che tutti i pricinpali browser supportano il nuovo formato WEB, che consente di avere la stessa resa cromatica/visiva di un file PNG (senza quindi perdere dettaglio come accade con i file JPG) in file che pesano circa il 60% in meno. Ho quindi deciso di convertire tutte le immagini in questo nuovo formato. I test effettuati sembrano essere promettenti, sia per quanto riguarda la velocità di caricamento che l'esperienza complessiva offerta. Piacevole il font, sia da desktop che da mobile e comodo anche il menù posizionato in alto a destra (sto però valutando di spostarlo in basso, per renderlo più facilmente accessibile e a portata di pollice). Ho iniziato nel mentre a costruire la sitemap e a configurare google search console, google tag manager e google analytics. Sono però scettico al momento, se lasciarli anche nella versione live, vorrei evitare il cookie banner e la privacy policy, senza considera che al momento non ho nessuna intenzione di analizzare il traffico o altro (non è questo lo scopo del sito). Ci sono ancora dei pezzi di codice che vorrei snellire e rendere più semplici, lato css e javascript invece, al momento, sto facendo fare tutto al plugin minify, per creare file snelli e leggeri. Sto comunque seriamente pensando di creare un file css ad hoc per la gestione della sezione blog/articoli, in considerazione del fatto che tanti effetti presenti in home non sono poi replicati in altre parti del sito. Mi piace la intro della home, quegli effetti unitamente al testo scorrevole mi piacciono da matti e lo ammetto, hanno reso decisamente molto più semplice la intro stessa.
Veder prendere forma il sito, riga dopo riga, div dopo div è stata la cosa più spassosa di tutto il progetto. Ogni sera, dopo cena, riuscivo a dedicarmi ad un pezzo. La gestione delle immagini e i vari resize, il menù e il footer e tutta l'organizzazione della home con i diversi effetti. Alcuni pezzi, lo ammetto, li ho trovati online e hanno snellito non poco il lavoro, anche se riuscire poi a plasmarli interamente per le mie esigenze, devo ammetterlo, ha richiesto più tempo del previsto. Index chiuso interamente, con tutti i placeholder, in attesa di sviluppare le immagini e comporre le varie sezioni. Sfruttandp il magnifico spazio offerto dal mio monitor UltraWide, ne avevo parlato qui, riesco a lavorare con finestre affiancate di modo da andare ad integrare il css con tutto quello che mi serve sia a livello di classi che a livello di layout e colori. Lato colori, dopo diverse prove, ho deciso di tenere un classico approccio black&white con qualche tocco di rosso, in attesa di riuscire ad integrare un toggle dedicato alla dark mode (ci ho provato, ma i primi risultati sono stati pessimi. Parallelamente ho inziato a buttare giù la prima versione delle pagine per gli articoli e una prima ipotesi di slider e gallery per le foto e iniziato ragionare su come organizzare la pagina About. Ho in mente alcune idee, tipo slider per le competenze e una visualizzazione verticale del mio percorso lavorativo, ma devo ancora studiare bene alcuni aspetti che limitano la mia capacità di tradurre in codice quello che ho in testa.
I primi giorni sono stati interamente dedicati alla configurazione del macbook pro e alla ricerca di ispirazione su design e tendenze a livello di layout e users experience. Nella prima stesura il sito aveva solamente 2 pagine (index e about.me); la creazione delle altre sezioni è avvenuta nel mentre. Ho ovviamente dovuto rispolvere un po' tutte le mie conoscenze in ambito programmazione e devo essere onesto, la quantità di risorse trovate online è stato davvero impressionante. Così come il numero di persone (su Reddit e simili) sempre pronte ad aiutarmi a superare i diversi problemi che strada facendo incontravo nel tradurre in codice quello che avevo in testa. Stesso discorso vale per la mole di codice disponibile gratuitamente online (penso ad esempio al contact form o alla gallery oppure a header e footer). Questo a testimonianza di come internet e tutti i suoi figli, se ben usati, possono essere una fonte inesauribile di informazioni e formazione. Il rischio però è quello di perdere il focus principale e di perdersi in una marea di contenuti che ci fanno cambiare idea ogni 5 minuti. Di fatto alla fine della prima settimana ho dovuto porre un freno alla ricerca di idee per cominciare a lavorare bene sulla mia e focalizzarmi solo su quello di cui necessitavo per tramutarla in righe di codice.