A2 – Atelier Web

Planning des cours : 48 heures TP (12×4)

Objectifs du cours : Connaître, prendre en main et maîtriser les plateformes de publication web (CMS). Réaliser un site web complet. Réaliser les supports d’accompagnement du projet et de maintenance du site. Gérer l’hébergement, le nom de domaine et l’installation (serveur) du site. Remettre le tout au client final -)

Pré-requis :

  • Cours documents structurés (première année / Bernard Germain)
  • Cours Ecriture numérique (deuxième année / Olivier Ertzscheid)
  • Toutes les notions abordées dans ces deux cours seront considérées acquises et doivent donc être revues si nécessaire.
  • Consulter également la bibliographie de ce cours.

Evaluation du cours :

  • Une note globale chaque semestre, soit 2 notes au total
  • Site(s) web(s) réalisé(s) : site lui-même + documents d’accompagnement + comportement, implication (individuel et collectif) dans la gestion du projet.
  • et peut-être 1 ou 2 exercices courts (type QCM) réalisés en atelier.
  • + fil rouge site infocom. Publier sur le site infocom : AU MOINS un article long (c’est à dire un peu fouillé, et éventuelement illustré avec des photos) ou deux articles courts PAR SEMAINE.

Cours 1 : Vendredi 11 septembre

1/ Présentation de l’Atelier
2/ Présentation des projets webs des années précédentes & Utilisation de CMS :

  • un logiciel CMS est un site « clé en main » développé par des programmeurs, il vous permet avec assez peu de connaissances, de créer, et surtout de gérer, ajouter, éditer du contenu sur un site en ligne, sans logiciel, juste avec l’aide de votre navigateur internet habituel.
    www.rennes-internet.com/vocabulaire-internet.html. Voir aussi la page Wikipedia des CMS qui insiste sur la séparation entre le fond et la forme

3 / Méthodologie de conduite de projet web

  • Définition du projet : étude préalable … Cahier des charges fonctionnel … Plan projet … Equipe de réalisation
  • Conception du site : fonctionnelle … technique … visuelle …
  • Réalisation du site
  • Mise en ligne du site
  • le tout résumé en une petite image :

methodologie

