1. Pubblicazioni
digitali
Breve introduzione
al formato ePub
Corso di aggiornamento
Cierre Gruppo Editoriale
Via Ciro Ferrari 5
Caselle di Sommacampagna (VR)
“content presentation should adapt to
the user rather than the user having
to a particular representation of
content”
EPUB 3.0 Specification
*Matteo Ziviani

2. Tipologie di e-book
Facciamo chiarezza su alcune definizioni
Terminologia definizione
pbook / p-book “printed book” fa riferimento al libro stampato
ebook / e-book “electronic book” cioè un libro elettronico. Il
termine è generico e non specifica il formato
etext / e-text “electronic textbook”. Edizioni digitali dei libri di
testo scolastici
esingles / e-singles Ebook brevi di massimo 50 mila caratteri utilizzati
per approfondire articoli

3. Il formato epub
È un formato standardizzato per lo scambio e
la distribuzione di pubblicazioni e documenti
esclusivamente digitali.
Adatto dove l’elemento preponderante è il testo.
Un ePub definisce, rappresenta e codifica in modo
semantico i contenuti e li distribuisce in un
singolo file compresso (“.epub”) leggibile da
diversi reader

4. Confronto con il pdf

5. Epub 2 vs Epub 3
Caratteristiche Epub 2 Epub 3 Funzionalità
<nav> N Y Il tag <nav> di html5 sostituisce il
documenti NCX che però può essere
incluso nella versione 3 per rendere
compatibili anche i sistemi di lettura più
obsoleti.
CSS3 N Y Miglior controllo e gestione del testo e
degli elementi grafici.
Fogli stile
multipli
N Y Permette di inserire fogli stile multipli e
applicare media query.
OTF & WOFF N Y Si possono inserire font che non sono
installate nel sistema di lettura
incorporandoli nell’epub.
Supporto SVG N Y Inserimento di grafica vettoriale inline o
come file svg.
Metadata N Y La versione 3 presenta una ricca gamma
di opzioni per l’aggiunta di metadati, per
migliorare la distribuzione.

6. Epub 2 vs Epub 3 #2
Caratteristiche Epub 2 Epub 3 Funzionalità
Epub:type N Y Permette di migliorare la semantica dei
tag xhtml
Epub:trigger N Y Consente la creazione di interfacce
utente definite per controllare oggetti
multimediali.
<binding> N Y Fornisce degli handler script-based per
media type non standard
MathML N Y Inserimento diretto di codice MathML per
la scrittura matematica testuale senza
l’utilizzo di immagini
Scripting N Y Possibilità di inserire linguaggio
javascript per migliorare l’interattività
Audio & Video N Y Supporta i rich media element di html5
Media Overlay N Y Funzioni di TTS (pronuncia PLS, SSML)
Consente l’utilizzo di SMIL per la
rapprensentazione di audio sincronizzato
con il testo

7. Comparazione tra device

8. Anatomia di un epub
Un epub è creato utilizzando HTML
(xhtml5), lo stesso linguaggio di
descrizione utilizzato per le pagine web,
CSS (Cascading Sheet Style) per la
gestione grafica degli elementi e Javascript
per poter aumentare eventualmente
l’interazione con l’utente, invece tutti i file di
configurazione per la visualizzazione della
pubblicazione sono in formato XML.
Il vantaggio di utilizzare queste tecnologie
già note nel mondo del web porta ad avere
un ampio range di lettori e-reader
hardware e software compatibili.

9. Il futuro? Streaming book
• La filosofia di base è “books as data” cioè
insieme di dati e “content negotiation” cioè il
server invia i contenuti adattati alle condizioni
del device
• Quindi è un libro dove i contenuti sono divisi in
“pezzi” e che risiedono su un server
• I dati verranno inviati, tramite la rete, come
pacchetto unico, il quale risponderà alle
caratteristiche del reader

10. Streaming book

11. Tradotto
Il testo risiederà su un server, dove potrà
contenere anche traduzioni in diverse lingue.
Quando un reader apre il “contenitore” del libro,
il server invierà il testo in funzione della lingua
settata nelle preferenze, invierà le immagini di
formato, risoluzione e colore adeguati al reader,
layout adattati alla dimensione del display e infine
se presenta video e/o audio, file del formato
corretto, dimensione e compressione

12. Come lavorano gli editori?
Software di impaginazione
oppure
Software di impaginazione
+ Plug-in terze parti
Conversione
(manuale o automatica)

13. Come lavorano gli editori?
DocBook XML, TEI
AsciiDoc
Altre tipologie di formati
+ eventuali arricchimenti

14. Dall’autore all’editore
Altre tipologie di formati
Autore
Redattore
.doc / .docx
XML + XSLT
+ Framework

