Tralascia la santità e ripudia la sapienza
e il popolo s’avvantaggerà di cento doppie […]
mostrati semplice e mantienti grezzo,
abbi poco egoismo e scarse brame.

Il passo che abbiamo appena citato viene dal capitolo XIX del Tao Te Ching e si intitola "Tornare alla purezza". Da queste poche righe si può già intuire che l'invito che viene suggerito in questo capitoletto è il ritorno a forme più semplici e "pure" del nostro essere e del nostro lavoro, qualunque esso sia. Un tema a nostro modo di vedere estremamente attuale e utile per tutti i developer e designer che desiderano estrarre il massimo dal loro lavoro con HTML5 e le nuove tecnologie del web

HTML5: purezza e semplicità

Se c'è un concetto astratto che sta alla base di HTML5 è infatti proprio quello di purezza/semplicità: basta partire dalla dichiarazione del DOCTYPE, che come sappiamo è un puro e semplice (appunto…)

<!DOCTYPE html>

per capire che l'intenzione principale dei creatori di questa nuova tecnologia sia proprio quella di rendere più diretta, semplice e lineare la programmazione del web e la creazione di pagine e markup comprensibile e "umano".

In questo senso l'aspetto più interessante riguarda proprio l'atteggiamento che ha animato la nascita di HTML5 e la sua genesi: non uno standard calato dall'alto e imposto da un qualche organismo internazionale supremo (come più o meno avveniva con le precedenti versioni di HTML) ma piuttosto una "living spec" (cioè uno standard in continua evoluzione e mutamento) composta dal basso attraverso una partecipazine reale e costante di tutte le parti interessate al linguaggio, creatori di browser ma anche developer e soprattutto utenti finali.

Questo ha portato alla stesura di una specifica in cui purezza e semplicità hanno permeato ogni definizione e dettaglio, rendendo semplici e alla portata di tutti soluzioni tecnologiche estremamente complesse nel loro funzionamento.

Gli esempi di questo atteggiamento sono molti, oltre al già citato DOCTYPE, a cominciare dalla dichiarazione della codifica caratteri del documento, ore un semplice

<meta charset="UTF-8">

invece del più lungo e difficile da ricordare

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

Non possiamo dimenticare, poi, tutto il discorso relativo ai form e alla validazione dell'input in HTML5: se per controllare la correttezza di un form è sempre stato necessario ricorrere a soluzioni JavaScript che validassero l'input prima di inviare i dati, adesso con gli attributi email, url, number e required tutti questi controlli sono nativi nel browser.

Come non parlare poi di drag'n'drop: una funzionalità che ha sempre richiesto librerie e librerie JavaScript oltre a una marea di codice non sempre facile da scrivere e mantenere. Anche questo soluzione è invece improntata ad una semplicità e "purezza" estrema con l'introduzione dei nuovi eventi dragstart, drop e gli altri che potete scoprire nel nostro tutorial.

Pensiamo infine a audio e video: per inserire un video HTML5 in una pagina basta una riga come questa:

<video src="video.webm" poster="immagine.jpg" controls>

e il video appare sul nostro browser (certo, discorso diverso è per il formato del file, ma purtroppo lì c'entra la politica e soprattutto i soldi – rieccoci a questioni di "egoismo e brame"…). Confrontiamo questa riga di markup con il codice necessario per inserire un video in Flash in una pagina web:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"<br />    codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,16,0"<br />    width="320" height="400" ><br />    <param name="movie" value="video-filename.swf"><br />    <param name="quality" value="high"><br />    <param name="play" value="true"><br />    <param name="LOOP" value="false"><br />    <embed src="video-filename.swf" width="320" height="400" play="true" loop="false" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer"<br />    type="application/x-shockwave-flash"><br />    </embed><br />    </object>

Beh, direi che in quanto a semplicità e "purezza" non c'è proprio confronto. E non abbiamo neanche menzionato la libreria di API JavaScript che ci consentono di manipolare a nostro piacimento il video con un set di funzioni davvero facili da usare – cosa ovviamente impossibile con Flash.

Mantenersi puri

Lo svantaggio delle cose semplici e pure è che è troppo facile renderle complesse e "sporche". L'invito che noi developer dobbiamo cogliere dalla specifica e dalla fatica che è stata fatta per rendere così diretto tutto HTML5 è proprio, allora, quello di sforzarci di dare anche alle nostre creazioni quella stessa semplicità che renderà la vita più semplice a noi, ai nostri utenti e a tutti coloro che, un giorno, dovranno magari mettere le mani nel nostro lavoro.

Per fare questo ci vengono in mente una serie di consigli – lista del tutto incompleta, sia chiaro, e a cui ci piacerebbe molto aggiungere i vostri consigli e suggerimenti:

  1. Pensiamo e creiamo in maniera semplice. HTML5 ha introdotto, fra le varie cose, una serie di nuovi tag semantici (header, nav, footer, etc.) per dare una struttura più logica e razionale alla nostra pagina web. Partiamo allora da quelle senza dover reinventare ogni volta la ruota e realizziamo così delle pagine che siano più facili da capire per tutti, utenti, motori di ricerca e developer. E questo principio ci deve accompagnare in ogni nostro sviluppo
  2. Usiamo la purezza di HTML5. Abbiamo visto una serie di esempi in cui HTML5 ha portato una ventata di freschezza e semplicità. Il nostro approccio dovrebbe dunque essere proprio quello di adottare il più possibile le novità HTML5 – non dimenticando di utilizzare, però, strumenti quali Modernizr per realizzare una soluzione il più possibile compatibile anche con i browser più vecchi
  3. KISS: "Keep It Simple Stupid" – mai principio fu più importante per tutto il mondo del web development e dell'informatica in generale. A prescindere allora dalla tecnologia che scegliamo (ovviamente noi consigliamo il mondo HTML5) l'elemento fondamentale per rendere un successo il nostro script, il nostro sito o tutto il nostro business è ancorarsi a principi di semplicità. Quando scriviamo del codice, sforziamoci di eliminare tutti i fronzoli e gli elementi che lo rendono complesso e che spesso non apportano nessun reale beneficio agli utilizzatori. Stesso discorso per una pagina web: focalizziamo l'obiettivo di quella pagina e incentriamo tutto il design e codice su quello – gli elementi di contorno non fanno altro che distrarre, anche se molto carini (anzi, soprattutto se molto carini!).
The following two tabs change content below.
Silvio Porcellana
Silvio Porcellana è il fondatore di mob.is.it, il tool che centinaia di agenzie e professionisti di tutto il mondo utilizzano per creare con semplicità siti mobili e applicazioni native per i loro clienti. Tiene anche un podcast dove racconta ogni venerdì le sue avventure imprenditoriali, senza veli o segreti: Opus Digitalis