Apprentissage de Typo3

Aurélie Beaumont TAIM-TD1 Aude Debouzy RTM-TD1 Céline Thibaut TAIM-TD2 Projet de Master 1ère Année 1er Semestre Apprentissage de Typo3 Création du site Internet du Centre des Ressources Informatique Tuteur : Sophie Nabitz Numéro de Projet : 4 Janvier 2007

Sommaire 1. Les CMS et Typo3 aujourd hui... 4 1.1. Les CMS... 4 1.2. La place de Typo3... 4 2. Travail réalisé au premier semestre... 5 2.1. Apprentissage de Typo3...5 2.2. Analyse du site du CRI... 8 2.2.1. Situation actuelle :... 8 2.2.2. Analyse :... 8 3. Cahier des charges... 10 3.1. Cadre du projet... 10 3.1.1. Présentation du Centre des Ressources Informatiques... 10 3.1.2. Présentation des spécificités métier... 10 3.2. Rôles et acteurs... 12 3.3. Site Internet du CRI... 12 3.3.1. Objectif...12 3.3.2. Organisation... 12 3.3.3. Fonctionnalités... 13 3.3.4. Interfaces... 16 3.3.5. Connexions et liens avec l existant... 18 3.3.6. Reprises des données existantes... 18 3.3.7. Gestion des droits d accès... 18 3.4. Usage et exploitation... 19 3.4.1. Formation... 19 3.4.2. Evolution... 19 3.4.3. Manuels... 19 3.5. Planning prévisionnel... 19 4. Conclusion et bilan du premier semestre... 20 4.1. Points positifs... 20 4.2. Points négatifs... 20 2

Introduction Notre projet de Master1 est intitulé : Apprentissage de Typo3 et réalisation du site du CRI. Il se décompose en deux parties : - Semestre 1 : Découverte et apprentissage des fonctionnalités de Typo3 et réalisation du cahier des charges du site du CRI - Semestre 2 : Réalisation du nouveau site du CRI en Typo3 qui sera rattaché au nouveau site de l Université d Avignon dont sa mise en ligne est prévue pour Février 2007. L intérêt et les motivations de ce sujet pour notre Master : - Apprentissage d un nouveau CMS qui est en pleine expansion. - Autoformation. - Travail en équipe d étudiantes ayant des spécialités différentes. - Réalisation d une application concrète pour le CRI. Le cahier des charges qui suit est en cours de finalisation et n'a pas encore été validé par le directeur du C.R.I faute de temps. En effet, nous avons eu le choix du mini site à réaliser seulement début Décembre 2006. Nous avons conclut, avec M. Spriet, de rendre le cahier des charges final pour fin Janvier. 3

1.Les CMS et Typo3 aujourd hui 1.1.Les CMS Les CMS pour Content Management System sont apparus il y a quelques années, aussi appelés SGC pour Système de Gestion de Contenu sont des programmes de Web dynamique, disponible en open source dont les plus connus sont : PostNuke, Spip, Xoops. L'originalité des CMS est de séparer le contenu du contenant, c'est à dire de séparer la mise en page du site avec les templates et les autres documents (textes, images...). Les pages HTML sont appelées «templates» en Typo3, elles sont stockées sur le serveur Web. Les données le sont dans une base de données. Lors du chargement d'une page sur un site, c est le moteur du CMS qui lie les deux: la page et son contenu. L intérêt des CMS pour le développeur est l utilisation d une interface BackOffice déjà créée en amont (souvent en PHP) et des extensions amenant de nouvelles fonctionnalités créés par la communauté de développeur du CMS. L intérêt premier est donc le gain de temps de développement et la facilité de mise en place du site. 1.2.La place de Typo3 Aujourd hui, Typo3 fait partie des meilleurs CMS Open Source en PHP du monde. Il allie la puissance, le paramétrage et l évolution. Typo3 dispose de références prestigieuses à travers l Europe et est intégré aussi bien par des PME, des collectivités locales que par des grandes entreprises. Le nombre de sites référencés à ce jour atteint les 5770. Typo3 se différencie par : - Une gestion administrable par des non-spécialistes, - Une gestion du contenu simple et rapide, - Une ergonomie conviviale et logique, - Une bibliothèque de plus de 1400 extensions, - Un environnement de développement, - Une communauté mondiale unie/structurée... 4

