Le Nouveau Site Web Présentation : Francis Conception du site : Nicolas © Association Sportive Matra Toulouse Section Plongée 21 Janvier 2008 V1.2

Sommaire 1. But du Site 2. Historique 3. Quelques définitions 4. Les Nouveaux outils du Site 5. Le Site (Page d’Accueil, un Article) 6. Naviguer sur le Site (Accès aux Articles ) 7. Fonctions Utilisateur (Poster un Commentaire, s’inscrire) 8. Fonctions Avancées Utilisateur (Déposer ses Photos sur PICASA, créer un lien) 9. Fonctions Rédacteur (Créer un article / Insérer un lien vers un album photo ) 10. Fonctions Administrateur (Mettre à jour le Calendrier / Gérer la liste de Diffusion) 1

I/ But du site [ Diffuser les informations de la section Diffuser les informations de la section –Les status du club (Organisation/Bureau/CR) –Les Annonces des activités (Week-End / Voyages / Cours) –Les Supports des Cours –Le Planning des activités de la section (date/Lieu des événements) –Les Infos pratiques (La vie de la section) Echanger des informations dans la section Echanger des informations dans la section –Retour d’expérience des W-E/Voyages… –Discussions Rassembler les membres Rassembler les membres 2

II/ Historique du site 2005 : Réservation de l’accès chez FREE + Mail (Francis) 2005 : Réservation de l’accès chez FREE + Mail (Francis) : Création du premier site (Stéphane) 2006 : Création du premier site (Stéphane) – –Technologie html simple 2007 : Création du deuxième site (Grégory) 2007 : Création du deuxième site (Grégory) –Avec un outillage html/php dédié (Outil KwsPHP) 2008 : Création du troisième site (Nicolas) 2008 : Création du troisième site (Nicolas) –Basée sur la technologie des blogs (Outil WordPress) 3

III/ Quelques définitions Un nouveau site, de nouvelles technologies, de nouvelles définitions Blog : Un blog (blogue) est un site web constitué par la réunion d’articles écrits dans l'ordre chronologique, et classés la plupart du temps par ordre ante-chronologique (les plus récents en premiers). Chaque article est, à l'image d'un journal de bord. Le contenu souvent textuel,est enrichi d'hyperliens et d'éléments multimédias, sur lequel chaque lecteur peut généralement apporter des commentaires. site webhyperlienssite webhyperliens Un moteur de blog est exécuté sur un serveur. Il est accessible via une interface web. Ainsi, un simple navigateur web permet de lire le blog, mais également de l'administrer. L'interface d'administration est sécurisé ; souvent grâce à un mot de passe. serveur navigateur webserveur navigateur web Un autre très gros avantage est de disposer de plusieurs mécanismes de recherche de l’information grâce à ces multiples possibilités d’organisation des articles (catégorie et temps), ainsi que par des mots clés, ou par un simple search de chaîne de caractère. 4

IV/ Les Nouveaux Outils du site (1/2) Sur la base d’un gestionnaire de contenu (Blog) Diffusion l’information via Diffusion l’information via –le mécanisme des « Articles » du blog –un lien vers le calendrier Google pour le Planning login : login : Echanger des Informations (la vie de la section) Echanger des Informations (la vie de la section) –Via le mécanisme des « commentaires » en réponses à des articles 5

IV/ Les Nouveaux Outils du site (2/2) Dépots des photos dans des Albums WEB : Dépots des photos dans des Albums WEB : –sur Google Picasa –Possibilité de lier les photos sur le site Gestion des listes de diffusion : Gestion des listes de diffusion : –Par Google group Ce nouveau site offre plusieurs avantages : simple à utiliser, il est aussi simple à gérer et à administrer (Article / Commentaire / Modération / Maj). Il est aussi associé à des outils extérieurs faciles à mettre à jour (calendrier, photos, liste de diffusion). Il est aussi associé à des outils extérieurs faciles à mettre à jour (calendrier, photos, liste de diffusion). 6

V/ Le Site [Haut de page] (1/4) Partie Dynamique,son contenu dépend du contexte.Soit :- un Article, - une liste d’article, -un c alendrier, - un commentaire … à partir la liste) d’un menu ou résultat de la recherche (Page/Catégories/Archives/Search) Pages Principales [Menu] Adresse ( URL ) du Site Nom du Site Recherche par Mot Clé des Articles du site Les Titres des derniers événements postés ( Commentaires ou Articles ) Sélection par typage des Articles (Catégories / Archives) [Menu] Liens Administration Présentation 7

V/ Le Site [Bas de page] (2/4) Liens Exterieurs Liste des Mots Clé (Taille proportionnelle) Poster un commentaire sur un article Le Calendrier De la section Fin de l’article 8

