dfgdfggggggggggggggggggggggggggggggggggggggggggggggggggggg ...users.polytech.unice.fr/~buffa/cours/internet/projets/form… · Web view04/03/2010 · L’utilisatrice s’est immédiatement

Projet commun IHM, BDOO et Internet.

Sophia Forum est le forum de l'emploi de Sophia Antipolis, fruit du travail d'étudiants de différentes écoles rassemblées en une association (CERAM, ESINSA, ESSI, Eurécom, ISIA et IUP). Le site web de Sophia Forum constitue non seulement une vitrine de cet événement, mais peut proposer des outils efficaces pour la recherche d’emploi et le recrutement (liste d’offres d’emploi et de CV). Par ailleurs, il doit permettre à ces élèves de mieux préparer l’organisation du forum.

Sophia Forum

Projet commun IHM, BDOO et InternetFévrier-Avril 2000

1. SOMMAIRE

1. Sommaire..........................................................................................................22. Présentation.......................................................................................................4

Introduction........................................................................................................4Contexte et but...................................................................................................4Equipe.................................................................................................................5

3. Partie IHM..........................................................................................................6Description du sujet............................................................................................6Analyse de l’existant..........................................................................................7

3.2.1. Ancien site web.....................................................................................73.2.2. www.atoutjob.com.................................................................................93.2.3. www.libremploi.fr................................................................................103.2.4. www.abjob.com...................................................................................113.2.5. www.planetcareer.com........................................................................123.2.6. www.cadresonline.com........................................................................133.2.7. Autres sites..........................................................................................13

Modèle conceptuel de l’utilisateur....................................................................143.3.1. Méthodologie.......................................................................................143.3.2. Interview..............................................................................................153.3.3. Analyse de l’existant par les interviewées..........................................16

Modèle conceptuel de conception....................................................................173.4.1. Page d’entrée......................................................................................173.4.2. Informations présentes sur toutes les pages.......................................183.4.3. édition 1999 (partie commune)...........................................................183.4.4. édition 2000 (partie commune)...........................................................193.4.5. édition 2001 (partie commune)...........................................................203.4.6. Sophia Antipolis (partie commune).....................................................203.4.7. emploi (partie commune)....................................................................213.4.8. news (partie commune).......................................................................213.4.9. forum (partie commune).....................................................................213.4.10. recommander une page à un ami (partie commune)........................213.4.11. rapporter un bug (partie commune)..................................................213.4.12. informations légales (partie commune).............................................213.4.13. newsletter (partie commune)............................................................213.4.14. contact (partie commune).................................................................213.4.15. Partie chercheur d’emploi.................................................................223.4.16. diagramme UAN : tâche « Saisie d’une nouvelle News »..................23

Choix de l’outil et réflexion sur la connexion avec les autre matières propres au projet................................................................................................................24Evaluation de l’interface par la première interviewée......................................24

3.6.1. Introduction.........................................................................................243.6.2. Première interviewée et premières impressions.................................243.6.3. Consulter une news.............................................................................243.6.4. Rechercher une offre...........................................................................243.6.5. Créer son profil....................................................................................253.6.6. Conclusion...........................................................................................253.6.7. Seconde interviewée et premières impressions..................................253.6.8. Consulter une news.............................................................................253.6.9. Rechercher une offre...........................................................................253.6.10. Créer son profil..................................................................................253.6.11. Conclusion.........................................................................................263.6.12. Autres impressions............................................................................26

4. Partie BDOO.....................................................................................................274.1. Introduction...............................................................................................274.2. Présentation du modèle objet....................................................................27

4.2.1. Bannières............................................................................................274.2.2. News....................................................................................................274.2.3. faq et bug............................................................................................284.2.4. image..................................................................................................284.2.5. Chercheur, recruteur, membre, contact et journaliste........................284.2.6. Profil, ProfilChercheur et ProfilRecruteur.............................................294.2.7. Poste, cv et lettre de Motivation..........................................................294.2.8. Offre d’emploi......................................................................................304.2.9. Entreprise............................................................................................304.2.10. La classe Ressources.........................................................................30

4.3. Choix de persistances................................................................................31

Page 2 de 44

Sophia Forum


4.4. Implémentation du lien ente la base de données et les pages web..........324.4.1. Transit des objets de page en page....................................................324.4.2. Connexions et accès concurrentiels....................................................32

4.5. Bilan...........................................................................................................355. Partie Internet..................................................................................................36

5.1. Les serveurs..............................................................................................365.1.1. Apache................................................................................................365.1.2. Tomcat................................................................................................36

5.2. Les langages utilisés..................................................................................365.2.1. HTML...................................................................................................365.2.2. JSP.......................................................................................................365.2.3. JavaScript............................................................................................365.2.4. Scripts CGI...........................................................................................375.2.5. Binding Java.........................................................................................385.2.6. L’interface http Session.......................................................................39

5.3. La partie visible.........................................................................................405.3.1. Les includes.........................................................................................405.3.2. Les bannières......................................................................................41

5.4. Conclusion.................................................................................................41

Page 3 de 44

Sophia Forum


2. PRÉSENTATION

2.1. Introduction

Le 11 mars 1999, à l'Agora de France Télécom s'est tenu la première édition de Sophia Forum. Ce premier forum de l'emploi sur Sophia Antipolis est le fruit du travail d'étudiants de différentes écoles de cette région (CERAM, ESINSA, ESSI, Eurécom, ISIA et IUP) organisées en une association loi 1901 nommée Créazur.

L'ambition de ce forum était de faire se rencontrer le monde de l'emploi et celui des études. Les entreprises ont ainsi eut la possibilité de tisser des relations durables avec les écoles par le biais de stages, de contrats d'apprentissage, contrats d'études ou d'offres d'emploi. Le forum, dont l'entrée était libre tout au long de la journée a été ponctué de tables rondes et conférences ayants traits au monde du travail et à la recherche d'emplois. Les secteurs les plus représentés étaient ceux des hautes technologies, et en particulier le secteur de l'informatique et des télécommunications.

Sophia Forum cherche à être un lieu d'échanges, de réflexions et de contacts entre les différents acteurs du marché de l'emploi : entreprises et étudiants. Lors de ce forum, les objectifs d’une entreprise étaient de :

- informer les étudiants sur les métiers et les activités proposées,- mettre en valeur son image et augmenter sa notoriété sur la région,- avoir des contacts pour offrir ses emplois, ses apprentissages et ses stages,- découvrir les écoles de la région.

Quant aux étudiants, ils cherchaient à :

- contacter les acteurs du monde professionnel,- définir leurs buts et leurs attentes de l'emploi,- découvrir leurs possibilités de carrière,- trouver un emploi, un apprentissage, un CSNE ou un stage.

La seconde édition de Sophia Forum aura lieu le 9 mars 2000.

2.2. Contexte et but

L’objectif de ce projet est la réalisation complète, tant au niveau interface graphique, que gestion d’une base de données et programmation web d’un site Internet pour la troisième édition de Sophia Forum.

Ce site dont le thème principal serait l’emploi, doit pouvoir proposer tout un panel de fonctionnalités complètement adaptées à la recherche d’emplois ou de stages. Il faut également qu’il soit un outil pour les entreprises afin de faciliter leurs procédures de recrutement. Enfin, il doit offrir aux membres de l’organisation un espace réservé à l’organisation du forum afin de pouvoir mieux y communiquer l’information et constituer un historique de sa préparation.

De nombreuses banques de CV sont disponibles sur Internet, mais s’arrêtent le plus souvent aux fonctionnalités suivantes :

- dépôt de CV- consultation de CV- dépôt de petites annonces- consultation de petites annonces

Pour assurer le succès d’un tel site, il ne suffit pas de proposer ces services, il faut attirer le visiteur et surtout le forcer à revenir. Proposer un véritable contenu est la clé de la réussite. Ce site doit intégrer un système d’articles et de news traitant de la recherche d’emplois, de la santé des entreprises, des salaires, de la région…

Un suivi de l’utilisateur dans sa démarche peut être effectué grâce à la présence d’agents intelligents qui vont lui envoyer par mail les dernières annonces en rapport avec son domaine. Le profil de ce dernier permettra donc de personnaliser le site. Une même approche peut être envisagée pour les

Page 4 de 44

Introduction

Contexte et but

Sophia Forum


entreprises, avec l’envoi de CV en relation avec des petites annonces postées précédemment.

Le site doit également constituer un outil pour tous les membres de Créazur. Il doit permettre de visualiser l’avancement des contacts au niveau des entreprises, de fournir les documents de l’association en ligne, de stocker certaines données comme les logos des entreprises, de stocker les comptes-rendus des réunions, de constituer en quelque sorte un certain patrimoine qui servira pour l’organisation des prochaines éditions. Il doit en outre faciliter la création de la brochure visiteur qui sera distribuée le jour du forum aux personnes présentes en centralisant les informations pertinentes des entreprises (description, pages de publicité, …).

Bien évidemment, d’autres paramètres doivent être gérés, comme le système de bandeaux publicitaire, la recherche par mots clés d’annonces, etc. Toutes ces parties demandent une programmation importante au niveau de la base de données :

- gestion de CV- gestion de bandeaux publicitaires- gestion de petites annonces- gestion des entreprises avec leur description, logo- gestion des news et articles- gestion d’agents intelligents

La partie IHM est la partie sensible de la conception du site. Tous les sites proposant le même type de contenu utilisent une interface graphique presque standardisée maintenant. Des interviews avec des personnes extérieures au monde informatique devraient nous permettre de définir un nouvel aspect, une nouvelle ergonomie que pourrait revêtir le site.

2.3. Equipe

Page 5 de 44

Charles Gaudon ([email protected])Elève ingénieur ESSI (Génie Logiciel)

Frédéric Nesme ([email protected])Elève ingénieur ESSI (Génie Logiciel)

Stéphane Thomas ([email protected])Elève ingénieur ESSI (Systèmes et Applications Répartis)

Equipe

Julien Fourment ([email protected])Elève ingénieur ESSI (Systèmes et Applications Répartis)

Sophia Forum


Page 6 de 44

Sophia Forum


3. PARTIE IHM3.1. Description du sujet

Le but de la partie IHM est la conception d’une interface graphique tout en prenant en compte les besoins des utilisateurs sans restreindre la créativité. Cela a également été pour nous l’occasion de développer un contenu plus attractif et plus fournit.

A partir des interviews que nous avons effectués avec des utilisateurs novices, en prenant en compte notre propre expérience mais aussi en consultant les sites déjà existants, nous allons pouvoir mettre au point un modèle conceptuel de l’utilisateur.

A partir de ce modèle, nous réaliserons le modèle conceptuel de conception qui décrit les tâches et l'architecture du site web.

Les outils employés pour la réalisation du site sont bien évidemment en rapport direct avec Internet (HTML, JAVA, Java Beans) et nous permettront de passer rapidement à la réalisation finale.

Il existe trois principaux types d’utilisateurs : le chercheur d’emploi, le recruteur ou le membre de Sophia Forum. Bien évidemment, leurs besoins sont différents. Le webmaster du site web est aussi à prendre en considération, même s’il ne s’agit pas d’une priorité, car c’est un utilisateur confirmé et durable.

D’autres catégories d’utilisateurs peuvent toutefois être envisagées suivant les fonctionnalités que nous développerons, comme par exemple le journaliste chargé d’écrire les articles traitant de l’emploi, ou l’entreprise souhaitant réserver un stand spécifique.

