Una lezione di storia del web design: 20 anni di web design

Sembra quasi una follia. Ho iniziato il mio percorso come web designer nel 1996 , lavorando per il mio giornale locale. Se i miei calcoli sono giusti, allora sto per entrare nel mio ventesimo anno. Più della metà della mia vita è stata spesa lavorando sul web.

In quanto tale, ho pensato che potesse essere interessante dare uno sguardo al modo in cui il web funzionava (o non funzionava) allora e confrontarlo con alcune delle sfide che dobbiamo affrontare oggi. La domanda che ho è: la storia si ripete sul web?

Strumenti del mestiere

Nel 1996, il web design era agli albori, almeno in senso commerciale. Allora ho codificato (e questo è gentilmente) HTML a mano nel Blocco note di Windows 95.

Esistevano alcuni editor web rudimentali, come Coffee Cup. Ma WYSIWYG non era nemmeno vicino alla realtà. Molto spesso ho scoperto che tutti gli editor HTML là fuori scrivevano codice sciatto (proprio come me). Ciò non iniziò a migliorare fino al 1997, quando Macromedia rilasciò la prima versione di Dreamweaver (successivamente acquistata da Adobe).

Macromedia ha rilasciato Dreamweaver nel 1997

Parlando di Adobe, il suo venerabile Photoshop non era affatto l'app per il web design che è oggi. Perché, guardando la cronologia delle sue versioni, è sorprendente pensare che l'onnipresente opzione "Salva per il Web..." non sia arrivata in Photoshop fino alla versione 5.5, rilasciata nel 1999.

Finestra di dialogo Salva per Web di Photoshop 5.5. (Fonte immagine)

Prima dei giorni di tutta la bontà CSS3 di cui ora godiamo, Photoshop era praticamente la tua unica opzione per ombre, angoli arrotondati e sfumature. La compressione di immagini per l'uso sul Web non era nemmeno un pensiero nella mente di Adobe all'epoca.

Al di là della grafica e della modifica del codice, lo strumento principale scelto da un designer era un buon vecchio client FTP. I caricamenti di file basati sul Web su modem 56k non erano un'opzione.

La storia si ripete?
Certamente no. Dreamweaver e Photoshop sono ancora abbastanza popolari e funzionano bene. Per non parlare di centinaia, se non migliaia, di altri strumenti per rendere molto più semplice la progettazione e lo sviluppo. Qualunque siano i tuoi gusti e le tue esigenze, molto probabilmente c'è uno strumento là fuori che fa per te.

Browser

Qualcuno ricorda NCSA Mosaic? Co-sviluppato da Marc Andreessen, che in seguito ha sviluppato Netscape, Mosaic è stato fornito in bundle con molti starter kit di provider di servizi Internet (ISP). Sia Netscape 2.0 che Internet Explorer 3.0 sono stati rilasciati nel 1996.

Il browser web Mosaic 1.0

I browser erano difettosi e instabili. Non era raro che un sito Web specifico (soprattutto uno con Shockwave/Flash) interrompesse ripetutamente la sessione del browser, il che significa che non avresti mai potuto controllare effettivamente il sito.

Una delle tendenze peggiori di questo periodo di tempo erano i siti che presentavano codice proprietario, che avrebbe funzionato solo in Internet Explorer (grazie, Microsoft). Ciò ha anche portato a siti per lo più inutilizzabili durante l'utilizzo di browser non IE.

La storia si ripete?
Fortunatamente no. Anche se dobbiamo ancora affrontare alcuni disastri precedenti, intendo le versioni di IE, le cose ora sono chiaramente migliori di quanto non fossero negli anni '90. Mentre i marchi Mosaic e Netscape sono diventati polvere da tempo, anche IE è andato e sostituito da Edge. Chrome, Firefox, Safari e Opera sono tutte opzioni solide. Le stranezze basate sul browser sono ancora in circolazione, ma non così diffuse come una volta.

Metodi di progettazione e limiti

La metà degli anni '90 è stata senza dubbio il "selvaggio west" per il design. Il motto di allora era "Fallo funzionare". Come accennato in precedenza, i browser Web erano praticamente terribili. A volte sembrava che dovessi indurli a collaborare con qualsiasi aspetto o caratteristica tu volessi creare.

Lo fai con Tables, ovviamente :
Quasi tutti i principali siti utilizzavano un layout basato su tabelle, poiché CSS1 era appena stato preparato per il rilascio. Se non hai mai creato un layout basato su tabelle, ti sei perso un po' di divertimento.

