Ciao, e benvenuto nella settima puntata della ventinovesima stagione. Nelle scorse puntate abbiamo capito come il CSS descrive e dispone le cose. Oggi affrontiamo una delle sfide più profonde e affascinanti che il CSS deve risolvere, e la sua filosofia per affrontarla: il fatto che, quando descrivi l'aspetto di una pagina, non sai su quale schermo verrà vista. Telefono, tablet, schermo enorme, dimensioni che non puoi prevedere. La risposta del CSS è progettare per l'ignoto: descrivere un aspetto che si adatta, invece di disegnarne uno fisso. Oggi parliamo di un disegno, infiniti schermi.
Partiamo dal problema, che è unico del web e voglio farti sentire in tutta la sua portata. Pensa a chi progetta qualcosa di stampato, un manifesto o una pagina di giornale: conosce esattamente le dimensioni del foglio su cui finirà. Progetta per uno spazio fisso e noto. Chi progetta per il web è in una situazione completamente diversa e più difficile: non ha idea di dove finirà la sua pagina. Potrebbe essere vista su un piccolo telefono, su un tablet, su un computer, su uno schermo gigantesco, in verticale o in orizzontale, in una finestra grande o piccola. Le dimensioni sono imprevedibili e infinite. Come fai a progettare un bell'aspetto quando non sai nemmeno quanto spazio avrai? È un problema che sembra quasi impossibile.
Voglio farti apprezzare perché questo problema sia così radicale, perché rovescia il modo di pensare al design. Nel design tradizionale, per uno spazio fisso, decidi tu ogni cosa: questo va qui, grande così, in questa posizione precisa, perché conosci lo spazio. Nel web non puoi farlo: se decidi una disposizione fissa, andrà bene per uno schermo e malissimo per tutti gli altri. Un layout perfetto per il computer sarà illeggibile sul telefono; uno pensato per il telefono sarà sprecato e povero sul grande schermo. Non puoi progettare un solo aspetto fisso, perché non esiste un solo schermo. Devi progettare in un modo completamente diverso, che tenga conto dell'imprevedibilità dello spazio.
Ed ecco la filosofia del CSS per risolvere questo, che voglio farti afferrare bene: non progettare un aspetto fisso, ma descrivere un aspetto che si adatta. Invece di dire questo elemento è largo esattamente così, dici questo elemento si adatta allo spazio disponibile. Invece di decidere una disposizione rigida, descrivi come le cose devono riorganizzarsi a seconda di quanto spazio c'è. Il CSS ti permette di dare istruzioni che si adattano: se lo schermo è largo, disponi in questo modo; se è stretto, riorganizza in quest'altro. Non un disegno solo, ma una descrizione flessibile che genera l'aspetto giusto per ogni schermo. Descrivi un aspetto adattivo, non uno fisso. È la risposta all'imprevedibilità.
Voglio darti un'immagine bellissima per questa idea, perché la coglie in pieno: l'acqua. L'acqua non ha una forma propria fissa: prende la forma del contenitore in cui la versi. In un bicchiere è stretta e alta, in un piatto è larga e bassa, e in ogni caso riempie bene lo spazio che ha. Il design adattivo del CSS è così: non impone una forma rigida, ma descrive un contenuto che, come l'acqua, prende la forma dello spazio disponibile, adattandosi a riempirlo bene, qualunque esso sia. Su un telefono si dispone in un modo, su un grande schermo in un altro, sempre adattandosi elegantemente al contenitore, come l'acqua. Progettare per il web è progettare qualcosa che scorre e si adatta, non qualcosa di rigido.
Voglio farti apprezzare quanto sia profonda questa idea di progettare per l'ignoto, perché va oltre la tecnica. Accettare di non sapere e non controllare lo schermo, e progettare comunque qualcosa che funzioni ovunque, è un cambio di mentalità profondo. Significa rinunciare al controllo totale sull'aspetto, in cambio della capacità di funzionare in infinite situazioni impreviste. Invece di dire come deve apparire esattamente, dici come deve comportarsi al variare dello spazio. È una forma di umiltà e di flessibilità: accetti l'imprevedibilità del mondo reale, e progetti per adattarti a essa, invece di illuderti di controllarla. Progettare per l'ignoto è, in fondo, accettare la varietà del mondo e abbracciarla, invece di combatterla.
Voglio collegare questa idea a un valore incontrato in un'altra stagione, perché c'è una parentela di spirito. Ricordi Java, con il suo scrivi una volta, gira ovunque? Il design adattivo del CSS ha uno spirito simile, applicato all'aspetto: descrivi un solo aspetto, e funziona su qualsiasi schermo. Un disegno, infiniti schermi, così come un programma, infinite macchine. In entrambi i casi c'è la stessa bella idea: descrivere qualcosa una volta sola, in modo che si adatti a una varietà imprevedibile di contesti. È l'ideale di creare qualcosa di flessibile, che prospera nella varietà invece di esserne sconfitto.
Per oggi ci fermiamo qui. Una sfida profonda del CSS è che, quando descrivi l'aspetto, non sai su quale schermo verrà visto: le dimensioni sono imprevedibili e infinite, a differenza della stampa, che ha un foglio fisso. La risposta del CSS è progettare per l'ignoto: non un aspetto fisso, ma una descrizione che si adatta allo spazio disponibile, riorganizzandosi a seconda di quanto spazio c'è, come l'acqua che prende la forma del suo contenitore. È un cambio di mentalità profondo, fatto di umiltà e flessibilità: accettare di non controllare lo schermo e progettare per adattarsi. È uno spirito simile allo scrivi una volta gira ovunque di Java: un disegno, infiniti schermi. Nella prossima puntata vediamo la sua tolleranza agli errori: perdonare invece di rompere. Nelle note trovi qualche spunto. Se ti è utile, condividila. Grazie per l'ascolto, e ci sentiamo alla prossima.