Page 7 de 44

Description du sujet

Chercheur d’emploi

Recruteur

Membrede

Sophia Forum

Site web

Entreprise(stand)

Webmaster

Journaliste

Sophia Forum


3.2. Analyse de l’existant3.2.1. Ancien site web

Pour mener à bien ce projet, Créazur s’est dotée de nombreux outils de communication. Ainsi, Sophia Forum est présent sur Internet à l’adresse www.essi.fr/forum. Pour des questions de coût et en considérant la politique de développement adoptée par Créazur, le nom de domaine www.sophiaforum.com n’a pas été acheté. Il le sera peut-être dans le futur.

Le site présente :- la lettre écrite par les directeurs des écoles organisatrices,- le forum dans ses grandes lignes,- le bilan de la première édition avec deux articles de journaux,- les entreprises qui seront présentes,- les prestations offertes à ces entreprises si elles viennent exposer lors du forum,- les écoles organisatrices,- l’équipe responsable de l’organisation du forum,- les coordonnées de l’association pour la contacter.

De nombreuses questions envoyées par e-mail montrent que le contenu du site n’est pas assez informatif ou peut être amélioré. Voici quelques extraits de ces questions :

Je recherche un poste dans un service du Personnel à Sophia (Bac + 5 et diplôme de Psychologue. Pouvez-vous avoir l'amabilité de me dire si je peux m'inscrire en tant que rechercheur d'emploi.

Je souhaiterais recevoir une plaquette de présentation et d'inscription pour le forum à l'adresse suivante : …

je serai très intéressée par venir à Sophia Forum, au mois de mars, alors j'aimerai savoir s'il est possible d'avoir plus amples informations sur la journée (son déroulement, son adresse...). Je travaille dans une entreprise de biotechnologie, et je serai intéressée par entrer en contact avec des entreprises sur Sophia.

Pourriez-vous s'il vous plaît me communiquer les informations générales d'inscription à votre Forum, une plaquette descriptive ... En effet, société en Télécommunication/Informatique, spécialisée dans la carte à puce, nous serions éventuellement intéressés pour participer au forum. Parallèlement à cet envoi, je vous serai reconnaissante si vous pouviez m'envoyer par retour d'email les conditions d'inscription.

Page 8 de 44

Analyse de l’existant

http://www.sophiaforum.com/

http://www.essi.fr/forum

Sophia Forum


Je suis actuellement scientifique du contingent et de formation ingénieur en électronique. Je suis très intéressé par la liste des entreprises de Sophia Antipolis, pourriez-vous me la retourner par mail SVP. De plus, s'il existe un site de recrutement, faites-le moi parvenir.

Ancien étudiant de l'ESSI (promos 96) je voudrais savoir si ce Forum est ouvert au non étudiant comme moi?

Je suis étudiante en 2ème année d'AES à Mulhouse (68). Pourriez-vous m'indiquer les conditions de sélection pour cette formation?

Je suis étudiant en informatique. Mais je n'appartient pas à la région PACA, j'aimerai savoir si le forum est ouvert à tout le monde ou simplement aux étudiants de Nice. Je suis de Bourges. Si certains jours sont réservés à un certain public, pouvez-vous m'en donner le détail. Je vous remercie de bien vouloir me répondre afin de m'éviter un déplacement de plusieurs centaines de km pour rien.

Une partie spécifique à chaque utilisateur type permettrait de répondre de manière pertinente aux questions qui reviennent le plus souvent.

Le logo qui a été choisi cette année n’est plus en corrélation avec la charte graphique adoptée par le site. La liste des entreprises doit être mise à jour à la main, car il n’y a pas de base de données gérant cela.

Une page est réservée aux membres de Sophia Forum. Elle recense la liste des entreprises contactées avec :

- nom de l'entreprise- sexe, prénom et nom du contact- numéro de téléphone de ce contact- adresse e-mail de ce contact- adresse de l'entreprise- nom du membre de Sophia Forum s'occupant de cette entreprise et étant en relation avec ce contact- école s'occupant de cette entreprise- état d'avancement des négociations (stand réservé, en attente du retour du formulaire de pré-inscription, refus, ...)

Cette page mise à jour à la main (ce qui est très fastidieux vu le nombre d’entreprises contactées), contient aussi un accès à des documents comme la plaquette distribuée aux entreprises au format Word 97 pour Windows. De plus, il s’agit de données importantes qui serviront pour l’organisation du prochain forum et qu’il faut donc organiser et archiver facilement.

Page 9 de 44

Sophia Forum


3.2.2. www.atoutjob.com

Atout Job est un portail qui s’intéresse uniquement aux sites ayant rapport au domaine de l’emploi. Il propose ainsi les rubriques suivantes :

- banque de CV- offre d'emploi - offre de stage- cabinet de recrutement - formation- institution - aide à l'emploi- association d'insertion professionnelle - création d'entreprise- droit du travail - informations / divers - salons et colloques

Page 10 de 44

http://www.atoutjob.com/

Sophia Forum


A noter également les avertissements présents quand au contenu du site d’un point de vue légal : « La société X décline toute responsabilité concernant le contenu des sites Internet accessibles au travers de son service… ». Une page contact comprend les coordonnées et une courte description de la société gérant le site Internet et une page publicité explique comment il est possible d’annoncer.

Comme il s’agit d’un portail, un formulaire est disponible pour faire référencer son site, seulement s’il s’agit d’un site dont le thème est l’emploi. De nombreux interviews sont visualisables, la plupart traitant de l’emploi (explication sur un job spécifique, travail à l’étranger, chasseurs de thèmes, etc). Très à la mode en ce moment sur Internet, les mini-sondages en première page permettent de faire participer le visiteur au moyen d’une question simple du type : « Pour vous le télétravail c’est ? ».

3.2.3. www.libremploi.fr

L’aspect général de www.libremploi.fr est très fouillis. Il y a énormément de publicités. L’utilisateur n’est absolument pas guidé et les différentes parties ne sont pas bien séparées. Du coup, il a du mal à s’y retrouver. En ce qui concerne le contenu du site, lorsqu’une entreprise souhaite consulter les informations personnelles des candidats, il faut qu’elle s’identifie avec son numéro de SIRET. Il y a une partie revue de presse qui liste les articles parus dans les journaux ou sur Internet et parlant du site. Une autre page s’intéresse plus aux prestations et aux tarifs du site pour les entreprises).

Un forum permet de poster des messages, le plus souvent pour demander un emploi. Une page liens contient une imposante liste d’adresses de sites dont le thème touche à l’emploi. On retrouve également des explications des différentes formalités liées à l’embauche (comme la visite médicale, les horaires de travail, le bulletin de paie, …) et des types de contrat existants (emploi jeunes entreprises, contrat emploi consolidé, emploi jeunes, …).

Page 11 de 44

http://www.libremploi.fr/


Sophia Forum


3.2.4. www.abjob.com

L’interface graphique de www.abjob.com est très originale et bien faîte. Par contre, on ressent un certain vide (peut-être à cause du blanc) et on a l’impression qu’il n’y a pas énormément de fonctionnalités. Le formulaire de recherche est très clair, cependant le résultat – la liste des entreprises – est un peu trop grande : il y a 6 lignes de description par offre, ce qui n’est pas forcément nécessaire pour une liste de résultat, surtout qu’il est possible d’obtenir plus d’informations en cliquant sur le nom de l’entreprise ! L’utilisateur ne sait pas non plus combien de résultats ont été trouvés et aussi combien de pages il lui reste à parcourir.

Les annonces passées par les entreprises sont du même type que celles passées dans les magazines (description de l’entreprise, du poste, de ce que cet emploi va apporter, …). Il est possible de visiter le site de l’entreprise grâce à un lien, ou d’envoyer un email à une adresse précise (souvent du type job@ ou emploi@). A noter une fonctionnalité intéressante : envoyer cette annonce à un ami.

La partie dépôt de CV ne fonctionne pas encore. A chaque visite sur le site, le candidat peut malgré tout consulter les offres d'emploi correspondant à son profil sans avoir à ressaisir ses critères de recherche. Il lui suffit pour cela de créer un ou plusieurs profils de recherche. Lorsque le candidat a créé un ou plusieurs profils de recherche, il peut choisir de recevoir les offres d'emploi (ou de stages) par e-mail.

Enfin, il est possible de s’inscrire à une newsletter, c’est-à-dire une mailing-list.

Page 12 de 44

http://www.abjob.com/


Sophia Forum


3.2.5. www.planetcareer.com

www.planetcareer.com propose plusieurs langues. L’interface est claire au premier abord, mais se révèle très lourde par la suite et nuît au téléchargement. Il est possible d’avoir droit à une visite guidée du site lorsqu’on arrive la première fois sur le site. Les explications sont intéressantes et les étapes bien décrites, mais cela manque parfois de schémas.

Il est possible de reporter des bugs au webmaster grâce à une adresse [email protected] présente sur toute les pages. Une faq permet de répondre aux questions les plus fréquemment posées. Un calendrier des évènements est disponible pour les recruteurs, pour connaître par exemple les dates de forum. Des news traitent des informations touchant à l’emploi (35 heures, telle société restructure, …).

Page 13 de 44

mailto:[email protected]

http://www.planetcareer.com/


Sophia Forum


3.2.6. www.cadresonline.com

Ce site est comme sont nom l’indique très ciblé. La page des dispositions légales est très détaillée et pourrait servir de modèle. Il y a beaucoup de choses à faire mais l’utilisateur n’est pas guidé. Là encore, des couleurs pastels ont servies de base pour l’interface graphique. Il est une fois de plus possible de recevoir des offres ciblées par email. Une rubrique présente les entreprises qui ont le plus recruté grâce a ce site. Une librairie virtuelle permet d’acheter un ouvrage parmi une sélection de livres touchant à la recherche d’emploi (en passant par www.bol.fr). Il est également possible d’évaluer son salaire grâce à un quizz. A noter que l’on peut créer plusieurs profils avec à chaque fois un CV et une lettre de motivation différentes.

3.2.7. Autres sites

Les sites www.itjobworld.fr, www.hitechpros.com/fr, www.lerucher.com, www.online-cv.com et autres proposent des fonctionnalités intéressantes comme :

- la petite annonce du jour- recherche d’offres d’emploi par entreprise- nombre d’annonces et de CV (pour les recruteurs) en ligne- nom des entreprises enregistrées et ayant accès aux CV- affichage du nom de l’utilisateur durant toute la durée de la session (personnalisation, …)

Les critères de recherche sont de plusieurs types :- annonces passées le jour même, cette semaine, ce mois, …

Pour la liste résultat d’un requête de recherche :- intitulé du poste- courte description sur 4 lignes- référence de l’annonce- date à laquelle l’annonce a été postée- type de contrat (CDI, CDD, stage, …)- début du contrat (immédiat, à partir du 01/03/2000, …)- poste actuel- poste recherché

En ce qui concerne la description de l’entreprise, on retrouve :- nom

Page 14 de 44

http://www.online-cv.com/

http://www.lerucher.com/

http://www.hitechpros.com/fr

http://www.itjobworld.fr/

http://www.cadresonline.com/

Sophia Forum


