Reveal.js
Présentations et technos Web
Thibaut Démare - 10 Avril 2015
En bref
Reveal.js est un framework Javascript qui permet de réaliser des présentations à l'aide de technos Web.
Le triplet HTML, CSS et Javascript est à la base de cet outil.
Avantages qu'apportent les technos Web
- Le concept du Responsive Design permet la compatibilité de la présentation avec différentes configurations (résolution, type de matériel,...).
- Le Web apporte de la dynamique (les animations CSS ou les scripts JS).
- C'est aussi facile que $\LaTeX$.
- On peut intégrer des composants Web comme des graphiques, des vidéos (Youtube ou pas),...
Y a-t-il d'autres frameworks?
Que propose vraiment Reveal.js?
- La coloration syntaxique de code source grâce à highlight.js (y compris du code Matlab ou du R).
- La personne qui présente peut avoir un affichage dédié avec un compteur, et des notes.
- Les formules de mathématiques peuvent être écrites en $\LaTeX$.
- On peut écrire le contenu en Markdown.
Que propose vraiment Reveal.js?
- On peut contrôler la présentation depuis un autre appareil tel qu'un téléphone.
- Il existe un plugin pour contrôler la présentation comme dans Minority Report.
- Et plein d'autres plugin, de thèmes,...
Existe-t-il un environnement WYSIWYG?
Oui ! slides.com
- Facile d'utilisation.
- Mais...
- il y a moins de libertés.
- Une version gratuite et une payante : gratuit = il faut rester connecté, et sa présentation est forcément publique.
Et en vrai ça donne quoi?
Structure du code
<!doctype html>
<html lang="en">
<head>
<title>Titre de la présentation</title>
<link rel="stylesheet" href="css/reveal.css">
<link rel="stylesheet" href="css/theme/black.css" id="theme">
<link rel="stylesheet" href="lib/css/zenburn.css">
</head>
<body>
<div class="reveal">
<div class="slides">
<section>
Une slide....
</section>
</div>
</div>
<script src="lib/js/head.min.js"></script>
<script src="js/reveal.js"></script>
<script>
Reveal.initialize({
transition: 'slide'
});
</script>
</body>
</html>