Perché dovresti conoscere il web design, oggi?!?

Forse il titolo di questo articolo può sembrarti banale, ma dal mio punto di vista non lo è affatto! Personalmente ritengo la conoscenza del web design un passo fondamentale nella vita di qualsiasi persona, anzi secondo me dovrebbe essere una materia che viene insegnata a scuola e non sono neanche l’unico a pensarlo.

L’ultima cosa che vorrei ottenere da questo articolo è quello di posizionarmi in una luce diversa dalla tua. In parte questo è uno sfogo personale, ma allo stesso tempo ho il desiderio che si trasformi in un inno alla condivisione.

Ebbene sì, condivisione!

Tutto quello che scriverò all’interno di questo articolo non deve essere visto come “Io sono più figo di te perché conosco queste cose”, tutt’altro!

I concetti che verranno esposti devono essere stimoli per una conversazione. Sono veramente curioso di conoscere il tuo punto di vista perché credo vivamente che da un confronto possiamo capire tutti meglio i motivi alla base di una scelta importante come quella di apprendere i fondamenti del web design.

Ma dato che una conversazione non può nascere senza basi, andiamo a elencare i motivi per i quali ti consiglio di conoscere il web design!

Partiamo da una definizione

La primissima cosa che dobbiamo fare in questo contesto è definire che cosa si intende per web design. Al contrario di quello che molti possono pensare, con questo termine non si indica una sola professionalità, ma ne troviamo diverse.

Fino agli anni ’90 un Web Designer era (traducendo letteralmente dall’inglese) la persona che disegnava (progettava) per il web; colui che grazie a programmi di grafica come Photoshop, Fireworks o altri dava colore alle pagine web man mano che queste conquistavano Internet.

Oggi con il termine web design non si intende più soltanto questo ma, come dicevo prima, un insieme di conoscenze diverse che molto spesso abbandonano l’uso esclusivo della grafica per incontrare i linguaggi di programmazione.

È vero che spesso si parte dai programmi di grafica, ma si arriva a conoscere linguaggi come HTML e CSS, due linguaggi che stanno alla base della creazione di pagine web e che vengono interpretati all’interno di qualsiasi dispositivo. Oltre a questo, con il passaggio di diversi anni e lo sviluppo di nuove tecnologie, è cresciuta la necessità di conoscere anche linguaggi di programmazione come JavaScript e PHP.

Ma questo è soltanto l’elenco della spesa perché le cose più interessanti del web design riguardano la sua evoluzione.

Siamo partiti con delle pagine composte da semplice testo. Sfondi bianchi con testi neri dove, di tanto in tanto, era presente qualche parola blu. Oggi invece le pagine web sono piene di colori, animazioni e funzionalità che fino a qualche anno fa non erano neanche immaginabili. Eppure oggi girano tranquillamente all’interno dei nostri browser.

Essere un web designer è veramente eccitante!

Posso capire che a molti mantenersi aggiornati può sembrare una perdita di tempo o un semplice spreco di energie, ma dal mio punto di vista Internet ci ha permesso di crescere a una velocità incredibile. Milioni di persone che quotidianamente scambiano opinioni, sviluppano assieme nuove funzionalità e creano nuovi trend per migliorare la fruizione del contenuto presente nelle pagine web. C’è veramente molto da conoscere se vogliamo essere i migliori.

Tu sai come si è sviluppato questo mondo? Continua a leggere per ottenere una risposta!

Proprio qualche giorno fa stavo ascoltanto un podcast in cui veniva espresso un concetto molto interessante. Alla rivoluzione industriale sono serviti 150 anni per essere distribuita completamente su tutto il pianeta, dall’avvento di Internet, sono bastati poco più di 20 anni per arrivare all’Internet of Things.

Tutto quello che apri con il browser è web design

Il primo punto per il quale ti consiglio di apprendere il web design è che qualsiasi cosa che apri con un browser, a parte i .pdf, è una pagina web realizzata con HTML e CSS. Non si scappa…

Se sei un po’ navigato probabilmente sei già pronto a venirmi contro dicendomi: “Andrea… E il Flash dove lo mettiamo?”

Beh il Flash è morto…