- type (cabinet de recrutement, ssii, agence temporaire, …)- logo de l’entreprise- adresse- site Internet- présentation- contact (nom, coordonnées, …)- secteur d’activités (Mécanique automobiles, navale, aéronautique, …)- effectifs

Et pour la description du poste :- intitulé (Consultant Telecom Sénior, …)- fonction (juriste, ingénieur, …)- région (Ile de France, Provence Alpes Côtes d’Azur, …)- type de contrat (CDI, CDD, stage, …)- salaire annuel brut (250 000 à 300 000F)- domaine d’activités (Applications JAVA pour site- description du poste- durée- nombre de postes

Et pour le profil recherché :- expérience (débutant, 1 à 3 ans, 3 à 5 ans, 5 ans et plus, ..)- niveau d’études (Bac+5, thèse, …)

Et pour la FAQ :- Combien cela coûte ? - Alors qui paye?- Vais-je recevoir des publicités par email?

Enfin, il ne faut pas oublier que la CNIL impose des restrictions : « Conformément à la loi "Informatique et Libertés" n°78-17 du 6 Janvier 1978, vous disposez d'un droit d'accès, de rectification et de suppression des informations que vous fournirez. ». Par ailleurs, le CV doit décrire précisément l’expérience professionnelle du jeune diplômé (projets de fin d’études, projets à l’école, en équipe, …). Les autres fonctionnalités intéressantes sont :

- entreprises qui ont le plus recruté grâce au site- sélection de livres traitant de l’emploi (partenariat avec www.bol.fr)- plusieurs profils par utilisateurs- nombre d’annonces postées aujourd’hui- calculer son salaire- tests, évaluation (QI, …)- préparation du CV- préparation de l’interview (questions pièges, …)- articles sur l’expression corporelle, le comportement à l’entretien, …- une partie envoyer nous vos commentaires visible sur chaque page- envoyer par email des offres d’emploi à des profils spécifiques (pour les recruteurs)- cv disponibles pour une durée de 2 mois

3.3. Modèle conceptuel de l’utilisateur3.3.1. Méthodologie

Il est nécessaire de connaître les besoins des utilisateurs finaux pour fixer le cahier des charges du site web. De plus, il est intéressant de disposer de personnes peu habituées à naviguer sur Internet. De ce fait, nous avons travaillé avec les personnes suivantes afin de préciser leurs attentes (fonctionnalités à avoir, habitudes à conserver, manière de procéder, …), et surtout de concevoir un modèle graphique qui soit original et ergonome, et qui ne soit pas basé sur une interface web classique :

- Florence Tahon : étudiante en IUT Techniques de Communication- Sabine Ferraye : à temps partiel et bientôt en recherche d’emploi (IUT Communication)

Voici le questionnaire qui a dirigé la première partie de l’interview avec nos utilisateurs tests et qui nous a permis de définir précisément leurs besoins et les fonctionnalités attendues :

Page 15 de 44

Modèle conceptuel de l’utilisateur

http://www.bol.fr/

Sophia Forum


1. Vous venez de finir vos études et vous souhaitez commencer à rechercher un emploi. Comment procédez-vous (visite de l’ANPE, consultation de magazines, …) ? 2. Si vous souhaiter utiliser Internet, comment vous y prenez vous (moteurs de recherche, …) ?3. Quel type d’information sur le site désirez-vous ?4. Comment envisagez-vous le dialogue entre les recruteurs éventuels et vous ?5. Quelles sont les informations personnelles que vous pourriez mettre à disposition des recruteurs ?

La seconde partie de l’interview constituait en une critique par ces personnes des sites web précédemment cités, à savoir : www.libremploi.fr, www.abjob.com, www.atoutjob.com, www.jobonline.com et www.planetcareer.com.

3.3.2. Interview

La démarche suivie dans la recherche d’un emploi par nos interviewées est la suivante :

- consultation de l’ANPE- consultation d’agences temporaires- consultation d’annuaires d’entreprises

Le fait d’aller à l’ANPE est malgré tout mal ressenti. Elles préfèrent passer par le bouche à oreille, par exemple au moyen de relations personnelles ou d’annonces affichées dans les magasins. Une liste d’entreprises idéale devrait comprendre d’après elles au moins les informations suivantes :

- chiffre d’affaires- effectifs- âge- domaines d’activités- coordonnées- nom d’un contact privilégié avec ses coordonnées et sa photo et pourquoi pas un édito ou une courte phrase réactualisable qui présenterait les postes proposés, la santé de l’entreprise, la présentation des événements de l’année…

Pour les offres d’emploi, il faut qu’elles soient structurées de manière claire en rubriques : stage, emploi, contrat de qualification, emploi permanent, etc.

En ce qui concerne la recherche d’emploi sur Internet, nos interviewées connaissaient quelques adresses comme www.emploi.fr, www.yahoo.fr, www.manpower.fr (et d’autres sites web d’agences de travail temporaire). Lors d’une recherche sur le site de Yahoo! dans la catégorie emploi, elles précisent que le nom de l’adresse mais surtout la ligne de description du site sont très important dans leur choix.

Par ailleurs, elles trouvent qu’en général, l’affichage des réponses à une requête n’est pas toujours très concis et très bien présenté. En ce qui concerne une future adresse www.sophiaforum.com, le caractère ponctuel est trop persistent et il faudrait donc que la ligne de description accroche l’utilisateur en se démarquant des autres et en lui montrant qu’il s’agit d’un site de recherche d’emploi sur la technopole de Sophia Antipolis. Elles ajoutent qu’il serait bien d’avoir sur le site un historique de la région avec des photos, des liens, etc.

Leur principale remarque dans la présentation d’un site web est qu’il ne faut pas tout mélanger et bien guider le visiteur en structurant en parties bien délimitées les pages Internet. Ainsi, il doit être possible :

- de spécifier si la recherche doit se faire par domaine d’activités ou par région- d’obtenir une liste exhaustive des entreprises de Sophia Antipolis- de pouvoir consulter des offres et des demandes d’emploi- de rechercher soit un stage, soit un emploi- de mettre son CV en répondant à une offre- d’envoyer un CV à une entreprise (candidature spontanée)- de contacter par email sans passer par un logiciel client le contact d’une entreprise

Page 16 de 44


http://www.manpower.fr/

http://www.yahoo.fr/

http://www.emploi.fr/


http://www.jobonline.com/




Sophia Forum


L’édition du CV doit se faire au moyen d’un formulaire clair et ordonné. Il peut être accompagné d’une lettre de motivation, ou alors de quelques lignes de présentation. Il serait intéressant de savoir qui et combien de personnes ont regardé le CV, mais également de laisser la possibilité à un recruteur de laisser un message du genre « j’aurai un job dans 6 mois » ou « tu ne devrais pas mettre ça dans ton CV » après en avoir lu un.

D’après leurs conseils, il faut simuler le bouche à oreille grâce à des forums ou des annonces de particuliers (et non plus de recruteurs), grâce à des news actualisées sur :

- les conférences et colloques de la région,- sur les différents salons touchant à l’emploi,- sur les concours aux grandes écoles et aux administrations,- sur les procédures d’inscription aux écoles (avec leur présentation).

Un carnet d’adresses utiles permettrait d’obtenir les coordonnées d’organismes particuliers, de résidences universitaires, de mairies, etc.

3.3.3. Analyse de l’existant par les interviewées

Pour le site www.libremploi.fr, l’interviewée préférerait que la bannière publicitaire soit située en haut de la page pour des raisons de clarté. Il y a trop de publicités dispatchées un peu partout (il vaudrait mieux les mettre dans un cadre en haut de la page) : « On a l’impression qu’il y en a partout ! ». Il n’y a pas de logique ni de cohérence dans la présentation et l’utilisateur n’est pas guidé. Le site est trop compliqué et n’est pas structuré.

Lorsqu’on souhaite déposer son CV, on ne tombe pas sur un formulaire comme on pourrait s’y attendre. Il n’y a aucune information et les textes des boutons sont mal choisis, d’où une perte de temps : on arrive sur les dates des concours de l’Armée de l’Air alors qu’on voulait obtenir la liste des offres d’emploi. Les bannière publicitaires affichées ne sont pas sérieuses (bannière pour une galerie d’art de photo de nues et de danse).

La présence d’un annuaire d’entreprises est bienvenue. Par ailleurs, l’interviewée remarque qu’il serait bien de savoir combien de jeunes ont pu trouver un emploi grâce au site (statistiques).

Le site www.abjob.com est beaucoup mieux présenté, avec la date qui s’affiche : « On a l’impression qu’il est mis à jour tous les jours. ». L’interface est originale avec des couleurs reposantes, mais peut ne pas plaire à certaines personnes. Il y a encore trop de publicités qui clignotent sur la partie gauche de l’écran. Au bas de chaque page on retrouve le sommaire (la liste des liens) ce qui permet de naviguer plus facilement. L’outil de recherche est convivial, il permet de choisir une recherche en fonction de la zone géographique ou du domaine d’activité. Les informations d’une entreprise que l’interviewée souhaiterait obtenir lorsqu’elle lance une requête sont :

- nom- région- chiffre d’affaires- effectif- date à laquelle a été postée l’annonce

Si elle clique sur le nom de l’entreprise, il faudrait alors voir afficher les informations suivantes :

- présentation de l’entreprise- type de contrat (CDD, CDI, …)- coordonnées du contact privilégié pour envoyer sa candidature ou son cv- un édito ou quelques lignes écrites par ce contact

Le site www.atoutjob.com dispose lui aussi d’une très bonne harmonie au niveau des couleurs. Il faudrait par contre utiliser des frames pour éviter les clignotements lors des chargements. Le classement est malgré tout brouillon, et l’interviewée pense qu’il serait préférable d’éviter les liens pointant sur les sites des entreprises, mais plutôt mettre directement les informations de l’entreprise et ses offres d’emploi sur le site.

Page 17 de 44




Sophia Forum


En ce qui concerne le site www.jobonline.com, du point de vue esthétique et ergonomie, l’utilisatrice a fait remarquer quelques petites erreurs comme le password qui s’affiche en clair ou bien la lenteur des opérations de validation de certains formulaires. La langue a été visiblement un problème, le site étant entièrement en anglais : il aurait été apprécié qu’une version en français soit disponible.

Une fois que l’utilisatrice s’est identifiée (username et password), une pop-up apparaît pour la suite des opérations. Malheureusement, il n’a pas été prévu d’afficher la barre des tâches qui permet notamment de revenir en arrière. Ce point a semblé gêner considérablement l’utilisatrice. Les points positifs relevés sur ce site sont la présence de descriptifs de toutes sortes très explicites et de bonnes possibilités pour ce qui concerne les contacts avec les entreprises.

Enfin, le site www.planetecareer.com est très certainement celui qui est le plus proche de ce que l’utilisatrice attendait de ce genre de site. Il est extrêmement bien rangé, et toutes les opérations sont classées en trois principales parties qui sont : Recruteur, Etudiant et Ecole.

L’utilisatrice s’est immédiatement prise au jeu, ça commence par une inscription, puis il faut remplir différents formulaires permettant de construire un CV qui se calque parfaitement sur la norme d’un CV ordinaire. Lors de l’inscription, l’utilisatrice a dû spécifier si elle cherchait un stage ou bien un emploi. Une fois que les informations ont été remplies, on est amené à visualiser le CV et à lancer la recherche des offres correspondant aux demandes de l’étudiant.

L’ensemble du site est très convivial, tout est fait pour fidéliser et mettre en confiance l’utilisateur. De plus, de gros efforts ont été faits pour permettre aux utilisateurs de faire différentes remarques sur le site afin de pouvoir l’améliorer en fonction des demandes des utilisateurs. Il apparaît visiblement qu’il sera intéressant de s’inspirer de certains de ces points pour nos travaux.

En résumé, il faut être clair et concis, et ne pas agresser l’utilisateur. Il faut structurer le site de façon à différencier les types d’utilisateurs primaires, à savoir chercheurs d’emploi et recruteurs. De même, il faut séparer les petites annonces en rubriques (stage, emploi, …). Un système de barre de progression pourrait guider l’utilisateur et lui permettre de voir où il en est dans la mise au point de son CV, de sa lettre de motivation, etc.

Afin de simuler le bouche à oreille, il devrait être possible de poster des messages sur une entreprise pour donner ces impressions sur le travail, sur l’ambiance, sur les avantages de travailler dans cette société. Pour éviter les abus, ce système ne serait pas anonyme mais au contraire une personne devra avoir posté son CV et des informations personnelles sur le site pour écrire ces impressions. Enfin, il faut laisser aux entreprises la possibilité de s’exprimer sur la structure même du CV afin de le faire évoluer et d’obtenir le formulaire le plus efficace possible.

3.4. Modèle conceptuel de conception3.4.1. Page d’entrée

La page www.sophiaforum.com/index.html a la charge d’aiguiller le visiteur en fonction de son type : chercheur d’emploi, recruteur ou entreprise souhaitant participer à Sophia Forum. Il s’agit de la partie publique du site, et une partie caché qui sera protégée par login et password permettra aux utilisateurs suivants de se connecter : membre de Sophia Forum, journaliste et webmaster.

Le premier niveau du site se décompose donc de la manière suivante :

Page 18 de 44

Modèle conceptuel de conception


http://www.planetecareer.com/

http://www.jobonline.com/

Sophia Forum


Les membres de l’organisation de Sophia Forum, les journalistes qui remplissent les articles et le webmaster qui maintient les pages web ont accès au site par des adresses non connues du public : www.sophiaforum.com/membre, www.sophiaforum.com/journaliste et www.sophiaforum.com/webmaster.

3.4.2. Informations présentes sur toutes les pages

On doit retrouver sur toutes les pages les informations suivantes :- [email protected] un lien vers la page contact (vers les coordonnées de l’association)- un bandeau publicitaire- un lien vers les informations légales- le copyright- un lien vers la page recommander cette page à un ami- un lien ver la page rapporter un bug- un sommaire en bas de page

Chaque partie utilisera une palette de couleur différente. Les parties communes auront toutes la même couleur. L’utilisateur pourra ainsi si retrouver plus facilement.

3.4.3. édition 1999 (partie commune)

Cette partie regroupe toute les informations concernant la première édition de Sophia Forum. Son contenu est entièrement basé sur celui du premier site web de Sophia Forum. Le but est de constituer un patrimoine et de garder un

Page 19 de 44


http://www.sophiaforum.com/membres



Sophia Forum


historique du forum. La page bio de XXXXX XXXXX est une page qui est générée en récupérant la biographie de chaque membre dans la base de données.

La lettre des directeurs est la première lettre qu’ont écrit les directeurs des 6 écoles organisatrices pour promouvoir le forum. Cette partie comprend également la présentation du salon en lui-même, mais aussi celle des écoles (avec coordonnées et lien vers leur site) et la liste des membres (avec une biographie) de l’équipe organisatrice. On retrouve également les sponsors, la liste des entreprises qui étaient présentes ainsi que la description de la journée.

Page 20 de 44

Sophia Forum



Cette partie est bien sûr plus abondante que la précédente. Le principe est le même. Mis à part les biographies, il s’agit encore de pages statiques. La plupart des pages ont été mise à jour par rapport à la première édition. Il s’agit des pages du site web de la seconde édition.

Il y a maintenant un historique (bilan, liste des entreprises présentes les années précédentes, …) et une revue de presse (articles, …).

Page 21 de 44

Sophia Forum



Une partie sera consacrée à la prochaine édition de Sophia Forum, avec en plus des pages classiques (équipe, présentation des écoles, lettre des directeurs, …) remises à jour, des pages spécifiques à chaque sponsor. Une page brochure permettra de télécharger la brochure de présentation du forum (au format Acrobat Reader par exemple) et pourquoi pas plus tard la brochure visiteur. Si les ressources de l’association le permettent, il est possible de proposer un formulaire de demande (la brochure étant envoyé ensuite par lettre à l’adresse précisée).

Une page contact présentera les coordonnées de l’association, le plan d’accès au forum (avec la description des voies d’accès) et éventuellement une liste d’hôtels affiliés. La page stands permettra de visualiser l’organisation des stands du forum à partir de plans de l’Agora (en fonction des salles et avec affichage des données relatives à un entreprise).

3.4.6. Sophia Antipolis (partie commune)

Cette partie présente la région de Sophia Antipolis et son histoire. Un carnet d’adresse regroupe toutes les adresses utiles sur les mairies, service publiques

Page 22 de 44

Sophia Forum


liés à l’emploi, etc. Une liste des entreprises permet de connaître exactement celles qui sont implantées à Sophia Antipolis.

3.4.7. emploi (partie commune)

On regroupe dans cette partie du site toutes les informations liées à l’emploi, comme par exemple la présentation des différents types de contrat existant (CDI, CDD, …), les démarches à suivre pour réussir son entretien et sa lettre de motivation, etc. Cette partie étant vide pour le moment, il n’y a pas d’arborescence spécifiée car cela dépendra du contenu.

3.4.8. news (partie commune)

Les news ou articles sont listés sur cette page. On y accède des autres parties du site et on obtient directement le texte de la news désirée. En bas de page, on a une liste des 3 dernières news diffusées. Une news est affichée avec titre, photo, texte, auteur et date. Si la news est accompagné d’une photo, on peut en avoir un zoom en cliquant dessus (une pop-up apparaissant alors). Les news seront rédigées par des journalistes qui disposeront d’un formulaire à cet effet, et toucheront divers sujet comme les dates de forum à venir, les réformes du ministère, les évènements de la région, etc.

3.4.9. forum (partie commune)

En fonction de la partie d’où il vient, l’utilisateur aura accès à un forum spécifique. Ainsi, s’il s’agit d’un recruteur, il ne pourra accéder qu’au forum recruteur. La forme de cette partie est à spécifier.

3.4.10. recommander une page à un ami (partie commune)

Fonction très pratique au demeurant, elle permet également de promouvoir le site auprès d'un plus large public. En fait, il s’agit d’un formulaire avec les champs suivants qui va envoyer un mail à la personne concernée :

- adresse de l’émetteur (obligatoire)- adresse du destinataire (obligatoire)- sujet- corps de l’email pré-généré avec l’adresse Internet de la page qui vient d’être visitée

3.4.11. rapporter un bug (partie commune)

Une page ne s’affiche pas bien ? Il y a une erreur avec les fonctionnalités de recherche ? Un mail au webmaster du site et les problèmes seront vite résolus ! Ce formulaire enverra un mail à l’adresse [email protected] avec les champs suivants :

- adresse de l’émetteur (obligatoire)- corps pré-généré avec l’adresse Internet de la page qui vient d’être visitée et qui serait défectueuse

3.4.12. informations légales (partie commune)

Les informations légales fixent les droits des utilisateurs ainsi que les avertissements quant au pertes de données ou autres.

3.4.13. newsletter (partie commune)

Un formulaire d’inscription/desinscription permet de s’enregistrer auprès de la mailing list du site. Cette newsletter permettra au journaliste de faire vivre le site en attirant les utilisateurs avec des articles. C’est également un bon moyen de prévenir les gens du forum.

3.4.14. contact (partie commune)

Page 23 de 44


Sophia Forum


Cette page regroupe toutes les informations pour contacter le webmaster, les journalistes, les membres, les directeurs d’écoles, etc.

3.4.15. Partie chercheur d’emploi

Cette partie concerne uniquement les personnes qui cherchent un emploi ou un stage. Le graphique ci-dessus montre les relations, c’est-à-dire les liens qui existent entre ces pages web. Sur la page d’accueil (première page de cette partie, celle tout en haut du graphique), on retrouve :

- la date du jour- l’offre de stage et l’offre d’emploi du jour- la possibilité de s’inscrire à la mailing-list en entrant son e-mail- les 2 derniers messages du forum- les 3 entreprises qui recrutent le plus en ce moment- la news du jour avec titre, photo, chapeau et lien

L’utilisateur a accès à la partie emploi (tout ce qui touche à l’entretien, à la recherche d’emploi, les trucs et astuces, …). Il peut consulter :

- les news en cliquant dessus- les offres de stage et d’emploi- les informations légales- la faq- la page contact- son profil s’il en a un- les informations sur les différentes éditions de Sophia Forum- les informations sur la région de Sophia Antipolis- le forum des chercheurs d’emploi

Il peut également rapporter un bug ou recommander une page à un ami.

Une page présente les réponses aux questions les plus fréquemment posées (faq ou Frequently Asked Questions), et un formulaire permet de soumettre de nouvelles questions.

Page 24 de 44

Sophia Forum


La recherche suit le processus suivant : l’utilisateur précise ses critères de recherche (type de contrat, localisation, …) et obtient la liste des résultat. Il peut ensuite cliquer sur une offre et une fenêtre pop-up s’affiche alors. Il peut ainsi consulter en détail celle-ci, et s’il le souhaite il peut envoyer cet offre à un ami. Les critères de recherche sont stockés dans des cookies afin d’accélérer la procédure de recherche lorsqu’il reviendra sur le site.

Lorsqu’un utilisateur est intéressé par un poste et qu’il répond à l’entreprise par courrier et non par email, il faudrait trouver un moyen de montrer à cette dernière que c’est grâce à www.sophiaforum.com que cet utilisateur vient (au moyen d’un petit carton à imprimer par exemple).

Tous les utilisateurs peuvent consulter les offres sans avoir à s’enregistrer. Par contre, pour pouvoir répondre à une offre, il faut créer un profil qui va stocker toutes les informations personnelles de l’utilisateur, mais aussi son CV et sa lettre de motivation. La création de ce profil se fait en quatre étape : état civil (avec login et mot de passe), formation, expérience professionnelle, poste recherché et souhaits. Toutes ces données vont permettre de mettre en forme le CV et la lettre de motivation. Bien sûr, on laisse la possibilité de copier/coller son CV et sa lettre de motivation au format texte, ou de préciser une adresse Internet pour télécharger son CV online.

L’historique du profil liste les informations suivantes :- date de création- date de dernière modification- date de dernière consultation- date à laquelle le profil ne sera plus actif (donc effacé)- nombre d’offres consultées- nombre de fois que le CV a été consulté

Dans le futur, on peut envisager de mettre au point un service push qui enverra les nouvelles offres d’emploi ou de stage à l’utilisateur par email suivant des critères spécifiques.

3.4.16. diagramme UAN : tâche « Saisie d’une nouvelle News »

Action Utilisateur Retour d’informations Etat interne du Système

~[ Dépôt news ] M v ^

( Dépôt News ) !Display( formulaire News )

Formulaire affiché

~[ Champ titre] M v ^ ( Titre ) ! Focus sur le champ titre

K Titre de l’article ( Titre ) !Display( Titre de l’article )

Champ titre renseigné

Cela est identique pour les autres champs de texte.

~[ Catégorie professionnelle ] M v

( Catégorie prof. ) !Display( Liste Catégories )

Ouverture ComboBox

Page 25 de 44


Sophia Forum


~[ Catégorie X ] M ^ ( Catégorie X ) !Display( Catégorie X )

Catégorie X sélectionnée

~[ Valider ] M v ^ ( Valider ) ! Validation de la page

3.5. Choix de l’outil et réflexion sur la connexion avec les autre matières propres au projet

Sophia Forum s’inscrit dans la réalité industrielle. L’organisation d’un tel événement est conditionnée par différentes contraintes temporelles, mais également et surtout financières. Les outils employés que ce soit au niveau du langage de programmation ou au niveau du système de gestion de la base de données doivent donc être le moins cher possible. Le site de Sophia Forum est pour l’instant hébergé par le serveur de l’ESSI. L’achat d’un nom de domaine n’est pas prévu cette année, mais peut être envisagé l’année prochaine.

Le langage JAVA (ou Just Another Vague Acronymous) semble être la meilleure solution en ce qui concerne le langage de programmation puisque complètement gratuit. La programmation du site se fera donc en utilisant les JSP, qui autorise la réalisation de pages dynamiques en relation avec une base de données.

En ce qui concerne les systèmes de gestion de base de données, l’ESSI qui héberge le site Internet dispose d’une licence pour le serveur 02, donc pas de problèmes de ce côté là !

3.6. Evaluation de l’interface par la première interviewée3.6.1. Introduction

Le site www.sophiaforum.com n’est pas complet car il implique un temps de développement très important. Par conséquent, certaines parties ne sont pas encore finalisées, de même que certaines fonctionnalités. Nous nous sommes focalisés sur la partie employeur.

3.6.2. Première interviewée et premières impressions

Il y a une très bonne harmonie au niveau des couleurs. Le choix des couleurs au tons pastels est bien trouvé. La homepage est explicite, il n’y a pas de surcharge, on a l’impression d’être au centre de l’emploi quand on regarde le monsieur. De manière générale, la présentation est claire. Le sommaire en bas de page rappelle bien les différentes parties.

Il aurait été bien d’avoir des boutons qui s’illuminent pour le menu à gauche (du type rollover) pour que cela soit plus interactif. Le bandeau d’image en haut (qui se retrouve sur toutes les pages) est bien choisi et rend le site authentique et en même temps dynamique. On sent que l’aspect communication n’a pas été laissé de côté.

3.6.3. Consulter une news

Comportement :La personne clique sur le bouton news du menu gauche.

Difficulté :La liste en bas de page n’est pas très explicite : « 3 dernières news » en

fonction de quoi ? Lorsqu’on clique sur la liste des news complète, on obtient un formulaire pas explicite du tout et mal spécifié.

Commentaires :Le texte n’est pas justifié. Il n’y a pas de saut de ligne dans le texte lui-même

et le chapeau est dans une police différente. Il vaudrait mieux dans la liste des news affiché un message « pas de news disponibles » plutôt que d’afficher un tableau vide.

Page 26 de 44

Evaluation de l’interface

Choix de l’outil


Sophia Forum


3.6.4. Rechercher une offre

Comportement :La personne clique sur le bouton rechercher une offre du menu gauche. Elle

obtient alors le formulaire de recherche. Elle clique sur rechercher et obtient une liste d’offre. Elle clique ensuite sur le titre d’un offre et une popup s’affiche avec le résumé. Elle clique ensuite sur obtenir plus de détail sur l’offre, la fenêtre se ferme et le détail de l’offre s’affiche.

Difficulté :Lorsqu’on obtient le détail d’une offre, on ne sait pas que le texte en bas de

page représente l’édito du recruteur. Il faudrait une phrase d’introduction à cet édito.

Commentaires :Le formulaire est très bien présenté. Il y a deux fois CA dans le résumé de

l’offre. Il faut penser à remettre à jour les offres et ne pas publier celles qui ne sont plus valables. Peut-être faudrait-il expliquer pour la liste des offres que si l’on clique sur l’intitulé, on obtient un résumé.

3.6.5. Créer son profil

Réactions :Aucun message n’indique clairement que la création du profil c’est bien faite.

Difficulté :Il faut expliquer ce que signifie le terme disponibilité pour le téléphone.

L’interviewée précise que ce champs ne lui servirait pas, même si elle reconnaît que cela peut être parfois utile.

Commentaires :Les champs du formulaire sont suffisants.

3.6.6. Conclusion

Les formulaires sont beau et bien détaillés. En ce qui concerne le contenu, il y a juste ce qu’il faut, ce qui est très bien. Il faut surtout penser à réactualiser le contenu et mettre une carte de Sophia Antipolis avec la localisation des entreprises à chaque fois. En ce qui concerne le vocabulaire employé, il est très direct, on sent qu’on vous parle directement, ce qui implique d’autant plus l’utilisateur.

3.6.7. Seconde interviewée et premières impressions

3.6.8. Consulter une news

Comportement :

Difficulté :

Commentaires :

3.6.9. Rechercher une offre

Comportement :

Difficulté :

Commentaires :

Page 27 de 44

Sophia Forum


3.6.10. Créer son profil

Réactions :

Difficulté :

Commentaires :

3.6.11. Conclusion

- fonctionnalités :

- informations (contenu), aide :

- ergonomie, agencement des différentes parties, guidage :

- choix des couleurs, graphisme et dessins :

- vocabulaire employé :

3.6.12. Autres impressions

Christophe Vantighem livre ses impressions : « le design du site est pas mal du tout ». Même avec quelques petits bugs corrigés maintenant, le projet est loin d’être fini, mais il est ambitieux. Les fonctionnalités sont riches et intéressantes, les informations pertinentes et le vocabulaire employé très adapté.

Pour Thierry Lieu, c'est beau mais le titre est trop petit pour la page de présentation. leSophia Forum caché tout en haut de la page au dessus des images cela pourrait être mieux ! Les couleurs sont belles, elles ne choquent pas trop aux yeux. L'écriture bleue ressort bien avec le jaune (sans ironie). C'est beau. Pour la partie rechercher une offre, Il y a deux fois indifférent dans secteur d'activité : au début et à la fin avec et sans accent. Dans l’ensemble, c’est beau, mais il y a des bugs.

Page 28 de 44

Sophia Forum


4. PARTIE BDOO4.1. Introduction

Nous avons donc utilisé le système de base de données orienté objet O2 pour implémenter le site Web de Sophia Forum. Le site étant destiné à recevoir et à diffuser diverses informations issues des différents utilisateurs, la nécessité de sauvegarder ces infos était évidente.

De plus, lorsque l’on étudie la structure des données à enregistrer, on remarque que l’on peut y associer une approche orientée objet assez intéressante. Le choix d’utiliser O2 s’est donc imposé du fait également qu’il nous semblait intéressant d’étudier comment l’interaction avec les techniques du web allait se faire.

Dans cette partie du rapport, nous allons exposer les différents points concernant l’implémentation du lien entre les pages du site et la base de données. Pour ce faire, nous allons vous présenter les techniques qui ont été utilisées, et les choix faits. Ces différents points sont évidemment à cheval entre les deux matières BDOO et Internet, mais il est certainement intéressant de présenter ceux-ci avec deux points de vues légèrement différents suivant la matière.

Afin d’interfacer ces deux domaines, nous avons commencé par étudier les différents moyens dont nous disposions. L’utilisation de O2 web aurait peut être pu être posée, mais il nous a semblé que cette technique risquerait de nous limiter lors du développement des différentes pages, dans le sens que certaines techniques utilisées en général ne seraient pas applicables.

Nous avons alors décidé d’utiliser le Binding Java O2. Ce choix nous a semblé le plus judicieux puisque Java semble vouloir s’imposer sur le domaine du web et qu’ainsi, en utilisant JSP ( Java Server Page ), et les techniques qui lui sont associées, nous pourrions ainsi atteindre la base de données tout en gardant toute la puissance des techniques actuelles sur Internet.

Le Binding Java O2 nous a permis de développer notre structure objet en écrivant nos différentes classes puis en les important simplement en O2, et ainsi nous donner la possibilité d’avoir d’un côté notre application avec les objets Java et de l’autre le système O2 auxquels sont liés ces mêmes objets. C’est dans cette technique que réside toute la puissance du binding en question.

4.2. Présentation du modèle objet4.2.1. Bannières

Une bannière est une image animée. La classe Banniere aura donc pour champ :

- nom du fichier de l’image- largeur de l’image- hauteur de l’image- ratio d’affichage- date de début d’affichage- date de fin d’affichage- texte apparaissant à la place de l’image- commentaires- nombre de fois que la bannière a été affichée- lien url

4.2.2. News

La classe News se décompose comme suit :- titre- chapeau- texte- auteur- date à laquelle la news a été posté

- partie (recruteur, chercheur, …) représentée par une entier :1 : chercheur d’emploi,

Page 29 de 44

Sophia Forum


2 : recruteur,3 : entreprise,4 : membre de l’organisation,5 : journaliste,6 : webmaster

- nombre de fois que la news a été affichée (en entier)

4.2.3. faq et bug

Les classes faq et bug héritent de la classe message dont voici les champs :- message- nom de l’auteur- email de l’auteur- date à laquelle le message a été posté- partie (recruteur, chercheur, …)

La classe faq va stocker les questions des utilisateurs, permettant ainsi au webmaster de les consulter et d’y répondre dans une page non dynamique. Elle ne dispose pas de champs supplémentaires pour le moment. La classe bug répertorie la liste des erreurs qui ont été rapportées par les utilisateurs au moyen d’un formulaire. Elle dispose des champs de la classe message, mais aussi de :

- adresse de la page défectueuse

4.2.4. image

La classe image sert à répertorier les images et à les archiver. On peut très bien envisager plus tard une recherche par mots clés mais si ce système n’est pas implémenté maintenant. La classe a pour champs :

- nom du fichier de l’image- date à laquelle l’image a été déclarée sur le serveur- titre- description- mots clés

4.2.5. Chercheur, recruteur, membre, contact et journaliste

Dans le cadre de ce projet, nous avons cinq type de personnes pouvant s’enregistrer et ajouter des informations sur le site de Sophia Forum. A chaque type est associé une classe le représentant :

- Les chercheurs d’emploi représentés par la classe Chercheur- Les recruteurs représentés par la classe Recruteur- Les membres de l’organisation de Sophia Forum représenté par la classe Membre- Les contacts d’entreprises représentés par la classe Contact- Les journalistes représentés par la classe Journaliste

Nous avons ensuite remarqué l’évidente redondance d’information dans les cinq classes. Par exemple, une grande partie des informations d’état civil sont communes aux cinq classes. Nous avons donc créer la classe Personne qui sera ensuite dérivée pour produire les autres classes.

La classe Personne contient donc les champs suivants :- login (unique)- mot de passe- titre représenté par un entier (voir la classe Ressources)- nom- prénom- adresse- code postal- ville- pays- téléphone (bureau)- disponibilité téléphone (bureau)- téléphone (portable)- disponibilité téléphone (portable)- fax

Page 30 de 44

Sophia Forum


- email- photo

La classe Chercheur qui dérive donc de la classe Personne contiendra les champs supplémentaires suivants :

- Date de naissance- nationalité représentée par une constante- statut militaire représentée par un entier (voir la classe Ressources)- téléphone (domicile)- disponibilité téléphone (domicile)- site Internet- ProfilChercheur (voir plus bas)

Un membre du Sophia Forum est en fait un chercheur d’emploi un peu spécial. En plus sa biographie est disponible en ligne ainsi qu’une photo l’accompagnant. La classe Membre dérivera donc de la classe Chercheur et contiendra les champs supplémentaires suivants :

- biographie- photo de la biographie

Un recruteur est attaché à une entreprise, qui doit déjà être enregistré dans la base avant sa création, et doit pouvoir se présenter via un edito. Donc, dans la classe Recruteur qui hérite de la classe Personne, on ajoutera les champs suivants :

- édito- Entreprise (voir plus bas)

Un journaliste est attaché à un média (journal « papier », électronique, radio … ). La classe Journaliste est une classe dérivée de Personne avec :

- nom du média auquel il appartient

Un contact est attaché à une entreprise, qui doit déjà être enregistré dans la base avant sa création. La classe Contact dérive donc de la classe Personne en ajoutant un champs :

- Entreprise

4.2.6. Profil, ProfilChercheur et ProfilRecruteur

La classe Profil contient des statistiques et des informations temporelles concernant les profils de chercheurs d’emploi et de recruteur. Son contenu diffère dans les deux cas, mais certaines informations sont communes aux deux profils, d’où la création d’une classe Profil qui sera dérivée en ProfilChercheur et ProfilRecruteur.

La classe Profil regroupe donc les informations suivantes :- Date de création du profil- Date de dernière modification du profil- Date de dernière consultation du profil- Date à laquelle le profil ne sera plus actif (donc effacé)- nombre de bugs rapportés- nombre de questions posées

Le profil du chercheur contiendra aussi son objectif, son Cv et sa lettre de motivation. La classe ProfilChercheur qui dérive de Profil aura les champs supplémentaire suivant:

- nombre d’offres consultées- nombre de fois que le CV a été consulté- Poste- Cv- LettreMotivation

Et pour la classe ProfilRecruteur héritant de Profil :- nombre de CV consultées- nombre d’offres postées

Page 31 de 44

Sophia Forum


4.2.7. Poste, cv et lettre de Motivation

La classe Poste a été crée afin de contenir les informations décrivant le poste recherché par le chercheur d’emploi. La classe poste recherché contient les champs suivants :

- Titre du poste recherché- mots clés permettant de préciser la recherche- type de contrat représenté par un entier (voir la classe Ressources)- secteur d’activité représenté par un entier (voir la classe Ressources)- salaire souhaité (en Francs Brut par an)- type de formation représenté par un entier (voir la classe Ressources)- expérience représenté par un entier (voir la classe Ressources)- niveau d’étude représenté par un entier (voir la classe Ressources)- Date de disponibilité

La classe Cv contiendra le CV du candidat. Pour l’instant le Cv est réduit à sa plus simple expression avec les champs suivants :

- Formation- Experience professionnelle

La classe Motivation contient la lettre de motivation du chercheur d’emploi, elle ne contient qu’un unique champs :

- Lettre de motivation

4.2.8. Offre d’emploi

La classe OffreEmploi contiendra les informations relatives aux offres d’emploi postées et enregistrées sur le site de Sophia Forum. Cette classe ne sera pas dérivée et contient les champs suivants :

- Le Recruteur qui a posté l’offre- Titre de l’offre- Mots clés permettant d’affiner les recherches- secteur d’activité, représenté par un entier (voir la classe Ressources)- région, représentée par un entier (voir la classe Ressources)- pays, représenté par un entier (voir la classe Ressources)- Date de disponibilité- type de contrat, représenté par un entier (voir la classe Ressources)- salaire- descriptif de l’emploi

4.2.9. Entreprise

La classe Entreprise contiendra les informations relatives aux entreprises enregistrées sur le site de Sophia Forum. La classe ne sera pas dérivée et contient les champs suivants :

- numéro de Siret- nom- adresse- code postal- ville - pays, représenté par un entier (voir la classe Ressources)- email- secteur d’activité, représenté par un entier (voir la classe Ressources)- nationalité, représentée par un entier (voir la classe Ressources)- dirigeant- Date de création- capital- chiffre d’affaire- site Web- implantations géographiques de l’entreprise- effectifs de l’entreprise- présentation

4.2.10. La classe Ressources

Page 32 de 44

Sophia Forum


La classe Ressources contient toutes les tableaux de constantes associé aux différents entiers utilisé à travers les classes. Cette classe a été créée dans le but d’alléger le volume d’information dans les autres classes (elle permet de remplacer une chaîne de caractères par un entier), mais aussi pour faciliter les recherches dans les offres d’emploi. De plus, cela permet d’assurer la cohérence entre tous les formulaires et toutes les classes utilisant un même champs, et d’en faciliter la mise à jour.

Par exemple, le tableau associé aux champs pays de la classe Personne contient tous les pays du monde (soit 222 pays !), alors que le champs pays est utilisé aussi dans les classes OffresEmplois, Entreprise … Ainsi, les formulaires HTML permettant de remplir ces classes, sont générés par un JSP qui recherche la liste des pays dans la classe Ressources. Si un nouvel état venait à se former il suffirait de le rajouter dans la liste sans mettre à jour tous les formulaires. Remarque : cette classe n’est pas importée. Voici le contenu de la classe Ressources :

package util;public class Ressources {public static String[] titres = {"Monsieur",

"Madame", "Mademoiselle" };

public static String[] statusMilitaires = {"Sursitaire","Dégagé des obligations militaires","Réformé" };

public static String[] pays = {"France", …};

public static String[] typesContrats = {"CDD", "CDI", "Temps partiel", "Interim", "Stage" };

public static String[] secteursActivites = {"Arts graphiques","Bureau d'études / Dessin / CAO","Commercial / Ventes / Marketing",…};

public static String[] typesFormations = { "Ecole de Commerce",

"Ecole d'ingenieur", "Universite", "IUT/BTS", "Autres" };

public static String[] niveauxEtudes = { "BAC",

"BAC+1", "BAC+2", "BAC+3", "BAC+4", "BAC+5", "BAC+6 et plus", "Autres" };

public static String[] experiences = { "Jeune diplome",

"De 1 a 2 ans", "De 3 a 5 ans", "+5ans" };

public static String[] regions = {"Aucune", /* étranger ? */"Toutes","Ile de France",. . .};

}

4.3. Choix de persistances

Nous allons décrire ici les racines de persistances utilisées. Elles sont relativement simples et sont toutes identiques. Le modèle de liste retenu a été l’ensemble DSet qui autorise la création d’ensemble sans doublons.

Les racines de persistances suivantes ont été créées dans la base :Page 33 de 44

Sophia Forum


- LesChercheurs de type o2_set_Chercheur contenant la liste des chercheurs d’emplois - LesRecruteurs de type o2_set_Recruteur contenant la liste des recruteurs - LesJournalistes de type o2_set_Journaliste contenant la liste des journaliste - LesMembres de type o2_set_Membre contenant la liste des membres de Sophia Forum - LesContacts de type o2_set_Contacts contenant la liste des contacts - ListeNews de type o2_set_News contenant la liste des news - ListeBannieres de type o2_set_Bannieres contenant la liste des bannières

4.4. Implémentation du lien ente la base de données et les pages web

L’une des principales particularité de ce projet est qu’un site web ne pourra jamais avoir les avantages d’une application Java où les objets sont persistants tout le long de l’exécution de l’application. Il a donc fallu mettre en place un système permettant de faire transiter les objets de pages en pages afin d’utiliser les avantages d’une base de donnée orientée objet.

Ce dernier point réside dans le fait que l’utilité d’une telle base est d’accrocher les objets au départ d’un processus, puis de garder le plus longtemps possible le lien sur cet objet qui reste en permanence lié à la base. Ainsi, les accès et modifications des différentes propriétés de l’objet se font sans avoir besoin de réaccéder à la base par une clé quelconque comme on le ferait en base de données relationnelle.

4.4.1. Transit des objets de page en page

Il a donc fallu faire transiter les objets persistants de la base au travers des différentes pages du site. Afin de mieux expliquer ce point, je pense qu’un exemple serait le mieux ; pour la liste des News, par exemple, on accède à la base pour charger la liste ( ou bien un échantillon de la liste ) puis on voudrait avoir la possibilité de cliquer sur l’un des éléments sorti et avoir plus d’information ou bien encore le modifier. Et bien le Binding Java nous a permis précisément de faire cela.

En fait, sur la première page, on récupère les objets demandés de la base pour les mettre dans un Vector Java. Puis c’est ce Vector Java, conteneur des objets que l’on va faire transiter d’une page à l’autre en utilisant l’objet session de http servlet. C’est un objet fourni par la bibliothèque jsp qui est global à une session du navigator. Il suffit d’invoquer sur cet objet les méthodes get et setAttribute pour enregistrer dans une page un objet Java de tout type et le récupérer dans une autre page, sous la condition de rester dans une même session.

Au cours de nos recherches, nous avons donc découvert cette première méthode pour faire transiter les objets, mais il en existe au moins une autre que nous avons également utilisé. C’est celle qui consiste à utiliser les Java-Beans dans les pages JSP en leur assignant une portée (scope) de type session pour une portée identique à la méthode précédente.

En fait, nous avons essayé d’utiliser ces deux méthodes, en choisissant suivant les besoins celle qui nous semblait la plus appropriée. Nous avons donc utilisé l’objet http session pour faire transiter les objets

persistants de la base de données. Nous avons utilisé les Java-Beans pour classifier et ordonner toutes les

méthodes d’accès à la base de données afin d’alléger au maximum le code dans les pages JSP. En général, la portée de ces beans se limite à la page

Enfin, nous avons utilisé un bean pour la partie concernant la connexion au système O2, et l’ouverture des bases. Nous allons développer l’implémentation de ce point dans la suite de ce rapport car il a fait partie des principaux problèmes que nous avons rencontrés lors de l’implémentation.

4.4.2. Connexions et accès concurrentiels

Page 34 de 44

Sophia Forum


Une fois que le problème de faire transiter les objets au sein de notre site fut résolu, il a fallu se plonger sur le problème des accès multiples à la base de données, ainsi que les connexions à cette même base.

O2 permet visiblement de connecter plusieurs utilisateur simultanément, et nous avons d’ailleurs vérifié ceci en exécutant deux fois une mini application Java accédant à la base. En revanche, lorsque nous avons essayé de transposer ces codes de connexion au sein de notre application, nous nous sommes trouvé devant un problème difficile à cerner et à régler.

En fait, nous avions préparé un Java Bean destiné à se connecter au système O2 et à ouvrir la base. Nous étions parvenu à valider l’ensemble du processus depuis la création des classes, jusqu’à leur utilisation dans notre code JSP ( ou plus souvent dans les Java Beans ).

Ce processus comprenait la création, le remplissage et enfin la consultation des racines de persistances. La validation de ce processus n’apparaît peut être pas très compliquée en elle-même mais en fait il a fallu surtout s’habituer à cette nouvelle vision d’une base de données, alors que nous étions jusqu’à ce jour fortement imprégnés de la technologie des bases de données relationnelles qui diffèrent énormément avec le système O2 et son approche orientée objet.

Donc, un fois ce processus validé, nous pensions pouvoir sans aucun problème l’appliquer sans même aucune modification, à notre site web comprenant de nombreux utilisateurs qui auraient ouvert une connexion chacun propre à leur visite sur le site.

C’était sans compter sur le problème sur lequel nous avons buté lorsque nous avons essayé de lancer deux utilisateurs à partir de deux navigateurs différents. En fait le serveur qui traite les pages JSP semble utiliser une seule thread pour exécuter une même partie de code à partir de deux navigateurs différents. Conclusion, le système O2 refusait d’ouvrir la deuxième connexion prétextant que l’utilisateur était déjà connecté.

Pour résoudre ce problème, nous avons extrait deux solutions, la première aurait consisté à utiliser du multiThread afin de résoudre ce problème dont JSP semble être la cause puisque nous avons testé par la suite, avec succès, des connexions multiples aux système O2 via deux exécutions d’un même programme ( donc deux Threads différentes ).

La deuxième solution consiste à utiliser une même connexion pour l’ensemble des accès au site. Il est à noter que cette solution nécessite bien évidemment de gérer proprement au sein du site les accès multiples en écriture aux données de la base, puisque tous les utilisateurs seront connectés via le même chemin ( une seule connexion ).

Nous avons tout d’abord opté pour la deuxième solution ( d’ailleurs la seule connue à ce moment là ) pensant que le problème venait du système O2, et nous avons implémenté l’ensemble des outils permettant de sécuriser ce processus. Lorsque nous avons découvert la réelle cause du problème, dû en fait au multiThread de JSP qui ne semble pas très approprié, nous avions déjà implémenté et sécurisé le processus et nous avons jugé qu’en fonction du temps qu’il nous était imparti, et vu que le processus semblait fiable, il n’était pas nécessaire d’implémenter cette gestion du multiTread qui s’avérait très compliquée ( nous avons tenter quelques expériences sans succès ).

Nous allons donc dans la dernière partie de ce rapport nous focaliser sur cette gestion des connexions et des accès concurrentiels.

En fait nous avons implémenté une classe MyDataBase qui possède un attribut static ( donc dans notre cas, commun à tous les utilisateurs ) de type DataBase sur lequel la connexion au système est effectuée. Nous y avons ajouté une variable elle aussi static permettant de comptabiliser les utilisateurs présents sur le site, afin que le premier effectue la connexion, que les suivants réutilisent la connexion et enfin que le dernier à partir du site déconnecte le système. Nous verrons plus loin que cette classe possède également un dernier attribut static permettant de gérer proprement les transactions. Le dernier attribut de cette classe est un booléen propre à chaque utilisateur permettant,

Page 35 de 44

Sophia Forum


lors du processus de connexion, de savoir s’il est déjà connecté et ainsi éviter des traitements inutiles.

Enfin, nous nous sommes aperçu que les accès concurrentiels au système, en écriture, était très mal gérés du fait que nous n’avions qu’une connexion utilisée par tout le monde, nous avons donc mis en place au sein de cette même classe un attribut trCom static par lequel tout le monde passe pour lancer ou bien valider une transaction. Il suffisait à partir de là de gérer une file d’attente sur cet attribut de type Transaction pour finaliser et valider notre processus entier.

Ceci fait, restait le problème de la déconnexion, nous ne pouvions rationnellement pas demander aux utilisateurs du site de cliquer sur un bouton DECONNEXION lorsqu’ils quittent le site ou même ferment leur navigateur. Nous avons d’ailleurs jugé qu’il serait intéressant d’effectuer la déconnexion seulement lors de la fermeture du navigateur, permettant ainsi à l’utilisateur de revenir sur le site sans avoir besoin de se reconnecter.

Il fallait donc trouver une astuce pour lever cet événement et y associer la déconnexion de l’utilisateur. Nous avons étudié le problème et nous avons opté pour une solution utilisant l’objet http Session. En fait, cette session est propre à un navigateur et possède une durée de vie limitée par un timeOut.

Nous avions donc reporté le problème sur le fait d’être en attente de la destruction de cette session. Nous avons découvert que les objets que nous faisions transiter via cette session pouvaient être à l’écoute de leur liaison avec la session, à condition que les classes implémentent une interface « HttpSessionBindingListener » issue du package javax.servlet.http.

En fait ces classes doivent définir deux méthodes valueBound(HttpSessionBindingEvent) et valueUnbound(HttpSessionBindingEvent) qui sont appelées lorsque l’objet est respectivement lié et décroché de la session.

Nous avons donc simplement crée un objet remplissant les bonnes propriétés, et notamment une méthode valueUnbound() qui déconnecte le système ( si l’utilisateur est le dernier ). Nous accrochons cet objet à chaque sessions et lorsque la session est détruite, l’ensemble des objets qui lui sont liés en sont séparés et alors notre objet Démon peut jouer son rôle et déconnecter le système automatiquement sans l’intervention de l’utilisateur.

Cette partie étant un peu technique, nous lui annexons la description des deux classes en question :

MyDataBase pour l’objet gérant les connexions DemonSession pour le Démon

***************MyDatabase****************package util;import com.ardentsoftware.jb.java.util.*;import com.ardentsoftware.jb.api.*;import javax.servlet.http.*;

public class MyDatabase{ private static Database database; private static int nbConn; private static Transaction trCom; private boolean log;

public MyDatabase(){ } public Database getDatabase(){ } public boolean connect(){ } public void disconnect(){ } public void startTransaction(){ } public void stopTransaction(){ }}*****************************************

Page 36 de 44

Sophia Forum


**************DemonSession***************package util;import java.util.*;import com.ardentsoftware.jb.api.*;import javax.servlet.http.*;

public class demonSession implements HttpSessionBindingListener { public static int nb; private MyDatabase db;

public demonSession(MyDatabase b){}

public void valueBound(HttpSessionBindingEvent event){ }

public void valueUnbound(HttpSessionBindingEvent event){ }}*****************************************

4.5. Bilan

En conclusion, une grosse partie du travail concernant cette partie du projet a consisté à mettre en place et à valider tout un processus afin de pouvoir interfacer le système O2 avec nos pages web. Ce travail a consisté à étudier les différentes solutions qui s’offraient à nous, à chercher et découvrir des techniques permettant de résoudre nos différents problèmes et ainsi, je pense que nous avons atteint notre objectif en proposant un processus validé et fiable que nous avons pu utilisé, par la suite, pour l’ensemble de notre site.

Page 37 de 44

Sophia Forum


5. PARTIE INTERNET

5.1. Les serveurs5.1.1. Apache

Comme nous avions besoin d’un server web fiable, rapide et surtout gratuit à mettre en place, nous avons donc opté pour Apache, utilisé par de nombreux sites à travers le monde. Nous avons installé la version 1.3.9 pour solaris. Nous avons aussi installé la version Windows mais le fait de pouvoir lancer un server sur une machine sans avoir besoin de la locker nous a fait préférer la version Unix.

5.1.2. Tomcat

Le serveur Tomcat est un serveur Web gratuit en JAVA permettant d'utiliser les JSP (Java Server Pages) et développé par le projet Jakarta (jakarta.apache.org) conjointement au projet Apache.

Le serveur Tomcat étant encore en phase de développement, toutes les fonctionnalités d'un serveur Web ne sont pas encore implémentées, aussi nous avons couplé le serveur Tomcat avec un serveur Apache, permettant ainsi de faire appel à des CGI, et de restreindre les accès à certaines zones.

L'objectif des développeurs est que les projets Tomcat et Apache se rejoignent et ne forment à l'avenir qu'un seul et même serveur.

5.2. Les langages utilisés5.2.1. HTML

Pour créer les pages du site, nous avons utilisé plusieurs méthodes :- DreamWeaver de Macromedia nous a permis de générer rapidement les pages HTML statiques dont nous avions besoin. C’est aussi avec cet outil que nous avons généré les pages correspondant aux différents types d’utilisateurs. Ensuite, nous avons complété ces pages à la main pour les fonctions plus avancées.- D' autres parts, des « morceaux » de pages sont générés dynamiquement par du code Jsp ou des fonctions Java…

Du fait de l’ampleur du site et du manque de temps, nous n’avons pas pu faire les tests nécessaires au bon fonctionnement du site sur tous les navigateurs; en fait nous l’avons développé pour Internet Explorer et c’est le seul navigateur sur lequel le projet fonctionne parfaitement.

5.2.2. JSP

En fait, pratiquement toutes les pages du site sont des pages Jsp, ne serait-ce que pour l’apparition d’une bannière de publicité (généré à la volée). Nous avons choisi ce langage car nous l’avions déjà utilisé dans le passé.

Page 38 de 44

Sophia Forum


5.2.3. JavaScript Le javascript est très présent sur tout le site web ; généralement pour des fonctions de vérification ou d’information.

Une fonction permet l’affichage de la date en toutes lettres ; cette fonction, présente dans le fichier date.js est incluse dans chaque fichier :

var da=new Date();var jours = new Array("Dimanche" , "Lundi" , "Mardi" , "Mercredi" , "Jeudi" , "Vendredi" , "Samedi");var j = jours[da.getDay()];document.writeln(j+" ");var d=da.getDate();document.writeln(d+" ");mois = new Array("janvier" , "février" , "mars" , "avril" , "mai" , "juin" , "juillet" , "aout" , "septembre" , "novembre" , "décembre");var m=da.getMonth();document.writeln(mois[m]+" ");var yy=da.getYear();var year=(yy<1000)?yy+1900:yy;document.writeln(year);

Lors du remplissage d’un formulaire, certains champs sont obligatoires. Le JavaScript permet de vérifier qu’ils sont remplis sans avoir besoin de changer de page.

if (document.FormName.FieldName.value == null) { champs=champs+"vous n'avez pas renseigné le champs FieldName\n";erreur=1;}else {if (document.FormName.FieldName.value=="none") {champs=champs+"vous n'avez pas renseigné le champs FieldName\n";erreur=1;}}

Ces quelques lignes de code permettent de vérifier que l’utilisateur a renseigné un champ ; si erreur=1, on affiche la chaîne « champs » et on ne passe pas à l’étape suivante. De plus, on peut même vérifier si l’utilisateur a rentré des données correctes grâce à cette fonction :

function isValid(string,allowed) {var j; for (var j=0; j< string.length; j++) { if (allowed.indexOf(string.charAt(j)) == -1) return false; } return true; }

Si on définit var validvalue = '0123456789'; et que l’on appelle isValid(document.FormName.Nombre.value,validvalue), on vérifie si l’utilisateur a entré un nombre dans le champ « nombre ».

5.2.4. Scripts CGI

Quand un journaliste écrit un article, il faut qu’il ait la possibilité d’y ajouter une photo. Le seul moyen que nous connaissons pour lire un fichier situé sur le disque du client est de lancer un script CGI. Nous l’avons écrit en Perl car c’est le langage le plus simple pour ce genre de script et le plus répandu.

#!/opt/net/GNU/bin/perl

use CGI qw(:standard); use CGI::Carp; print header(); print start_html("Sélectionnez l'image:"); print h1("Sélectionnez l'image:"),p; print start_multipart_form(), "Sélectionnez l'image:",

Page 39 de 44

Sophia Forum


filefield('filename','',45), br, p, reset,submit('submit','Enregistrer'), endform;

$timenow = time; if ($file = param('filename')) { $ext=substr ($file,-3,3); if (($ext eq "jpg") || ($ext eq "JPG") || ($ext eq "gif") || ($ext eq "GIF")) { print hr(); my @salt_chars= ('a'..'z','A'..'Z','0'..'9'); my $salt= $salt_chars[rand(63)].$salt_chars[rand(63)]; open MYFILE, ">/u/dessi3/fourment/tomcat/webapps/www.sophiaforum.com/images/photos/180x140/image$timenow$salt.$ext"; while (<$file>) { print MYFILE; }

close $file; close MYFILE; if ($file = param('filename')) { print hr,"l'image est enregistree",hr,"<script language='javascript'>opener.document.FormName.titi.src='../images/photos/180x140/image",$timenow,$salt,".$ext';opener.document.FormName.nomphoto.value='image",$timenow,$salt,".",$ext,"';</script>"; print "<script language = 'javascript'> setTimeout('self.close()',1000); </script>"; } } else { print hr,"le fichier sélectionné n'est pas du type jpeg ou gif; veuillez en choisir un autre"; } } print hr(),

end_html;

L’avantage est que, non seulement ce script va lire un fichier sur le client pour le copier sur le serveur, mais en plus il génère le nom de ce fichier nous évitant ainsi les noms du genre « photo01, photo02 ». De plus, l’image sélectionnée apparaît ensuite dans la fenêtre de saisie de l’article permettant ainsi au journaliste d’avoir une bonne idée de ce que donnera l’article sur le web. Ce script

est aussi utilisé pour enregistrer les bannières de publicité.

5.2.5. Binding Java

Pour interfacer la base de données O2 avec nos pages web, nous avons décidé d'utiliser le Binding Java O2. Ce choix nous a semblé le plus judicieux puisque Java semble vouloir s'imposer sur le domaine du web et qu'ainsi, en utilisant JSP (Java Server Page), et les techniques qui lui sont associées, nous pourrions ainsi atteindre la base de données tout en gardant toute la puissance des techniques actuelles sur Internet.

Pour les besoins de la base de données, il fallait mettre en place un système permettant de faire transiter les objets de pages en pages afin d'utiliser les avantages d'une base de données orientée objet. Il a donc fallu faire transiter les

Page 40 de 44


Sophia Forum


objets persistants de la base au travers des différentes pages du site. Afin de mieux expliquer ce point, je pense qu'un exemple serait le mieux ; pour la liste des News, par exemple, on accède à la base pour charger la liste ( ou bien un échantillon de la liste ) puis on voudrait avoir la possibilité de cliquer sur l'un des éléments sorti et

avoir plus d'information ou bien encore le modifier. Et bien le Binding Java nous a

permis précisément de faire cela. En fait, sur la première page, on récupère les objets demandés de la base pour les mettre dans un Vector Java. Puis c'est ce Vector Java, conteneur des objets que l'on va faire transiter d'une page à l'autre en utilisant l'objet session de http-servlet. C'est un objet fourni par la bibliothèque jsp qui est global à une session du navigateur. Il suffit d'invoquer sur cet objet les méthodes getAttribute et setAttribute pour enregistrer dans une page un objet Java de tout type et le récupérer dans une autre page, sous la condition de rester dans une même session.

Au cours de nos recherches, nous avons donc découvert cette première méthode pour faire transiter les objets, mais il en existe au moins une autre que nous avons également utilisé. C'est celle qui consiste à utiliser les Java-Beans dans les pages JSP en leur

assignant une portée (scope) de type session pour une portée identique à la méthode précédente. En fait les Java Beans utilisent les HttpSession, et stocke les objets dans la session courante (voir plus bas).

En fait, nous avons essayé d'utiliser ces deux méthodes, en choisissant suivant les besoins celle qui nous semblait la plus appropriée. Nous avons donc utilisé l'objet httpSession pour faire transiter les objets persistants de la base de données.

Nous avons utilisé les Java-Beans pour classifier et ordonner toutes les méthodes d'accès à la base de données afin d'alléger au maximum le code dans les pages JSP. Un Bean permet de stocker facilement un objet dans une session, mais l'objet doit être connu au moment de la requête HTTP et posséder un constructeur par défaut. Si on souhaite créer les objets dans le code JPS, alors il faudra l'insérer manuellement dans la session.

Enfin, nous avons utilisé un bean pour la partie concernant la connexion au système O2, et l'ouverture des bases. Nous allons développer l'implémentation de ce point dans la suite de ce rapport car il a fait partie des principaux problèmes que

nous avons rencontrés lors de l'implémentation.

Ceci fait, restait le problème de la déconnexion, nous ne pouvions rationnellement pas demander aux utilisateurs du site de cliquer sur un bouton DECONNEXION lorsqu'ils quittent le site ou même ferment leur navigateur. Nous avons d'ailleurs jugé qu'il serait intéressant d'effectuer la déconnexion seulement lors de la fermeture du navigateur, permettant ainsi à l'utilisateur de revenir sur le site sans avoir besoin de se reconnecter. Il fallait donc trouver une astuce pour lever cet événement et y associer la déconnexion de l'utilisateur. Nous avons étudié le problème et nous avons opté pour une solution utilisant l'objet http Session. En fait, cette session est propre à un

Page 41 de 44

Sophia Forum


navigateur et possède une durée de vie limitée par un timeOut. Nous avions donc reporté le problème sur le fait d'être en attente de la destruction de cette session. Nous avons découvert que les objets que nous faisions transiter via cette session pouvaient être à l'écoute de leur liaison avec la session, à condition

que les classes implémentent une interface " HttpSessionBindingListener " issue du package javax.servlet.http.

En fait ces classes doivent définir deux méthodes valueBound(HttpSessionBindingEvent) et valueUnbound(HttpSessionBindingEvent) qui sont appelées lorsque l'objet est respectivement lié et décroché de la session.

Nous avons donc simplement crée un objet remplissant les bonnes propriétés, et notamment une méthode valueUnbound() qui déconnecte le système ( si l'utilisateur est le dernier ). Nous accrochons cet objet à chaque sessions et lorsque la session est détruite, l'ensemble des objets qui lui sont liés en sont séparés et alors notre objet Démon peut jouer son rôle et déconnecter le système automatiquement sans l'intervention de l'utilisateur.

5.2.6. L’interface http Session

L'interface HttpSession fournit un moyen d'identifier un utilisateur à travers plusieurs pages et de stocker des informations sur un utilisateur. Le "servlet container" utilise cette interface pour créer une session entre un client HTTP et un serveur HTTP. La session persiste ensuite pour une durée spécifiée.

Généralement, une session correspond à un utilisateur, qui peut visiter un site plusieurs fois. Le serveur peut maintenir cette session de plusieurs façons comme avec des cookies ou en réécrivant les URLs. Cette interface permet aux servlet de:

- voir et manipuler les informations d'une session, telles que la dates de création, le nombre d'accès ... - de "binder" des objets à une session, d'autoriser que des informations puissent persister sur plusieurs connections - quand une application sauve ou enlève un objet d'une session, celle-ci vérifie si l'objet implemente HttpSessionBindingListener. Si c'est le cas, le servlet notifie l'objet qu'il a été attaché (bound) ou détaché (unbound) de la session.

Les méthodes que nous avons utilisées sont setAttribute() et getAttribute() qui permettent de stocker et de recupérer des objets dans l'objet session.

Remarque: les "beans" utilisés par les JSP sont stockés dans un objet HttpSession, l'objet 'session' qui est la session courante. Nous avons d'ailleurs utilisé cette session courante pour stocker nos objets qui transitaient d'une page à l'autre.

5.3. La partie visible5.3.1. Les includes

Cette fonction permet d’inclure un fichier jsp à l’intérieur d’un autre ; c’est très utile lorsque l’on veut qu’un morceau de code apparaisse dans plusieurs pages. On utilise l’include déjà pour les fichiers javascript. Cependant, la syntaxe est différente pour le jsp :

<%@ include file="_include/header.jsp"%>

Le fichier header.jsp est le suivant:

Page 42 de 44

Sophia Forum


<%@ page language="java" import="java.util.Vector, com.ardentsoftware.jb.java.util.*, com.ardentsoftware.jb.api.*" %><jsp:useBean id="conn" class="util.MyDatabase" scope="session"/><%if (conn.connect()){ util.demonSession d=new util.demonSession(conn); session.setAttribute("demon1",d);} %><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><meta name="author" content=""><meta name="keywords" content=""><meta name="description" content=""><link rel="stylesheet" href="liens.css" type="text/css"><script language="JavaScript"></script>

Dans chaque fichier jsp, on inclut aussi le fichier footer.jsp qui permet d’afficher le même pied de page et de le modifier une seule fois pour toutes les pages.

<jsp:useBean id="ban" class="srcBanniere.selectBanniere" scope="page"/><% srcBanniere.importClasses.Banniere b2 = ban.myMain(conn);%><br><br><p align="center"><a href="<%= b2.geturlClient() %>" target="_blank"><img src="../images/bannieres/<%= b2.geturlImage() %>" border="0" width="<%= b2.getlargeur() %>" heigth="<%= b2.gethauteur() %>" alt="<%= b2.gettexte() %>"></a></p></p><div align="center"> <hr width="95%"> <font face="Arial, Helvetica, sans-serif" size="1"><a href="index.html">accueil</a>|<a href="profil/index.jsp"> profil</a>|<a href="cv.html">rechercher un cv</a>|<a href="news.jsp" >news</a><br><a href="../edition2000/index.html">Sophia Forum</a>|<a href="../sophiaantipolis/index.html">Sophia Antipolis</a>|<a href="faq.html">faq</a>|<a href="contact.html">contact</a><br><br><font color="#999999">Copyright © 1999-2000 Sophia Forum, tous droits révervés<br><a href="mailto:[email protected]"> [email protected]</a> - <a href= "informations.html"> informations légales</a></font></font></div>

Si l’on inclut aussi le fichier menu.jsp, on peut générer un fichier jsp de base en quelques lignes.

Page 43 de 44

Sophia Forum


L’exemple ci-dessus est une page d’accueil conçue avec des includes.

5.3.2. Les bannières

Notre site comporte des bannières de publicité. Ces bannières s’affichent selon ce que l’annonceur a demandé : il peut spécifier la fréquence d’affichage et les dates. Pour trouver la bannière à afficher dans la page, on trouve la ligne suivante dans le footer :

srcBanniere.importClasses.Banniere b2 = ban.myMain(conn);

b2 est une bannière qui respecte les contraintes de fréquence et de date ; il ne reste plus qu’à l’afficher, comme on le voit dans l’exemple précédent.

5.4. Conclusion

Ce projet fut complexe à réaliser du fait de la diversité des techniques utilisées. Cependant, malgré l’instabilité de Tomcat qui empêche son utilisation à grande échelle, ce site a tout pour être un site Internet fiable grâce aux choix qui ont été faits lors de sa conception.

Page 44 de 44

Documents

dfgdfggggggggggggggggggggggggggggggggggggggggggggggggggggg ...users.polytech.unice.fr/~buffa/cours/internet/projets/form… · Web view04/03/2010 · L’utilisatrice s’est immédiatement