2.Travail réalisé au premier semestre 2.1.Apprentissage de Typo3 o L Organisation en équipe Dans un premier temps nous avons cherché chacune de notre côté les possibilités de Typo3 avec les templates déjà existants. Pour cela nous avons réalisé chacune un mini-site sur nos CV et un mini-site d annonce : Ex d un mini site d un CV : Puis dans un deuxième temps nous avons exploré les templates sur nos mini-sites et mis en commun pour réaliser un mini-site d annonce avec notre propre template simple. 5

o Formation Dans le cadre de notre apprentissage de Typo3, nous avons assisté à une formation donnée par un intervenant travaillant dans la société ayant réalisé le nouveau site de l université. Cette formation s est déroulée le 21 décembre 2006 dans les locaux de Ste Marthe. Il était question dans cette formation de l apprentissage de Typo3 et plus particulièrement des points suivants : le langage Typoscript et les gabarits en Typo3 (nous n avons malheureusement pas pu assister à cette partie car nous avions un cours à ce moment là), la création d extensions en Typo3. Cette formation a été intéressante pour nous car nous avons appris comment réaliser une extension, ce qui nous sera utile si nous voudrons créer des plugins pour le site du CRI. Nous avons récupéré une documentation réalisée par la société qui a fait le nouveau site et qui nous sera utile pour la compréhension de ce qui a été fait sur le site de l université pour nous aider dans notre travail. Cette documentation a été réalisée pour les personnes travaillant pour le CRI, ce qui leur permettra de mieux comprendre le fonctionnement du nouveau site de l université et d apporter des modifications si nécessaire. o Création des mini-sites Tout d abord nous avons créé les pages du mini-site (Bonnes affaires, Immobilier, Voitures ). Puis nous avons insérer le contenu et fait la mise en page. En quelques clics on arrive à des résultats visibles mais il faut tout de même faire attention car il est possible de rendre une page cacher en cochant une option dans les propriétés de la page. 6

Ensuite on attache au site un template que nous devons créé auparavant ou choisir dans la liste de ceux existant. Et voici le résultat : 7

2.2.Analyse du site du CRI 2.2.1.Situation actuelle : Le site de l UAPV ayant été complètement refait en Typo3, le directeur du CRI, M. Thierry Spriet, nous a demandé de refondre le site actuel du CRI et de l actualiser de la même manière que le site de l université qui sera mis en place dans le mois de février. Dans l état actuel des choses, le site du CRI n est pas organisé et l information précise dont on a besoin n est pas accessible si facilement qu on le voudrait. Il y a des informations redondantes, des informations inutiles, etc. C est pour toutes ces raisons que M. Spriet a sollicité un groupe d étudiants dans le cadre de leur projet de master pour réaliser le nouveau site du CRI. Nous avons donc choisi de réaliser cette tâche pour notre projet. Un des travaux que nous avons eu à réaliser au premier semestre, avec l apprentissage de Typo3, est l analyse du site du CRI (www.cri.univ-avignon.fr). Pour ce faire nous avons analysé chacune de notre côté les points positifs et négatifs, les éléments qu il faudrait changer puis nous nous sommes rassemblées toutes les trois pour mettre notre travail et nos réflexions en commun. Nous avons posé de nombreuses questions au directeur du CRI et, dans le cadre d une réunion (qui s est déroulée le 18 décembre 2006 à l IUP) nous lui avons fait part de nos propositions pour le nouveau site. 2.2.2.Analyse : Nous avons tout d abord analysé le site actuel du CRI dont la page d accueil est la suivante : 8

