Outils de publication en ligne

Page 1

Présentation du w3qc [24 avril 2006]

Diaporama (X)HTML-CSS

[COMPARATIF] Table des matières Présentation du w3qc [24 avril 2006] ..............................................................................................................1 Introduction......................................................................................................................................................2 Pourquoi un document au format OpenOffice / pdf ?....................................................................................2 Démonstration...................................................................................................................................................2 Présentation.......................................................................................................................................................3 But...................................................................................................................................................................3 Technologie....................................................................................................................................................3 Fonctionnalités communes.............................................................................................................................3 Fonctionnalités spécifiques.............................................................................................................................3 Avantages et inconvénients............................................................................................................................3 Liste des solutions.............................................................................................................................................4 Outils conformes en (x)html / css ..................................................................................................................4 Autres outils inadéquats..................................................................................................................................4 Aperçu des solutions.........................................................................................................................................5 Ajax-s..............................................................................................................................................................5 Domslides.......................................................................................................................................................5 OperaShow.....................................................................................................................................................6 S5....................................................................................................................................................................7 Slidy................................................................................................................................................................7 Comparatif........................................................................................................................................................8 Conclusion......................................................................................................................................................10 Liste de liens...................................................................................................................................................11 Crédits.............................................................................................................................................................12 Historique des modifications..........................................................................................................................13 Licence du document......................................................................................................................................13

Version 1 – 24 avril 2006


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

Introduction Ce comparatif a pour but d'aider à faire un choix entre plusieurs systèmes qui offrent à première vue les mêmes options. Différents tests montreront les avantages et inconvénients de chacun des outils séléctionnés : ✔ ✔ ✔

Rendu sur plusieurs navigateurs web : Mozilla Firefox, Internet Explorer, Opera, Safari et Konqueror. Options disponibles : raccourcis, menu de navigation, .. Création/mise à jour des pages : Code, outil d'assistant à la création, ..

À noter, que dans cette version du comparatif, il n'y a aucun point abordé sur l'accessibilité des documents générés. Cette partie du travail pourrait se faire dans une prochaine version, celui ci étant sous licence LGPL et libre d'être modifié par quiconque le souhaite.

Pourquoi un document au format OpenOffice / pdf ? Ce document a été réalisé à l'aide d'OpenOffice version 2 alors qu'il aurait pu utiliser un des systèmes énonçés dans ce comparatif. Il y a plusieurs raisons à cela : ✔ ✔ ✔

Par manque de temps : J'ai démarré avec OpenOffice avant de même de pouvoir juger quel était l'outil le plus approprié par rapport à mes besoins. Pour ne pas influencer le choix des utilisateurs : Si j'avais utilisé le système S5 de Meyer, qui aurait lu le comparatif ? ;) Mon document ne convient pas pour un format diapositive : Je trouve qu'avec des systèmes de diaporama, nous sommes souvent contraint de n'afficher du contenu que par bloc parce que l'on est dépendant de la taille de l'écran en hauteur, dans mon comparatif certains éléments comme les tableaux auraient nécessité plus de place (ce que je ne permet pas le format S5 de Meyer par exemple...) Exportation pdf : C'est plus simple d'exporter un document OpenOffice au format PDF. Même si je ne l'aborde pas dans ce comparatif, mais l'exportation d'une page (x)html/css en pdf reste très difficile.

Malgré toutes ces raisons, j'aurais souhaité pouvoir rendre le document plus visible et accessible s'il avait été sur le web, dans l'état actuel il sera diffusé au format PDF et OpenOffice pour permettre la modification plus facilement par d'autres utilisateurs.

Démonstration Une présentation vaut mille mots, alors pour commencer voici un exemple de présentation réalisée à l'aide du système « S5 » d'Éric Meyer : « Développez et testez vos pages Web avec Mozilla Firefox » http://www.framasoft.net/IMG/html/firefoxwdev2-traduction.html

www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

Présentation But Les différents systèmes existants ont pour but de réaliser des présentations (texte + image en générale) qui seront diffusables en ligne et qui peuvent être des alternatives à Powerpoint par exemple. Des boutons suivant/précédent ainsi qu'un index des différentes pages permet de naviguer à travers l'ensemble du document.

Technologie Dans tous les cas de figure, les formats du diaporama sont fondés sur trois langages : le XHTML, le CSS et le Javascript. Suivant le système, on trouve plus ou moins de code Javascript. Dans un avenir proche, l'ajax sera certainement de plus en plus utilisé et la génération de ces diaporamas sera grandement facilitée par l'ajout d'éditeur Wysiwyg (What you see is what you get.). Ce comparatif a exclu toutes les technologies nécessitant l'installation d'interpréteur spécifique (Perl, Php, ..) de manière à pouvoir générer facilement tout le code manuellement.

Fonctionnalités communes Voici quelques fonctionnalités que l'on retrouve dans la plupart des systèmes de génération de diaporama XHTML/CSS : ✔ ✔ ✔ ✔ ✔ ✔ ✔

Mode diaporama / impression (passage de l'un à l'autre avec un clic sur une touche du clavier) Bouton précédent / suivant (navigation possible également au clavier) Génération automatique d'un menu de navigation (pour passer rapidement à une page spécifique) Affichage du numéro de page en cours et du nombre de pages totales (exemple : page 2 sur 34) Entête et pied de page personnalisable. Compatibilité avec l'ensemble des navigateurs (dans le meilleur des mondes ;-) Mode pleine page (permet de profiter du mode pleine page du navigateur)