Non vorrei approfondire troppo questo argomento, non voglio lanciare un flame ma (andando per un attimo sul tecnico) quello che oggi puoi realizzare con JavaScript e CSS è molto più performante e accessibile di questa vecchia tecnologia. Per comprendere perché oggi è importante conoscere i linguaggi di programmazione dedicati al web basta pensare che tutti i device Apple non leggono Flash, capisci da solo la fetta di mercato che ti stai perdendo è molto grossa se continui a puntare su questa vecchia tecnologia.

Tornando a noi, come approfondiremo a breve, i browser sono ovunque!

C’è Google che con i suoi Chromebook ha creato un intero sistema operativo basato sulle tecnologie web, FirefoxOS e Windows Phone sono altri sistemi operativi sviluppati soltanto con HTML, CSS e JavaScript. Oltre a questi sul web sono stati sviluppati sistemi di pagamento, aste online, social network, video games e moltissimi innovativi sistemi che non sono altro che delle applicazioni eseguite all’interno di un browser.

Applicazioni mobile scritte con i linguaggi del web

Come ti ho anticipato poco fa, esistono già dei cellulari che sono dei browser portatili, tutto quello che viene eseguito al loro interno sono applicazioni realizzate sfruttando le tecnologie che quotidianamente costruiscono il web.

E questo non è affatto un caso!

Tra l’iPhone e i vari Android che si sono diffusi a macchia d’olio, siamo stati testimoni della lotta dei marketplace. Ciascun partecipante tirava l’acqua al proprio mulino e obbligava gli sviluppatori a usare sistema di sviluppo dedicato, le proprie SDK. Ma con gli ultimi sviluppi stiamo assistendo a un trend molto interessante basato su un concetto semplicissimo: il web è compatibile con tutti i sistemi mobile, perché non estendiamo le sue funzionalità alla creazione di app?

Ed ecco che sistemi come FirefoxOS, Windows Phone e anche Ubuntu Phone; permettono a qualsiasi sviluppatore web di creare la propria applicazione. E non soltanto!

Grazie infatti alla grande estendibilità del linguaggio di programmazione JavaScript sono nati moltissimi framework come Ionic o React Native (giusto per citarne alcuni) che permettono di creare intere applicazioni mobile sfruttando le componenti harware del telefono. Questi permettono di scrivere la propria applicazione in un singolo linguaggio e poterla installare su diversi dispositivi mobili in modo da semplificare la vita a noi sviluppatori.

Per farla semplice: se oggi impari a creare un sito web, domani sarai in grado di creare le tue applicazioni mobile!

Siamo nel 2019

Ebbene, non voglio fare il rompi di turno ma bisogna essere onesti con se stessi: il WWW è nato nel 1991 e viviamo nel 2019, forse è l’ora di fare pace con questo fenomeno e cavalcare questo trend che da 28 anni non smette di crescere. Conoscere il web design è sicuramente utile, anche perché è divertente 😀

Sapere come sono state create le pagine che quotidianamente accompagnano le nostre giornate, scoprire come personalizzarle da soli ed entrare pian piano nella logica di questo ambiente ci permetterà di essere un po’ più padroni di un canale che quotidianamente usiamo. Ci renderà più coscenti riguardo il suo utilizzo e le sue potenzialità.

Se stai leggendo queste righe e hai un figlio, insegna l’HTML anche a lui! Sono sicuro che sarà una skill che si potrà giocare molto bene in futuro 😉

Ti sto dicendo tutto questo perché è stata proprio la ex-vicepresidente della commissione europea per l’agenda digitale ha sempre portato avanti il codice e le sue infinite applicazioni nella vita quotidiana paragonando la possibilità di comprendere e utilizzare la sua sintassi come vera e propria letteratura!

Io credo fermamente che questo sia un fattore più che importante, per tutti gli adolescenti e ragazzi che navigano per il web perché (senza voler entrare troppo nelle critiche) ritengo che YouTube e i social network in generale stiano dando un messaggio sbagliato alle nuove generazioni. Prova a fare una veloce ricerca su YouTube con la parola chiave gameplay e guarda quanti video vengono elencati…

E le visualizzazioni? Hai visto quante visualizzazioni scatenano questi video dove il creatore non fa altro che parlare mentre gioca a un videogioco?!?

