STIC:STIC II - exercice 10 (Volt)
Enoncé de l'exercice 10
Cet exercice du cours STIC II vous permet:
- d'apprendre comment construire des DTDs pour XML
- d'apprendre les bases de XSLT
- d'apprendre comment associer une feuille de style CSS à une "sortie XHTML"
Tâche
- Créer une DTD simple sur un sujet de votre choix, mais en rapport avec une thématique "MALTT"
- Afficher avec une feuille de style XSLT un contenu XML valide crée avec cette DTD
- Bonus: associer une CSS au résultat HTML
- Ecrire un rapport
- Participer au Wiki (en rapport avec la thématique de l'exercice ou du cours)
Emplacement de la page d'accueil / rapport:
/etu-maltt/<promo>/<login>/stic-2/ex10/
par exemple:
/etu-maltt/qwerty/user1/stic-2/ex10/
- Donc ex10 et ne pas exercice 10 etc. !!
Contraintes
- Contenu selon vos envies et possibilités, mais en rapport avec les thématiques de MALTT
- Vous pouver soit définir une nouvelle DTD, soit adapter une DTD
- La DTD doit être correcte et vos contenus doivent être valides (respecter la DTD)
Il faut donc produire 4 fichiers:
- Une DTD,
- un fichiers *.xml qui sont identiques,
- un fichiers *.xsl associés à ces fichiers xml
- un rapport.
Le rapport:
- Titre, auteur et date
- Le résulat:
- Lien vers la DTD
- Lien vers le fichier XML
- Lien vers le *.XSLT qui va avec (et la CSS si vous en utilisez)
- Objectifs DTD: Elle sert à quoi ?
- Objectifs XSLT: Comment avez-vous pensé la mise en page ?
- La production: bref résumé de la démarche
- Contribution Wiki
- Difficultés, auto-évaluation, remarques
- Ressources utilisées, bibliographie.
Evaluation
- Documentation technique interne et/ou externe
- Qualité du rapport (y compris discussion des besoins et du vocabulaire)
- Thématique (pas de recette de cuisine, liste de CDs etc. ! Soyez créatifs ...)
- User experience: Ergonomie et qualité de la présentation (X)HTML
- Fonctionalité, originalité. etc.
- Qualité de la DTD par rapport au buts fixés
- Qualité technique: Validité des fichiers XML, XSLT et de la DTD
- Bonus: Richesse de la DTD (faire plus qu’une simple structure tabulaire ! Evitez donc les DTD pour gérér vos CD et vos livres ....)
- Participation au wiki (en dehors de la page discussion !)
Propositions wiki-writing
(ou autre chose en rapport avec le sujet)
- Compléter XML
- Compléter Tutoriel XSLT débutant
- Compléter Tutoriel DTD
- XML dans l'éducation
- Décrire un vocabulaire XML qui vous intéresse (regardez ce que publie W3C,, OASIS,....)
- Voir aussi la catégorie en:XML (possibilité de faire un bout de traduction par exemple)
Activités en classe
Tour de logiciels
- Java 6 SDK. Il faut installer cet environnement, car plusieurs programmes que nous allons utiliser en ont besoin.
Ensuite, installer / utiliser un éditeur XML. Voici quelques choix:
- Editeur XML - Choix 1
- Exchanger XML Editor lite (PC/Mac/Unix). Donwload chez Google code. Vérifiez que c'est au moins la version 3.3 (pas prendre chez xchanger.com (site abandonné).
- Editeur XML - Choix 2
- epcEdit (Linux, Windows)
- Le plus convivial à utiliser (mais pas à installer)
- XML Copy editor - Choix 3
- XML Copy editor (Linux, windows)
- Le plus facile à installer ! Assez facile à utiliser, mais moins puissant !.
- Peut valider toutes sortes de schémas.
- Editeur XML - autres choix
- C.f. XML editor
Introduction à XML
- Introduction à XML et DOM (slides)
- Introduction technique à XML (HTML) - PDF, (transparents)
Warm-up - éditer une DTD de cuisine
Copiez ces fichiers:
- http://tecfa.unige.ch/guides/xml/examples/dtd-examples/cuisine.xsl
- http://tecfa.unige.ch/guides/xml/examples/dtd-examples/cuisine.css
- http://tecfa.unige.ch/guides/xml/examples/dtd-examples/cuisine.dtd
- http://tecfa.unige.ch/guides/xml/examples/dtd-examples/cuisine-template.xml
ATTENTION: il faut "sauver les lien sous" / "save link as" ! Pas afficher dans le navigateur et sauver ensuite ...
Avec votre éditeur XML, ouvrez le document cuisine-template.xml
Entrez une recette ...
Créer une DTD
- Créez une DTD, exemple:
<!ELEMENT addressBook (person)+> <!ELEMENT person (name,email*)> <!ELEMENT name (family,given)> <!ELEMENT family (#PCDATA)> <!ELEMENT given (#PCDATA)> <!ELEMENT email (#PCDATA)>
- Faites un fichier XML avec cette DTD
Template XML (remplacez "VOTRE_RACINE" et "VOTRE_DTD")
<?xml version="1.0"?>
<!DOCTYPE addressBook SYSTEM "VOTRE_DTD.dtd">
<addressBook>
</addressBook>
Introduction à XSLT
- Introduction technique à XSLT - PDF file , (transparents)
XSLT
(1) Regardez d'abord des examples, notamment la recette de cuisine ci-dessus !
- Sinon, fouillez par exemple les exemples très simples: http://tecfa.unige.ch/guides/xml/examples/xsl-simple/
(2) Pour votre XML/DTD faites une simple feuille de style XSLT
Copiez/collez le chablon ci-dessous si vous voulez et remplacez "VOTRE_RACINE, "UN_ELEMENT" par vos éléments. Sinon, la plupart des éditeurs XML offrent une assistance XSLT.
Template XSLT:
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="html"/>
<xsl:template match="VOTRE_ELEMENT_RACINE">
<html>
<body bgcolor="#FFFFFF">
<xsl:apply-templates/>
</body>
</html>
</xsl:template>
<xsl:template match="UN_ELEMENT">
</xsl:template>
<xsl:template match="UN_ELEMENT">
</xsl:template>
</xsl:stylesheet>
Template XML avec XSLT
<?xml version="1.0" ?>
<!DOCTYPE VOTRE_RACINE SYSTEM "VOTRE_DTD.dtd">
<?xml-stylesheet href="VOTRE_STYLE.xsl" type="text/xsl"?>
<VOTRE_RACINE>
</VOTRE_RACINE>
Ressources
- Transparents
- TECFA's XML page
- Introduction à XML et DOM - PDF file , (transparents)
- Introduction technique à XML - PDF file , (transparents)
- Introduction technique à XSLT - PDF file , (transparents)
- Manuels électroniques (PDF et dPUB sur XML)
- [docs protégés]
- Exemples de DTD
- http://tecfa.unige.ch/guides/xml/examples/dtd-examples/
- http://tecfa.unige.ch/guides/xml/examples/xsl-simple/
- Pages wiki fr
- XML (survol conceptuel)
- Tutoriel DTD (important, comprend les éléments pour réuissir l'exercice)
- Encodage de caractères
- Tutoriel XSLT débutant (contenu similaire aux transparents XSLT)
- Pages wiki en
- Editing XML tutorial (tutoriel pour utiliser un schéma XML)
- XML (en, mini-tutoriel + liens)
- XML editor (on conseille Exchanger light, si vous n'arrivez pas à l'installer, essayez d'autres comme epcedit)
- XSLT (en, liens)
- XSLT Tutorial (en, mini-tutoriel)
- Character encoding (en, liens encodage)
- Cours COAP
- La catégorie XML