Landing page

come ho creato la mia



Intro

Buonsalve, oggi ho un progettino da presentarvi: la mia nuova landing page!

Cos’è una landing page?

Una landing page, o “pagina d’arrivo” è una pagina web che serve come “cancello” o meglio, come “guida” di un sito web.

Visto che CuSO’s Place non ne aveva una, ho deciso di sfruttare le 32454354 ore di treno degli ultimi giorni per crearla.

Ammetto sia stato più complesso del previsto, non tanto per il puro codice html, quanto per codice css, per i meno avvezzi “lo stile grafico della pagina”. Una tortura vera e propria, cerca i colori, prova 324234 dimensioni dei pulsanti, scegli la disposizione degli stessi, aggiungi icone per non riempire troppo di pulsanti inutili ed infine le animazioni

Eh già, ho messo anche quelle… Non vi dico la sofferenza.

Impariamo i keyframes

Ho deciso, in maniera assai masochista, di imparare il funzionamento dei @keyframes in css, regola che serve a “muovere” gli elementi della pagina web.

Di per sè non è nulla di complicatissimo, basta dare i parametri giusti agli elementi corretti e tutto danzerà splendidamente nel vostro browser….

Peccato che sia difficile trovare i parametri giusti e gli elementi a cui assegnarli. sopratutto quando si vuol far eseguire pià di un’animazione allo stesso elemento.

Vi lascio immaginare cos’abbiano potuto ascoltare gli altri passeggeri del treno quando le icone non facevano l’effetto popup quando clickate…

Tra una vicissitudine e l’altra

Imprevisti ed errori banali a parte, la pagina è finalmente completata!

Ora tutti potrete visitarla e vedere quali animazioni carine ho inserito :)

Per favore, fatelo, ho bisogno di supporto emotivo…

Sì, belli i bottoni che si muovono, ma a che scopo?

Tutto molto semplice: mi serve per i social network.

Nei vari video che posto su instagram affermo che l’articolo sia nel “link in bio”, cosa vera in quanto il link porta all’home page del sito, in cui il primo articolo è presente tra i rettangoloni.

Però la vista “mobile” della homepage non mostra istantaneamente i rettangoloni, bensì il messaggio di benvenuto e la foto del mio avatar, il che non è il massimo quando qulcuno sta cercando di raggiungere la sezione degli articoli. (che vi ricordo sia posizionata immediatamente dopo)

Pertanto, in questa “landing page” ho inserito un bottone apposito che riporta all’ultimo articolo, così da sistemare questo piccolo “deficit funzionale”.

Ok ma sta pagina?

Ora sarete sicuramente curiosi di vedere il mio lavoro, beh…

Ecco a voi: Landing Page