Non mi guardare storto, anche io diversi anni fa passavo pomeriggi interi con mio fratello a giocare alla PlayStation 2, bei tempi… Però sai perché la maggior parte di questi ragazzi inizia a fare video? Perché pensano che sia una carriera e che sia possibile vivere di rendita soltanto pubblicando dei video su YouTube!

Sicuramente qualcuno ci è riuscito, guarda il famoso caso di Favij, ma come anche tu ti puoi immaginare i casi di vero successo sono veramente pochi e il trend che si vede più di tutti è la falsa realtà che tanto basta un buon profilo sociale e apparire per essere qualcuno e venir pagati.

Ecco perché penso che è molto importante insegnare a fare codice alle nuove generazioni. Il codice ci spinge a fare delle prove, a conoscere nuove cose, a picchiare la testa sullo schermo, ma soprattutto ci permette di farci provare delle emozioni veramente forti perché grazie alle conoscenze acquisite siamo in grado di imparare a creare!

Ovviamente io sono di parte, ma tu che dici?

Provi le stesse emozioni e pensi che sia un’esperienza utile quella di conoscere il codice che compone le pagine web? Aspetto la tua risposta nei commenti che intanto continuo questo articolo parlando di altri aspetti per cui la semplice conoscenza del codice HTML ci può tornare utile in altre situazioni che avvengono all’interno della nostra vita digitale.

È utile se vuoi “embeddare” qualsiasi elemento

Ecco che entriamo in un argomento leggermente più spinoso, una situazione dove un po’ di codice HTML lo vedi per forza. Con il termine embed si intende: prendere un contenuto da una pagina e inserirlo all’interno di un’altra. Semplice. Diretto.

Se non ti è mai capitato di fare una cosa del genere, guardiamo di fare un esempio pratico. Hai mai visto un video YouTube all’interno di un sito web? Diciamo qualcosa come questo:

Quello che vedi qua sopra è il risultato di quando si embedda un video YouTube all’interno di una pagina web. Il video si trova sui server di YouTube e non va a pesare sulle risorse del server dove è presente questo sito, però grazie a questa azione posso riprodurlo direttamente da questa pagina con del semplice codice HTML:

 <video width="1920" height="1080" controls>
	<source src="movie.mp4" type="video/mp4">
	<source src="movie.ogg" type="video/ogg">
	Il tuo browser non supporta il tag video.
</video> 

Una riga di codice ti permette di includere un video, e non soltanto! A seconda dei servizi che vai a utilizzare è possibile anche inserire dei sondaggi, delle presentazioni o addirittura i post del tuo social network preferito!

Se conosci il linguaggio HTML avrai capito da solo che parole come width, height, src o anche allowfullscreen sono degli attributi dell’elemento iframe che servono per identificare e dare semantica a porzioni della pagina. Avere questa conoscenza di sicuro non ti permetterà di creare il tuo player personalizzato, per quello sicuramente ne servono molte altre conoscenze, ma almeno saprai dove andare ad agire per modificare le dimensioni del player o per impedire che gli utenti visualizzino il video fullscreen 😉

Anche in questo caso, è bastato un po’ di codice HTML per popolare la pagina di nuovo contenuto e la cosa più bella è che non importa conoscere nel dettaglio il linguaggio utilizzato, ma è comunquer  meglio che fare del copia/incolla selvaggio 😀

Ti apre la mente verso nuovi concetti

Ancora mi ricordo la prima volta che sono riuscito a creare una pagina web, ero veramente contento! Ero riuscito a trasformare del semplice testo in una pagina web colorata e ricca di immagini e contenuti! Però è stato ancora più bello quando ho capito che questo era soltanto l’inizio perché imparare a creare una pagina web è una attività che permette anche di aprire la mente e di avvicinarsi a concetti di programmazione sempre più avanzati.

Per prima cosa si comprende che il proprio computer non è fatto di magia, piuttosto è codice che si trasforma in qualcosa di grafico, in qualcosa che interagisce con noi. Tutto a un tratto colori, bottoni, moduli e filmati popolano le pagine web e noi diventiamo affamati di nuove conoscenze.