Comme vous pouvez le constater, le site est divisé en plusieurs parties concernant les différentes composantes du CRI : la CIG, la CIP et la CRIR (visibles en haut de la page). Les informations sont dispersées dans ces 3 parties et il est très difficile d y accéder intuitivement. Le but est de refondre tout le site et que les informations soient accessibles d un seul endroit. D autant plus que le CRI n est plus organisé de cette manière. L organisation a changé, ce que ne reflète plus le site actuel. Nous avons réfléchi à sélectionner les informations selon le profil de l utilisateur qui se présente sur le site. Nous nous sommes demandées s il fallait intégrer un système de login/mot de passe mais ce n est pas ce que veut M. Spriet. Nous nous sommes posées la question de comment allaient être stockées les informations avec Typo3. Il faut envisager deux manières : Faut-il avoir un tronc commun d informations et aller «piocher» les informations intéressantes selon le profil de l utilisateur? Faut-il avoir les informations enregistrées pour chaque type d utilisateur, pouvant entraîner une redondance des données stockées? Nous avons opté pour la première solution, beaucoup plus claire pour comprendre. Les raisons en sont les suivantes. Typo3 étant un système de gestion de contenu, les données ne sont pas stockées dans une base de données comme dans un site classique en PHP/SQL. Tout le contenu du site sera stocké dans une table gérée par Typo3. Vu que le nouveau site sera géré par des personnes ne connaissant pas Typo3, il faut que la structure soit simple. Nous nous sommes demandées quel profil pouvait accéder à telle ou telle information. Par exemple le téléchargement de logiciels n est pas le même pour un étudiant que pour un enseignant. Nous n avons par contre pas réfléchi sur l interface du nouveau site. Nous savons que celle-ci ressemblera au nouveau site de l université. La présentation finale du site souhaitée par le directeur du CRI est décrite en détails dans le cahier des charges du projet. 9

3.Cahier des charges 3.1.Cadre du projet 3.1.1.Présentation du Centre des Ressources Informatiques Le C.R.I. est un service commun de l Université qui a pour mission la mise en place de la politique informatique de l Université. Le C.R.I a notamment les rôles suivants : - Il implante et gère les moyens informatiques collectifs et les réseaux, à l'exclusion des équipements bureautiques. Il peut toutefois apporter, dans ce domaine, un conseil quant au choix des équipements. - Il élabore et réalise le plan de formation des utilisateurs aux outils qu'il a mis en place. - Il assure également une assistance technique aux utilisateurs des logiciels et des réseaux qu'il a implantés. Cette mission ne concerne que les services administratifs. 3.1.2.Présentation des spécificités métier Le CRI a déterminé récemment ses différentes missions (voir organigramme suivant), qui sont en fait des cellules d actions ayant chacune des activités différentes. 10

11

3.2.Rôles et acteurs - En ce qui concerne la maîtrise d oeuvre : L équipe projet est constituée de trois étudiantes, Aude Debouzy, Céline Thibaut et Aurélie Beaumont. Lors du premier semestre, chacune d entre nous a étudié tout d abord le CMS Typo3 et a analysé le site du CRI. Nous avons aussi réalisé le cahier des charges en totale collaboration. L avantage de l apprentissage de Typo3 seule nous a permit d acquérir une connaissance générale de Typo3. Pour le second semestre, le développement de l application sera partagé entre les différents membres du groupe de projet dans le but d avancer le plus rapidement possible. - En ce qui concerne la maîtrise d ouvrage : Ce projet est réalisé à la demande du CRI. Celui-ci est représenté par son directeur : Thierry Spriet. Nous organiserons des réunions régulièrement au cours du semestre afin de répondre le mieux possible à ses besoins. 3.3.Site Internet du CRI 3.3.1.Objectif Dans le cadre de la mise en place d un nouveau site de l Université en Typo3 réalisé par l entreprise e-magineurs, le CRI souhaite mettre à jour son site en se basant sur celui-ci. Le nouveau site de l Université devrait être mis en ligne en février 2007. De plus, le CRI a évolué et ses composantes sont aujourd hui différentes, une mise à jour importante s impose donc. Enfin, son directeur souhaite avoir un site ayant une navigation plus intuitive, moins de redondance des données et de supprimer les trois mini-sites qui composaient jusqu à aujourd hui le site du CRI (CRIR, CIG, CIP). 3.3.2.Organisation Le CRI nous a donné un accès limité sur le site de L Université. Pour le développement du mini-site du CRI, nous travaillerons sur une copie du site de l Université qui sera stocké sur le serveur de l Université dont nous aurons les droits administrateurs afin de pouvoir manipuler notamment les templates. 12