4/ Première découverte « live » d’une interface SPIP & Blog

  • Pour vous exercer tranquillement sans avoir peur de rien “casser” : une démo publique de SPIP qui vous donne accès à l’interface d’administration (login : demo_admin, password : demo) et à toutes les options de publication http://demo.spip.org/spip.php?article10
  • Et pour arriver plus intelligent que le prof au prochain cours : plein de jolis tutoriels SPIP
  • Découverte de l’interface de publication et des fonctionnalités de WordPress. (Rappel : WordPress est un CMS que nous allons apprendre à utiliser pour créer des blogs). Rendez-vous sur la page http://www.opensourcecms.com/demo/2/87/WordPress
  • Il s’agit d’un blog de démonstration, que tout le monde peut utiliser, et qui est remis à « zéro » toutes les deux heures. Ce qui veut dire que vous pouvez y aller et bidouiller dans tous les coins sans crainte de « casser » quelque chose.
  • L’objectif est de découvrir les fonctionnalités de WordPress dans l’ordre. Pour cela :
  1. Rendez-vous sur la page de connexion (http://www.opensourcecms.com/demo/2/87/WordPress) et tapez « admin » comme login et « demo123 » comme mot de passe. Ca y est, vous êtes « loggués ».
  2. Exploration des fonctionnalités proposées.
  3. A la fin des deux heures, chacun(e) devra être capable de : écrire un billet, une page, ajouter une catégorie, créer des catégories arborescentes (= emboîtées les unes dans les autres pour les malcomprenants), ajouter des liens,  changer de gabarit (ou de « thème »), modifier l’image d’en-tête du blog, et à quoi servent les petits « widgets »

Cours 2 : Mardi 22 septembre

A/ Présentation des projets & constitution des groupes projet avec nomination du « chef de projet »

  • CASI : Coordination des Associations de Solidarité Internationale. (Rendez-vous avec le « client » Lundi prochain à 14h)
  • PA : Palmes académiques.
  • IC : Site Infocom.
  • DL : Lycée De Lattre. (Rendez-vous aujourd’hui à 10h pour une première présentation avec le client).

B/ Constitution des groupes projet

  • Projet 1 CASI : Justine Brun, Caroline Dausmann, Delphine Courant (chef de projet)
  • Projet 2 PA : Bertille Solves-Hurel, Ana Garcia, Magali Bernier (chef de projet)
  • Projet 3 IC : Doriane Lemeur, Mélanie Troadec, Romain Leger, Caroline Trottin (chef de projet)
  • Projet 4 DL: Johanna Deconihout, Orlane Rozo, Agnès Brossier, Mélissa Audia (chef de projet)

C/ 2 délivrables à l’issue de cette seconde séance :

  1. Premier travail d’investigation autour du projet qui doit vous permettre de repérer des sites web « semblables » et de commencer à réfléchir à une arborescence.
  2. Rédiger un cahier des charges « à trous » en reprenant les infos données lors du dernier cours. M’envoyer le cahier des charges à la fin de la séance. Vous avez le droit de vous inspirer très fortement du cahier des charges disponible ici : cahier_des_charges_de_realisation_de_site_internet.pdf

D/ Cours : Utilisation d’un CMS.

Prospection pour ouverture et paramétrage d’une adresse (offre) d’hébergement. Selon les cahiers des charges de chaque projet : soit le client dispose déjà d’un compte chez un hébergeur et souhaite le réutiliser (auquel cas on récupère ses codes clients) soit tout est à faire, auquel cas (selon le budget) on étudie l’offre des différents hébergeurs en fonction des contraintes du site.

Choix des squelettes SPIP et/ou des gabarits WordPress ==> étape super-importante (notamment pour les gabarits SPIP, moins « souples » (= si on veut en changer, c’est plus compliqué) que les gabarits WordPress

Manipulation d’un logiciel de transfert de fichier (FTP) : Filezilla

Cours 3 : Mardi 6 Octobre

Tutoriel Spip et WordPress.

Délivrable à l’issue de la séance : Ouverture d’un blog wordpress.com dédié pour chaque projet. Alimentation du site et mise en place de l’arborescence et des premiers contenus. Les contenus seront « exportés » quand on passera à la phase de prototypage sur le site déployé « grandeur réelle ».

Cours 4 : Mardi 20 Octobre

  • site CASI : WordPress installé. Objectif fin de séance : importer données XML du site test, les réimporter dans le « vrai » site. Choix et installation du gabarit.
  • Site De Lattre : WordPress installé. Objectif fin de séance : importer données XML du site test, les réimporter dans le « vrai » site. Choix et installation du gabarit.
  • Site Palmes Académiques : changement du cahier des charges suite au rendez-vous avec le client.
  • SIte Infocom : plateforme WordPress pas encore installée. Travail sur les contenus depuis le site prototype.

Cours 5 : Mardi 10 Novembre

Mise en ligne des contenus. Peaufinage du rubriquage et de l’arborescence des sites.

Cours 6 : Mardi 24 Novembre : Cours annulé. Enseignant en grève.

Cours 7 : Mardi 8 Décembre

Evaluation-Bilan : chaque groupe prépare pendant une heure une présentation de son site web. Le contexte est le suivant : Vous êtes une « web-agency », et vous allez faire une présentation du site web réalisé devant les autres membres du « staff » qui ne connaissent RIEN de votre projet ni de votre client. L’objectif de la présentation (10 minutes minimum, 15 minutes maximum) est le suivant :

  • présentation du client (CASI, lycée de Lattre, Concours « bien écrire » palmes académiques, Dpt Infocom) et du cahier des charges (objectifs du site ; motivations du client = pourquoi il veut un site ; etc …)
  • présentation du prototype de site web : la présentation se fera via le vidéoprojecteur, en naviguant sur le prototype et en s’attardant sur des points particuliers en fonction du cahier des charges
  • Présentation des travaux restant à accomplir (nom de domaine, gabarit, images, points spécifiques du cahier des charges, etc …)

IMPORTANT : tous les membres du groupe devront prendre la parole pendant l’oral.

But du jeu de cette évaluation :

  • voir si vous êtes capables de « vendre » et surtout de défendre un produit (site web)
  • faire un bilan d’avancement pour tous les groupes
  • corriger les erreurs ou incohérences, notamment par rapport au cours d’écriture multimédia
  • (et accessoirement vous donner une note pour le S1)

A la fin de chaque présentation, les autres groupes interviendront pour faire part de leurs remarques et conseils avisés.

Cet exercice sera noté.

Suite du cours … pour les différents groupes :

  • DeLattre : prendre RdV avec le commanditaire (vérif mon edt). Préparer l’odj de la réunion (voir les points du cahier des charges restant à valider : nom de domaine, validation des contenus et du gabarit, etc …).
  • Casi : Terminer de mettre en ligne les infos. Prendre rdv avec le client avant les vacances ou au plus tard la première semaine de la rentrée pour validation.
  • PalmesAcadémiques : créer les pages du site web pour le colloque « L’enfant et le livre ».
  • Infocom : Nettoyage du site SPIP en fonction des indications de la dernière réunion avec Bernard Germain + intégration du fil RSS du blog sur le site Spip + prendre contact avec groupe « année de la comm » pour voir ou ils en sont de leur blog et pour intégration de leur fil RSS sur le site SPIP et sur le blog + enrichir les widgets RSS (mettre par exemple celui du grandR) + réfléchir à l’intégration des actus de l’assoc AIR-IC et de l’assoc culture « Le Fil » = me proposer des solutions pour que le site puisse continuer de rendre compte de l’actu de ces assos même quand vous serez partis en stage …

ATTENTION : IL NE RESTERA QUE 4 COURS APRES LES VACANCES. PRENEZ DE L’AVANCE SUR LA REALISATION DU TUTORIEL WORDPRESS. PENSEZ A METTRE A JOUR LE DOCUMENT « CAHIER DES CHARGES » AU FUR ET A MESURE DE VOS AVANCEES.

FIN DU SEMESTRE 1.


COURS DU SEMESTRE 2.

Cours 8 : semaine 2

  • Avancée sur les contenus.

Cours 9 : semaine 4

  • Objectif fin de séance pour tous les groupes (Infocom / De lattre / Casi / Blog FrN) : m’envoyer une version « finale » :
  • Du cahier des charges
  • Du document de formation (pensez à ajouter un lien vers le site en ligne http://codex.wordpress.org/fr:Accueil)
  • Valider la date de la formation avec le client (s’il en souhaite une)
  • En parallèle : « terminer » les contenus + régler les différents petits bugs

Cours 10 : semaine 6

  • Pour tous les groupes : filage d’un scénario complet d’installation et paramétrage d’un site.
  • Cours et démo sur la gestion des plug-in dans wordpress + insertion d’une liste de diffusion + paramétrage
  • Gestion du référencement du site.

Cours 11 : semaine 10

  • ?

Cours 12 : semaine 12

  • Normalement tout est fini et le prof paie son coup de champomy.

Publicités

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s

%d blogueurs aiment cette page :