Fonctionnalités spécifiques Certains systèmes amènent quelques notions supplémentaires ou outils annexes pour la création du diaporama. ✔ ✔ ✔ ✔

Liste incrémentale (permet d'afficher certaines informations de la page les unes après les autres) Taille des polices proportionnelles (tous les systèmes ne permettent pas toujours d'obtenir du contenu qui s'adapterait à la taille de votre écran, aussi bien le texte que les images SVG par exemple) Outils Offline/Online permettant la création et l'alimentation du contenu des pages. Commander la navigation dans les pages à la voix (OperaShow)

Avantages et inconvénients Voici une liste des avantages à utiliser un système de diaparama en ligne et bien entendu les quelques désavantages que cela implique : www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

Avantages : ➢ Mettre à disposition une présentation sur le net de type « powerpoint » sans nécessité l'installation de programme ou de plug-un spécifique et donc pouvoir modifier facilement ce contenu par la suite. ➢ Permet de rédiger son texte dans un éditeur (exemple : Dreamweaver) et d'avoir un rendu sous forme de diapositives. ➢ Le contenu est plus accessible grâce à l'utilisation du (x)html et des feuilles de style CSS ➢ La plupart des systèmes offrent la possibilité de pouvoir afficher les diapositives au format « impression » les unes en dessous des autres.

Inconvénients : ➢ Il est souvent difficile de séléctionner un texte sur une diapositive pour en faire un copier-coller ➢ Mettre une page en favori n'est pas toujours une option disponible avec ce type de système. ➢ Certains systèmes se limitent à n'afficher que ce que la hauteur de l'écran permet. ➢ L'exportation d'un fichier HTML/CSS au format PDF n'est pas toujours correcte. ➢ Il faut quelques connaissances en HTML et CSS pour avoir un rendu tel qu'on le souhaite.

Liste des solutions Voici la liste des solutions que nous allons étudier dans ce comparatif ainsi que celles que nous avons exclues parce qu'elle ne généraient pas de code XHTML et/ou ne faisaient pas appel aux CSS pour la personnalisation du rendu visuel.

Outils conformes en (x)html / css Par ordre alphabétique : ➢ ➢ ➢ ➢ ➢

AJAX-S : par Robert Nyman DomSlides : par Christian Heilmann OperaShow : par Mark Schenk pour le navigateur « Opera » S5 : par Éric Meyer Slidy : par Dave Raggett

Autres outils inadéquats Certaines de ces solutions ne sont pas à exclure, mais dans la plupart des cas, soit elles nécessitent l'installation de programme tier, un environnement de travail spécifique (serveur web par exemple), soit elles ne font pas appel aux feuilles de style, ou à l'utilisation du javascript ce qui pose problème pour la mise à jour et le coté « accessible » de la chose. Par ordre alphabétique : ➢ ➢ ➢ ➢

B5 : Un fork de Slidy (w3c) OpenOffice Impress (exportation HTML) : Ne génère que des pages HTML statiques avec très peu de CSS PerlPoint : Nécessite perl pour fonctionner Powerpoint : [A tester]

www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc ➢ ➢ ➢ ➢

Diaporama xhtml-css [comparatif]

24 avril 2006

Slidemaker : Fonctionne avec Perl (w3c) Spip – Squelette S5 Slide show : Utilisation du système « S5 » de Meyer, mais nécessite l'installation du cms SPIP. Thumbstacks : Un powerpoint en ligne, mais propriétaire fonctionnant principalement avec du Javascript. Tiki-slideshow : Nécessite l'installation du cms Tikiwiki pour générer des diaporamas en ligne. Voir aussi tous les outils utilisant le code du système « S5 » de Meyer à cette adresse : http://microformats.org/wiki/s5-tools/

Aperçu des solutions Ajax­s L'auteur d'Ajax-s avait pour but premier de réaliser un système permettant à ceux qui n'avaient pas de connaissance en HTML de pouvoir réaliser des diaporamas comme ceux de Meyer. Malheureusement à l'heure actuelle son procédé ne fonctionne qu'avec Internet Explorer 6 et les navigateurs basés sur Mozilla Firefox. Nom AJAX-S : AJAX-Slides (ou Asynchronous JavaScript and XML Slides) Auteur Robert Nyman Page officielle http://www.robertnyman.com/2005/11/13/proudly-presenting-ajax-s/ Création Novembre 2005 Version Release 2 Technologie XHTML, CSS, Javascript, XML, XSLT Démonstration http://www.robertnyman.com/ajax-s/ Les plus

Les moins

Pas de connaissances requises en HTML si on choisi de le faire en XML ➔ Contenu incrémental (3 styles : passé, actif, ..) ➔ Taille de la police de caractère qui s'ajuste à la taille du navigation ➔ Menu de navigation sous forme de boite de sélection Au format XML il y a un problème de compatibilité : cela ne fonctionne qu'avec IE6 et navigateur basé sur le moteur de Mozilla Firefox (à cause de la transformation XSLT et de certaines fonctions propre à l'ajax qui ne semble pas supporté par Camino ou Konqueror par exemple) ➔ Une page unique, impossible d'avoir un lien vers une diapo en particulière ➔ Pas de raccourci clavier (ex : mode « diaporama » au mode « impression »)

Domslides L'auteur de Domslides qui connaissait tout comme celui d'Ajax-s l'existence du système S5 de Meyer souhaitait corriger les lacunes de celui-ci et offrir un fonctionnement différent, ainsi trois points ont été revus : ✔ ✔

L'auteur ne souhaite pas utiliser les raccourcis claviers, il a donc omis ces options là On est pas contraint de se limiter à la hauteur de l'écran pour l'affichage du contenu

www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc ✔

Diaporama xhtml-css [comparatif]

24 avril 2006

Le contenu dans la page est hierarchique contrairement à celui généré par Éric Meyer Nom DOMSlides Auteur Christian Heilmann [http://wait-till-i.com/] Page officielle http://icant.co.uk/domslides/ Création Juin 2005 Version 1.0 Technologie HTML, CSS, Javascript Démonstration http://icant.co.uk/domslides/ Les plus

Personnalisable depuis le fichier Javascript (navigation, table des matières, ..) Affichage du nombre de diapo + menu de navigation ➔ Table des matières (n'utilise pas de boite de sélection) ➔ Lien possible vers une diapositive particulière (ex : index.html#slide10) ➔ L'ensemble des fichiers ne prend pas beaucoup de poids ➔ On peut cacher certaines pages dans la table des matières ➔ ➔

Les moins

➔ ➔

Pas de navigation via les flèches du clavier Impossible d'afficher le mode « impression » si ce n'est en désactivant le javascript.

OperaShow On a peu d'information concernant le développement du système lancé par le navigation Opera, ce qui s'explique sans doute par le fait que ce n'est pas un développement basé sur une licence ouverte, mais propriétaire à Opera.L'auteur qui est derrière OperaShow s'appele « Mark Schenk » il a collaboré avec Éric Meyer pour rendre compatible le système S5 de Meyer avec OperaShow. Nom Opera Show Auteur Mark Schenk Page officielle http://my.opera.com/community/dev/operashow/ Création 2005 ? Version 1.0 Technologie (X)HTML, CSS 2, Javascript

[Nécessite le navigateur Opera 7.2 et plus]

Démonstration http://www.opera.com/support/tutorials/operashow/ (appuyer sur F11) Les plus

Les moins

www.tc2l.ca

Le mode plein écran prend 100% de l'espace ➔ Les polices s'ajustent à la résolution de l'écran ➔ On peut cacher certains éléments à la projection ➔ Un générateur est présent pour assister la création de diaporama ➔ Un éditeur offline (shareware et trial 30 jours) Format propriétaire à Opera (ne fonctionne qu'avec le navigateur Opera !!) ➔ Il n'existe pas de gabarit simple pour démarrer sans passer par le générateur ➔ Aucun raccourci clavier hormis le PagUp et PagDown pour passer d'une diapo à 24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

Nom Opera Show ➔

l'autre Il n'existe pas de table des matières

S5 Éric Meyer s'est basé sur le procédé de Tantek Çelik pour développer sa version originale, il a ensuite travaillé pour rendre son système compatible avec Opera Show (OSF 1.0) puis XOXO. C'est sans doute l'une des solutions les plus ambitieuses et compatibles du moment avec un site très bien documenté et des mises à jour fréquentes. Sans oublier que c'est une source d'inspiration pour plusieurs autres systèmes (Domslides, Ajax-s, ...) Nom S5 : Système de préSentation Simple et baSé sur les Standards (Simple Standards-based Slide Show System) Auteur Éric Meyer Page officielle http://www.meyerweb.com/Éric/tools/s5/ Création 30 mai 2005 Version 1.1 (stable) / 1.2a2 (développement) Technologie XHTML, CSS, Javascript Démonstration http://www.meyerweb.com/Éric/tools/s5/s5-intro.html Les plus

Les moins

Prochaines options à venir

Le texte s'adapte à la taille du navigateur ➔ Affichage incrémental de certains éléments (texte, images) ➔ Accès direct à une diapo (ex : index.html#slide7) ➔ Plusieurs raccourcis clavier (saisie d'un numéro de diapo + touche « entrée ») ➔ Compatible avec le format OperaShow et XOXO ➔ Le menu de navigation peut être caché ou visible (dans les paramétres) ➔ Affichage des numéros de diapositive dans le menu de navigation. ➔ Beaucoup de documentation, des thèmes ainsi que des mises à jour fréquentes L'affichage semble plus lent sur certains navigateurs (sous linux uniquement ?) ➔ L'ensemble du contenu doit s'afficher dans la page courante, sinon impossible d'utiliser la barre de défilement verticale du navigateur. Amélioration des éléments incrémentaux (état d'avancement) ➔ Gestion de « notes » pour chaque diapositive ➔ Gestion du temps (présentation total, par diapositive)

Slidy L'auteur est un des membres du consortium w3c, il travaille sur plusieurs projets dont HTML Tidy, EzMath et HTML Slidy. Tout récemment il a entreprit des travaux sur les navigateurs vocaux. Son système fait partie des outils du w3c pour la génération de diaporama. L'on retrouve également parmi ces outils deux autres systèmes similaires : B5 (fork de Slidy) et Slidemaker/slideme (nécessite Perl). – Plus d'informations ici : http://www.w3.org/Talks/Tools

www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

Nom HTML Slidy Auteur Dave Raggett [http://www.w3.org/People/Raggett/] Page officielle http://www.w3.org/Talks/Tools/Slidy Création 2005 Version 1.0 Technologie XHTML, CSS, Javascript Démonstration http://www.w3.org/Talks/Tools/Slidy Les plus

Les moins

Prochaines options à venir

Beaucoup de raccourcis claviers (augmenter la taille de la police, déplacement, afficher le pied de page, mode diaporama/pages, ..) ➔ La taille des polices ainsi que le logo (SVG) s'ajustent à la taille du navigateur. ➔ Affichage incrémental ainsi qu'expansif [+/-] ➔ Page d'entête différente des autres ➔ Facile de mettre une diapositive particulière en favori Beaucoup de code Javascript qui contrôle l'affichage de certains éléments (difficile de personnaliser certaines parties dont le pied de page par exemple et la francisation)

Du SVG utilisable avec IE sans l'installation de plug-in ➔ Utilisation de fonction javascript propre à l'ajax ➔ De la voip (synchronisation des diaporamas avec la voix) ➔ Filtre powerpoint/openoffice + exportation au format PDF ➔ Editeur graphique Wysiwyg

Comparatif Voici quelques tableaux permettant d'avoir une vue d'ensemble des différentes possibilités de chacun des systèmes de diaporama. Les tests ont été effectués ainsi : pour chaque outils comparés, j'ai tenté l'intégration d'une présentation déjà existante sur le web : La présentation est celle de Denis Boudreau du w3qc présentée dernièrement au tc2l et disponible à cette adresse : http://w3qc.org/conferences/tc2l-060405/ (ces travaux ne seront publiés que dans la version 2 de ce comparatif et seront disponibles à la fin du tableau ci-dessous dans « Tests avançés ».) Ajax-s

Domslides

OperaShow

S5

Slidy

Version

Release 2

1.0

1.0

1.1 / 1.2

?

Date de la 1ere version

11/2005

06/2005

2005

05/2005

2005

Technologie

XHTML, CSS, HTML, CSS, Javascript, Javascript XML, XSLT

XHTML, CSS 2, Javascript

XHTML, CSS, XHTML, Javascript CSS, Javascript

Autres formats

-

-

OSF, XOXO

www.tc2l.ca

-

-

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif] Ajax-s

Domslides

Documentation

-

-

Licence

?

CCommons Paternité 2.5

OperaShow

24 avril 2006 S5

Slidy -

Copyright Opera

Domaine Public Copyright w3c

Compatibilité fureteur Internet Explorer 6

Oui

Oui

-

Oui

Oui

Firefox 1.x

Oui

Oui

-

Oui

Oui

Konqueror

-

?

-

Oui

Oui

Opera

-

Oui

Oui

Oui

Oui

Safari

-

?

-

Oui

?

Environnement Raccourcis claviers

3

Table des matières

1à3

2

+10

+10

Menu déroulant Menu volant

-

Menu déroulant Menu volant

Lien direct vers une diapositive

Oui

Oui

?

Oui

Oui

Bookmarker une diapositive

-

-

-

-

Oui

Editeur Wysiwig Hors ligne/En ligne

-

-

Shareware Shareware (QuickShow) (CityDesk)

A venir

Création

Kit

Kit

Assistant en ligne

Kit

Kit

Thème téléchargable

-

-

-

Oui

-

Le texte s'adapte à la taille du navigateur

Oui

-

Oui

Oui

Oui

-

-

Génération

Rendu/Personnalisation

Contenu incrémental (plusieurs états possibles) Contenu expansif

-

-

-

-

Oui

Mode « impression »

Oui

-

Oui

Oui

Oui

Oui

?

Personnalisation (fichier javascript) Cacher certains élements en ? mode « projection »

? Oui

Oui

Zone de contenu du texte (propre à l'écran ou infini) Tests avançés Taille des fichiers (html, www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif] Ajax-s

Domslides

OperaShow

24 avril 2006 S5

Slidy

css, xml, js) Validation (X)HTML Validation CSS Facilité de création (balises, options, ..) Appréciation générale

Conclusion Cette première version du comparatif ne permet pas encore de pouvoir évaluer complètement l'ensemble des solutions, pour cela il faudrait travailler d'avantage à la réalisation de plusieurs diaporamas comme énoncé dans le paragraphe précédent en reprennant comme modèle une présentation « statique » déjà existante par exemple. Voici donc une conclusion à partir des informations recueillies sur le site des développeurs, ainsi que des démonstrations mises à disposition, de mon expérience personnelle (qui se résume à l'utilisation de Slidy ;) et des témoignages nombreux que l'on peut retrouver sur le web (forums, blogs, commentaires, ..) Nom du système

Avis personnel – Yannick Pavard – 24 avril 2006

Ajax-s L'intérêt du XML n'est pas encore très visible, de plus si cela diminue la compatibilité avec des navigateurs autres que IE et Firefox ça n'est pas très intéressant. Le développement devrait peu à peu reprendre les idées des autres systèmes tel que S5 ou Slidy qui sont en avance et une touche d'ajax devra rendre l'outil plus attrayant. Les options actuelles sont suffisantes mais pauvres (peu de raccourci par exemple) Domslides Le développeur de ce système a pris une voie très personnelle dans son approche (ne pas utiliser de raccourci clavier, se restreindre à un menu de navigation de type « menu déroulant ») ce qui pousse les utilisateurs à se rabattre sur le système S5 de Meyer. Domslide est surtout apprécié pour la taille légère des fichiers et pour répondre aux besoins les plus élémentaires (menu, numéro de diapositive, liens entre les diapositives ...). Malheureusement il n'existe pas de mode « impression », la seule façon étant de désactiver le javascript. OperaShow OperaShow est propre à Opera, cela veut dire qu'il ne fonctionnera correctement qu'avec le navigateur Opera (à partir de la version 7.2) et ce en activant la touche F11. S'il n'y avait que ce bémol ! Malheureusement derrière ce projet ambitieux, il y a beaucoup de manque dans ce projet : • On doit passer par le générateur en ligne pour obtenir un premier template ou suivre le tutorial. • Il n'y a pas de table des matières • Il n'y a qu'un moyen de passer à la diapositive suivante : utiliser la touche « PageDown » • etc...

www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc Nom du système

Diaporama xhtml-css [comparatif]

24 avril 2006

Avis personnel – Yannick Pavard – 24 avril 2006 Hormis le fait que le tutoriel donne un très beau résultat en mode « projection » et que tout est prévu pour les débutants (assistant en ligne), OperaShow n'a sûrement qu'un avenir limité.

S5 C'est la Rolls-Royce des systèmes de diaporamas xhtml/css, sans doute celui qui a le plus d'avance et qui est mis à jour très régulièrement, sans parler de la documentation qui est abondante sur le site. C'est sûrement celui aussi qui reste le plus compatible de tous les navigateurs, car il est également prévu une comptabilité avec le système OperaShow. Reste à vérifier ce que cela donne avec les navigateurs fonctionnant avec Linux, car l'auteur n'a pas vérifié ce point ;) Les futures options (gestion du temps, notes) devraient mettre encore plus le système S5 en avant de la scène. Toutefois je trouve encore le système un peu lent sur mon Firefox linux, dommage. Slidy Créé par un membre du w3c, slidy semble prometteur et offrir dans un avenir proche beaucoup de nouveautés qui risquent de faire palir Éric Meyer, l'auteur du système S5 : • Commande par la voix • Utilisation de l'ajax • Meilleure prise en compte du format SVG sous Internet Explorer • Editeur Wysiwyg intégré Hormis toutes ces belles promesses, Slidy a parfois des allures de mastodonte. L'interface est parfois lourde, les polices de caractères dans la démonstration sont trop grandes, mais heureusement des raccourcis permettent de l'adapter rapidement. Quant à la personnalisation du rendu, c'est la croix et la bannière. Il faut éditer le fichier JS qui est vraiment gros et trouver les chaines de caractères pour la francisation. Hormis ces petites lacunes, les options sont très nombreuses (raccourcis clavier à gogo, incrémentation ...). Pour avoir mis le doigt dans le code CSS/XHTML, je trouve ça un peu complexe pour un rendu parfait. Il y a beaucoup de classes qui se chevauchent et le passage de IE à Firefox n'est pas toujours identique. Pour conclure, il n'y a pas de solutions miracles, surtout qu'il risque d'y avoir d'autres systèmes qui vont s'en venir avec l'avènement du web 2.0, mais combien seront-il être à l'écoute comme Éric Meyer ou avangardistes comme Slidy ? Pour moi Domslides n'a plus d'avenir, l'auteur semble obtu et le développement à zéro. Il reste de l'espoir avec Ajax-s qui a choisi la voie du XML, espérons que ce choix ouvrira de nouvelles portes.

Liste de liens Voici quelques liens utiles pour aller plus loin avec les systèmes de diaporamas en ligne : ✔

Ajax-s ➢ Site Officiel : http://www.robertnyman.com/2005/11/13/proudly-presenting-ajax-s/ ➢ Démo : http://www.robertnyman.com/ajax-s/

Domslides ➢ Site Officiel : http://icant.co.uk/domslides/ ➢ Site de l'auteur : http://www.wait-till-i.com/index.php?p=123

www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc ➢

Diaporama xhtml-css [comparatif]

La fiche sur Framasoft :http://www.framasoft.net/article4079.html

OperaShow ➢ Site Officiel (tutoriel) : http://www.opera.com/support/tutorials/operashow/ ➢ Le site de l'auteur : http://www.markschenk.com/opera/index.html ➢ Un article (tutoriel) : http://www.informit.com/articles/article.asp?p=212186&rl=1

S5 ➢ ➢ ➢ ➢ ➢ ➢ ➢

24 avril 2006

Site Officiel : http://www.meyerweb.com/eric/tools/s5/s5-intro.html Démo officielle (anglais) : http://almaren.ch/projets/s5intro-fr/s5-intro.html Démo (en français) : http://almaren.ch/projets/s5intro-fr/s5-intro.html Au sujet de l'incrémentation : http://boxofchocolates.ca/projects/s5-incremental-graphics/ S5 et CityDesk : http://www.elanceur.org/CityDeskGabarit/S5/ CityDesk en version gratuite : http://www.elanceur.org/CityDeskFranceXML/TelechargementdeCityDesk.html Le modèle S5 pour CityDesk : http://www.elanceur.org/CityDeskFrance/GabaritS5pourdiaporamasde.html

➢ ➢ ➢ ➢ ➢ ➢

Contribution pour Spip : http://www.spip-contrib.net/Squelette-S5-Slide-Show Démo avec Spip : http://www.pbcom.net/rubrique.php3?id_rubrique=16 Le site de celui qui a aidé Meyer à démarrer ce projet : http://tantek.com/ Liste des autres contributions autour du système S5 : http://microformats.org/wiki/s5-tools/ XOXO, microformat utilisé par S5 : http://microformats.org/wiki/xoxo

Slidy ➢ Site de l'auteur : http://www.w3.org/People/Raggett/ ➢ Démo : http://www.w3.org/Talks/Tools/Slidy/ ➢ Exemple d'utilisation de Slidy : http://www.w3.org/2002/12/cal/mash/slides ➢ Le futur de Slidy : http://www.w3.org/2006/02/woa/#(29) ➢ Aperçu de l'éditeur wysiwyg : http://www.w3.org/Talks/Tools/Slidy/editor/editor-screenshot1.png

Outils du w3c ➢ Les outils du w3c : http://www.w3.org/Talks/Tools/ ➢ B5 une alternative à Slidy : http://www.w3.org/Talks/B5example/ ➢ Slidemaker : http://www.w3.org/Talks/YYMMsub/Overview.html

Ajax ➢ Editeur pour Slidy : http://www.clipperz.net/users/marco/blog/2005/12/28/slidy_and_s5_ready_for_an_ajax_editor

Autres solutions ➢ Thumbstacks : http://www.thumbstacks.com/ ➢ Tutoriel Thumbstacks : http://www.solutionwatch.com/322/online-presentations-with-thumbstacks/ ➢ Exemples avec Tikiwiki : http://marclaporte.com/tiki-index.php?page=Tiki&bl

www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

Crédits ➔ ➔

Auteur : Yannick Pavard (ypavard@tc2l.ca) Contact : Développement Web / web@tc2l.ca / http://www.tc2l.ca

Historique des modifications ➔

24 avril 2006 : Publication de la première version lors des présentations du w3qc.

Licence du document Le document est sous licence GNU FDL version 1.2. Une traduction non officielle de cette licence peut être obtenue à l'adresse suivante: http://fr.wikipedia.org/wiki/GNU_FDL GNU Free Documentation License Version 1.2, November 2002 Copyright (C) 2000,2001,2002 Free Software Foundation, Inc. 51 Franklin St, Fifth Floor, Boston, MA 021101301 USA Everyone is permitted to copy and distribute verbatim copies of this license document, but changing it is not allowed. 0. PREAMBLE The purpose of this License is to make a manual, textbook, or other functional and useful document "free" in the sense of freedom: to assure everyone the effective freedom to copy and redistribute it, with or without modifying it, either commercially or noncommercially. Secondarily, this License preserves for the author and publisher a way to get credit for their work, while not being considered responsible for modifications made by others. This License is a kind of "copyleft", which means that derivative works of the document must themselves be free in the same sense. It complements the GNU General Public License, which is a copyleft license designed for free software. We have designed this License in order to use it for manuals for free software, because free software needs free documentation: a free program should come with manuals providing the same freedoms that the software does. But this License is not limited to software manuals; it can be used for any textual work, regardless of subject matter or whether it is published as a printed book. We recommend this licence principally for works whose purpose is instruction or reference. 1. APPLICABILITY AND DEFINITIONS This License applies to any manual or other work, in any medium, that contains a notice placed by the copyright holder saying it can be distributed under the terms of this License. Such a notice grants a world-wide, royalty-free license, unlimited in duration, to use that work under the conditions stated herein. The "Document", below, refers to any such manual or work. Any member of the public is a licensee, and is addressed as "you". You accept the license if you copy, modify or distribute the work in a way requiring permission under copyright law. A "Modified Version" of the Document means any work containing the Document or a portion of it, either copied www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

verbatim, or with modifications and/or translated into another language. A "Secondary Section" is a named appendix or a front-matter section of the Document that deals exclusively with the relationship of the publishers or authors of the Document to the Document's overall subject (or to related matters) and contains nothing that could fall directly within that overall subject. (Thus, if the Document is in part a textbook of mathematics, a Secondary Section may not explain any mathematics.) The relationship could be a matter of historical connection with the subject or with related matters, or of legal, commercial, philosophical, ethical or political position regarding them. The "Invariant Sections" are certain Secondary Sections whose titles are designated, as being those of Invariant Sections, in the notice that says that the Document is released under this License. If a section does not fit the above definition of Secondary then it is not allowed to be designated as Invariant. The Document may contain zero Invariant Sections. If the Document does not identify any Invariant Sections then there are none. The "Cover Texts" are certain short passages of text that are listed, as Front-Cover Texts or Back-Cover Texts, in the notice that says that the Document is released under this License. A Front-Cover Text may be at most 5 words, and a Back-Cover Text may be at most 25 words. A "Transparent" copy of the Document means a machine-readable copy, represented in a format whose specification is available to the general public, that is suitable for revising the document straightforwardly with genÉric text editors or (for images composed of pixels) genÉric paint programs or (for drawings) some widely available drawing editor, and that is suitable for input to text formatters or for automatic translation to a variety of formats suitable for input to text formatters. A copy made in an otherwise Transparent file format whose markup, or absence of markup, has been arranged to thwart or discourage subsequent modification by readers is not Transparent. An image format is not Transparent if used for any substantial amount of text. A copy that is not "Transparent" is called "Opaque". Examples of suitable formats for Transparent copies include plain ASCII without markup, Texinfo input format, LaTeX input format, SGML or XML using a publicly available DTD, and standard-conforming simple HTML, PostScript or PDF designed for human modification. Examples of transparent image formats include PNG, XCF and JPG. Opaque formats include proprietary formats that can be read and edited only by proprietary word processors, SGML or XML for which the DTD and/or processing tools are not generally available, and the machine-generated HTML, PostScript or PDF produced by some word processors for output purposes only. The "Title Page" means, for a printed book, the title page itself, plus such following pages as are needed to hold, legibly, the material this License requires to appear in the title page. For works in formats which do not have any title page as such, "Title Page" means the text near the most prominent appearance of the work's title, preceding the beginning of the body of the text. A section "Entitled XYZ" means a named subunit of the Document whose title either is precisely XYZ or contains XYZ in parentheses following text that translates XYZ in another language. (Here XYZ stands for a specific section name mentioned below, such as "Acknowledgements", "Dedications", "Endorsements", or "History".) To "Preserve the Title" of such a section when you modify the Document means that it remains a section "Entitled XYZ" according to this definition. The Document may include Warranty Disclaimers next to the notice which states that this License applies to the Document. These Warranty Disclaimers are considered to be included by reference in this License, but only as regards disclaiming warranties: any other implication that these Warranty Disclaimers may have is void and has no effect on the meaning of this License. www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

2. VERBATIM COPYING You may copy and distribute the Document in any medium, either commercially or noncommercially, provided that this License, the copyright notices, and the license notice saying this License applies to the Document are reproduced in all copies, and that you add no other conditions whatsoever to those of this License. You may not use technical measures to obstruct or control the reading or further copying of the copies you make or distribute. However, you may accept compensation in exchange for copies. If you distribute a large enough number of copies you must also follow the conditions in section 3. You may also lend copies, under the same conditions stated above, and you may publicly display copies. 3. COPYING IN QUANTITY If you publish printed copies (or copies in media that commonly have printed covers) of the Document, numbering more than 100, and the Document's license notice requires Cover Texts, you must enclose the copies in covers that carry, clearly and legibly, all these Cover Texts: Front-Cover Texts on the front cover, and Back-Cover Texts on the back cover. Both covers must also clearly and legibly identify you as the publisher of these copies. The front cover must present the full title with all words of the title equally prominent and visible. You may add other material on the covers in addition. Copying with changes limited to the covers, as long as they preserve the title of the Document and satisfy these conditions, can be treated as verbatim copying in other respects. If the required texts for either cover are too voluminous to fit legibly, you should put the first ones listed (as many as fit reasonably) on the actual cover, and continue the rest onto adjacent pages. If you publish or distribute Opaque copies of the Document numbering more than 100, you must either include a machine-readable Transparent copy along with each Opaque copy, or state in or with each Opaque copy a computer-network location from which the general network-using public has access to download using publicstandard network protocols a complete Transparent copy of the Document, free of added material. If you use the latter option, you must take reasonably prudent steps, when you begin distribution of Opaque copies in quantity, to ensure that this Transparent copy will remain thus accessible at the stated location until at least one year after the last time you distribute an Opaque copy (directly or through your agents or retailers) of that edition to the public. It is requested, but not required, that you contact the authors of the Document well before redistributing any large number of copies, to give them a chance to provide you with an updated version of the Document. 4. MODIFICATIONS You may copy and distribute a Modified Version of the Document under the conditions of sections 2 and 3 above, provided that you release the Modified Version under precisely this License, with the Modified Version filling the role of the Document, thus licensing distribution and modification of the Modified Version to whoever possesses a copy of it. In addition, you must do these things in the Modified Version: A. Use in the Title Page (and on the covers, if any) a title distinct from that of the Document, and from those of previous versions (which should, if there were any, be listed in the History section of the Document). You may use the same title as a previous version if the original publisher of that version gives permission. www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

B. List on the Title Page, as authors, one or more persons or entities responsible for authorship of the modifications in the Modified Version, together with at least five of the principal authors of the Document (all of its principal authors, if it has fewer than five), unless they release you from this requirement. C. State on the Title page the name of the publisher of the Modified Version, as the publisher. D. Preserve all the copyright notices of the Document. E. Add an appropriate copyright notice for your modificationsadjacent to the other copyright notices. F. Include, immediately after the copyright notices, a license notice giving the public permission to use the Modified Version under the terms of this License, in the form shown in the Addendum below. G. Preserve in that license notice the full lists of Invariant Sections and required Cover Texts given in the Document's license notice. H. Include an unaltered copy of this License. I. Preserve the section Entitled "History", Preserve its Title, and add to it an item stating at least the title, year, new authors, and publisher of the Modified Version as given on the Title Page. If there is no section Entitled "History" in the Document, create one stating the title, year, authors, and publisher of the Document as given on its Title Page, then add an item describing the Modified Version as stated in the previous sentence. J. Preserve the network location, if any, given in the Document for public access to a Transparent copy of the Document, and likewise the network locations given in the Document for previous versions it was based on. These may be placed in the "History" section. You may omit a network location for a work that was published at least four years before the Document itself, or if the original publisher of the version it refers to gives permission. K. For any section Entitled "Acknowledgements" or "Dedications", Preserve the Title of the section, and preserve in the section all the substance and tone of each of the contributor acknowledgements and/or dedications given therein. L. Preserve all the Invariant Sections of the Document, unaltered in their text and in their titles. Section numbers or the equivalent are not considered part of the section titles. M. Delete any section Entitled "Endorsements". Such a section may not be included in the Modified Version. N. Do not retitle any existing section to be Entitled "Endorsements" or to conflict in title with any Invariant Section. O. Preserve any Warranty Disclaimers. If the Modified Version includes new front-matter sections or appendices that qualify as Secondary Sections and contain no material copied from the Document, you may at your option designate some or all of these sections as invariant. To do this, add their titles to the list of Invariant Sections in the Modified Version's license notice. These titles must be distinct from any other section titles. You may add a section Entitled "Endorsements", provided it contains nothing but endorsements of your Modified Version by various parties--for example, statements of peer review or that the text has been approved by an organization as the authoritative definition of a standard. You may add a passage of up to five words as a Front-Cover Text, and a passage of up to 25 words as a BackCover Text, to the end of the list of Cover Texts in the Modified Version. Only one passage of Front-Cover Text and one of Back-Cover Text may be added by (or through arrangements made by) any one entity. If the Document already includes a cover text for the same cover, previously added by you or by arrangement made by the same entity you are acting on behalf of, you may not add another; but you may replace the old one, on explicit permission from the previous publisher that added the old one. The author(s) and publisher(s) of the Document do not by this licence give permission to use their names for publicity for or to assert or imply endorsement of any Modified Version.

www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

5. COMBINING DOCUMENTS You may combine the Document with other documents released under this License, under the terms defined in section 4 above for modified versions, provided that you include in the combination all of the Invariant Sections of all of the original documents, unmodified, and list them all as Invariant Sections of your combined work in its license notice, and that you preserve all their Warranty Disclaimers. The combined work need only contain one copy of this License, and multiple identical Invariant Sections may be replaced with a single copy. If there are multiple Invariant Sections with the same name but different contents, make the title of each such section unique by adding at the end of it, in parentheses, the name of the original author or publisher of that section if known, or else a unique number. Make the same adjustment to the section titles in the list of Invariant Sections in the license notice of the combined work. In the combination, you must combine any sections Entitled "History" in the various original documents, forming one section Entitled "History"; likewise combine any sections Entitled "Acknowledgements", and any sections Entitled "Dedications". You must delete all sections Entitled "Endorsements". 6. COLLECTIONS OF DOCUMENTS You may make a collection consisting of the Document and other documents released under this License, and replace the individual copies of this License in the various documents with a single copy that is included in the collection, provided that you follow the rules of this License for verbatim copying of each of the documents in all other respects. You may extract a single document from such a collection, and distribute it individually under this License, provided you insert a copy of this License into the extracted document, and follow this License in all other respects regarding verbatim copying of that document. 7. AGGREGATION WITH INDEPENDENT WORKS A compilation of the Document or its derivatives with other separate and independent documents or works, in or on a volume of a storage or distribution medium, is called an "aggregate" if the copyright resulting from the compilation is not used to limit the legal rights of the compilation's users beyond what the individual works permit. When the Document is included in an aggregate, this License does not apply to the other works in the aggregate which are not themselves derivative works of the Document. If the Cover Text requirement of section 3 is applicable to these copies of the Document, then if the Document is less than one half of the entire aggregate, the Document's Cover Texts may be placed on covers that bracket the Document within the aggregate, or the electronic equivalent of covers if the Document is in electronic form. Otherwise they must appear on printed covers that bracket the whole aggregate. 8. TRANSLATION Translation is considered a kind of modification, so you may distribute translations of the Document under the terms of section 4. Replacing Invariant Sections with translations requires special permission from their copyright holders, but you may include translations of some or all Invariant Sections in addition to the original versions of these Invariant Sections. You may include a translation of this License, and all the license notices in the www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

Document, and any Warranty Disclaimers, provided that you also include the original English version of this License and the original versions of those notices and disclaimers. In case of a disagreement between the translation and the original version of this License or a notice or disclaimer, the original version will prevail. If a section in the Document is Entitled "Acknowledgements", "Dedications", or "History", the requirement (section 4) to Preserve its Title (section 1) will typically require changing the actual title. 9. TERMINATION You may not copy, modify, sublicense, or distribute the Document except as expressly provided for under this License. Any other attempt to copy, modify, sublicense or distribute the Document is void, and will automatically terminate your rights under this License. However, parties who have received copies, or rights, from you under this License will not have their licenses terminated so long as such parties remain in full compliance. 10. FUTURE REVISIONS OF THIS LICENSE The Free Software Foundation may publish new, revised versions of the GNU Free Documentation License from time to time. Such new versions will be similar in spirit to the present version, but may differ in detail to address new problems or concerns. See http://www.gnu.org/copyleft/. Each version of the License is given a distinguishing version number. If the Document specifies that a particular numbered version of this License "or any later version" applies to it, you have the option of following the terms and conditions either of that specified version or of any later version that has been published (not as a draft) by the Free Software Foundation. If the Document does not specify a version number of this License, you may choose any version ever published (not as a draft) by the Free Software Foundation. ADDENDUM: How to use this License for your documents To use this License in a document you have written, include a copy of the License in the document and put the following copyright and license notices just after the title page: Copyright (c) YEAR YOUR NAME. Permission is granted to copy, distribute and/or modify this document under the terms of the GNU Free Documentation License, Version 1.2 or any later version published by the Free Software Foundation; with no Invariant Sections, no Front-Cover Texts, and no Back-Cover Texts. A copy of the license is included in the section entitled "GNU Free Documentation License". If you have Invariant Sections, Front-Cover Texts and Back-Cover Texts, replace the "with...Texts." line with this: with the Invariant Sections being LIST THEIR TITLES, with the Front-Cover Texts being LIST, and with the Back-Cover Texts being LIST. If you have Invariant Sections without Cover Texts, or some other combination of the three, merge those two alternatives to suit the situation. www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Présentation du w3qc

Diaporama xhtml-css [comparatif]

24 avril 2006

If your document contains nontrivial examples of program code, we recommend releasing these examples in parallel under your choice of free software license, such as the GNU General Public License, to permit their use in free software.

www.tc2l.ca

24 avril 2006, présentée par Yannick Pavard [web@tc2l.ca]


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.