3.3.3.Fonctionnalités Lors de la réunion du 18/12/2006 avec Thierry Spriet (Directeur du CRI), nous avons commencé à étudier l'ergonomie du futur site du CRI. -Besoins exprimés Les besoins exprimés par le CRI pour son nouveau site : Objectif du nouveau site : Répondre aux questions des utilisateurs Abandonner les différentes cellules existant sur le site (CRIR, CIG, CIP) au profit des différentes missions du CRI. Le service a beaucoup bougé depuis la création du site et ne reflètent plus l'organisation du CRI d'aujourd'hui. Donner des accès au site par type de profil comme le site de l'université d'avignon. Les profils retenus à ce jour pour le CRI sont : étudiant, enseignant, administratif, partenaire économique. Mettre en place une description complète du CRI et de ses différentes missions (composantes). Mettre en place un système de FAQ pour chacun des profils pour permettre d'éclairer chaque internaute cherchant une information sur le site. Maintenir l'accès réservé pour l'intranet de l'université. Mettre en place une validation des contenus destinée au site par le directeur (Thierry Spriet) ou par l'un des deux directeurs techniques (Réseaux Infrastructures : Stéphane IGOUNET et Systèmes : Thomas GUTHMANN) Mettre en place un système d'authentification seulement pour l'accès réservé et non pour les autres rubriques du site, notamment pas d'authentification pour les différents profils. Créer une dizaine de rubriques de FAQ pour permettre de couvrir le maximum de questions des utilisateurs. 13

-Rubriques potentielles En collaboration avec Thierry Spriet, nous avons étudiées plus d'une dizaine de rubriques pour la FAQ ainsi que d'autres rubriques liés à la description du CRI. o Niveau 1 Le premier niveau de rubriques est le choix du profil : étudiant, enseignant, administratif ou partenaire économique. En effet, l'information résultant du profil permettra des réponses plus adaptées au profil choisi. o Niveau 2 Nous avons ensuite, des rubriques communes à tous les profils dont le contenu pourra être différent. Ce sont les rubriques suivantes qui seront probablement situées sur le panneau de gauche: Organisation du CRI L'organisation du CRI présentera toute la cellule du CRI ainsi que ses différentes missions. On verra apparaître notamment l'organigramme du CRI (voir plus haut) ainsi que des explications plutôt détaillées des différentes missions et sous missions du CRI. Cette rubrique servira à répondre aux questions: Qui est le CRI? Que fait le CRI? Demandes d'intervention Une rubrique de demande d'intervention existe déjà sur le site actuel, la demande est différente selon le profil choisi. Bookmark du CRI Cette rubrique donne une liste des sites appartenant au CRI notamment le site des TICe qui seront toujours en ligne après l'ouverture du nouveau site du CRI. Statistiques sur l'informatique à l'uapv Les statistiques du CRI se baseront sur le matériel à l'uapv et les environnements numériques de travail. Accès réservé L'accès réservé donne droit à l'intranet. Enfin, nous avons les rubriques de la FAQ situées au centre de la page du profil choisi. Nous avons étudié 12 rubriques de questions/réponses, celles-ci peuvent encore évoluer. 14

Voici une première ébauche des rubriques FAQ: N Titre de la FAQ Profil Récupération de rubriques existantes 1 Je suis nouveau à l'université Etudiant, Enseignant, Compte invité 2 Environnement de travail à l'université Etudiant, Enseignant, Nomade, Compte Invité, connexion, Logiciels, NTP, Demandes d'intervention, Règlements, matériel 3 Environnement Numérique de travail Etudiant, Enseignant, Sauvegarde 4 Partenariat économique Partenaire économique 5 Travailler à l'extérieur Etudiant, Enseignant, Nomade, FTP 6 Serveurs Web Enseignant, WWW 7 Cours en ligne Etudiant, Enseignant, TICe 8 Téléphone Enseignant, Demandes d'intervention, Téléphone 9 Audio Vidéoconférence Etudiant, Enseignant, Audio Vidéoconférence 10 Messagerie Electronique Etudiant, Enseignant, Listes de diffusion, Webmail 11 Applications de gestion Enseignant, CIG, Scolarité 12 Formations Enseignant, Formations o Niveau 3 Le troisième niveau donne les différentes questions/réponses de la rubrique de FAQ sélectionnée ou le lien de la page demandée. 15