Almeno per me è stato proprio corsì, quando ho capito che era semplice creare degli elementi dal nulla, personalizzarli con un po’ di codice CSS e animarli con un pizzico di JavaScript ho anche capito che creare nuove applicazioni (che siano web o mobile) è un gioco da ragazzi.

Non sto parlando di fantascienza, piuttosto di una possibilità che viene spesso riportata all’arte. Chi dipinge o chi fa musica, tra gli altri, sono in grado di provare queste forti emozioni che ci fanno sentire delle divinità.

Ebbene, dal mio punto di vista, questo succede anche a chi scrive codice!

Hai un sacco di nuove opportunità

Non abbiamo ancora parlato di come si sia evoluto l’ecosistema degli sviluppatori web ma immagina questo: fino a una decina di anni fa la realizzazione di un sito web era una peculiarità di persone che passavano gran parte del proprio tempo all’interno di mailing list. Questo significa che c’era e c’è un forte senso di comunità e di condivisione, ma al posto di utilizzare forum pubblici o l’ultimo social network le persone preferivano utilizzare lo strumento più in voga a quei tempi: l’email.

Non ti nego che anche oggi è uno strumento che si usa moltissimo, ma quando si deve condividere qualcosa con il maggior numero di persone possibili, quando questo è un argomento che riguarda in particolar modo gli sviluppatori e l’implementazione di nuove tecnologie, non è forse melgio pubblicare queste informazioni in un posto dove queste persone già si radunano? In un posto che oggi è in grado di creare facilmente uno storico delle conoscenze condivise e di metterle a disposizione del prossimo?

Ebbene, il posto esiste, e si chiama GitHub.

Da semplice condivisione di codice open source, GitHub è ben presto diventato un social network di riferimento per tutti gli sviluppatori web e non. All’interno di questo portale si trovano anche moltissimi progetti che non hanno niente a che fare con il web. Cavolo! Si trovano anche i sorgenti del kernel Linux!

Questa è la bellezza di conoscere le fondamenta del web design, abbiamo a disposizione degli strumenti che ci permettono e facilitano la comunicazione con i nostri colleghi. Ma facciamo anche un esempio concreto.

Diciamo che sei interessato a creare delle animazioni CSS, inizi andando a vedere come funziona il progetto Animate.css e tutto ad un tratto ti trovi all’interno del repository che contiene la libreria scritta in Sass, una libreria che permette di velocizzare incredibilmente la creazione di animazioni.

Con quest’ultima frase ti ho dimostrato una semplice cosa, le opportunità e la conoscenza riguardo al web design è messa a disposizione dalla stessa tecnologia!

Lavora con nuoni linguaggi ed estendi le tue conoscenze

Iniziamo a guardare il tutto da un punto di vista lavorativo perché anche il lato guadagno è una caratteristica che ci interessa perché, in fin dei conti, dobbiamo essere in grado di mettere il pane in tavola. È vero, si può campare dignitosamente sapendo utilizzare un programma di grafica e dei linguaggi frontend, ma estendere le proprie conoscenze ci permette di ottenere progetti più stimolanti e più redditizi.

Pensaci per un momento, è vero che conoscere conoscere i fondamenti del web design ti permetterà di creare delle pagine web, ma sempre di pagine web si parla. Se desideri scoprire come inserire un login, come permettere al tuo cliente di inserire nuove pagine o semplicemente di modificare il menu senza dover cambiare del codice HTML allora ti conviene imparare un linguaggio di programmazione.

All’interno di questo portale vogliamo aiutarti a fare proprio questo, infatti nel corso Apprendi il PHP con WordPress ho cercato di unire in un colpo solo la bellezza di questi due mondi, quello del web design e dello sviluppo lato server. La mia intenzione è stata quella di permetterti di scoprire come funziona il linguaggio di scripting lato server più utilizzato al mondo e aiutarti a muoverti sviluppando all’interno del CMS più diffuso.

Ma questo è soltanto un esempio.

Python, Ruby, Perl sono alcuni dei linguaggi di programmazione che puoi scoprire e che sono molto utilizzati, mentre se ti interessano i framework hai soltanto l’imbarazzo della scelta!