V/ Le Site [Un Article] (3/4) Titre de l’Article CatégorieDe l’Article Contenu deL’ Article Auteur de La Publication Date de Publication Tag (Mot Clé) [en rouge] 9

V/ Le Site [Un Article] (4/4) Possibilité d’associer des photos (dans un article) ou un lien (Article et Commentaire) Liste des Tags (Mot Clé) De l’Article Lien vers l’Album PICASA 10

VI/ Naviguer sur le site [Pages Principales] (1/6) Pages Principales : Elles permettent d’accéder directement aux rubriques principales du site [seule la partie de gauche (Dynamique) est modifiée]. La page d’accueil du site (affiche le dernier article crée) Affiche Le planning des activités de la section Comment fonctionne la section (tour de Matos, règlement, Procédures…) Concerne l’organisation des Sorties de la Section (W-E, Voyages..) Comment utiliser le site Affiche aussi Le Planning 11

VI/ Naviguer sur le site [Catégories] (2/6) Catégories : Elles permettent d’afficher la liste des articles contenus dans ces rubriques. [Seule la partie de gauche (Dynamique) est modifiée]. Entre parenthèse Le nombre d’article disponibles. La liste des Articles Cliquer dessus pour les faire apparaître 12

VI/ Naviguer sur le site [Les Archives] (3/6) Archives : Elles permettent d’afficher la liste des articles crées à ces dates quelques soit leur catégorie. [Seule la partie de gauche (Dynamique) est modifiée]. La liste des Articles Cliquer dessus pour les faire apparaître 13

VI/ Naviguer sur le site [Liens / Sponsors] (4/6) Liens : Lien hyper texte vers des sites partenaires ou commerciaux. [Seule la partie de gauche (Dynamique) est modifiée]. 14

VI/ Naviguer sur le site [Les TAGS] (5/6) Tags : Permet de retrouver et d’afficher la liste des Articles contenant le tag sélectionné. [Seule la partie de gauche (Dynamique) est modifiée]. 15

VI/ Naviguer sur le site [search] (6/6) Search : Afficher la liste des Articles contenant la chaîne de caractère saisie. [Seule la partie de gauche (Dynamique) est modifiée]. 16

VII/ Fonctions Utilisateur [commentaire] (1/2) Commentaire : Vous voulez donner un avis sur l’article ? => il faut poster un commentaire A la fin de l’article la grille de saisie suivante apparaît. Saisir les champs Nom et Courriel, puis le message, et cliquer sur le bouton POST. Nota : Un commentaire posté par un nouveau auteur sur le site est « modéré » c-a-d contrôlé par le modérateur (il n’apparaîtra pas de suite). Pour les commentaires suivant de ce même auteur, ils apparaîtront automatiquement. 17

VII/ Fonctions Utilisateur [Inscription] (2/2) Inscription : Si vous souhaitez déposer un article : il faut s’inscrire au préalable auprès de l’administrateur du site. Saisir les informations dans les champs du formulaire d’inscription et cliquer sur le bouton « S’inscrire » 18

1.Se connecter sur Picasa avec un des login suivants : Créer un nouveau Album (Règle de Titrage : Lieu – Auteur) 3. Uploader ses photos dans cet Album (Directement à partir de son PC) VIII/ Fonctions Avancé Utilisateur [Déposer ces photos sur PICASA] (1/2) Remarques : Limiter le nombre de Photo (max 20) et les alléger (max 100K)19

VIII/ Fonctions Avancé Utilisateur [ Créer un lien simple vers l’album PICASA] (2/2) Dans un commentaire utilisateur il est possible de mettre un lien vers un Album Photo. Suivre la procédure décrite dans la FAQ du Site : Lien vers l’Album PICASA Remarque : L’exemple présenté est dans un Article 20

IX/ Fonctions Rédacteur [Créer un Article] 1.Lire la FAQ du site 2.Ce connecter sur le site (Après Inscription) 3.Créer l’Article Nota : Règles de titrage de l’Article => Lieu - Date - Prénom 21

IX/ Fonctions Rédacteur [Lien Visuel PICASA] Dans un Article il est possible de mettre un lien Visuel et dynamique vers un Album Photo. Suivre la procédure décrite dans la FAQ du Site. Lien Visuel sur l’Album PICASA Remarque : Ce n’est pas possible dans un commentaire 22

X/ Fonctions Administrateur [MAJ Agenda] 1.Ce connecter sur l’agenda de l’ASMT Plongée avec le login 2.Mettre à jour l’Agenda directement Documentation : 23

X/ Fonctions Administrateur [MAJ Diffusion] 1.Se connecter sur le google group avec le login administrateur 2.Mettre à jour la liste des adresses enregistrées 3.Liste des groupes de l’ASMT : (liste complète) (liste N1 seul) (liste N2 seul) (liste N3 seul) (liste Bureau seul) 24