LICENCE LEA L3 INFORMATIQUE - SECOND SEMESTRE CONSIGNES DE REDACTION DU CAHIER DES CHARGES - PROJET SITE WEB Projet réalisé par groupe de 2 étudiants (note commune) Cahier des charges (4 séances) : 50% de la note Site Web (8 séances) : 50% de la note La rédaction du cahier des charges se place dans le cadre d une réponse à un appel à projets. L idée consiste à présenter à votre partenaire votre solution (votre projet) de site Web, sachant que vous êtes dans un climat de concurrence. Il s agit donc de rédiger un document qui sera utilisé comme support à l acceptation du contrat puis référence à la production même du site (chaque partie s engage à respecter ce qui a été écrit dans le cahier des charges ; votre partenaire ne pourra pas vous en demander plus et vous vous engager à produire tout ce qui a été précisé). La réalisation effective du site (à partir des différents logiciels étudiés en cours) et sa publication «on-line» (par exemple chez free) seront des tâches effectuées dans un second temps. Notez qu il est possible d utiliser un autre logiciel que celui présenté en cours à savoir Kompozer (par exemple Dreamweaver ou FrontPage). Remarque : le site devra être produit au minimum en deux langues (dont le français)! Les groupes de 3 personnes sont autorisés à condition que le site soit développé en deux langues étrangères (en sus du Français), par exemple Anglais et Espagnol. PLAN RECOMMANDE Introduction. Présentation du partenaire (association sportive, culturelle, etc. petite entreprise magasin hors e-business, etc.) - Objectifs visés à travers le site. Partie 1 : Contenu du site L objectif de cette partie est de décrire le contenu des différentes rubriques de votre solution. Il ne s agit pas de décliner la forme visée (cet aspect sera abordé par la suite lors de la réalisation effectif du site) mais de présenter la structure de votre site par l intermédiaire de rubriques et de contenu de rubriques. Il est bien évidemment L3 - LEA (Université de Nantes) 1/10
possible d inclure les textes qui seront affichés dans le site par la suite et qui correspondent au contenu des rubriques (par exemple, l historique de l association), mais ceux-ci devront être positionnés en Annexes du rapport. 1.1. Architecture générale du site 1.2. Rubrique 1 et ses éventuelles sous-rubriques 1.3. Rubrique i et ses éventuelles sous-rubriques Cette partie doit offrir la possibilité au lecteur de «s imaginer» le site en terme de mise en forme. Elle ne doit pas imposer une charte graphique ou une forme particulière. La cohérence, la pertinence et l originalité des rubriques choisies (et leur organisation) est primordiale et doit refléter la solution que vous allez apporter à votre commanditaire. Partie 2 : Etude de l existant L objectif de cette partie est de montrer à votre partenaire (1) que vous connaissez bien «le contexte virtuel» dans lequel vient se positionner votre projet (en lui montrant les sites proches, concurrents voir futurs partenaires) et (2) que vous avez défini une stratégie de référencement pour faire connaître le site. Ces deux points sont importants pour mettre en confiance votre commanditaire : «vous n êtes pas qu un développeur de site web mais un véritable cabinet d audit capable de positionner un projet web dans le contexte actuel» ; cet audit étant également une bonne source d inspiration (il faut savoir copier les bonnes idées et rejeter les mauvaises!). 2.1. Les sites proches Il s agit de présenter, par exemple sous forme de tableaux, des sites partenaires (par exemple, le site de la Fédération Française de Volley) et/ou concurrents directs (par exemple, le site du club voisin). Les sites devront être regroupés en grandes thématiques (afin d éviter de longues listes) et de faciliter la vision de l existant (par exemple, pour un club de Volley, les sites institutionnels, les clubs proches géographiquement, les clubs étrangers, etc.). Au maximum, 10 sites seront présentés, sachant qu il est possible de lister d autres sites en Annexe. Notons que pour l aspect Etranger, il est recommandé, lorsque le sujet s y prête, de faire une analyse comparative sur la façon dont le même projet peut être présenté en France et dans les pays étrangers, par exemple, un site web dédié à une épicerie fine de produits italiens est-elle présentée (sur le web) de la même façon en France, en Allemagne et en Italie? De même, quelles sont les différences entre un site de web de club de rugby français et gallois? Chaque site sera décrit par un texte synthétique, une URL, une accroche visuelle (capture d écran) et une liste de critères d analyse à définir en fonction de la thématique du projet. Ces critères devront aborder au minimum : le contenu L3 - LEA (Université de Nantes) 2/10
informationnel, la qualité rédactionnelle, la navigabilité, le graphisme au sens visuel, les langues étrangères développées et divers autres éléments du type impressions au premier abord, idées originales, positionnement sur google par rapport à certains mots clés, etc. Un système de notation final de chaque site est à définir. 2.2. La stratégie de référencement 2.2.1 Fiche signalétique du site Rédaction d une fiche synthétique de présentation du site, en deux langues (ou trois si vous êtes 3 étudiants sur le projet), qui vous servira par la suite lors de la phase de référencement. Ces deux fiches doivent être négociées avec votre partenaire car de leur contenu dépendra la bonne visibilité et l image du site sur les outils de recherche (moteurs, annuaires spécialisés, etc.). Négocier également la liste des mots clés (environ 30 dans les 2 langues). Titre du site : Bio Latitude Institut bio de beauté et de bien-être URL : http://www.bio-latitude.com (ou http://biolatitude.free.fr) Description synthétique : Institut de beauté et de bien-être fondé sur l'usage exclusif de produits biologiques, Bio Latitude vous propose de vous évader dans une atmosphère zen et naturelle, peuplée de calme et de raffinement. Un endroit cosy pour une halte urbaine au plein cœur des Sorinières et à deux pas du centre ville de Nantes. Mots clés en français (environ 30) : bio, latitude, biologique, cosmétique bio, produits bio, nantes, institut de beauté, bien être, esthéticienne, soins bio, institut de beaué bio, dr hauschka, phyts, laboratoire, nvey eco, maquillage bio, parfun bio, creme bio, the bio, santé bio, accessoire bio, innovation bio, nouveau institut, nantes bio, massage, relaxation, modelage, zen, zenitude, épilation, visage, corps, naturel, nature, vert, econet, certification bio, SPA, SPB, cocoon, senteurs de fée, nantes, reze, sorinieres, sorinières, rezé, cool, chaleureux. Attention! La description synthétique ne doit pas correspondre à «Ce site est composé de 4 rubriques.» mais à une accroche de communication sur le projet. 2.2.2 La diffusion «en ligne» Les sites institutionnels (fédérations nationales), les annuaires généralistes (pages jaunes, ville de Nantes) et/ou spécialisés, etc. Il s agit ici de montrer à votre partenaire que vous avez des idées originales et un plan précis pour faire connaître le site au sein du web. Il faut trouver des annuaires spécialisés pertinents. L3 - LEA (Université de Nantes) 3/10
2.2.3 La diffusion «hors ligne» La presse standard et spécialisée, les encarts publicitaires (radios, ), les flyers, etc. Il s agit ici de montrer à votre partenaire que vous avez des idées originales et un plan précis pour faire connaître le site en dehors du web. Conclusion C est la seule partie non formelle du rapport. Vous devez nous parler directement de vos relations avec votre partenaire (du type «c est mon oncle»), de l importance du projet pour votre partenaire («il compte beaucoup dessus»), de vos besoins en technique (un appareil photo numérique pour couvrir un événement, on veut mettre du son, etc.) et vos états d âmes éventuels!!! Cette conclusion devra être supprimée du dossier si le cahier des charges est diffusé. Remarques de forme : l utilisation des styles est imposée! Ne pas oublier la page de garde (accrocheuse et ne comportant pas vos noms qui seront précisés en seconde page!), le sommaire. Pensez à discuter avec votre enseignant du nom de votre projet qui conditionne le nom de domaine (adresse web) de votre futur site (http://nomdeprojet.free.fr). Cette adresse devra être précisée sur la page de garde ; pour certains projets, il sera également possible de réserver le.com,.org,.fr,.info (les consignes seront données en cours). D un point de vue longueur, le document produit ne devra pas dépasser les 15 pages. L originalité de présentation sera prise en compte dans l évaluation. Critères de notation Critères de notation du cahier des charges. CAHIER DES CHARGES EXISTANT /4 REFERENCEMENT /3 FICHE /3 CONTENU /4 INNOVATION & DOSSIER /6 Analyse des sites existants (intérêt de la typologie, pertinence des critères d'analyse, choix des sites prototypiques, analyse comparative des sites internationaux, bilan) Positionnement de la Stratégie de référencement (En Ligne et Hors Ligne) Pertinence des annuaires et cohérence avec les objectifs de communication Fiches en langues étrangères (pertinence des mots clés, rédaction de la synthèse, choix/poids communication, réponse aux objectifs) Contenu des rubriques, Structuration du site et Adéquation au projet Innovation et originalité (fond et forme) Définition claire des objectifs langues Pertinences des annexes Styles Word L3 - LEA (Université de Nantes) 4/10
Critères de notation du site web. SITE TECHNIQUE /5 CONTENU INFORMATIONNEL /5 MULTIMEDIA /5 REFERENCEMENT REEL / 5 Problème de liens cassés et images Structure du site Respect du nombre de langues Clarté dans la rédaction (équilibre texte, image, placement), facilité dans la navigation, pas trop de profondeur dans les menus Effort de Production Multimédia (Images, Video youtube, dailymotion, Sons, Slides picturetrail, Deezer, etc.) Vérifier la cohérence des tags TITRE, DESCRIPTION, KEYWORDS Si bien référencé dans Google par rapport aux mots clés visés, bonus Des exemples de sites des années précédentes Voir le site http://www.lea-nantes.com/informatique Quelques pointeurs de sites web Recherche et positionnement du projet Ressources pour webmestres Quelques sites incontournables pour la recherche de sites connexes et la stratégie de «Référencement» http://www.lesannuaires.com http://www.maville.com (http://asso.maville.com/associations/nantes_association.html pour l annuaire des associations) http://www.nantes.fr/ http://www.pagesjaunes.fr http://www.nantes-tourisme.com/ http://www.portail44.org (Annuaire des sites nantais) http://www.fra.cityvox.fr http://nantes.cityannuaire.com/ http://www.44-nantes.net/ http://www.nantes-web.com/ L3 - LEA (Université de Nantes) 5/10
Les sites des institutions départementales, régionales et nationales (par exemple, le site de la Fédération Française de Volley - http://www.volley.asso.fr/) http://www.paysdelaloire.fr/ http://www.cg44.fr/ http://www.nantes.cci.fr/ Quelques pistes pour photos Libre de Droits http://fr.fotolia.com/ http://www.gettyimages.com Quelques pistes pour les kits graphiques http://www.oswd.org (gratuit) http://www.free-css-templates.com/ (gratuit) http://www.openwebdesign.org (gratuit) http://www.graphiques-kits.com/ (gratuit) http://www.opendesigns.org/ (gratuit) http://www.kitgrafik.com/ (allo pass) http://www.freegaia.com/ (allo pass) http://www.kit-graphique-web.com/ (allo pass) http://web2net.free.fr/ (allo pass) http://www.easycreation.com (Bien) http://www.freelayouts.com/ (Bien) http://kitgraphique.maxiservices.net/ (Bien) http://godtemplates.com http://www.gratos.be/webmaster/ http://www.webdiz.com/ Autres ressources pour votre site (javascripts, images, gifs animés, etc.) http://www.editeurjavascript.com (INCONTOURNABLE) http://www.generateur.net (Génération automatique de bannières) http://www.maxiservices.net/ (Génération automatique de bannières) http://dynamicdrive.com/ (des javascripts gratuits) http://www.gograph.com/ http://freegraphics.com/ http://www.abc-creatweb.com/ : excellentes applets (images sur cube 3D) ; excellents effets graphiques en JavaScript http://xaruf.free.fr/ http://appletworld.free.fr/ Un web-ring (anneau communautaire) sur le graphisme et le design :http://i.webring.com/hub?ring=artetwebdesignfr http://www.atelierwebzone.com Hébergement de site avec nom de domaine au choix compris (compter 70 Euros / an) L3 - LEA (Université de Nantes) 6/10
http://www.amen.fr (avec en plus un Web Creator très complet) http://www.ovh.com http://www.lost-oasis.net http://www.oneandone.fr http://www.un-nom.com Sites persos qui proposent de nombreuses ressources http://amandine4.chez.tiscali.fr/ http://www.chambily.com (logiciels anti-yeux rouges) http://www.lewebmaster.net http://www.grenadine.net/ (des fonds d'écran sympa) Quelques pointeurs pour le référencement http://www.google.com Bas, A propos Puis Ajouter URL http://www.pagerank.fr/ http://www.referencement-fr.com/ http://www.referencement-2000.com http://www.refgratuit.com/ http://www.adamah.com/ http://www.refposition.com http://www.abondance.com/), Contrôler le référencement : logiciel Advanced Web Ranking http://www.advancedwebranking.com Quelques pistes pour des ressources (gifs animés, fonds d écran, etc.) http://fr.bestgraph.com Quelques pistes pour des logiciels gratuits bien utiles http://www.telecharger.com/ http://www.weboutils.com/ http://www.francegratuit.com/ http://www.gratissimo.com/ http://www.gratilog.net/ Des sites généralistes http://www.toutgratuit.com http://www.radins.com/ http://www.webdeveloppeur.com/ http://www.webmestre.org/ Des conseils sur le cahier des charges http://www.ebusinessgeneration.com/redaction-cahier-des-charges.html Quelques logiciels gratuits bien utiles Pour «Franciser» les logiciels : L3 - LEA (Université de Nantes) 7/10
http://www.toutfr.com/ PHOTO Paint.Net PhotoFiltre Retouche Photos très complet : http://www.photofiltre.com XnView Retouche Photos par lots + Format IPTC : http://www.xnview.com/ Picasa Excellent gestionnaire de photos + Diaporamas Web http://www.picasa.com IrfanView Diaporama photo exécutable + Traitement par lots (réduction taille, poids) + Capture écran http://www.irfanview.com/ Pour paramétrer IrfanView en version Française, il faut télécharger French.zip (http://irfanview.tuwien.ac.at/lang/french.zip), puis copier le fichier french.dll dans le répertoire c:\programfiles\irfanview\languages\ ImageWalker Excellent pour Diaporamas Web + Indexation IPTC/ EXIF http://www.imagewalker.com/ Kalimages Logiciel/prototype permettant de décrire, indexer, classifier et rechercher des images numériques selon le standard IPTC http://www.kalimages.com Création de CD au format DVD (le format VCD) : NeroVision Express ou ProShow Gold AUDIO dbpoweramp Music Converter (dmc) Convertion de fichiers audio (WAV to MP3) : http://www.telecharger.com AUTRES Autre logiciel (générateur d Applets style cube 3D) Anfy210e.exe (Applets menus 3D sur un cube) http://www.anfyteam.com/ Styles à étudier: MadText, AnfyPaint, AnfyPuzzle, Othet/TextScroller and Zoom and Blur, 3DApplets/3DCube et 3DCube+Links CREATION DE MENUS NavStudio 2005 : http://www.opencube.com Sites spécialisés : http://dynamicdrive.com/ SERVICES GRATUITS (à intégrer sur le site) Exemples : bulletin météo (météo consult), horoscopes, informations, etc. http://www.gratuits-sites.com/ http://contenu-gratuit.web-soluces.net/services%20gratuits/actualite/actualites.php http://www.action-webmasters.com/ http://www.gratos.be/webmaster.php?catid=945 http://www.picturetrail.com/ http://www.widgetbox.com/ L3 - LEA (Université de Nantes) 8/10
http://www.slide.com http://www.deezer.com/ http://www.vuvox.com http://www.photoshow.com http://www.fliptrack.com http://www.animoto.com http://www.my-google-maps.com/ Vidéos http://www.stage6.com http://www.youtube.com http://www.dailymotion.com Blog http://fr.wordpress.com/ http://www.canalblog.com/public/ http://www.over-blog.com/ Flux RSS Pour intégrer un flux RSS dans votre site : http://www.widgeteasy.com/ Radio Web Pour intégrer une radio web : http://www.goomradio.com/goomweb/home.do L3 - LEA (Université de Nantes) 9/10
TRAITEMENT D IMAGES (à l aide de logiciels gratuits et disponible sur internet) IrfanView Traitement par lots : redimensionnemnet et le renommage Exemple : renommer et diminuer en taille (octets) un ensemble de photos Paint.Net Création dune image avec Calques Exemple : créer une bannière de 750 sur 100 pixels par copier/coller d images existantes et en jouant sur les transparences des calques L3 - LEA (Université de Nantes) 10/10