Però non voglio metterti pressione perché sarai tu stesso a decidere quale sarà il prossimo linguaggio di programmazione da apprendere, in questa sezione la mia unica intenzione è stata quella di farti capire quanto può essere allettante espandere le tue conoscenze nel campo del web design, entrando e approfondendo quelle del web developer.

Concetti di design e programmi di grafica

Diciamoci la verità, inizialmente le mie competenze grafiche facevano veramente pena!

Vabbé, forse proprio pena pena non facevano, ma bisogna comunque dire che non era presente un vero e proprio stile grafico… Ma cosa ci fanno quei fiorellini ai lati?!?

Aggiornarsi costantemente, scoprire i trend del momento e prendere ispirazione da altri siti web aiuta a sviluppare un occhio grafico. Ci permette di imparare dai propri errori, di comprendere meglio come l’utente medio naviga su Internet e sopratutto ci aiuta a evolvere la nostra arte.

Bada bene, sto utilizzando il termine arte perché come dicevo prima dal mio punto di vista questa non si raggiunge soltanto con uno scalpello, un pennello o con l’occhio nascosto dietro un obiettivo. Secondo me facciamo arte ogni volta che qualcuno si sfida con se stesso, ogni volta che ci mettiamo in gioco cercando di realizzare qualcosa di nuovo. E con questo non facciamo altro che migliorare la nostra arte.

In fin dei conti è arte anche quando prendiamo in mano il nostro mouse ed apriamo un programma di grafica come Photoshop o Gimp per realizzare la bozza del nostro sito web. Negli anni mi è capitato molto spesso di dover aprire questi programmi e come puoi notare tu stesso da questo sito, anche se non perfetto, il gusto grafico è andato man mano migliorando.

Questo succederà anche a te!

Man mano che passa il tempo e affini le tue tecniche, è molto probabile che ti troverai a dover scegliere se continuare a creare la grafica o unirti a “uno bravo” che collabori e inizi a lavorare con te. Potrebbe anche accadere il contrario, non è tanto importante se tu sarai lo sviluppatore o il grafico, l’importante è sapere che saprai spiegargli cosa vuoi, o meglio, che cosa vuole il cliente.

Ebbene questo è più che mai vero perché essere in grado di dialogare è sicuramente una competenza molto utile quando designer e developer si confrontano, se entrambi conoscono il mondo del professionista che si trovano a fianco saranno in grado di portare a termine un lavoro qualitativamente migliore.

Ecco perché, anche se sei un web developer, ti consiglio di scoprire più che puoi del mondo che ti affianca: il web design.

Conclusioni

Scoprire i fondamenti del web design è una delle pratiche più semplici e più importanti che potrai apprendere nel tuo percorso. Rianalizzando brevemente quanto espresso in questo articolo, abbiamo visto che imparare questi concetti non ti è soltanto utile perchè il web si sta espandendo quotidianamente, ma allo stesso tempo è stimolante per migliorare le prorpie conoscenze!

Oggi essere un web designer non significa più essere in grado di disegnare le pagine web (se mai lo è stato). Non voglio assolutamente denigrare i sapienti artisti che usano Illustrator per creare le nuove interfacce del web (anche perché li invidio incredibilmente!!!), ma per coprire questo ruolo molto spesso dovrai conoscere anche codice HTML, CSS e perché no un po’ di JavaScript.

Per quanto possa sembrare una situazione frustrante, per quanto tu non abbia voglia di accrescere le tue conoscenze è essenziale mantenersi aggiornati. Non si sa mai, domani queste stesse conoscenze potrebbero esserti utili per creare la tua applicazione mobile 😉

Ebbene, siamo giunti al termine di questo lungo articolo ma vorrei chiederti un favore, vorrei conoscere la tua opinione a riguardo. Anche per te è importante che sempre più persone, compresi i nostri figli, scoprano come sia possibile diventare un web designer? Credi che questo sia utile per un lavoro futuro?

Come ti ho confessato fin dall’inizio di questo articolo sono curioso di scoprire che cosa ne pensi, sono affamato del tuo contributo. Quindi investi una manciata di secondi per condividere con me e con tutti i lettori qual è il tuo punto di vista. I commenti sono proprio qua sotto 😉