Tutos Numook

Remarque importante

En 2022 en France, 70 % du trafic Web provient d’appareils mobiles (dont une grande partie sur smartphones), c'est à dire sur des écrans de petite taille.
Il est donc important de ne pas créer, dans un livre Book Creator, des pages contenant trop d'informations. Cela obligerait le lecteur – sur smartphone en particulier – à constamment zommer/dézommer et rendrait donc la lecture peu fluide.
Il faut donc privilégier deux (ou plusieurs) pages aérées avec une police de caractères pas trop petite et des images de taille moyenne à grande plutôt qu'une seule page trop dense.

 

Le sommaire interactif

Lire sur le site de Book Creator : Le sommaire interactif.

Comment faire ?

À faire quand le livre est terminé.
Créer en début de livre une page Sommaire avec les titres des chapitres et les numéros de pages correspondantes.
Insérer, sur les numéros de page (page 14 dans l'exemple ci-dessous), un lien vers la page du livre correspondante (surligner le n° de page puis cliquer sur ).

Insérer, sur une icône Accueil, un lien vers la page du sommaire (cliquer sur l'icône puis sur i  et saisir le n° de la page contenant le sommaire dans la zone LIEN HYPERTEXTE).

Il suffit de créer une seule icône Accueil cliquable puis de la copier/coller sur les autres pages : sa position dans la page et le lien vers la page du sommaire seront conservés.
L'icône Accueil peut être remplacée par une zone de texte Retour au sommaire ou par une icône Sommaire.

Télécharger des icônes Accueil

La version SVG (modifiable) est téléchargeable ci-dessous.

Télécharger des icônes Sommaire

La version SVG (modifiable) est téléchargeable ci-dessous.

 

Les notes de fin de livre

Lire sur le site de Book Creator : Les notes de fin de livre.

Comment faire ?

À faire quand le livre est terminé.
Créer en fin de livre des pages contenant les notes.
Insérer, dans les pages du livre, des liens sur des mots (ou groupes de mots) conduisant à la page contenant la note correspondante.
Placer, en regard de chaque note, une icône Retour avec un lien conduisant à la page contenant le mot correspondant à cette note.
L'icône Retour peut être remplacée par une zone de texte Retour à la page.
La méthode est identique à celle employée pour le sommaire interactif.

Télécharger des icônes Retour

La version SVG (modifiable) est téléchargeable ci-dessous.

 

Les notes avec infobulles

Une autre solution consiste à créer des infobulles, un peu à la manière de Wikipedia.
Exemple :

Lire sur le site de Book Creator : Les notes avec infobulles.

Comment faire ?

Remarque : copier-coller un fichier audio avec une transcription est inutile. En effet, les changements appliqués à une transcription seront appliqués à la transcription de l'autre fichier audio.

Un fichier audio silencieux (1 seconde) est téléchargeable ci-dessous.

Autre exemple

Lire sur le site de Book Creator : Les infobulles.

 

Les images interactives

Lire sur le site de Book Creator : Les images interactives.

Comment faire ?

Télécharger l'image ci-dessous

Avec des liens absolus (externes au livre)

Importer l'image dans le livre puis insérer, sur cette image, un lien vers une page internet.

Positionner cette image au bon endroit, la redimensionner et cliquer sur i  puis rogner l'image afin de l'adapter à la zone que l'on souhaite rendre cliquable.
Cliquer de nouveau sur i  puis définir la transparence au maximum.

La zone cliquable est maintenant créée.

Il n'est pas toujours facile de rogner précisément une image de petite taille.
On peut pallier cette difficulté en superposant une forme qui rendra une partie de l'image transparente non cliquable.
Superposer une forme à l'image transparente.

Rendre cette forme transparente (aucun remplissage).

Avec des liens relatifs (internes au livre)

La méthode est identique à la précédente.
On insère un lien vers une page du livre à la place d'un lien vers une page internet.

Remarque
Afin d'obtenir une zone cliquable plus précise, il est possible de copier/coller l'image transparente (avec son lien) afin d'obtenir une zone cliquable d'une forme plus complexe qu'un rectangle. On peut également faire pivoter cette image ou encore lui superposer plusieurs formes transparentes.

 

L'intégration iframe

 

Lire sur le site de Book Creator : L'intégration iframe.

Comment faire ?

Cliquer sur +, sur PLUS, puis sur Intégré.

Dans la fenêtre qui s'ouvre, coller l'URL de la page web ou le code iframe puis cliquer sur Confirmer.

Dans la fenêtre qui s'ouvre, modifier éventuellement le titre puis cliquer sur Ajouter.

Les poignées d'étirement permettent de redimensionner le bouton cliquable.
En cliquant sur i , on peut masquer l'image miniature, modifier le titre du lien ainsi que sa police de caractère et sa couleur ou bien encore masquer ce titre et enfin le placer à l'avant ou à l'arrière plan. Si image miniature et titre sont masqués, on peut associer le lien à une image.

En mode lecture, lorsqu'on clique sur le bouton, la page web s'ouvrira dans une fenêtre qui se superposera au livre (un lien située sous cette fenêtre permet d'ouvrir la page dans le navigateur).

Remarques
• Lorsqu'on édite un lien hypertexte sur du texte ou une image, ce lien conduira vers une page web qui s'ouvrira dans un nouvel onglet du navigateur : le lecteur quittera donc le livre. L'intérêt de l'intégration iframe est d'ouvrir la page web en superposition du livre, sans sortir de celui-ci et sans possibilité de naviguer sur internet (en dehors des liens contenus dans la page affichée).
• Lorsqu'on réalise l'intégration iframe d'une vidéo hébergée sur YouTube, lors de la mise en pause ou en fin de lecture, des suggestions de vidéos peuvent apparaître. Un lien vers YouTube est également présent dans la barre de contrôle. Tous ces éléments peuvent être supprimés. La méthode est détaillée ICI.
• Cette méthode permet d'insérer une carte interactive Google Maps ou OpenStreetMap.
Comment récupérer le code iframe ?
Avec Google Maps
Se rendre sur le site Google Maps, saisir dans la barre de recherche le nom ou l'adresse du lieu que l'on souhaite repérer puis, dans le volet de gauche, cliquer sur Partager.
Dans la fenêtre qui s'ouvre, sélectionner Intégrer une carte puis cliquer sur COPIER LE CONTENU HTML.
Avec OpenStreetMap
Se rendre sur le site OpenStreetMap, saisir dans la barre de recherche le nom ou l'adresse du lieu que l'on souhaite repérer puis, dans la partie droite, cliquer sur Partager.
Dans le volet qui s'ouvre, cocher Inclure le marqueur (le marqueur est repositionnable), cliquer sur HTML puis copier le code.

Haut de page