atelier normes & standards juin 2018 annexe : crÉer un ... · 1 1.options d’exportation...
TRANSCRIPT
ATELIER NORMES & STANDARDS JUIN 2018ANNEXE : CRÉER UN EPUB ACCESSIBLE AVEC INDESIGN
A. INTRODUCTION
2
1. Prérequis
• Conception éditoriale
• Etat des fichiers InDesign
2. Outils
INTRODUCTION
Créer un EPUB accessible avec InDesign, c’est en premier lieu créer un EPUB !
Des contraintes et prérequis existent donc :
• du fait du format EPUB lui-même
• du fait d’InDesign, dans une version donnée (paramétrages d’export, fonctionnalités disponibles, etc.)
• et de par la nature même du mode de production (export d’un format numérique depuis un outil
de mise en page)
Anticiper ces contraintes, dans les phases de conception éditoriale puis de production, permet de mieux
les surmonter.
3
PRÉREQUIS POUR CRÉER UN EPUB
Conception éditoriale :
Penser la transition page papier/page écran (par ex. : organisation et densité de l’information)
Penser aux atouts du numérique : liens hypertextes, tables, index, etc.
S’adapter aux contraintes du format et du parc de lecteurs EPUB. Attention :
▪ au sens qui serait porté par des couleurs ou des contrastes de couleur
▪ aux contenus informationnels ou de navigation qui seraient présents dans les en-têtes
et pieds de page
▪ aux mises en page complexe qui seraient essentielle à une bonne lecture du document :
pages en regard, double page, fond perdu, multicolonnage, habillage texte/illustration
4
◼ Contraintes : exemples ◼
• En-tête et pied de page : permis par EPUB 2 et 3, mais non supporté par les liseuses
• Fond perdu : uniquement en fixedlayout
• Multicolonnage : permis par EPUB 2 et 3, mais rendu variable sur les liseuses
Source : CNDP
5
PRÉREQUIS POUR CRÉER UN EPUB AVEC INDESIGN
Les nature des contenus InDesign a un impact sur le travail à réaliser. Dans l’idéal, il faudrait :
➢ des contenus structurés (« stylés »)
➢ sans styles locaux
➢ une feuille de styles explicite (nommage, organisation)
➢ un ordre logique de lecture parfaitement décrit :
— enchaînement linéaire des flots de texte ou des blocs
— ordre déduit de la structure XML ou du mode Articles
— ancrage des objets hors flot principal (illustrations, encarts…) dans le flot principal
➢ des tables (matières, figures…), notes et index générés à l’aide des outils dédiés InDesign
(et non à la main)
➢ pas de mise en forme forcée dans les contenus : saut de ligne forcé, césure non
conditionnelle, ligne blanche, espaces multiples
6
◼ Contraintes : exemples ◼
• En-tête et pied de page non exportés
• Placement des illustrations et des hors-textes non ancrés
• Placement des notes : en fin de chapitre avec EPUB 2, sous forme de pop-up avec EPUB 3
Source : CNDP
7
◼ Contraintes : ordre d’exportation des contenus ◼
L
L’algorithme d’export d’InDesign conduit à un ordre d’apparition erroné des contenus dans l’EPUB.
8
OUTILS
Utiliser une version récente d’InDesign :➢ plus de contenus exportés automatiquement au fil
des versions (par exemple les index)
➢ meilleure qualité de l’export HTML
➢ plus d’options de paramétrage de l’export EPUB
En pratique :➢ InDesign CS6 (2012)
➢ InDesign CC (2014 à 2018)
➢ et un éditeur de code
9
B. POUR CRÉER UN EPUB ACCESSIBLE AVEC INDESIGN
10
1. Ordre logique
2. Structure hiérarchique
3. Balisage HTML
• Notes de bas de page
• Annotations sémantiques
• Langues
• Espaces verticaux
4. Description des images
5. Tables
• des repères
• des folios
6. Métadonnées
Ancrer les objets dans le flot de texte principal (ou utiliser le mode Articles pour une mise en page sans flot)
11
Ordre logique
Beaucoup de manipulations pour
certaines maquettes
Impacts possibles sur la maquette
papier
• Pour les légendes d’illustration, utiliser Objet/Générer une légende
• Découper l’ouvrage en chapitre à l’aide du panneau Modifier toutes les balises d’exportation.
• Dans chaque chapitre, la balise de plus haut niveau doit être <h1>. Elle doit être unique (attention aux titres maquettés sur plusieurs lignes…)
12
Structure hiérarchique
La balise HTML <title> doit être signifiante or InDesign la renseigne avec le nom du fichier :
<title>Monde_fantastique-2</title>
13
Utiliser un balisage HTML sémantique : Modifier toutes les balises d’exportation ou
Options de style de paragraphe/Exportation du balisage
13
Styles de
paragraphes HTML
"montitre1" <h1>
"montitre2" <h2>
"encadré" <aside>
"maliste" <li>
"fig" <figure>
"legende" <figcaption>
…
Balisage HTML
• Les associations créées sont mémorisées dans le gabarit InDesign et peuvent donc être réutilisées
Styles d’objet HTML
"figureChap" <figure>
"maBoite" <aside>
"debut" <bsection>
…
• Idem pour les styles de caractères
14
Styles de
caractères HTML
"monItalique" <i>
"citation« <i>
"gras" <b>
"déclamation" <em>
…
Balisage HTML (suite)
• InDesign propose une liste fixe de balises
HTML, mais elle est éditable
• Idem pour les styles d’objet
• Une bonne pratique consiste à utiliser une feuille de styles CSS pour la
production EPUB (conçue pour une collection, un éditeur, etc.)
• Cela permet de garantir une production homogène, d’utiliser des
polices différentes des polices print, etc.
• InDesign autorise de ne pas exporter sa propre
feuille CSS et d’importer à la place une feuille
CSS externe (onglet HTML et CSS du panneau
d’exportation
15
Gestion des CSS
• Des ruptures de contexte dans le texte doivent être marqués par une balise <hr/>
afin que la synthèse sonore puisse faire une pause.
• Dans InDesign, insérer un style de paragraphe vide et faire correspondre avec une
balise d’export HTML <hr/>
• Styler cette balise avec du CSS dans l’EPUB
(symbole, espace vertical, filet horizontal…)
16
Espaces verticaux
Notes de bas de page
Pour les notes de bas de page,
paramétrer un balisage EPUB 3
17 Ne fonctionne pas sur toutes les liseuses. Le
codage HTML est donc à retoucher pour rendre
compatible avec liseuses EPUB 2 et (certaines)
liseuses EPUB 3
Listes
Pour les listes à puce et les listes numérotées, ne
pas utiliser l’option Convertir en texte,
afin de conserver un balisage
sémantique :
<ol>, <ul>, <li>
18
Cas des notes de fin de chapitre
[InDesign CC 2018
uniquement]
19
Balisage non sémantique
Lecture audio synchronisée
Avec structuration : balisage HTML et annotations sémantiques
Avec balisage anonyme <div> et feuille de styles CSS (orienté mise en page)
20
Annotations sémantiques
Lecture audio synchronisée
21
1Sur les objets, à l’aide de
l’onglet Options d’exportation
d’objet/EPUB et HTML
• Choisir le type epub:type adéquat
dans le vocabulaire.
• L’export HTML est :
<div epub:type="chapter">
…
</div>
Annotations sémantiques
Lecture audio synchronisée
22
Annotations sémantiques : limitations
On ne peut pas utiliser un attribut aria:role
Sur les objets uniquement : blocs, flots de texte. On ne peut
donc pas positionner epub:type sur des styles de
paragraphes ou de caractères.
Il n’est pas possible de créer une
structure logique hiérarchique annotée :
<section epub:type="chapter">
<h1>
<p>
<section epub:type="section">
<h2>
<p>
</section>
…
</section>
Lecture audio synchronisée
23
La ou les langues principales du document sont référencées dans le manifeste OPF et sont donc connues des dispositifs de lecture et d’assistance.
Mais les contenus textuels (mot, ligne, paragraphe…) dans des langues autres doivent être signalés à l’aide des attributs lang et xml:lang
<i lang="FR" xml:lang="FR">J’aime mange de la baguette</i>
<span class="allemand" lang="de-DE" xml:lang="de-DE">Himemberg</span>
Langues
Lecture audio synchronisée
24
Les langues présentes dans le document InDesign sont exportées comme métadonnées dc:language dans le manifeste OPF.
La langue principale du document (définie dans Préférences/Dictionnaire) est exportée dans les fichiers HTML (attributs lang et xml:lang sur la balise <body>)
La langue définie dans les styles de paragraphe et de caractère (Formats de caractères avancés) est exportée :
<span class="anglais" lang="en-EN"
xml:lang="en-EN">New York</span>
Langues (suite)
Les attributs lang devraient être placés sur
la balise <html> de chaque fichier et non sur
<body>
Toutes les langues présentes (même de manière
très ponctuelle) sont exportées
dans le manifeste .opf
Description des imagesAnnoter les contenus non textuels avec Options de style d’objet/Options d’exportation/Texte de
remplacement (pour un style d’objet) ou Options d’exportation d’objet/Texte de remplacement (pour
les objets)
25 • Le texte est placé dans un attribut alt :
alt="texte descriptif"
Description des images
Les textes descriptifs peuvent provenir :
—de la zone de saisie dans InDesign
—de la structure dans InDesign (panneau
Affichage/Structure)
—des annotations alt saisies dans Word
—des champs de métadonnées XMP des
illustrations importées (titre, description,
titraille, ou autre champ XML à spécifier)
NB : les images décoratives doivent avoir
un attribut alt vide : alt=""
26 Exemple Adobe Photoshop
Table des repères (landmarks)
Une table des repères permet d’identifier les principaux éléments présents dans un ouvrage
(préface, début du contenu principal, annexes, etc.) et ses outils de navigation (TdM, table des
figures, index, etc.).
<nav epub:type="landmarks">
<h1>Guide</h1>
<ol>
<li>
<a epub:type="toc" href="tdm.xhtml">Table des matières</a>
</li>
<li>
<a epub:type="bodymatter" href="chap001.xhtml#bodymatter">Chapitre 1</a>
</li>
…
<li>
<a epub:type="index" href="index.xhtml">Index</a>
</li>
</ol>
</nav>
27
Lecture audio synchronisée
28
1
1.Options d’exportation d’objet,
sur un flot de texte, appliquer la
structuration sémantique epub:type
(« Document Partitions ») : cover,
bodymatter. backmatter…
2. Exporter en version EPUB 3.
3. La table des repères est générée
d’après les epub:type.
Ne fonctionne que sur les flots de texte
Il faut ensuite traduire en français
les entrées de la table.
Table des repères avec InDesign
Table des folios (page list)
Liens entre contenu numérique et folios papier
29
les marqueurs insérés dans le contenu
…
<div class="p-indent">Nous allons avoir sous les
yeux les êtres les plus dignes de l’attention du
physicien. Que l’imagination, éclairée par le
flambeau de la science, rassemble en effet tous
les produits organisés de
<span id="page002" epub:type="pagebreak"
title="002"></span>la puissance créatrice…
Table des folios
Gestion de l’affichage des tables par les liseuses
30
les folios papier
<nav epub:type="page-list">
<h1>Pages</h1>
<ol>
<li><a
href="ebpt6k6289050k_tp01.html">3</a></li>
<li><a
href="ebpt6k6289050k_p01.html">5</a></li>
…
</ol>
</nav>
Commutation des folios numériques/papier
31
11. Script InDesign (AppleScript, JavaScript)
pour insérer des ancres de page.
2.Marqueurs exportés automatiquement lors
de l’export EPUB :
<span class="sautPage">{51}</span>
3. Scripts pour :
• Créer les marqueurs dans le
contenu :
<a epub:type="pagebreak" id="p51"</a>
• et générer la table des folios :
<nav epub:type="page-list" hidden="">
<h1>Pages</h1>
<ol>
…
<li><a href="chap1.xhtml#p51">51</a>
</li>
…
Table des folios avec InDesign
Il faut utiliser des scripts*
Il faut spécifier quelle est l’œuvre source dans les
métadonnées (dc:source)
* PageStaker + EPUBOgrify
Métadonnées
Ajouter les métadonnées d’accessibilité dans le manifeste .opf
<meta property="schema:accessMode">textual</meta>
<meta property="schema:accessMode">visual</meta>
<meta property="schema:accessModeSufficient">textual,visual</meta>
<meta property="schema:accessModeSufficient">textual</meta>
<meta property="schema:accessibilityFeature">transcript</meta>
<meta property="schema:accessibilityFeature">MathML</meta>
<meta property="schema:accessibilityFeature">alternativeText</meta>
<meta property="schema:accessibilityHazard">flashing</meta>
…
32 Il n’est pas possible d’insérer ces métadonnées dans InDesign
NOT WITH INDESIGN
Après la finalisation de l’export dans InDesign :
— Régler les points signalés plus haut (en rouge)
— Inclure si nécessaire des polices de caractères
Pour les caractères non supportés par les logiciels de lecture (Adobe Digital Edition a une faible couverture
Unicode) : polices non latines ; caractères spéciaux, phonétique, mathématique, etc.
Pour utiliser des polices « numériques » et non pas les polices print
— Retoucher/nettoyer le balisage HTML exporté par InDesign.
33
CONCLUSION
La production d’un EPUB accessible avec InDesign est possible.
Cependant, ce mode de production est tributaire de la nature même du travail à
réaliser et peut conduire à :
— des tâches manuelles répétitives (par ex. ancrer des blocs dans le flot de texte)
— un réglage complexe des paramètres d’export
Néanmoins, la mise en œuvre d’un gabarit InDesign en amont (en anticipant la
production numérique) et de méthodes de maquettage rigoureuses permettent
d’atténuer ce point.
Concernant l’accessibilité, des limitations demeurent (en particulier pour l’annotation
sémantique) mais elles ne sont pas un obstacle à l’obtention d’un EPUB doté d’un bon
niveau d’accessible.
34
TOUTES LES
RESSOURCES NORMES
ET STANDARDS :
HTTPS://WWW.SNE.FR/N
UMERIQUE-2/NORMES-
ET-STANDARDS/
TOUTES LES
RESSOURCES POUR LA
PRODUCTION DE LIVRES
NUMERIQUES
ACCESSIBLES :
HTTPS://WWW.SNE.FR/N
UMERIQUE-
2/RESSOURCES-POUR-
LA-PRODUCTION-DE-
LIVRES-NATIVEMENT-
ACCESSIBLES/
35
La présente annexe a été produite par Sébastien Cretin (FeniX),
Louis Marle (Albin-Michel) et Jean-Philippe Moreux (BnF)