Template EPUB3 completi e commentati per studiare layout, struttura, accessibilità e comportamento dei contenuti nei diversi ambienti di lettura.
Indice dell’articolo
Quando lavoro su un EPUB, una delle cose che trovo meno utili è incontrare una soluzione che funziona senza riuscire a capire perché.
Una regola CSS può risolvere un problema in un reader e comportarsi in modo diverso nel successivo. Un layout sembra stabile finché non cambia la dimensione del testo. Un’immagine sta dove dovrebbe, almeno fino a quando lo schermo viene ruotato o il contenuto diventa più lungo di quello usato nei test.
In questi casi copiare una soluzione non basta: bisogna poterla aprire, modificare, rompere e capire quali parti siano davvero necessarie.
Negli anni ho iniziato così a costruire piccoli EPUB di prova, file nei quali isolare un problema, verificare una soluzione e tornare nel codice per capire cosa stesse succedendo.
Prove di layout nasce da questo modo di lavorare.
È una collana di template EPUB3 sorgente, completi e commentati, da aprire con Sigil o con un normale editor HTML/CSS, studiare e adattare alle esigenze di un progetto reale. Non è una raccolta di effetti grafici né una serie di eBook già pronti da riempire.
Il layout di un EPUB non è soltanto quello che vediamo
Nel libro cartaceo la relazione tra contenuto e pagina è relativamente stabile. Si decidono dimensioni, margini, posizione delle immagini, corpi tipografici e gerarchie sapendo che quella composizione resterà la stessa dopo la stampa.
Con un EPUB reflowable il problema cambia.
Il lettore può modificare il corpo del testo, scegliere un altro carattere, cambiare tema, orientamento o dispositivo. Lo spazio disponibile non è fisso e ogni reading system può interpretare alcune regole a modo suo.
Il progetto grafico resta possibile, ma diventa un sistema di regole più che una pagina immobile.
In questo sistema il codice fa parte del progetto editoriale. HTML e CSS non sono semplicemente ciò che sta “dietro” l’eBook: definiscono gerarchie, relazioni, comportamento dei contenuti e possibilità di adattamento.
Per chi produce EPUB, guardare soltanto il risultato finale non sempre basta.
Un template EPUB da leggere anche nel codice
Ogni Prova di layout è un EPUB completo.
Contiene documenti XHTML, fogli di stile, navigazione, metadati, immagini e struttura del package, e non soltanto il frammento CSS che produce un determinato effetto.
L’idea è osservare una soluzione nel contesto reale in cui deve funzionare.
Nei sorgenti i passaggi più importanti sono accompagnati da quattro indicazioni ricorrenti:
- [ACCESSIBILITÀ], per le scelte che incidono sull’uso del contenuto attraverso modalità di lettura differenti;
- [STANDARD], per gli elementi legati direttamente alle specifiche EPUB;
- [COMPATIBILITÀ], quando una soluzione richiede particolare attenzione ai diversi reading system;
- [MODIFICA], per le parti che si possono personalizzare più liberamente.
Servono a distinguere ciò che si può cambiare senza particolari conseguenze da ciò che fa parte della struttura del documento o dipende dal comportamento previsto dallo standard.
A ogni template si affianca una guida con indicazioni sulla struttura del file, sulle principali modifiche e sui controlli da eseguire dopo la personalizzazione.
Gli EPUB conformi alle precedenti revisioni di EPUB 3 non devono essere modificati soltanto per l’arrivo della 3.4, la nuova revisione dello standard di cui parlo nell’articolo dedicato a EPUB 3.4.
Per i controlli uso EPUBCheck per la conformità tecnica e Ace by DAISY per i controlli automatici di accessibilità. Superare i controlli automatici, però, non significa avere finito: la prova di lettura sui reader resta un passaggio a parte.
Il punto, in fondo, non è riuscire a cambiare un colore o un margine.
È sapere che cosa si sta cambiando.
L’accessibilità non è un’aggiunta finale
Nelle Prove di layout non esiste un template “accessibile” separato dagli altri.
Gerarchia dei titoli, ordine di lettura, lingua del contenuto, navigazione, note, testi alternativi e struttura semantica sono decisioni da prendere mentre l’EPUB viene costruito. Non si possono applicare alla fine come un nuovo foglio di stile, e per questo anche il template più semplice parte da una struttura corretta.
Usare un template non produce però un EPUB accessibile in automatico.
Il risultato dipende dal contenuto inserito: un attributo alt deve contenere una descrizione adeguata, un contrasto va verificato sul progetto reale, l’ordine dei contenuti deve avere senso dopo ogni modifica.
I template forniscono una base e rendono più visibili i punti da controllare. L’accessibilità richiede comunque verifica.
È un tema che merita molto più spazio, e lo affronterò separatamente parlando di EPUB Accessibility 1.2 e del quadro attuale dell’editoria digitale accessibile.
I template
#0 — EPUB reflowable base
Il primo template della serie è il punto da cui partire, ed è gratuito.
Contiene la struttura essenziale di un EPUB3 reflowable: frontespizio, titoli, paragrafi, liste, collegamenti, note, immagini con didascalia, semplici testi in versi, apparati minimi, navigazione e colophon.
Non è una versione ridotta degli altri né una demo. È una base completa per osservare come sono organizzati i file di una pubblicazione EPUB e iniziare a intervenire sul codice senza costruire tutto da zero.
La vedo soprattutto come punto di partenza per narrativa, saggistica e libri prevalentemente testuali.
Ideale per: chi vuole partire da una struttura EPUB3 pulita e commentata o capire come è organizzato un eBook reflowable.
#1 — Layout responsive
Una delle domande più frequenti quando si lavora su un EPUB è apparentemente semplice: che cosa succede quando cambia lo schermo?
Il primo template specialistico lavora su questo.
Immagini con proporzioni differenti, orientamento portrait e landscape, elementi a tutta larghezza, unità relative, margini adattivi, semplici tabelle e casi testuali difficili servono a osservare come una composizione reagisce allo spazio disponibile.
L’obiettivo non è ricreare una pagina fissa a ogni dimensione, ma fare in modo che la struttura resti leggibile quando le condizioni cambiano.
Ideale per: progetti nei quali immagini, tabelle e contenuti devono adattarsi a schermi e impostazioni di lettura differenti.
#2 — Composizione editoriale
Un EPUB reflowable può avere un progetto riconoscibile.
Questa Prova di layout esplora quanto si possa costruire un’identità editoriale mantenendo flessibile la pagina. Aperture di parte e capitolo, epigrafi, eserghi, capolettera, occhielli, pull quote, riquadri, separatori, poesia composta e teatro sono gli esempi su cui lavorare, soprattutto per gerarchie, ritmo e tipografia.
Le famiglie di caratteri sono volutamente due, Lora e Open Sans, perché l’identità non dovrebbe dipendere dalla moltiplicazione dei font. Peso, corpo, spazio e posizione possono fare molto di più.
Ideale per: narrativa, saggistica e collane che richiedono una personalità grafica più riconoscibile senza rinunciare alla natura reflowable del formato.
#3 — Immagini annotate
Inserire un’immagine in un EPUB è semplice.
Capire quale rapporto debba avere con il testo, con la didascalia, con i crediti e con chi non può accedere direttamente all’informazione visiva lo è molto meno.
Il terzo template affronta questa relazione con esempi di didascalie e crediti, strategie per gli attributi alt, descrizioni estese, immagini con callout, SVG annotati, approfondimenti collegati alle figure e sequenze di immagini. Il lavoro si estende ad audio e video, transcript e fallback.
È il template in cui il confine tra progetto grafico e struttura semantica diventa più evidente.
Un’immagine non è solo qualcosa da posizionare bene: prima bisogna capire che cosa comunica.
Ideale per: cataloghi, saggi illustrati, pubblicazioni didattiche e progetti nei quali immagini e media contengono informazioni necessarie alla comprensione del testo.
#4 — EPUB multilingue
Un libro in più lingue non è lo stesso testo ripetuto più volte.
Cambiano la struttura, la navigazione e la gestione dei cambi di lingua.
Il quarto template parte dalla struttura dell’EPUB per osservare come più lingue possano convivere nello stesso libro e come ogni cambio vada dichiarato correttamente, anche perché le tecnologie assistive possano interpretarlo.
Entrano in gioco attributi linguistici, font, fallback e organizzazione dei contenuti.
Ideale per: edizioni bilingui e multilingue, antologie e pubblicazioni che usano più lingue.
#5 — Tecnico e didattico (in preparazione)
È il template a cui sto lavorando adesso, pensato per pubblicazioni più strutturate: manuali, testi scolastici, libri tecnici e contenuti didattici.
L’obiettivo è una base modulare nella quale possano convivere unità, box di approfondimento, attività, soluzioni, glossari, tabelle, bibliografie, rimandi, formule e altri apparati senza trasformare l’EPUB in un insieme ingestibile di casi speciali.
Proprio perché è ancora in sviluppo preferisco non definirne troppo presto tutti i moduli.
L’idea di fondo è già chiara: ciò che non serve deve poter essere eliminato senza rompere il resto della struttura.
Ideale per: manualistica, editoria scolastica, accademica e tecnico-scientifica.
Non sono livelli progressivi
I template non sono livelli progressivi, e usare il #4 non rende un progetto più avanzato del #1.
Ogni file affronta un problema diverso.
Un romanzo potrebbe avere bisogno soltanto del #0. Un saggio illustrato potrebbe usare la struttura di base insieme ad alcune soluzioni del #1 e del #3. Un manuale costruito sul futuro #5 potrebbe incorporare una composizione sperimentata nel #2.
Le Prove di layout vanno lette anche come insieme di soluzioni, oltre che come prodotti separati.
Il progetto editoriale viene prima del numero del template.
I template a pagamento (#1–#4, anche in bundle) sono presentati nelle rispettive schede del Laboratorio EPUB.
A chi non servono
Se cerchi un EPUB già pronto da riempire senza mai aprire un file XHTML o un foglio CSS, probabilmente questa non è la collana giusta.
Esistono strumenti più adatti a quel tipo di workflow.
Le Prove di layout sono pensate per chi vuole capire come è costruito il libro che sta producendo.
Non serve essere sviluppatori, ma serve la disponibilità a entrare nei sorgenti, fare una modifica, controllarne l’effetto e, qualche volta, chiedersi perché non abbia funzionato come previsto.
Per me è questa la parte interessante.
Un EPUB è abbastanza semplice da poter essere aperto e studiato direttamente, e abbastanza complesso da obbligarci a mettere insieme progettazione grafica, struttura del contenuto e comportamento del software.
Ridurre tutto a un pulsante “Converti” significa perdersi una parte importante del formato.
Uso nei progetti commerciali
I template si possono usare e modificare per realizzare propri libri e pubblicazioni per clienti, comprese quelle commerciali.
La licenza non consente invece di redistribuire, condividere o rivendere il template come modello autonomo, anche dopo averlo modificato.
Il sorgente può diventare uno strumento del proprio lavoro, ma non un nuovo prodotto da ridistribuire come template.
E il fixed layout?
Arriverà, ma non è il numero successivo della stessa sequenza.
Un EPUB fixed layout parte da un principio progettuale diverso: la composizione della pagina resta controllata, mentre nel reflowable è il contenuto ad adattarsi alle condizioni di lettura.
Cambiano dimensioni, posizionamento, viewport, immagini e soprattutto accessibilità.
Merita un progetto e una trattazione specifici.
Il layout è anche il codice che lo regge
Il lettore non dovrebbe preoccuparsi di classi CSS, elementi semantici, media query o struttura del package.
Dovrebbe poter leggere il libro nel modo più naturale possibile.
Per chi quel libro deve costruirlo, invece, il codice deve essere comprensibile.
Le Prove di layout servono a questo: avere uno spazio in cui provare una soluzione, modificarla, romperla e capire fino a dove regge prima di portarla in un progetto reale.
Perché il layout di un EPUB non è soltanto quello che appare sullo schermo.
È anche l’insieme di regole che gli permette di continuare a funzionare quando quello schermo cambia.