15. Cos’è HTML?
• È un linguaggio di Markup. Cioè applicare delle
etichette (tag) per descrivere gli elementi in
modo corretto.
Perché?
• Logica Semantica
• Formato standard e compatibilità
• Adattabile

16. Esempio
<h1>Ebook, il declino degli eReader e l’ascesa dei
tablet</h1>
<p>Non sempre l’innovazione tecnologica paga. Lo sa bene
l’americana <strong>Barnes &amp; Noble</strong>, che nel
suo ultimo trimestre ha visto le perdite nel mercato
digitale mangiarsi i profitti delle sue storiche (nonché
fisiche) librerie.</p>

17. Come si scrive un tag
ELEMENTI
<tag />
TAG ELEMENTO CON ATTRIBUTI
<tag attributo=“valore” […] />
CONTENITORI
<tag > contenuto vario </tag>
TAG CONTENITORI CON ATTRIBUTI
<tag attributo=“valore” […] > contenuto vario </tag>

18. Cos’è CSS?
• È un insieme di regole che applicano la veste
grafica a uno o più documenti HTML
Perché?
• Selettori diversi per applicare la grafica (id,
classi, tag)
• Usa il concetto di cascata
• È possibile creare elementi e layout responsivi

19. Esempio
h1 {
color: #F00;
text-align: center;
page-break-before: always;
}
p {
font-size: 1em;
line-height: 1.3em;
text-align: right;
}
.evidenziazione {
background-color: #FF0;
padding: 2px;
}

20. Come si scrive uno stile
SELETTORE {
attributo: valore;
attributo: valore;
attributo: valore;
[…]
}

21. HTML e HTML+CSS

22. File di configurazione opf
• È chiamato Package Document
• Ha estensione “.opf”
• Diviso in tre parti
 Metadata: contiene le informazioni riguardanti la
pubblicazione ed è utile per le biblioteche/librerie per
classificare la pubblicazione
 Manifest: è lista di risorse che compongono la pubblicazione
 Spine: determina l’ordine di visualizzazione e di lettura delle
risorse

23. Esempio
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<package xmlns="http://www.idpf.org/2007/opf" unique-identifier="bookid" version="2.0">
<metadata xmlns:dc="http://purl.org/dc/elements/1.1/">
<meta name="cover" content="copertina.jpg" />
<dc:title>Epub 3.0 Guida</dc:title>
<dc:creator>Matteo Ziviani</dc:creator>
<dc:description>Fasi per realizzare una pubblicazione
elettronica</dc:description>
<dc:publisher>Narcissus Self Publishing</dc:publisher>
[…]
</metadata>
<manifest>
<item id="CoverImage" href="CoverImage.xhtml" media-type="application/xhtml+xml"
/>
<item id="frontespizio" href="frontespizio.xhtml" media-
type="application/xhtml+xml" />
<item id="capitolo-1" href="capitolo-1.xhtml" media-type="application/xhtml+xml"
/>
<item id="capitolo-2" href="capitolo-2.xhtml" media-type="application/xhtml+xml"
/>
[…]
</manifest>
<spine toc="ncx">
<itemref idref="CoverImage" linear="no"/>
<itemref idref="frontespizio" />
<itemref idref="capitolo-1" />
<itemref idref="capitolo-2" />

24. Media Type riconosciuti
Media type immagini Applicazione
Image/gif Immagini GIF
Image/jpeg Immagini JPEG
Image/png Immagini PNG
Image/svg+xml Documenti/sintassi SVG
Media type Applicazioni Applicazione
Application/xhtml+xml Documenti XHTML
Application/x-dtbncx+xml Documenti NCX
Application/vnd.ms-opentype Font OpenType
Application/font-woff Font WOFF
Application/smil+xml Documenti SMIL
Application/pls+xml Text-to-speech (TTS)