Una pagina web composta da tabelle. (Fonte immagine)

Sebbene fosse abbastanza facile creare un layout con più colonne, altri layout richiedevano un grande livello di creatività. Spesso, la soluzione era semplicemente annidare un tavolo all'interno di un altro, ancora e ancora. Il codice era estremamente gonfio e tassava le connessioni lente.

Gare di lumache :
Le velocità di connessione erano uno dei maggiori ostacoli nella creazione di un sito. I modem 56k erano lenti, ma mio Dio, sembravano a banda larga rispetto ai modelli 14.4 e 28.8. In generale, volevi che la tua home page (codice e immagini) totalizzasse meno di 50kb di spazio.

Naturalmente, ora vediamo siti con dispositivi di scorrimento a larghezza intera che superano a loro volta 1 MB. Le connessioni Internet lente rappresentavano una sfida difficile di cui dovevi costantemente essere consapevole.

Risoluzioni/Dispositivi :
Hai presente quello smartphone che hai in mano? Bene, molto probabilmente ha una risoluzione più alta rispetto alla maggior parte dei computer desktop del 1996. Il mio Packard Bell soggetto a crash ha uno schermo allettante 640 × 480. Vedi, prima eravamo mobili!

Ma seriamente, quello era un piccolo schermo. Alcuni utenti funzionavano a 800 × 600 o anche a 1024 × 768 occasionali (se stavi eseguendo un sistema davvero di fascia alta), ma era difficile ottenere l'accesso a risoluzioni più grandi se non ne stavi già utilizzando uno. Ciò ha portato molti siti a essere progettati per schermi di piccole dimensioni, solo per rompersi su schermi più grandi.

I dispositivi mobili in grado di navigare sul Web erano praticamente un sogno irrealizzabile a quei tempi. E, anche se all'epoca non ne avevo mai avuto voglia, in realtà le cose erano più semplici in termini di tipi di schermi per i quali stavi progettando. Ora abbiamo layout reattivi che funzioneranno praticamente su ogni schermo.

Gestione del sito :
Quindi sì, non c'era niente come WordPress ai tempi. Se volevi modificare il contenuto del tuo sito, o peggio ancora aggiungere una nuova sezione di navigazione, stavi praticamente hackerando potenzialmente le centinaia di file in un sito HTML statico.

Mentre le inclusioni lato server sono state utilizzate da alcune persone esperte (non io), altre (me) sono state relegate a modificare ogni singolo file nel sito. La ricerca e sostituzione globale è stata di grande aiuto.

Qualsiasi sistema di gestione dei contenuti dalla metà alla fine degli anni '90 era solitamente costruito su misura per un'azienda e costava una somma di denaro piuttosto elevata. Tuttavia, non hanno funzionato così bene. Le limitazioni del browser e degli script renderebbero questi sistemi un grande spreco di denaro in molti casi. È anche uno dei motivi per cui IE 6 è rimasto ben oltre la sua vita utile.

La storia si ripete?
Direi che l'unica cosa che si è ripetuta (e moltiplicata) sono le risoluzioni dello schermo e il numero di dispositivi per cui dobbiamo progettare. Tuttavia, l'avvento del design reattivo ha sicuramente reso questa sfida molto più facile da affrontare.

Come accennato in precedenza, quei browser "classici" spesso prendevano lo stesso codice e lo rendevano in modi molto diversi. Anche se il problema si ripresenta di tanto in tanto, non è nemmeno lontanamente il disastro del design di una volta. Questo è un altro grande passo per permetterci di creare design che funzionano su tutti gli schermi.

Qui e ora

Come l'elettronica e le automobili, il web design ha fatto molta strada in un lasso di tempo relativamente breve. È incredibile vedere cosa stanno creando designer e sviluppatori di talento, non avendo mai sognato cose del genere quando ho iniziato.

Fortunatamente, i progressi hardware e software hanno reso il nostro lavoro più facile e democratizzato la pubblicazione online. Non dobbiamo più assumere grandi aziende per costruirci un CMS. Ce ne sono molti fantastici disponibili gratuitamente. Le installazioni con un clic dai provider di hosting consentono a coloro che non sono nemmeno professionisti di iniziare a correre sul Web. Ciò ha creato più opportunità per tutti noi.

Quando è iniziato il tuo percorso come web designer? Quali sono alcune delle differenze più evidenti tra allora e oggi?