3.3.4.Interfaces Dans les CMS, on distingue deux types d interfaces : - BackOffice : l interface utilisée par les rédacteurs et administrateurs du site pour la gestion du contenu et l administration des templates. Cette interface est appelée Backend en Typo3. Le Backend est déjà implémentée par Typo3. - FrontOffice : cette interface est la vitrine du site, c est ce que tout internaute peut aller consulter. En Typo3, cette interface s appelle FrontEnd. Le CRI demande la réutilisation des templates utilisés pour le site de l UAPV. Nous aurons ainsi les trois niveaux qui se présenteront de la manière suivante : Les profils : La page d accueil du profil sélectionné : Chaque profil se présentera de la même façon, il n y aura que l intitulé des rubriques de la FAQ qui changera. 16

Pour la page des réponses aux questions de la FAQ deux possibilités s offrent à nous : Une page avec les questions en haut avec des liens vers les réponses situées plus bas : 17

Une page avec l intitulé de toutes les questions avec des liens menant vers des pages séparées où se trouveront les réponses : 3.3.5.Connexions et liens avec l existant Des liens vers les sites des TICe, de l ENT et de l intranet seront intégrés dans les différentes rubriques du site. 3.3.6.Reprises des données existantes En ce qui concerne la reprise des données existantes, la majorité du contenu du site actuel sera repris et intégré dans le nouveau site à travers les réponses aux questions de la FAQ entre autre. 3.3.7.Gestion des droits d accès L accès administrateur est destiné au directeur (Thierry Spriet) et aux deux directeurs techniques (Réseaux Infrastructures : Stéphane IGOUNET et Systèmes : Thomas GUTHMANN). Chaque partie du CRI pourra modifier les contenus de leur partie et seul les administrateurs pourront valider et mettre en ligne la mise à jour avec les modifications. 18

3.4.Usage et exploitation 3.4.1.Formation Une formation durant tout le semestre sera effectuée pour le directeur du CRI (Thierry Spriet). 3.4.2.Evolution Toutes les rubriques de la FAQ seront paramétrables et pourront être rajoutées ou supprimées facilement à travers l interface Backend sous Typo3. 3.4.3.Manuels Un manuel utilisateur pour la modification, l ajout et la suppression des rubriques sera rédiger à la demande du directeur du CRI (Thierry Spriet). 3.5.Planning prévisionnel Période Janvier 2007 Fin Janvier 2007 31 Janvier 2007 Février/Mars 2007 Mars 2007 Avril Fin Avril Mai Fin Mai Tâche Finalisation du cahier des charges Réunion finalisation du cahier des charges avec Thierry Spriet Validation du cahier des charges par le CRI Création des templates Réunion avancement1 avec Thierry Spriet Gestion des utilisateurs / Insertion de contenus Réunion avancement2 avec Thierry Spriet Tests / Création de la documentation pour le CRI Livraison du mini-site au CRI 19

4.Conclusion et bilan du premier semestre 4.1.Points positifs Ce premier semestre nous a permis de découvrir un nouvel outil qui est un plus dans notre cursus universitaire. D autant qu il est en pleine expansion et qu il offre de très nombreuses possibilités. Typo3 est en effet complètement paramétrable ce qui nous donne de nombreuses éventualités pour réaliser le site du CRI. 4.2.Points négatifs Le sujet du deuxième semestre nous a été communiqué seulement début décembre c est pourquoi nous n avons pas eu suffisamment de temps pour réaliser un cahier des charges complet et plus précis. 20