25. Media Type riconosciuti
Media type Testo Applicazione
text/mathml Sintassi mml
Text/css File/sintassi CSS
Text/javascript File/sintassi Javascript
Media type Audio/Video Applicazione
Audio/mpeg File mp3
Audio/webm File webm (vorbis codec)
Audio/ogg File Ogg (vorbis codec)
Video/webm File webm (VP8 video codec)
Video/ogg File Ogg (Theora video codec)
Video/mp4 File MP4 (H.264 video codec e
AAC audio codec
Non tutti i reader supportano tutti i codec, quindi sarebbe buona norma inserire entrambi i
formati specificando ambedue le <source> attraverso il tag <video>

26. Cover size ottimali
Copertina interna: Usare una risoluzione di almeno 72 dpi,
la larghezza deve essere larga almeno 1400px ed è
consigliato mantenere una proporzione tra i lati di 6:9 o
6:9,6 con una dimensione di peso inferiore ai 2Mb
Copertina esterna: è la copertina che si va a piazzare sugli
scaffali delle varie librerie. Il file di copertina deve essere
in formato JPG, in alta risoluzione. Esso deve essere di
almeno 1875x2500 pixel affinché l’ebook vada in vendita
su Amazon ed Apple.

27. Cover size
EBOOK COVER SIZE SPECIFICATIONS BY eBOOK SITES:
Kobo Immagine di copertina non superiore a 2 MB.
Formato JPG o PNG
Amazon KDP Minimo 1000px per il lato lungo e 325 per il
lato corto. Rapporto altezza/larghezza 1.6.
Formato JPG o TIFF. Formato ideale
1563x2500 px
Apple Ibooks Almeno 1400px di larghezza. Formato JPG o
PNG
Barnes and Noble Non più di 2 MB. Larghezza ideale 1400px.
Formato JPG o PNG

28. Test epub
Il test di un epub sarebbe opportuno farlo sia a livello
hardware, cioè testarlo direttamente sui device e-reader ma
anche a livello software, provandolo sulle app di lettura più
utilizzate, previo una verifica di conformità del file.
1)Per verificare la conformità del file (preflight) si possono
utilizzare tre strumenti:
 Epub Check
 Il servizio online dell’IDPF
 Flight Crew

29. Test epub
2) Per verificare il risultato finale visivo è utile testare la
pubblicazione su diverse applicazioni di lettura come:
 Readium
 Adobe Digital Edition
 Ibooks (app nativa di IOS)
 Kobo (app scaricabile dal sito)
 Kindle Previewer (se si pensa di venderla anche
tramite amazon convertendola nel suo formato
proprietario)
È consigliato testarla anche su un e-ink reader per vedere
la resa cromatica in B/N (16 livelli di grigio)

30. Test epub
2) Per verificare il risultato finale visivo è utile testare la
pubblicazione su diverse applicazioni di lettura come:
 Readium
 Adobe Digital Edition
 Ibooks (app nativa di IOS)
 Kobo (app scaricabile dal sito)
 Kindle Previewer (se si pensa di venderla anche
tramite amazon convertendola nel suo formato
proprietario)
È consigliato testarla anche su un e-ink reader per vedere
la resa cromatica in B/N (16 livelli di grigio)

31. Test epub
2) Per verificare il risultato finale visivo è utile testare la
pubblicazione su diverse applicazioni di lettura come:
 Readium
 Adobe Digital Edition
 Ibooks (app nativa di IOS)
 Kobo (app scaricabile dal sito)
 Kindle Previewer (se si pensa di venderla anche
tramite amazon convertendola nel suo formato
proprietario)
È consigliato testarla anche su un e-ink reader per vedere
la resa cromatica in B/N (16 livelli di grigio)

32. Tips per la creazione
1. Aumenta la conoscenza di HTML e CSS
2. Seleziona un font adeguato e utilizza font free. Ricorda che spesso i reader
non tengono in considerazione la tua scelta di font e la sostituiscono con le
loro font di sistema.
3. Stilizzare i link e differenziarli da altri elementi.
4. I lettori aggiungono automaticamente i margini destro e sinistro, quindi
non forzarli.
5. Per i testi utilizzare unità di misura proporzionali (em)
6. Quando è possibile usare SVG che sono scalari.
7. Utilizza i giusti strumenti. Adobe Indesign può essere un punto di partenza
ma non è adatto per il fine tuning.
8. Separa il contenuto dalla presentazione. Il codice deve essere
semanticamente corretto. I lettori che fanno uso di riproduzione TTS devono
essere in grado di interpretare il contenuto. Attenzione all’utilizzo di immagini
che contengono testo e ricorda l’attributo alt alle immagini.

33. Tips per la creazione #2
9. Con iOS prova a disattiva le impostazioni di default di ibooks per valutare
le differenze e rendersi conto delle scelte stilistiche e cromatiche.
10. Usa colori ad alto contrasto, perché alcuni reader usano display e-ink (B/N)
11. Valuta correttamente se per gli elementi audio e video è meglio
l’inserimento, lo streaming o link a repository dedicati.
12. Non inserire numeri di pagina o riferimenti fissi. Il layout e reflowable.
13. In funzione del prodotto valuta correttamente il layout, se Fixed o reflow.
14. Gli elementi cliccabili non devono essere più piccoli di 45 pixel, il puntatore
non è visibile perché nei tablet c’è il tocco (touch) e la precisione nell’uso
del dito e minore della precisione nell’uso di un puntatore

34. Contatti
Matteo Ziviani
Scuola Grafica Cartaria «San Zeno»
Via Don G. Minzoni 50 - Verona
m.ziviani@sanzeno.org
zivianimatteo@gmail.com
@matteoziviani