Étude sur les sites adaptatifs Réalisation d un site comme point de contact des étudiants de la HEG pour les semestres à l étranger

Transcription

1 Étude sur les sites adaptatifs Réalisatin d un site cmme pint de cntact des étudiants de la HEG pur les Travail de Bachelr réalisé en vue de l btentin du Bachelr HES par : Elvis Zukanvic Cnseiller au travail de Bachelr : Xavier BURDET, Prfesseur HES et respnsable de la crdinatin de l enseignement et des relatins internatinales Caruge, le 11 septembre 2015 Haute Écle de Gestin de Genève (HEG-GE) Filière Infrmatique de Gestin

2 Déclaratin Ce travail de Bachelr est réalisé dans le cadre de l examen final de la Haute écle de gestin de Genève, en vue de l btentin du titre Bachelr f Science HES-SO en Infrmatique de gestin. L étudiant atteste que sn travail a été vérifié par un lgiciel de détectin de plagiat. L étudiant accepte, le cas échéant, la clause de cnfidentialité. L'utilisatin des cnclusins et recmmandatins frmulées dans le travail de Bachelr, sans préjuger de leur valeur, n'engage ni la respnsabilité de l'auteur, ni celle du cnseiller au travail de Bachelr, du juré et de la HEG. «J atteste avir réalisé seul le présent travail, sans avir utilisé des surces autres que celles citées dans la bibligraphie.» Fait à Caruge, le 11 septembre 2015 Elvis ZUKANOVIC ZUKANOVIC Elvis i

3 Remerciements Je tiens tut d abrd à remercier M. Xavier Burdet, le prfesseur qui m a suivi et cnseillé pendant la rédactin de ce travail de Bachelr. De plus, je suhaite remercier Megi Thanati et Bénédict Zuccne qui nt présenté leur idée de site web répndant aux besins des étudiants vulant passer un semestre à l étranger et qui m nt permis d avir ce sujet. Ensuite, je suhaite remercier le bureau des relatins internatinales de la Haute Écle de Gestin de Genève pur les répnses apprtées à mes questins et le temps qu ils nt cnsacré à mn travail. Enfin, je remercie tut mn enturage qui m a mtivé et m a sutenu durant mes années passées à la HEG et particulièrement durant ce travail de Bachelr. ZUKANOVIC Elvis ii

4 Résumé La technlgie se dévelppe très vite de ns jurs. De nuveaux supprts d accès à Internet snt lancés sur le marché et les utilisateurs s empressent pur se les prcurer. Il devient dnc impératif pur tutes entreprises u particuliers d être visible sur ces nuveaux appareils. Il ne leur suffit plus de créer un site web accessible depuis un rdinateur. Il faut désrmais créer afin que le cntenu sit adapté à des tailles d écran variées. C est le défi à surmnter pur les prgrammeurs web d aujurd hui. Il existe pur ce faire plusieurs technlgies, mais la principale qui est mise en avant dans ce travail est le respnsive design, sit une cnceptin de site web adapté à l écran sur lequel ce dernier est cnsulté. Il s agit de permettre à l utilisateur de naviguer sur un site et d en vir le cntenu imprtant, qu imprte la surface que ce dernier utilise. Grâce à la technlgie, il est devenu pssible d adapter la vue avec laquelle un appareil va s afficher. Si l utilisateur cnsulte le site depuis un rdinateur u un smartphne, il aura les infrmatins qu il désire sans devir zmer sur la page u devir défiler plusieurs fis les infrmatins présentes l écran. La partie métier de ce travail de Bachelr est rientée vers un besin qui se fait nécessaire parmi les étudiants de la Haute Écle de Gestin de Genève. Ce besin cncerne les étudiants qui suhaitent effectuer des pur parfaire leur cnnaissance d une langue u simplement pur décuvrir une nuvelle culture et une nuvelle université. Pur ces étudiants-là, il n existe actuellement aucun supprt leur permettant de prendre cntact les uns avec les autres afin d échanger leurs expériences. Plus imprtant, cmme tus les étudiants ne se cnnaissent pas, ils ne peuvent pas s entraider pur s infrmer des lieux ù ils se snt rendus pur y effectuer leur semestre. Deux persnnes partant pur la même destinatin devraient puvir s infrmer des endrits clés ù se rendre durant leur semestre. La très bnne idée qu nt eue Megi Thanati et Bénédict Zuccne, deux étudiants de la filière écnmie d entreprise, est de mettre en ligne un site permettant aux étudiants de cnnaître les lieux qu nt fréquenté leurs camarades durant leur séjur à l étranger et de puvir se rencntrer pur échanger leur avis et expériences. Le public cible à atteindre est dnc les étudiants et cmme ces derniers utilisent énrmément leur smartphne, il est évident que la slutin qui est adaptée à ce prblème est de créer un site web respnsive afin de pallier aux défis du besin ainsi que du dévelppement web. ZUKANOVIC Elvis iii

5 Préface Il y a quelques mis, j ai eu l idée d effectuer mn travail de Bachelr sur un sujet qui m interpellait depuis quelques temps. Le prblème que je rencntrais fréquemment était la navigatin depuis mn smartphne sur des sites web. En effet, il m arrivait suvent de tmber sur des pages que je ne puvais pas cnsulter sans faire de manœuvres répétitives. Entre clics et zms, je perdais l envie de cnsulter le site en questin. Je me suis rapidement aperçu que pur la plupart des sites, il existait des slutins adaptées aux mbiles. Parfis, c était le site qui me prpsait de télécharger l applicatin u qui me redirigeait directement sur sn site mbile. J avais cnnaissance de la pssibilité de réaliser un site web qui s adapte «autmatiquement» seln la taille de l écran. Je me psais dnc la questin de savir purqui certaines entreprises u assciatins ptaient pur avir un site classique, un site mbile et en plus de cela, une applicatin alrs que d autres ne faisaient qu un site web respnsive design. Il m est dnc venu l idée de faire de ce sujet mn travail de Bachelr. De plus, je suhaitais inclure dans mn travail de Bachelr une partie pratique afin d acquérir plus d expérience dans le dmaine. Il y a un an, j ai exercé ma passin dans le cadre d un stage chez Firmenich ù j ai eu l ccasin de dévelpper une interface web. Il était dnc nécessaire pur mi d rienter mn travail de Bachelr sur un côté pratique. Lrsque j ai vu l annnce pur la réalisatin d une applicatin sur les échanges internatinaux, j ai directement pstulé. Durant le 7 ème semestre de ma frmatin, j ai réalisé, en grupe, dans le cadre d un curs, une étude statistique sur les échanges Erasmus. J avais déjà une idée des prblèmes que puvaient rencntrer des étudiants dans les pays étrangers grâce à des cnnaissances qui nt vécu cette expérience. Lrsque les étudiants de la filière d écnmie d entreprise m nt présenté leurs idées et leur prjet, ces derniers m nt vraiment intéressé. Une slutin puvait être apprtée à ce prblème et faire partie du grupe qui y remédie fut pur mi une satisfactin. ZUKANOVIC Elvis iv

6 Table des matières Déclaratin... i Remerciements... ii Résumé... iii Préface... iv Liste des tableaux... viii Liste des figures... viii Glssaire Intrductin Supprts et site web Les Apprfndissement de la demande Descriptin de la situatin actuelle... 5 L existant... 5 Purqui effectuer un semestre à l étranger?... 6 Lien entre les différentes universités... 6 Interview des étudiants... 6 Supprts académiques Prcédure IN/OUT... 8 Lien avec le site web Analyse du besin Cmplément de la nuvelle applicatin Utilisatin (Charge d utilisateur) Méthdlgie Analyse du besin des étudiants EE mandants du prjet Interview du Bureau des Relatins Internatinales de la HEG Mise en place du serveur Étude technlgique Sécurité d accès Mise en place du prttype Validatin de l applicatin Test avec vlée (après la péride du travail de Bachelr) Assciatin des étudiants Supprts d accès à internet Histrique du hardware Descriptin du hardware aujurd hui Dévelppement de sites web et d applicatins ZUKANOVIC Elvis v

7 5.1 Site web classique Histrique Détails Utilisatin Site web mbile Histrique Détails Utilisatin Applicatin mbile Histrique Détails Utilisatin Site web respnsive Histrique Détails Utilisatin Illustratin Analyse Dévelppement Que snt les medias queries? Temps Mbilité Prix Dévelppement du site web respnsive Mde de dévelppement Prcédé Thème Extensins Cde Fnctinnalités du supprt Tutriel pur la maintenance Cnclusin Cnstat persnnel Difficultés rencntrées Bibligraphie Annexe 1 : Platefrme à l université de Saint-Gall Annexe 2 : Frmulaire pur les étudiants srtants Annexe 3 : Frmulaire Learning Agreement pur un échange en Eurpe 44 ZUKANOVIC Elvis vi

8 Annexe 4 : Frmulaire Learning Agreement pur un échange HE Annexe 5 : La vue depuis un rdinateur (site web de Genève) Annexe 6 : La vue depuis un smartphne (site web de Genève) Annexe 7 : La vue depuis un rdinateur (site web des CFF) Annexe 8 : La vue depuis un smartphne (site web des CFF) Annexe 9 : Tutriel pur la maintenance des cartes des universités partenaires et des psts d étudiant ZUKANOVIC Elvis vii

9 Liste des tableaux Tableau 1 : Synthèse des avantages et incnvénients des CMS Tableau 2 : Explicatin des pndératins Tableau 3 : Analyse multicritère de base des CMS Tableau 4 : Analyse multicritère fnctinnelle des CMS Tableau 5 : Cmparatif des différentes catégries de prtables Tableau 6 : Nmbre de sites crées par année depuis le 1 er site Liste des figures Figure 1 : Vue des pays partenaires Figure 2 : Vue des psts Figure 3 : Reverse prxy Figure 4 : Ordinateur transprtable Figure 5 : Ordinateur prtable Figure 6 : Ultra-prtable Figure 7 : Netbk Figure 8 : Respnsive design ZUKANOVIC Elvis viii

10 Glssaire Ce glssaire répertrie tutes les définitins des différents acrnymes, abréviatins et termes techniques cntenus dans ce travail. HEG Haute écle de gestin de Genève IN Étudiants venant effectuer une partie de leurs études à la HEG OUT Étudiants effectuant une partie de leurs études à l étranger BRI Bureau des relatins internatinales de la HEG qui s ccupe des échanges internatinaux AAI Identifiant prpre à chaque étudiant permettant une cnnexin à divers services, cmme Cyberlearn par exemple. Cyberlearn Platefrme pur les étudiants et les prfesseurs pur faciliter les échanges. Les curs ainsi que les exercices prpsés y snt ajutés par les prfesseurs. OCP Office cantnal de la ppulatin de Genève HES-SO Haute écle spécialisée de Suisse Occidentale Erasmus «Eurpean Actin Scheme fr the Mbility f University Students, est le nm dnné au prgramme d'échange d'étudiants et d'enseignants entre les universités et les grandes écles eurpéennes.» CMS «Un système de gestin de cntenu u SGC (Cntent Management System u CMS en anglais) est une famille de lgiciels destinés à la cnceptin et à la mise à jur dynamique de sites Web u d'applicatins multimédia» ntenu ZUKANOVIC Elvis 1

11 Thèmes/Template Un thème est un mdèle d affichage chisi pur la créatin d un site web. Il implique dispsitin de la page, culeur, plice, etc. Extensins/Plugins Une extensin et un cmplément de lgiciel qui apprte de nuvelles fnctinnalités Backup Ce snt les sauvegardes effectués tut au lng du prjet, que ce sit des sauvegardes de cdes u de dcuments. Référencement «le travail de référencement cnsiste à amélirer le psitinnement et la visibilité de sites dans des pages de résultats de mteurs de recherche u d'annuaire» SE «Le système d explitatin, abrégé SE (en anglais perating system, abrégé OS), est l ensemble de prgrammes central d un appareil infrmatique qui sert d interface entre le matériel et les lgiciels applicatifs.» Framewrk «Un framewrk u structure lgicielle est un ensemble chérent de cmpsants lgiciels structurels, qui sert à créer les fndatins ainsi que les grandes lignes de tut u d une partie d'un lgiciel» WrdPress, Jmla!, Drupal CMS les plus ppulaires Respnsive design Permet grâce à des techniques de prgrammatin d adapter le cntenu d une page au supprt sur lequel cette dernière est cnsultée. ZUKANOVIC Elvis 2

12 1. Intrductin 1.1 Supprts et site web Les différents appareils ayant une cnnexin à internet se snt multipliés ces dernières années. La place qu ils ccupent dans ntre qutidien est devenue très imprtante. Ces supprts permettent à leurs utilisateurs de naviguer sur le web sur des nuvelles platefrmes qui n existaient pas il y a quelques années. Ce snt évidemment les smartphnes, les tablettes tactiles et même les rdinateurs prtables pur ne citer que ceux-ci. L épque ù nus étins bligé d avir un rdinateur de bureau pur accéder à de l infrmatin en ligne est révlue et laisse place aujurd hui à une multitude de pssibilités. Ces nuveaux supprts impactent les entreprises qui snt visibles sur internet. Chaque sciété ayant un site web se dit de réfléchir cmment le structurer et l adapter afin de permettre aux internautes de naviguer plus facilement depuis les différentes platefrmes. Il ne suffit plus de créer sn site et de le publier en sachant qu il sera visualisé uniquement depuis un rdinateur de bureau. Par cnséquent, plusieurs techniques pur la réalisatin d un site web nt été mises en place afin de permettre d adapter ses cntenus. Ces dernières vus sernt explicitées dans la suite du dcument. Il s agit de : Site web classique Site web mbile Applicatin mbile Site web respnsive 1.2 Les La HEG prpse, à travers ses partenariats internatinaux, des pssibilités d étudier un semestre u une année à l étranger, dans le cadre du Bachelr. Les critères pur ce faire snt suples par rapprt au niveau linguistique de l étudiant. Il est, par exemple, pssible de partir dans un pays et d y étudier en anglais sans pur autant parler curamment la langue. Il n y a à ce jur que très peu de slutins prpsées par la HEG aux étudiants qui ne se snt jamais rendu dans le pays dans lequel ils désirent effectuer leur semestre, en ce qui cncerne les lieux utiles à cnnaître. Il en résulte dnc un prblème par rapprt à tus les besins d un étudiant. Prenns cmme exemple un étudiant qui part effectuer ZUKANOVIC Elvis 3

13 un semestre en Italie, dans une ville dans laquelle il ne s est jamais rendu. Cet étudiant aimerait à l arrivée dans sn lgement truver un endrit lui permettant d acheter une carte SIM afin de ne pas utiliser sn réseau Suisse pur éviter d imprtants frais. Truver cet endrit peut se révéler plus cmpliqué que cela en a l air. Dans certains pays, Il n est pas pssible d acquérir de nuveaux numérs dans des magasins de tabac, cmme il l est faisable en Suisse, encre faudrait-il le truver ce magasin de tabac! De plus, il faut chisir un pérateur qui prpse des prix abrdables pur un étudiant. Beaucup de chses auxquelles l étudiant ne pense pas frcément, peuvent devenir très cmpliquées à se prcurer si ce dernier ne cnnaît pas la ville. Il y a dnc plusieurs bstacles qui peuvent se dresser devant l étudiant en plus de la barrière de la langue. Ce n est ici qu un exemple mais il en existe bien d autres, cmme truver une pste pur l envi de clis à ses amis et à sa famille u un supermarché pur faire les curses, etc. Tus ces services snt nécessaires afin de passer un bn semestre. Ne cnnaissant pas les lieux, il devra se renseigner tant bien que mal sur des sites internet, des frums u auprès de ses camarades afin de truver ces services dans les alenturs de sn lgement et il peut arriver qu internet ne sit pas tujurs fiable. Il faut dnc ffrir, à ces étudiants, une slutin plus adéquate pur ne pas appréhender leur semestre à l étranger. Ce site, entièrement dédié aux étudiants ayant déjà effectué un échange u vulant en effectuer un, leur permettrait de publier en ligne tut ce genre de service. Si un étudiant a truvé un service de currier prche de sn campus, il purra mettre l adresse avec le type de service ainsi que le prix, par exemple. De plus, ses crdnnées apparaîtrnt sur le site. Ainsi, un autre étudiant, suhaitant partir dans la même écle, purra le cntacter pur se rencntrer afin d avir plus de détails et par la même ccasin recevir d autres infrmatins imprtantes sur le lieu en questin. Enfin, cela favrisera la rencntre et le partage entre étudiants. ZUKANOVIC Elvis 4

14 2. Apprfndissement de la demande Vus truverez ci-dessus une analyse des besins pur cette nuvelle slutin prpsée aux étudiants de la HEG et plus précisément à ceux qui effectuent un échange à l étranger ainsi qu à ceux qui désirent le faire. 2.1 Descriptin de la situatin actuelle Actuellement la HEG ne prpse aucune véritable slutin pur pallier au manque d infrmatins sur l endrit ù un étudiant désire se rendre afin d effectuer sn semestre à l étranger. D une part, ce manque de slutin prvque certains prblèmes nn négligeables. Pur n en citer qu un, il y a certains étudiants qui ne franchissent pas le cap à cause de cela. Ne pssédant pas suffisamment d infrmatins sur la ville dans laquelle il suhaite étudier, il préfère ne pas s y aventurer de peur de ne pas puvir s en srtir, entre les difficultés de la langue qui peuvent survenir u l impssibilité de truver un lgement. D autre part, un des principaux bjectifs d un semestre à l étranger, est de permettre à l étudiant de décuvrir ses prpres capacités d adaptatin. Il est dnc nrmal que la HEG ne furnisse pas tus les utils nécessaires et de ce fait, c est à l étudiant de parfaire sn apprentissage en cherchant une slutin aux prblèmes qui surviennent avec ses prpres myens. L util qui est prpsé aux étudiants va faciliter cette démarche. Mais ce sera tujurs à l étudiant d aller chercher les infrmatins dnt il a besin. L existant Après une recherche des différentes platefrmes utilisées dans les autres universités de Suisse cncernant les échanges internatinaux, c est le prcessus de l université de Saint-Gall qui a été retenue. Dans cette université, il existe pur l instant uniquement une prcédure bligatire pur tus les étudiants qui nt effectué un semestre à l étranger. Ils divent en rentrant faire un cnstat de leur expérience. La Haute Écle de Gestin demande aussi à ses étudiants un cmpte rendu de leur échange sans les en bliger. Cependant le taux de participatin n est pas très élevé. Le côté peut-être trp frmel de cette démarche en dissuade sûrement quelques-uns. Ils arrivernt plus facilement à faire un cnstat ralement à des camarades et sernt plus francs que ce qu ils auraient été s ils avaient écrit au bureau des relatins internatinales. Vus truverez en annexe 1, des images de la platefrme sur laquelle les étudiants de Saint-Gall divent dnner leur avis sur leur séjur. Il leur est pssible de vir les avis des autres étudiants. Ils nt plusieurs filtres pssibles afin de sélectinner une destinatin. ZUKANOVIC Elvis 5

15 La recherche d autres établissements pssédant un myen infrmatique pur répndre aux besins des étudiants n a pas été pussée très lin mais il s avère que très peu d université en Suisse prpse une vraie slutin pur le prblème cité. Purqui effectuer un semestre à l étranger? «La mbilité c est : Atteindre un très bn niveau dans une langue étrangère Un chix de curs élargi La décuverte d une nuvelle culture Acquérir un prfil riginal Vivre une expérience passinnante et enrichissante» (Un semestre d études ailleurs? lsn16_flyer_mbilite_ , p. 1) Cmme mentinné ci-dessus, effectuer un semestre à l étranger apprte de grands bénéfices pur les étudiants. Lien entre les différentes universités À ce jur, la Haute Écle de Gestin de Genève a plus de 100 universités partenaires à travers le mnde. Vus puvez cnsulter la liste cmplète sus : Ce nmbre cnséquent cnfirme l imprtance que la HEG attribue à ses étudiants et aux échanges avec les autres pays. Elle est active à l internatinal et permet dnc à ses étudiants de vivre une expérience unique en effectuant un semestre à l étranger. De plus, elle ffre elle-même la pssibilité à des étudiants d autres universités de venir décuvrir la qualité des frmatins qu ffrent la HEG et de visiter le cantn de Genève. Les universités snt liées par un cntrat qui détermine le nmbre d élèves qui peuvent se rendre chaque semestre dans l établissement cncerné. La HEG est en cnstante recherche de nuveaux partenariats afin d étffer encre plus sn réseau internatinal. «L établissement d un nuveau partenariat se fait généralement en participant à des cnférences internatinales et en prenant cntact avec des directeurs de prgrammes cmparables aux nôtres. S il y a un intérêt des deux côtés à cllabrer, nus établissns un accrd de partenariat pur une durée de vie de deux à cinq ans renuvelable. Dans ce partenariat, si nus décidns de puvir échanger des étudiants, nus en fixns le nmbre (généralement deux par semestre).» Interview des étudiants (En répnse à une questin, M. Xavier Burdet) Deux interviews nt été rganisés afin d avir le pint de vue d étudiants cncernant l applicatin ZUKANOVIC Elvis 6

16 La première cncernait un étudiant qui avait déjà suivi un semestre dans une université partenaire de la HEG. Les questins et répnses de cet étudiant snt : Qu est-ce qui vus a dnné envie d effectuer un semestre à l étranger? «Vivre une expérience humaine au but du mnde Décuvrir une autre culture Amélirer significativement mn niveau d anglais» Où avez-vus effectué vtre séjur? «Internatinal Cllege f Management (ICMS) à Manly (Sydney, Australie)» Avez-vus rencntré des difficultés pur la recherche d un lgement? «J'ai truvé un lgement assez rapidement par le fait que l écle (ICMS) avait cmmuniqué des pprtunités.» Avez-vus une anecdte à racnter sur une des difficultés rencntrées que l applicatin dévelppée dans ce prjet vus aurait permis d éviter? «Etant dnné que je vulais effectuer un rad trip après mn semestre et que je ne vulais pas m encmbrer de tutes mes affaires, je vulais renvyer ma valise prématurément à Genève. Le prix de ce service à la pste était hrs de mes myens. J ai truvé avec beaucup de difficulté un cncurrent qui ffrait les mêmes services beaucup mins cher.» Auriez-vus aimé avir en vtre pssessin cette applicatin avant vtre départ? Y auriez-vus cntribué? Pur quelles raisns? «Oui, je pense que cette applicatin est une excellente idée. J aurais partagé mes décuvertes et bn plan sur l applicatin et prfiter des recmmandatins des autres utilisateurs.» La deuxième interview cncernait une étudiante qui suhaite partir un semestre à l étranger au semestre de printemps de l année sclaire Les questins et répnses de cette dernière snt : Qu est-ce qui vus a dnné envie d effectuer un semestre à l étranger? «Décuvrir une autre culture Étudier les inégalités» Où suhaitez-vus effectuer vtre séjur? «Au Brésil» Avez-vus des appréhensins cncernant les difficultés pur la recherche d un lgement? «Oui, parce qu il n y a pas de campus ni de lgement étudiant» Avez-vus une idée des difficultés que vus puvez rencntrer durant vtre séjur et que l applicatin dévelppée dans ce prjet vus permettrait d éviter? «Les difficultés que je risque de rencntrer snt la recherche de magasins, (Ikea, supermarché), de me sentir arnaquée. L applicatin purrait éviter cela grâce aux infrmatins d autres étudiants» ZUKANOVIC Elvis 7

17 Aimerez-vus avir en vtre pssessin cette applicatin pendant vtre séjur? Allez-vus y cntribuer? Pur quelles raisns? «Oui, j aimerai avir en pssessin cette applicatin afin de puvir retruver plus facilement des myens de transprts et autres astuces nécessaires. En ce qui cncerne la cntributin, cela dépendra de ce que l applicatin purra m apprter à mi-même. Si je me sens dépannée dans plusieurs situatins alrs j y cntribuerais aussi.» Supprts académiques Prcédure IN/OUT Actuellement et cmme déjà expliqué précédemment, la HEG ne furnit pas de supprts infrmatiques permettant à un étudiant de gérer sn échange. Il existe cependant deux prcédures pur les échanges des étudiants qui viennent à la HEG (IN) et ceux qui partent (OUT). Ces deux prcédures varient de l une à l autre et ffrent les infrmatins nécessaires sur la HEG et sur le cantn de Genève. Vici la prcédure que le bureau des relatins internatinales suit pur les étudiants IN : L étudiant qui suhaite venir à Genève dit d abrd s inscrire sur un site en y ntant ses crdnnées persnnelles ainsi que tut sn parcurs sclaire. De ce fait, le bureau des relatins internatinales (BRI) de la HEG prend cnnaissance du prfil de l étudiant qui va venir. Suite à cela, et si ce dernier y crrespnd, une lettre d acceptatin lui est envyé. Il peut dnc venir étudier à la HEG. Le bureau des relatins internatinales envie ensuite les dnnées de l étudiant au service infrmatique de la HEG pur la créatin de ses cmptes. Une liste des fyers et lgements dispnibles à Genève est envyée à l étudiant IN. Ce n est pas la HEG qui s ccupe de truver un lgement. Elle demande néanmins aux étudiants qui viennent de passer un semestre à Genève de laisser les crdnnées de cntacts de l appartement dans lequel ils étaient installés pur les suivants. De plus, il y a la pssibilité qu un étudiant OUT laisse sn lgement à un étudiant IN. Dans ce cas, c est la HEG qui met en cntact les deux persnnes. L assciatin des étudiants prpse pur chaque étudiant IN la pssibilité d avir un «Buddy», une persnne de la HEG, qui purra l accmpagner dans ses études u lui faire décuvrir Genève. L assciatin rganise également des activités festives auxquelles l étudiant IN purra s inscrire. Lrs du premier jur du semestre, tus les étudiants IN snt cnviés à une séance d accueil ù ils reçivent tutes les infrmatins nécessaires à leurs cmptes (AAI, Cyberlearn, etc). Ils snt infrmés du lieu ù ils divent se rendre pur demander leur permis de séjur (OCP). Ils reçivent leur prgramme d étude et prennent cnnaissance de l infthèque. Ensuite chaque étudiant est cnvié séparément pur effectuer sn inscriptin aux curs. Au milieu du semestre, un feedback est demandé à l étudiant pur cnnaître sa situatin, s il s est bien adapté et si sn séjur se dérule sans encmbre. À la fin du semestre, après les examens, le bulletin de ntes est envyé à l étudiant ainsi qu à sn université accmpagné d une attestatin de suivi des curs. ZUKANOVIC Elvis 8

18 Enfin, une séance d au revir est rganisée et un feedback sur l ensemble du semestre est demandé à l étudiant. Vici la prcédure que la HEG suit pur les étudiants OUT : Les étudiants suhaitant effectuer leur semestre à l étranger divent en premier lieu remplir un frmulaire (vir annexe 2), cntenant leurs infrmatins persnnelles ainsi que les chix des universités dans lesquelles ils suhaitent se rendre. De plus, ils divent s inscrire en ligne sur la platefrme «mven». Une fis ces deux dcuments remplis et les autres annexes prêtes (lettre de mtivatin, bulletins de ntes, CV), ils divent dépser leur dssier au guichet Mbilité de la HEG avant le délai fixé par le bureau des relatins internatinales. Si le dssier est validé par l université dans laquelle l étudiant aimerait se rendre et par la HEG, une répnse est envyée par à l étudiant l infrmant de la prcédure d inscriptin à effectuer pur l établissement partenaire. En général, si la HEG dnne sn accrd pur l échange, l université partenaire en fait de même. Suite à cela, il faut que l étudiant remplisse le frmulaire «Learning Agreement» (vir annexe 3 et 4) cntenant les curs que ce dernier aimerait suivre à l étranger. Il y a deux frmulaires différents pur les échanges en Eurpe et hrs Eurpe. L étudiant OUT de la HEG reçit une aide financière pendant sn séjur à l étranger : une burse fferte par la HES-SO ainsi qu une burse de la cnfédératin si celui-ci part dans le cadre d un échange ERASMUS. L étudiant n a plus qu à remplir la déclaratin de burse avant de puvir, enfin, rganiser sn séjur (budget, lgement, billets de vyage, visas si nécessaire, etc.). La HEG met l étudiant en cntact avec la persnne en charge d accueillir les étudiants IN dans l université partenaire. Ces deux prcédures cnfirment que les étudiants de la HEG ne dispsent pas d énrmément de supprts infrmatiques pur truver les infrmatins dnt ils nt besin pur rganiser leur semestre à l étranger. Dans l autre sens, c est la HEG qui ne reçit pas énrmément de feedback des étudiants qui partent et par cnséquent ne peut furnir aux étudiants suivants des infrmatins utiles sur les lieux ù ils se rendent. Seln l université qui va accueillir un étudiant, il peut y avir plus u mins d infrmatins furnies à ce dernier cncernant les lgements. Il va de si que dans certains pays, c est plus facile et mieux structuré. Certains établissements pssèdent des campus avec des fyers pur les étudiants alrs que pur d autres, cmme c est le cas de la HEG, il faut truver un lgement dans les envirns pur éviter une heure de trajet pur s y rendre. Lien avec le site web C est précisément à ce manque de supprts que vient pallier la présence d un site web cnçu pur aider les étudiants dans leur démarche avant et pendant leur semestre à l étranger. Cntrairement aux étudiants qui viennent passer leur semestre à Genève et que la HEG infrme sur les fyers et lieux de lgement, les universités partenaires ZUKANOVIC Elvis 9

19 n ffrent pas tujurs cette pssibilité aux étudiants. Ceci pur ne citer que les prblèmes de lgement. Il devient dnc primrdial de puvir ffrir une aide pur s en srtir plus facilement et pur que les étudiants de la HEG passent un bn séjur. Le seul util infrmatique utilisé à ce jur est le lgiciel «mven» sur lequel les étudiants divent s inscrire pur prétendre à un semestre à l étranger. Ce dernier permet de cncentrer tutes les infrmatins d un étudiant, ses infrmatins persnnelles, ses destinatins suhaitées et les curs qu il suhaite suivre. De plus ce lgiciel cntient les infrmatins sur tutes les universités partenaires. Il s agit dnc d intégrer les infrmatins sur les universités dans la nuvelle platefrme prpsée aux étudiants. Ces derniers purrnt retruver ces infrmatins avant de décider dans quel établissement il suhaite se rendre. De plus, cela purra leur permettre de prendre une décisin plus facilement. Il y aura aussi le nmbre d étudiants par destinatin, ce qui permettra de vir quelles snt les destinatins phares des étudiants. 2.2 Analyse du besin Vus truverez ci-dessus plus d infrmatins cncernant la nuvelle applicatin. Cmplément de la nuvelle applicatin La nuvelle applicatin est accessible à tus les étudiants de la HEG. Un étudiant IN devient également étudiant de la HEG dès le premier jur de sn séjur à Genève. Elle leur sert de premier cntact avec le pays dans lequel ils suhaitent se rendre. L bjectif principal est que les étudiants participent et alimentent le site avec les décuvertes de lieux intéressants de la ville dans laquelle ils effectuent leur semestre. De plus, cette dernière favrisera le cntact entre les étudiants qui sernt frcément amenés à se vir pur discuter des renseignements que l un u l autre a psté. En effet, il n y aura pas de cntact à travers le site web. Le but est que les étudiants se rencntrent et échangent leurs expériences de vive vix. Il n y aura pas la pssibilité de cmmuniquer directement sur le site mais il y aura les crdnnées de l étudiant qui a rajuté un lieu. Néanmins, un partie «cmmentaires» sera pssible afin d avir plusieurs avis sur un lieu psté par un étudiant. Il se peut que quelqu un ait rencntré des prblèmes le cncernant et il purra le partager. De même si une pste u autre lieu ne snt plus à leur place d rigine, ils purrnt être annncés afin qu ils sient supprimés u mdifiés par les persnnes en charges de la maintenance. Utilisatin (Charge d utilisateur) La partie la plus imprtante du site est le nmbre d utilisateurs qui vnt naviguer et être actifs dessus. Pur que le site fnctinne, il faut que les étudiants partagent leurs expériences, qu ils sient d accrd de prendre du temps pur faciliter la vie du prchain ZUKANOVIC Elvis 10

20 étudiant. Il faut que les étudiants se disent : «J aurai aimé avir cette infrmatin sur Lndres, je vais la dnner pur que le prchain étudiant bénéficie de ce que je n ai pas eu la chance d avir.». Si tus les étudiants participent, le site web deviendra incnturnable parce qu il amènera le plus qui n existe pas actuellement. C est le plus grand défi de ce prjet. Il faut intéresser les étudiants afin qu ils aident le site à grandir et à être à jur. C est uniquement avec leur participatin que le site purra vivre. ZUKANOVIC Elvis 11

21 3. Méthdlgie Vus truverez dans les sectins suivantes la méthdlgie appliquée pur mener à bien ce travail. 3.1 Analyse du besin des étudiants EE mandants du prjet Au début du prjet, une réunin a été mise en place entre les mandants du prjet et mimême. Il s agissait là de réfléchir ensemble aux fnctinnalités nécessaires pur cette applicatin. Un brainstrming a été réalisé et il en est srti beaucup de fnctinnalités similaires entre chacune des parties. Au final les deux grandes et plus imprtantes fnctinnalités à mettre en place snt : Puvir retruver sur une carte les universités partenaires de la HEG et avir leurs crdnnées de cntact. Les infrmatins retenues snt : Pays Ville Adresse Nm de l établissement Site web Filière existante (EE, IG, etc.) Langue d étude Niveau d étude prpsé (Bachelr, Master, etc) Figure 1 : Vue des pays partenaires Ces infrmatins permettent dnc d avir une vue d ensemble sur l université partenaire, de puvir directement accéder à leur site web. Il y a aussi la pssibilité d entrer une adresse, par exemple l adresse du lgement truvé, et de vir l itinéraire jusqu à l université dans laquelle un étudiant va étudier. ZUKANOVIC Elvis 12

22 Permettre aux étudiants cnnectés de rentrer un lieu qu il juge nécessaire pur le bien être durant le semestre à l étranger. Les infrmatins à y retruver snt : Titre du pst Nm et prénm de l étudiant qui a émis le pst Numér de téléphne Catégrie du pst Date du pst Hraire d uverture (si existant) Site web (si existant) Adresse du pst Figure 2 : Vue des psts C est là le cœur de l applicatin prpsée. C est à cet endrit que les étudiants aurnt les infrmatins dnt ils nt besins sur un lieu qu un autre étudiant a identifié sur la carte. Deux parties snt à distinguer ci-dessus. Il y a d abrd les infrmatins relatives à l étudiant. Ces infrmatins permettent de retruver qui a psté l infrmatin et par ce fait de puvir rentrer en cntact avec ce dernier. La deuxième partie cncerne les infrmatins en rapprt avec le pst lui-même. Une infrmatin très imprtante qui y figure est la date de pst. Si le pst est récent, les étudiants peuvent s y fier. Si nn, il faudra parcurir une liste de cmmentaire afin de vérifier l exactitude de l infrmatin. Il est aussi pssible évidemment de lancer une recherche Ggle afin de s assurer que l adresse du lieu est tujurs identique et que ce n est pas un autre bâtiment qui y est. ZUKANOVIC Elvis 13

23 3.2 Interview du Bureau des Relatins Internatinales de la HEG Après les interviews de madame Silvia Rebecca (chargé des étudiants IN), Jennifer Geitlinger (chargé des étudiants OUT) et Dminique Bng (stagiaire), membres du bureau des relatins internatinales, il en ressrt que les étudiants de la HEG ne pssèdent pas suffisamment de myen leur permettant de rentrer en cntact avec d autres étudiants u de prendre cnnaissance des lieux imprtants sur place lrs de leur semestre à l étranger. La rubrique «2.1 Descriptin de la situatin actuelle» est le résultat de l entretien mené avec le BRI. Cette sectin explique la façn dnt le BRI traite les demandes des étudiants qui viennent à la HEG et ceux qui partent étudier dans une autre université. 3.3 Mise en place du serveur Le serveur utilisé à terme pur héberger le site web est un Windws server L hébergement se fera à la HEG car le site sera dans un premier temps accessible uniquement aux étudiants de la HEG. 3.4 Étude technlgique Cette sectin a pur but de vus justifier les raisns sur la prise de décisin quant au chix technlgiques utilisés pur le dévelppement du site web. Vici tut d abrd une explicatin de ce qu est un CMS. «Un système de gestin de cntenu u SGC (Cntent Management System u CMS en anglais) est une famille de lgiciels destinés à la cnceptin et à la mise à jur dynamique de sites Web u d'applicatins multimédia. Ils partagent les fnctinnalités suivantes : ils permettent à plusieurs individus de travailler sur un même dcument, ils furnissent une chaîne de publicatin (wrkflw) ffrant par exemple la pssibilité de mettre en ligne le cntenu des dcuments, ils permettent de séparer les pératins de gestin de la frme et du cntenu, ils permettent de structurer le cntenu (utilisatin de FAQ, de dcuments, de blgs, de frums de discussins, etc.), ils permettent de hiérarchiser les utilisateurs et de leurs attribuer des rôles et des permissins (utilisateur annyme, administrateur, cntributeur, etc.), certains SGC incluent la gestin de versins.» ( Les avantages et incnvénients retenus pur cmparer les CMS avec les autres mdes de dévelppement nt été chisis en fnctin de mes recherches sur le sujet et mn ZUKANOVIC Elvis 14

24 expérience durant mes études à la HEG. Ce snt des critères généraux et ne snt peutêtre pas ttalement évalués à juste titre, c est le reflet de mn pint de vue. Listes des avantages retenus : Gain de temps : le temps passé pur dévelpper un site WrdPress est généralement mins lng que pur un site classique. Une persnne sans cnnaissances particulières du dmaine peut réussir à se créer un site web. Ils existent beaucup de slutins prpsées par WrdPress avec tus les plugins et cela peut accélérer le prcessus de réalisatin d un site web. Cependant, seln la nature du site, cela peut demander autant, vir plus de temps pur le dévelppement. Cmmunauté très active : à ce jur, beaucup d agence web n utilisent que les CMS pur créer les sites web de leurs clients. Il y a un très grand nmbre de slutins à prpser aux clients et ces derniers purrnt quasiment faire la maintenance du site tut seul. Cela n est pas pssible pur la créatin d un site web classique. De plus, les internautes participent énrmément à l améliratin des CMS de jur en jur. Pur tus prblèmes rencntrés, une slutin peut être truvée sur les frums. Multitudes de thèmes existants : il y en a pur tus les gûts et ils snt rapides à mettre en place. Il est pssible par la suite d apprter des mdificatins au thème seln les besins. Multitudes de plugins existants : à nuveau il existe des plugins de tutes srtes, pur énrmément de fnctinnalités. Ces derniers snt faciles à installer et il y a suvent de bns tutriels pur expliquer leurs utilités et cmment les utiliser. Mise à jur du site facile : ce pint rappelle les deux premiers, un client d une agence web, purra mettre à jur le cntenu de sn site et les versins de plugins sans aide externe au vu de la simplicité de la démarche. Le client a les clés en main et n est pas tujurs bligé de recurir aux dévelppeurs pur faire des mdificatins de sn site. Liste des incnvénients retenus : Plugins et thèmes réalisés par d autres persnnes : mettre en place un plugin peut être cnsidérablement cmpliqué et prendre beaucup de temps. La slutin est de télécharger des plugins faits par d autres dévelppeurs. Mais le prblème qui peut survenir est que ce dernier ne crrespnd pas entièrement aux besins. Il y a suvent des plugins u des thèmes assez généraux et il peut être cmpliqué de se lancer dans la mdificatin de cdes pur le persnnaliser. Plus lent : surcharger sn site avec des plugins et des thèmes peuvent ralentir le chargement du site. Il faut s assurer du fait que tus les plugins utilisés apprtent une valeur ajutée au site web. De même pur les thèmes, il faut bien chisir sn thème pur éviter ce prblème. Cmme dit précédemment, des persnnes qui ne snt pas issues du dmaine peuvent se créer un site à l aide d un CMS. Cmme ils ne snt pas du milieu, ils aurnt tendance à faire des erreurs dans le chix des thèmes et installernt beaucup de plugins, par cnséquent ils aurnt un site plus lent. Flexibilité : un site web utilisant un CMS va ffrir énrmément de pssibilité à sn utilisateur cependant il y aura suvent une limitatin dans les thèmes et ZUKANOVIC Elvis 15

25 plugins qu il chisit et ce sera difficile d y remédier. S il chisit des plugins qui crrespndent parfaitement à ses besins, il n aura aucuns prblèmes. Tableau 1 : Synthèse des avantages et incnvénients des CMS Avantages Incnvénients Gain de temps Plugins et thèmes réalisés par d autres persnnes dnc risque qu ils ne répndent pas entièrement aux besins Cmmunauté très active Généralement plus lent Multitudes de thèmes existants Flexibilité Multitudes de plugins existants Mise à jur du site facile L utilisatin d un CMS s est mntrée la plus apte à être mise en place par rapprt au temps à dispsitin pur ce mémire et pur le grand nmbre de services que cette technlgie prpse. Une étude sur les tris CMS les plus ppulaires, se basant sur le travail de mémire de Khut Edit, ancienne étudiante de la HEG qui a effectué sn travail sur les CMS, a dnc été faite afin de sélectinner le meilleur util pur la créatin du site web dans le cadre de ce travail. Vici les tris CMS qui nt été sélectinnés au vu de leur ppularité : Drupal Jmla! Wrdpress Vici deux analyses multicritères réalisées pur le chix du CMS. La première répertrie les critères de base et la secnde les critères fnctinnels. Ces deux analyses nt été faites dans le cadre du travail de Bachelr par Khut Edit. Pur les deux analyses, la nte maximale est de 3. Une pndératin a été ajutée pur chacun des critères afin de garder la base de travail de Khut Edit tut en spécialisant l étude pur les besins de l applicatin dévelppée dans le cadre de ce travail de Bachelr. Il y a dnc certains critères qui ne sernt pas pris en cmpte. La nte ttale est la multiplicatin de la nte par la pndératin attribuée au critère. La pndératin des critères s établira de la façn suivante : ZUKANOVIC Elvis 16

26 Tableau 2 : Explicatin des pndératins Critère nn pris en cmpte Critère utile Critère imprtant Critère primrdial Cette étude est amenée d un pint de vue de dévelppeur. Ce snt des critères qui ne purrnt pas être appliqués aux utilisateurs du site et très légèrement aux persnnes en charge de la maintenance. Liste des critères de base : Installatin : ce critère permet d évaluer la rapidité et la facilité d installatin d un des CMS cités. La pndératin évaluée pur l installatin du CMS est de 3. C est le premier cntact avec le CMS, il peut être déterminant. Si l installatin est très cmplexe et qu elle prend énrmément de temps, le dévelppeur ptera directement pur un autre. Apprentissage : celui-ci est présent pur évaluer la pssibilité de se frmer sur les CMS sans aucunes cnnaissances au préalable. La pndératin évaluée pur l apprentissage du CMS est de 3. Il faut que l apprentissage s effectue de manière chérente et intuitive. Si l utilisatin est très cmplexe, à nuveau c est un autre CMS qui sera chisi. Cnvivialité d interface administrateur : il faut que le dévelppeur pssède une interface facile d utilisatin, claire et précise. La pndératin évaluée pur ce critère est de 2. Il est imprtant que l interface sit cnviviale et qu elle nus dnne envie de travailler. Gestin de la mise à jur de l util : l util lui-même, les «template» utilisés, les «plugins» utilisés divent être mis à jur afin de prfiter pleinement des chix que l utilisateur a fait. Il est dnc imprtant de prendre en cmpte ce critère. La pndératin évaluée pur ce critère est de 2. La mise à jur de l util dit s effectuer sans cmplicatin et assez rapidement. Si chaque semaine il faut passer une heure pur mettre à jur le CMS, il ne sera pas utilisé. Backup : en ce qui cncerne les backups (sauvegardes) du site. Il y aussi des plugins qui existent et qui permettent d autmatiser ce prcessus. Il est très imprtant d avir plusieurs sauvegardes du site web pur puvir récupérer les fichiers en cas de panne. La pndératin évaluée pur le backup est de 3. Il est primrdial d avir des sauvegardes régulières pur éviter tute perte de temps causé par une panne. Référencement : Le référencement permettra au site d être truvé facilement dans les mteurs de recherche. Il est imprtant de bien chisir le chemin d accès pur chacune des pages afin de facilité la navigatin à l utilisateur. Il faut dnc prendre en cmpte ce critère. La pndératin évaluée pur le référencement est de 1. Il y a plusieurs techniques pur référencer un site mais c est tujurs utile d avir le CMS qui prpse de le référencer lui-même autmatiquement. Mise en frme des menus : les menus du site web snt tut aussi imprtants. Ce snt eux qui vnt permettre à l interface d être cnvivial à l utilisateur. Cependant la façn dnt ils vnt être mis en place est sans grande cnséquence. La ZUKANOVIC Elvis 17

27 pndératin évaluée pur ce critère est de 1. Certain CMS prpse des mises en frme sans passer par des extensins alrs que d autres intègrent déjà ce cas de figure. Vici dnc l analyse multicritère se référant à ces critères avec l ajut de la pndératin : Tableau 3 : Analyse multicritère de base des CMS Critères WrdPress Jmla! Drupal Pndératin Installatin Apprentissage Cnvivialité d interface administrateur Gestin de la mise à jur de Backup l util Référencement Mise en frme des menus Ttal pndéré (Système de gestin de cntenu de libre accès - Travail de Bachelr de Khut Edit, 2012, p. 34) Liste des critères fnctinnels : Mise en frme des articles : afin d ffrir une vue agréable à l utilisateur, il faut prendre en cmpte la mise en frme. Cette dernière permettra d apprter du design aux articles. La pndératin évaluée de ce critère est pur le mment de 0 étant dnné que les articles ne snt pas utilisés dans le dévelppement du site. Gestin des médias : ce critère définit la difficulté à insérer des images, des sns u des vidés dans les pages du site web. La pndératin évaluée de la gestin des médias est de 2. Il faut puvir facilement interagir avec l ajut et la suppressin de médias. Cela dit être rapide et fait sans encmbre. Frmulaire : créatin d un frmulaire de cntact avec l entreprise gérant le site web. La pndératin évaluée de ce critère est de 1. Il est utile de puvir insérer facilement un frmulaire de cntact dans une page du site. Cmmentaire : les cmmentaires snt très imprtants dans un site web. Dans celui dévelppé dans le cadre de ce travail de Bachelr, c est grâce aux cmmentaires que les persnnes chargées de la maintenance purrnt savir s il faut supprimer un endrit car il n existe plus par exemple. La pndératin évaluée pur ce critère est de 3. En effet dans l applicatin dévelppée pur ce travail, les cmmentaires snt primrdiaux. Les étudiants dnnernt leurs avis sur les lieux présents sur la carte. Ils permettrnt aussi de savir si un pst dit être supprimé u nn. Gestin des liens : ce critère cncerne les liens des pages qui snt déjà évqués dans les critères de base. La pndératin évaluée pur la gestin de liens est de 2. Cmme cité, il est imprtant d avir des liens curt et précis pur faciliter la navigatin et pur que l utilisateur sache sur quelle page il se truve en lisant le lien. ZUKANOVIC Elvis 18

28 Flux RSS : «un flux RSS permet la diffusin des fils d actualité de façn autmatique» cité du Travail de Bachelr de Khut Edit, 2012, p.36. La pndératin évaluée pur ce critère est de 0. Il ne sera pas utilisé dans ce prjet. Gestin des utilisateurs : il est pssible d ajuter des utilisateurs au site web, une persnne qui serait par exemple chargée de mettre à jur les articles du site. Ce critère juge de la difficulté à ajuter un nuvel utilisateur et lui administrer les drits nécessaires sur le site. La pndératin évaluée pur la gestin des utilisateurs est de 2. Il est imprtant de puvir attribuer des rôles précis aux persnnes qui sernt chargées de la maintenance du site web. Gestin de vente en ligne : cmme le nm l indique, il s agit de vérifier la pssibilité de chacun des CMS d en faire un site de vente. Dans le cadre de ce travail, ce critère n est pas abrdé. La pndératin de ce critère est de 0 parce qu il ne sera pas utilisé dans le site web dédié aux étudiants en échange. Vici dnc l analyse multicritère se référant à ces critères avec l ajut de la pndératin : Tableau 4 : Analyse multicritère fnctinnelle des CMS Critères WrdPress Jmla! Drupal Pndératin Mise en frme des articles Gestin des médias Frmulaire Cmmentaire Gestin des liens Flux RSS Gestin des utilisateurs Gestin de vente en ligne 3 3 N/A 0 Ttal pndéré (Système de gestin de cntenu de libre accès - Travail de Bachelr de Khut Edit, 2012, p. 38) D après ces deux analyses, WrdPress et Jmla! arrive à égalité de pints. D rdre général nus puvns dnc affirmer que ces deux derniers sernt les plus adaptés pur effectuer un site web. WrdPress a finalement été chisi pur dévelpper l interface de ce mémire grâce aux ntes des critères fnctinnels qui snt meilleures que celles attribuées à Jmla! La HEG utilise Drupal pur diverses raisns dnnées par Murbach Vérnique, cnceptrice en cmmunicatin web au labratire des technlgies de l infrmatin LTI de la HEG. Le premier facteur qui a été pris en cmpte est l expérience et la cnnaissance existante du CMS. Le deuxième facteur est la pssibilité de lier Drupal avec un autre LDAP existant, cmme par exemple l annuaire du persnnel HES-SO. ZUKANOVIC Elvis 19

29 Enfin, c est pur sn exhaustivité, sn évlutin et la maintenance des mdules imprtante dans la cmmunauté. 3.5 Sécurité d accès L accès au site web dévelppé dans le cadre de ce travail dit être exclusif aux étudiants de la HEG. Un étudiant IN purra dnc bénéficier de l applicatin. Il purra dnner/truver lui-même des infrmatins sur Genève. Le site est par cnséquent blqué par le cmpte AAI des étudiants. Chacun peut visiter le site pur autant qu il sit cnnecté. Il s agit de dnnées cnfidentielles et il est dnc impssible de puvir les manipuler au sein de la même base de dnnées que celle utilisée pur les dnnées du site. Pur être plus technique, il s agira de prtéger le site web par un reverse prxy. Un reverse prxy est un type de serveur par lequel l utilisateur devra passer pur accéder à un site web du serveur interne. Figure 3 : Reverse prxy ( Une fis ce reverse prxy passé, l étudiant se retruvera sur le site lui étant dédié et purra y naviguer et devenir acteur du site web. Si l étudiant se décnnecte, il repasse de l autre côté et n aura plus accès aux infrmatins du site web. 3.6 Mise en place du prttype L idée de base du prjet était de créer un prttype du site. En incluant les phases de tests, le temps mis à dispsitin ne suffit pas afin d avir une versin finale du site. Le prttype devra prpser les deux fnctinnalités de base discutées avec les mandants, sit une page avec l affichage sur une carte de tutes les universités partenaires, ainsi qu une page avec l affichage des psts d étudiants. Cette dernière sera interactive étant dnné que les étudiants purrnt eux-mêmes rajuter des lieux. 3.7 Validatin de l applicatin L applicatin a été validée le par M. Burdet et par le bureau des relatins internatinales. Les deux fnctinnalités présentées crrespndent bien aux besins. Le BRI pense que les étudiants participernt plus en alimentant le site web qu en ZUKANOVIC Elvis 20

30 remplissant le feedback demandé au retur d un séjur par la HEG. Les deux parties snt satisfaites du résultat et espère puvir permettre l utilisatin de l applicatin aux étudiants au plus vite. Il reste néanmins quelques pints à rajuter avant de lancer le site web et avant la sutenance du mémire prévue au : Héberger le site web sur un serveur de la HEG Ajuter la cnnexin par cmpte AAI Amélirer certains détails du site web 3.8 Test avec vlée (après la péride du travail de Bachelr) Idéalement la phase de test du site web devrait être lancée à la rentrée sclaire C est au mment du lancement du site que l assciatin des étudiants de la HEG lancera une légère campagne de publicité pur le site afin que les étudiants prennent cnnaissance de l pprtunité qu ils nt. Cette première vlée d étudiants sera celle qui n aura pas de bénéfice, si ce n est aider les autres, sur l applicatin. Ce sernt les premiers à pster des infrmatins du lieu dans lequel ils se sernt rendus. Les résultats de ce test ne purrnt dnc pas prendre part dans ce travail de Bachelr étant dnné que la fin est prévue au 22 septembre et sernt fait par la suite. 3.9 Assciatin des étudiants L assciatin des étudiants de la HEG, étant très intéressée par ce prjet, se prte vlntaire pur faire la prmtin du site envers les étudiants. Il s agira là d envyer régulièrement un aux étudiants pur leur faire savir qu un site leur ffrant des nuveaux services est dispnible. De plus, un lien menant sur l applicatin sera dispnible depuis le site de l assciatin. Enfin ce sera peut-être l assciatin qui sera chargée de la maintenance du site web. ZUKANOVIC Elvis 21

31 4. Supprts d accès à internet Cmme déjà cité lrs de l intrductin, les différents supprts permettant une cnnexin à internet, de ns jurs, snt les suivants : Ordinateurs de bureau Ordinateurs prtables Tablettes tactiles Phablettes Smartphnes 4.1 Histrique du hardware Les rdinateurs de bureau, généralement cmpsés d une tur et d un écran nt été mis sur le marché, pur les premiers à la fin des années Ce snt les premiers rdinateurs persnnels ppulaires et ils snt désignés cmme ceux qui nt lancé la révlutin numérique. C est uniquement en 1983 que le mt «Internet» fait sn apparitin. La première vague d rdinateur cnnecté est lancée cette année-là et cmpte un peu plus de 500 rdinateurs. Par la suite et jusqu en 1989 il y a une augmentatin cnséquente et ce snt 100'000 rdinateurs qui utilisent internet. À partir de 1990 le marché des rdinateurs et d internet ne cessent d évluer, un véritable bm dans l histire. Les vitesses de cnnexin à Internet en fnt de même. À la fin des années 1990 c est l ADSL qui s impse en ffrant l Internet à haut débit. À cette même péride ce snt encre les rdinateurs qui ne cesse d augmenter, les mdèles se multiplient, les mémires augmentent, la puissance de ces derniers aussi. Les technlgies avancent à une vitesse fulgurante, les rdinateurs deviennent sans cesse plus petits, plus ergnmique et plus léger. Le premier rdinateur prtable accessible au public est présenté en Il s agit de l IBM Cependant ce dernier qui pesait 28kgs était difficilement prtable malgré les caractéristiques qui lui valaient sn appellatin d rdinateur prtable. Le premier rdinateur prtable qui était vanté par sn cnstructeur cmme étant un vrai rdinateur prtable. C est d ailleurs le premier qui est cmmercialisé avec ce terme. Il était cette fis-ci bien plus léger et pèse 4kgs. Il se nmme Gavilan SC. ZUKANOVIC Elvis 22

32 La première tablette destinée au public a été cmmercialisée en Ce fût la GRiDPad. Elle était néanmins peu accessible étant dnné sn prix très élevé (3000 dllars). En 2001, c est le terme «tablette pc» qui est lancé par Micrsft. Il l asscie à la Windws XP Éditin Tablet PC qui est le premier rdinateur prtable sans clavier ni suris et pssédant un écran tactile. Une tablette pc est une catégrie des rdinateurs prtables. C est une tablette mais qui pssède un système d explitatin Windw, pur cette dernière en l ccurrence, et permet les mêmes fnctinnalités qu un rdinateur. La tablette pc de Micrsft a évidemment évlué au fil des années. Avec ces évlutins, les tablettes tactiles se snt décupées en deux catégries : «ardise : la plus curante, sus la frme d'un écran fin qui cntient tute l'électrnique, avec les digts u un stylet pur interagir. Le clavier physique est remplacé par un clavier virtuel cnvertible : sus la frme d'un prtable traditinnel avec clavier qui cntient la majeure partie de l'électrnique, mais dnt l'écran peut se détacher, de telle srte que seul, l'écran devienne une tablette tactile» (Wikipédia, tablette tactile, dern. Mdif. le 18 mars 2015) Mais c est surtut en 2010 avec le lancement de l IPad 1 d Apple que le marché des tablettes a cmmencé à crître. De là même à ce que la vente des tablettes tactiles cncurrencent celle des rdinateurs prtables et viennent aussi à les dépasser. Phablette est le nm dnné aux smartphnes ayant une taille cmprise entre 12,7 cm et 17,5 cm. Elles snt l intermédiaire entre les smartphnes classiques et les tablettes d ù sn appellatin. La première de ce genre a été cmmercialisée en juin 2010 et se nmme «Dell Streak». Les smartphnes existent depuis le début des années 1990 mais c est en uniquement en 2007 avec le lancement du premier IPhne d Apple que le smartphne prend une nuvelle dimensin révlutinnaire. En effet, le premier smartphne a été lancé sur le marché en Il s agissait de l IBM Simn. Il est évidemment très différent de ce que l n peut truver aujurd hui sur le marché. On ne dirait même pas que s en est un. Avant l apparitin de l IBM Simn, c est la génératin de réseau GSM (Glbal System fr Mbile Cmmunicatins) qui est dévelppé. Cmparé à la perfrmance que nus avns aujurd hui, le GSM est très faible mais à cette épque-là c était une révlutin. Le réseau s est dévelppé au même rythme que les smartphnes. En 2000, c est le ZUKANOVIC Elvis 23

33 réseau EDGE (Enhanced Data Rates fr GSM Evlutin) qui pssède une vitesse bien supérieure à sn prédécesseur qui est dévelppé. L année 2006 marque aussi un grand turnant ù les vitesses de cnnexins prennent de plus en plus d ampleur. Si le dévelppement du réseau est abrdé c est ntamment car c est un facteur très imprtant pur les smartphnes. C est avec la 3G (trisième génératin) que la cnnexin permet un usage plus crrect et beaucup plus rapide. C est dnc en 2007 que le premier téléphne d Apple, l IPhne, qui bénéficie dnc de ce réseau suffisamment puissant pur naviguer aisément sur Internet depuis sn smartphne, vit le jur. C est aussi cette année-là qui marque le turnant des smartphnes. Dès lrs, plusieurs grandes marques se snt lancées dans la recherche et la cnstructin de smartphnes afin de cncurrencer l IPhne. Le premier cncurrent arrive en 2008, la même année qu Apple lance sn secnd smartphne l IPhne 3G. Il s agit du HTC Dream turnant sur le système d explitatin Andrid qui est encre aujurd hui le principal cncurrent du système d explitatin d Apple, ios. En 2010, ce snt plusieurs autres marques qui prpsent leurs mdèles de smartphne et qui lancent véritablement le renuveau de la téléphnie mbile. C est uniquement en 2013 que les ventes des smartphnes dépassent celles des téléphnes mbiles classiques seln une étude du cabinet Gartner. 4.2 Descriptin du hardware aujurd hui À ce jur, il y a sur le marché plusieurs supprts d accès à internet cmme déjà cité. Chacun de ces supprts pssèdent ses avantages et incnvénients. Leur fabricatin n est pas prévue pur la même utilisatin. Un rdinateur de bureau cntient généralement une tur, un écran, un clavier et une suris. Il est utilisé principalement en entreprise. Un rdinateur prtable cntient les mêmes cmpsants qu un rdinateur de bureau. Ce qu il pssède de plus est sa batterie qui est rechargeable à l aide d une prise électrique. Cmme sn nm l indique, il est fait pur être transprté d ù sa taille qui peut varier. En fnctin de ns besins nus chisirns plutôt un grand écran u un petit. Si nus nus déplaçns partut avec, il va de si que nus prendrns une taille qui n est pas trp encmbrante. Généralement les rdinateurs prtables cûtent plus cher que les rdinateurs de bureau. Cette différence de prix est surtut due à la miniaturisatin des cmpsants et au manque de quantité fabriqué de ses cmpsants. Ils snt aussi en myenne mins ZUKANOVIC Elvis 24

34 puissants car ils divent limiter leurs perfrmances afin de garder une autnmie de la batterie imprtante. C est un critère très imprtant du prtable car, cmme évqué précédemment, ils snt transprtés par leurs utilisateurs et divent dnc fnctinner un maximum de temps sans être branchés à une prise. Une autre caractéristique imprtante du prtable est le système de refridissement. Ils nt un ventilateur intégré et peuvent même en psséder plusieurs seln la puissance de la machine. Avec le temps les rdinateurs prtables nt énrmément évlué et se snt divisés en plusieurs catégries : les transprtables, plus lurds que la myenne (plus de 3kgs) les prtables les ultra-prtables, de taille très réduite les netbks, les plus petits et les mins perfrmants du marché, prévus uniquement pur des usages tels qu Internet et la bureautique En ce qui cncerne les ultra-prtables, ils pssèdent dans leur rang les ultra-bks qui nt des critères bien précis, fixés par Intel, pur prter cette appellatin. «Le cahier des charges d INTEL se présente cmme ceci : Le critère physique : Finesse et légèreté divent être au prgramme Un ultra-bk dit impérativement peser mins de 1.5 kg et respecter un critère d épaisseur : mins de 18mm pur les écrans jusqu'à 13.3 puces et mins de 21mm pur les écrans de 14 puces et plus. Au niveau du physique, vus aurez dnc un PC prtable extrêmement fin et léger. Dernier pint, l autnmie, qui dit être au minimum de 5 heures. Si le prtable testé n atteint pas cette durée, il ne sera pas cnsidéré cmme un ultra-bk. La plupart des PC prtables sur le marché nt vraiment du mal à atteindre cette durée, et snt plutôt aux alenturs de 3 à 4 heures d autnmie.» (Gunther, , ZUKANOVIC Elvis 25

35 Tableau 5 : Cmparatif des différentes catégries de prtables Transprtable lurd (> 3 kg) peu autnme (2h) perfrmant (+ u -) encmbrant (17-20 puces) Figure 4 : Ordinateur transprtable Prtable pas trp lurd (< 3kg) autnme (2-4h envirn) perfrmant (+ u -) encmbrement standard (15") Figure 5 : Ordinateur prtable images/rdinateur-transprtable-02.jpg Ultra-prtable léger (< 2kg) peu encmbrant (12-14") cher par rapprt à la puissance assez autnme perfrmance faible en 3D Figure 6 : Ultra-prtable Netbk très léger (< 1 kg) ultra réduit (7-10 puces) ges330jpg/ jpg perfrmance limitée, adapté à la bureautique et internet très grande autnmie Figure 7 : Netbk ges/fr/nr/1a/9a/62/ / jpg a/4/39a467c4dba49c2b568f3723f9f0fa80-500x500.jpg ( La tablette tactile est un intermédiaire entre un rdinateur prtable et un smartphne. Il s agit uniquement d un écran plat tactile. On peut éventuellement lui rajuter un clavier si n s en sert cmme traitement de texte mais elles snt généralement vendues sans ce périphérique. Le côté tactile prend la place de la suris, certains mdèles cmprtent des stylets qui permettent peut-être plus de précisin pur la navigatin. Ses fnctinnalités snt très ressemblantes à celle d un rdinateur prtable. On peut, entre autres, cnsulter le web u juer à des jeux vidé u encre faire de la bureautique. A ce jur, nus puvns cmpter plusieurs phablettes sur le marché, telle que l IPhne 6 Plus u les différents Galaxy Nte. L attirance pur ses mdèles peut être ZUKANOVIC Elvis 26

36 expliquée par le fait que beaucup de persnnes ne se prcurent pas uniquement un smartphne mais elles se dtent de plus d une tablette. Grâce à cette nuvelle frme, les utilisateurs purraient se cntentés de n avir qu un appareil. D autant plus qu ils pssèdent les avantages des deux supprts. Ils snt plus puissants que les smartphnes rdinaires et nt quasiment la taille d une tablette tactile. Les smartphnes, quant à eux, snt la valeur sûre du marché des téléphnes mbiles d aujurd hui. Ils snt utilisés pur surfer sur internet, juer à des jeux vidé, certains s en servent énrmément pur leur mails, cmme agenda, etc. ZUKANOVIC Elvis 27

37 5. Dévelppement de sites web et d applicatins Cmme expliqué auparavant, il existe plusieurs techniques pur créer un site web. Ces techniques répndent à certains besins particuliers. Vici une petite explicatin et cmparaisn des différentes techniques existantes. 5.1 Site web classique Le site web classique évqué ici est un site web accessible avec une vue crrecte depuis un rdinateur de bureau u un rdinateur prtable de taille myenne à grande. Histrique La créatin de site web est en cnstante évlutin. Pur preuve, vici un tableau qui récapitule le nmbre de sites dévelppé dans le mnde depuis la créatin du premier site web, qui était «inf.cern.ch». Tableau 6 : Nmbre de sites crées par année depuis le 1 er site Année Nmbre (niveau mndial) 1991 (aût) (fév.) (nv.) (fév.) (avr.) (jan.) (nv.) (dnt actifs) ( ZUKANOVIC Elvis 28

38 Détails Il y a deux types de site web. Il existe des sites web statiques et dynamiques. Les sites web statiques snt des sites avec des pages créées à l aide d un éditeur de texte. Ces pages snt fixes. Chacun des fichiers renvie une page du site en passant l url du fichier au site. Si l n désire mdifier une page, il faudra prcéder en mdifiant le fichier de la page en questin. Au cntraire, les sites web dynamiques cmme le nm l indique cmprte des pages dynamiques qui snt chargées seln la demande de l utilisateur et qui interrge une base de dnnées. Les pages snt dnc mdifiées seln les suhaits de l utilisateur et seln ce qu il a besin d afficher. Utilisatin Le site web classique est surtut utilisable depuis un rdinateur de bureau u un rdinateur prtable suffisamment grand pur permettre une lecture agréable du site. La vue qu un utilisateur de smartphne aura ne sera pas agréable pur naviguer. Il faudra sans cesse zmer sur les paragraphes pur les lire parce que le frmat n est pas adapté. 5.2 Site web mbile Le web mbile a fait sn apparitin grâce à l évlutin technlgique dans la créatin de téléphne ainsi que la mise sur le marché des abnnements par les pérateurs permettant de surfer sur internet. Les sites web mbiles nt par cnséquent pu cmmencer à se dévelpper. Histrique C est en 1999 que le premier téléphne permettant d aller sur internet est lancé. Il s agit du Nkia Suite à cela, ce snt les navigateurs internet qui se snt multipliés. Il y a, ensuite, eu la pssibilité de se cnnecter à internet par Bluetth. C est uniquement en 2003 que la 3G apparaît et permet un accès à internet à haut débit. À cela s ajute, en 2005, l apparitin du WIFI, véritable décuverte technlgique, qui va permettre un accès depuis un téléphne sans cût. Enfin et seulement en 2010, les pérateurs nt lancé des abnnements à frfait internet illimité, ce qui prvqua une expansin sur le marché des téléphnes mbiles. Détails Un site web mbile est un site web adapté au mbile. C est-à-dire un site web classique qui a été restructuré pur ffrir une meilleure expérience utilisateur. Le cntenu est adapté à un smartphne u une tablette. Tutes les infrmatins principales se situent ZUKANOVIC Elvis 29

39 en avant par rapprt aux détails du site. Les infrmatins snt cndensées, il n y a plus beaucup d image, le but est de miser sur le cntenu à présenter à l utilisateur. Utilisatin L utilisatin s effectue uniquement depuis un terminal, smartphne u tablette, pssédant un accès à internet. Il est également pssible de naviguer sur un site destiné au mbile depuis un rdinateur mais ce n est pas très agréable pur l utilisateur. 5.3 Applicatin mbile Les applicatins mbiles snt l autre facette de l utilisatin d internet sur les smartphnes u tablettes. Chaque fabriquant de téléphne a sn système d explitatin, ce qui dnnera plusieurs applicatins seln si l utilisateur utilise un iphne u un Samsung (IOS versus Andrid), par exemple. Une applicatin est cnsultable depuis un smartphne en la téléchargeant sur des platefrmes de téléchargement que prpsent les fabricants de ces derniers. Histrique Les applicatins snt apparues plus u mins en même mment que les premiers smartphnes. Les premières applicatins étaient les listes de cntacts, les s et la mété entre autres. C est à partir de 2005 et avec les entreprises qui nt cmmencé à les utiliser, que les applicatins nt vraiment cmmencé à se dévelpper et à faire leur place dans d autres dmaines d utilisatin. Il est aujurd hui devenu presque primrdial de télécharger des applicatins telles que les jurnaux, les jeux, les réseaux sciaux. Ce snt les applicatins les plus téléchargées sur le marché et cela ne cesse de crître. Détails Une applicatin mbile est suvent de type prpriétaire, c est-à-dire qu elle n est accessible uniquement depuis un système d explitatin (SE). Il est nécessaire d effectuer plusieurs dévelppements pur rendre l applicatin dispnible depuis tus les SE. C est l incnvénient principal de ce mde de dévelppement. Pur prendre un exemple, l applicatin des transprts publics genevis n est pas exactement la même, au niveau de l interface, si elle est utilisé depuis un iphne u depuis un Samsung. Cmme expliqué précédemment, le mde de dévelppement n est pas le même, le langage de prgrammatin n est pas le même et par cnséquent il est quasiment impssible d avir le même rendu sur deux systèmes d explitatin différents. Utilisatin Pur utiliser une applicatin, il est nécessaire d avir un smartphne u une tablette avec un système d explitatin sur lequel cette dernière est dévelppée. Certaines ZUKANOVIC Elvis 30

40 applicatins existent uniquement sur Andrid par exemple. Il faut la télécharger sur la platefrme prpsée par le fabricant et elle peut ensuite être utilisée. Certaines nécessitent une cnnexin internet afin d en prfiter pleinement. Pur les jeux par exemple, il est nécessaire d accéder à internet pur les télécharger mais pur la plupart ils peuvent être utilisés sans accès internet. 5.4 Site web respnsive Les sites web respnsives u adaptatifs réunissent les caractéristiques des précédentes techniques de dévelppement en une seule, adapter le cntenu. Histrique «Les rigines remntent à un article de Jhn Allsp écrit en 2000 dans lequel il présente sa visin du Web de demain. Mais il faut attendre dix ans pur qu une définitin claire, cde à l'appui, sit dnnée. C'est ce qu'a fait Ethan Marctte en mai 2010 dans sn article «Respnsive Web Design» dans lequel, cmme il le déclarera lui-même plus tard, il cncrétise les ntins abrdées par Jhn Allsp en 2000.» ( Design-1ere-Partie) Détails Un site web, dit respnsive, est dnc un site qui adapte sn cntenu seln le terminal sur lequel l utilisateur le cnsulte. Si ce dernier se truve sur un rdinateur de bureau avec un grand écran, il aura beaucup d infrmatins sur sa page, beaucup d images et le texte sera très présent. Si au cntraire il se retruve à naviguer sur sn smartphne, il aura uniquement les infrmatins principales du site qui apparaîtrnt, plus d images mais uniquement le cœur du site web. La vue pur l utilisateur sera adaptée à la taille de sn écran. C est exactement pur cela que les sites web mbiles nt été dévelppés, pur répndre aux besins de l utilisateur naviguant sur un smartphne. Le respnsive design permet lui de ne plus se sucier de la platefrme sur laquelle le site sera cnsulté. Le dévelppement est réalisé afin que tutes les platefrmes sient prises en cmpte et que le site puisse être utilisable et agréable indépendamment d un rdinateur u d une tablette. Ce qui est très imprtant, c est que le site sera exactement le même que ce sit sur l une u l autre platefrme, ce sera uniquement la vue qui changera. Il ne faudra dnc plus que dévelpper un seul site au lieu de plusieurs (site classique + site mbile) afin d être accessible depuis tus les terminaux. ZUKANOVIC Elvis 31

41 Figure 8 : Respnsive design ( Vus puvez vir sur l illustratin ci-dessus de quelle manière un site vu depuis un mbile va s adapter. Les blcs représentent les infrmatins sur le site. L essentiel du site (partie bleue) reste la première chse que l utilisateur va vir. Le reste est cnstruit autur que ce sit sur la vue classique u vue réduite. Il est imprtant de rérganiser le cntenu du site lrsque l écran change de taille. C est ce qui permet d avir une interface cnviviale dans chaque cas. Utilisatin Un site web adaptatif peut être cnsulté depuis un navigateur internet. Il n y a rien à téléchargé. Il peut autant être utilisé depuis un rdinateur que depuis une tablette u un smartphne. Il n y a plus de limite de ce côté-là. Vus truverez des cmparaisns avec les autres myens de dévelppement dans la partie analyse du travail. 5.5 Illustratin Vus truverez en annexes 5 à 8 les différentes vues, si c est un site web classique, sit un site web mbile, une applicatin u un site web respnsive et de plus si c est un affichage depuis un rdinateur u depuis un smartphne. Les vues peuvent beaucup changer de l une à l autre. ZUKANOVIC Elvis 32

42 6. Analyse Vus truverez ci-dessus une cmparaisn des différentes techniques citées dans les précédents chapitres du travail. 6.1 Dévelppement Pur chacune des techniques citées, le dévelppement va s effectuer depuis un rdinateur. Pur les applicatins mbiles, elles snt aussi dévelppées depuis un rdinateur. Il existe des simulateurs et c est par ce biais qu elles snt cnstruites. Seln le site web que vus réalisez, le dévelppement peut être plus cmplexe. C est le cas d un site web respnsive. Cmme ce dernier dit s adapter à tutes les vues, il faut bien mettre en place la slutin qui va le permettre. En fait, il faudra tester l écran du supprt et afficher certaines infrmatins, en masquer d autres seln la taille de ce dernier. La grande différence qu il y a entre un site web classique dévelppé en HTML, Javascript, PHP et CSS et un site web respnsive dévelppé dans les mêmes technlgies est l utilisatin, dans le CSS, pur les sites respnsives, des medias queries. Cmme dit auparavant, le défi des dévelppeurs web d aujurd hui est de crée un site web qui va entièrement répndre à la prblématique de la réslutin d écran de l utilisateur. Que snt les medias queries? Glbalement, les medias queries est un mdule de la spécificatin CSS3 représentant des règles à appliquer pur changer la mise en page d un site. Le dévelppeur devra spécifier dans le CSS le type de média en questin et à partir de quelle taille u jusqu à quelle taille, tel u tel élément va changer. Par exemple, dans le cas ù l écran est supérieur à 1024px, l affichage de la plice du texte sera de 100%. Une fis le site lancé depuis un navigateur, ce dernier va parcurir la feuille de style CSS et va lancer l affichage de la page qui crrespnd aux spécificatins. Si le site est cnsulté depuis un écran et que la taille est supérieure à 1024px, la plice sera affichée à 100%, c est-àdire sans miniaturiser le texte. Il y a dnc ces deux éléments primrdiaux qu il faut spécifier, quel type de média et quelle taille d écran. 6.2 Temps Le temps de dévelppement est quasiment identique pur un site web mbile u un site web classique, indépendamment de ce qui est demandé par l utilisateur. Ces deux snt juste dessinés différemment mais ffrent dans la plupart des cas les mêmes fnctinnalités aux utilisateurs. Pur un site web respnsive, il faut généralement un peu ZUKANOVIC Elvis 33

43 plus de temps, il faut tester l affichage et vir s il est crrect sur chaque terminal en plus du dévelppement plus cmplexe que celui-là nécessite. Néanmins le temps que nécessite la créatin d un site web mbile en plus d un site web classique est équivalent, si ce n est plus lng, qu un site internet respnsive. Le temps de dévelppement pur une applicatin peut devenir assez lng aussi surtut si cette dernière dit être accessible depuis tus les différents systèmes d explitatin. Afin d évaluer au mieux, il faut multiplier le temps de réalisatin d une applicatin par le nmbre de terminaux avec un système d explitatin différent que le mandant veut autriser. 6.3 Mbilité Pur ce critère, c est largement le site web respnsive qui l emprte. Avec sn adaptatin de cntenu, il suffit d en dévelpper un et tus les affichages snt pssibles. En ce qui cncerne les sites web classiques et cmme déjà expliqué, ils ne sernt pas cnviviaux depuis tutes les platefrmes. Une entreprise qui suhaite être visible sur le net devra sit créé un site web respnsive, sit deux sites web séparés, vire tris, un pur les rdinateurs et un pur le mbile, éventuellement un pur les tablettes. Sachant qu un site web mbile ne s affichera pas très bien sur un rdinateur car il a été cnçu en se basant sur une taille d écran plus petite. Une applicatin mbile dit pur sa part être dévelppée sus plusieurs langages. Si sn créateur veut qu elles sient utilisées un maximum, il lui faudra créer une applicatin pur Andrid, une pur iphne, une pur Windws phne etc. Cela devient vite lurd à gérer et prend du temps à dévelpper, sans parler du fait qu il faut avir la cnnaissance de tus ces langages pur le faire. 6.4 Prix Les prix dépendent du temps cnsacré au dévelppement, de la cmplexité de ce dernier et des besins d utilisateurs. Il est dnc impssible de dnner un prix juste et stable cncernant la réalisatin de sites web. Par cnséquent un site web respnsive risque d être le plus cher. Cependant, si n rajute le prix d un site web mbile à celui d un site classique, le mntant peut facilement dépasser celui d un site respnsive. De plus, s il y a deux sites, il y a deux maintenances à effectuer. En sachant que la maintenance est ce qui cûte le plus cher, il y a des questins à se pser quant à demander un site web respnsive qui évitera ce travail fait à duble. Le prix des applicatins peut vite devenir cnséquent, entre le cût de dévelppement, les licences pur chacun des systèmes d explitatin et une maintenance à effectuer sur tus les systèmes. ZUKANOVIC Elvis 34

44 7. Dévelppement du site web respnsive Le site crée dans le cadre de ce travail de Bachelr est basé sur le respnsive design. Ce chix technlgique a été pris pur les différentes raisns que vus avez pu lire précédemment. Il est imprtant de signaler que le côté respnsive du site a été mis en place avec le chix d un thème respnsive. Par ce fait, la technique de réalisatin d un site web respnsive n a pas été apprfndie durant ce travail, elle a été appliquée. 7.1 Mde de dévelppement Le chix pur la réalisatin du site s est dnc prté sur un site web respnsive fait avec le CMS WrdPress pur les différentes raisns que vus avez pu lire jusqu à présent. Prcédé Il a tut d abrd fallu télécharger et installer un serveur en lcal afin de puvir faire turner le site sur la machine utilisée pur le dévelpper. Il s agit en fait de deux serveurs, un pur le web et un autre pur la base de dnnées du site. C est EasyPHP qui a été chisi. Ensuite, la dernière versin de WrdPress depuis le site a été téléchargée et installée. Thème Le thème respnsive chisi pur dévelpper le site web s appelle «Evlve». Il est dévelppé avec le framewrk Btstrap, framewrk CSS qui cntient également du Javascript et de l HTML. Il a été chisi en regardant la nte que les précédents utilisateurs lui nt dnné, qui est de 4.5/5 avec une grande majrité de persnnes qui nt nté 5. Il a été téléchargé plus de 740'000 fis sur le site fficiel de WrdPress. De par sn renmmé, il a été jugé qu il puvait satisfaire la demande. Extensins L extensin u en anglais plugin utilisée principalement dans ce site web est Map List Pr. Cette extensin utilise les cartes Ggle et pssède d imprtant atut cmme l affichage de plusieurs icônes sur la carte, les détails sur les marqueurs psés u encre la pssibilité de classer le tut par catégrie. Cde Cmme expliqué auparavant, une extensin est furnie pur répndre à un besin général. Il est dnc impssible de l utiliser telle quelle sans remaniement. C est avec les langages HTML, Javascript et PHP que l applicatin a été dévelppée. Ntamment la page des psts qui a été réfléchie afin qu un utilisateur puisse ajuter sn prpre lieu et ZUKANOVIC Elvis 35

45 faire une recherche des psts seln une adresse entrée. Cette fnctinnalité n existe pas dans l extensin et il fallait dnc la cder en supplément. 7.2 Fnctinnalités du supprt Les fnctinnalités du supprt séparé par pages snt : Page «Pays partenaires» Sur cette page les différentes fnctinnalités snt les suivantes : Page «Psts» Cnsultatin de la liste des pays partenaires de la haute écle de gestin de Genève avec affichage sur une carte Pssibilité de faire un itinéraire depuis une adresse quelcnque Pssibilité aux ayants drit de mdifier u de supprimer des lieux sur la carte Sur cette page les différentes fnctinnalités snt les suivantes : Cnsultatin de la liste des psts des étudiants de la HEG avec affichage sur une carte Cnsultatin des détails d un pst Recherche de psts par prximité d un lieu Pssibilité de lcaliser sa psitin afin de rajuter un pst Pssibilité d entrer une adresse afin de rajuter un pst Pssibilité aux ayants drit de mdifier u de supprimer des lieux sur la carte 7.3 Tutriel pur la maintenance Afin de maintenir le site à jur, il est nécessaire d avir accès à l interface de WrdPress. Pur ce faire, le super-administrateur du site dit furnir un accès aux persnnes chargées de la maintenance. Ces persnnes aurnt le rôle d éditeur du site. Ils purrnt par cnséquent : Ajuter, mdifier, supprimer des pages du site Ajuter, mdifier, supprimer des articles du site Ajuter, mdifier, supprimer des médias du site (images, vidés) Gérer les cmmentaires parus sur le site, les supprimer Gérer les cartes Ajuter, mdifier, supprimer des lieux sur les cartes Ajuter, mdifier, supprimer des catégries de psts Afin de faciliter le dernier pint, un tutriel a été mis en place afin d aider les persnnes en charge de la maintenance. Ce dernier se truve en annexe 9. ZUKANOVIC Elvis 36

46 8. Cnclusin Cmme déjà abrdé au début du travail, les technlgies se dévelppent à une vitesse impressinnante aujurd hui. Ce snt chaque année des dizaines de nuveaux appareils qui arrivent sur le marché. Les fabricants se livrent des cmbats sans relâchement. Il n y a qu à vir les prcès que se disputent les deux grands cnstructeurs de smartphnes, Apple et Samsung. Persnne ne sait ce que le dévelppement technlgique nus apprtera d ici quelques années. Faudrait-t-il de nuveau repenser aux dévelppements de sites web parce que ns cnnaissances actuelles ne suffirnt plus? En vyant le rythme auquel se snt dévelppés les appareils téléphniques et multimédias ces dernières années, j ai de la peine à imaginer la suite. Actuellement, le dévelppement de site web respnsive suffit pur rendre dispnibles des infrmatins sur tus les supprts, cmme cela l a été pur l applicatin dévelppée dans ce prjet. Dans quelques années et cmme c est le cas dans beaucup de sujet en infrmatique, cette dernière technlgie deviendra sûrement bslète pur laisser sa place à la prchaine. Tut cela nus blige à être prêts à mettre à jur ns cnnaissances cnstamment par de nuvelles frmatins, par un esprit uvert au dévelppement parce que nus nus devns d être au même niveau que les nuvelles technlgies. Le site web dévelppé dans le cadre de ce travail de Bachelr sera lancé prchainement. Les analyses quant à l utilisatin de ce dernier sernt effectuées par la suite. Il faudra étudier la réussite de l applicatin, en cmparant le nmbre d étudiants désirant partir depuis la mise en place d un util leur facilitant cette expérience, par rapprt aux nmbres d intéressés avant cela. De plus, des utils de perfrmance purrnt être mis en place afin de vérifier le nmbre de persnnes utilisant l applicatin. M. Burdet, le bureau des relatins internatinales de la HEG ainsi que mi-même, smmes assez ptimistes par rapprt au futur de l applicatin. Avec quelques améliratins et quelques cmplémentarités, elle purra devenir, nn seulement le prttype qu elle est aujurd hui, mais également un véritable util de travail pur les étudiants. Ce dernier purrait les suivre durant leur parcurs dans une autre université et purrait augmenter davantage le nmbre d étudiant intéressé à étudier à l étranger. Un des bjectifs qui avait été abrdé au début du travail, à plus lng terme, est de sumettre l applicatin à la HES-SO afin que d autres universités Suisse en prfitent. C est seln le succès rencntré auprès des étudiants de la HEG que cette secnde partie du prjet purrait prendre sn départ. ZUKANOVIC Elvis 37

47 9. Cnstat persnnel Ci-dessus, vus truverez les difficultés que j ai rencntrées et réslues durant ce travail de Bachelr. 9.1 Difficultés rencntrées Les principales difficultés rencntrées durant ce prjet snt : Pas de cnnaissance sur la technlgie chisie Je n avais jamais eu l ccasin de travailler avec WrdPress, c était dnc une nuvelle décuverte pur mi. Je n ai pas eu de difficultés à cmprendre le fnctinnement mais truver le bn thème et les bnnes extensins à utiliser étaient plus cmpliqué. Les répnses à mes questins je les ai, pur la plupart, truvé en ligne sur des frums et surtut sur la dcumentatin WrdPress. Pas de cnnaissance en hébergement de site web Mn cursus à la HEG et mes expériences ne m nt pas permis d apprendre cmment héberger un site web sur un serveur. J ai dévelppé ce site web sur un serveur Windws 2012 à la HEG avec les technlgies dnt j ai parlé plutôt dans ce travail. Cependant, je n ai pas réussi à faire en srte que mn site sit cnsultable depuis l extérieur. J ai dnc demandé de l aide à un camarade qui a accepté de me prêter un sus-dmaine de sn serveur afin de puvir faire les tests nécessaire au bn fnctinnement du design respnsive du site. À terme, le site sera hébergé sur un serveur de la HEG et sera prtégé par le cmpte AAI d un étudiant. Truver certaines infrmatins Je pense ntamment aux infrmatins des prix du dévelppement d un site web. Ce dernier dépend de tellement de chses qu il est difficile de fixer une tranche de prix. Lrs de mes recherches, je tmbais suvent sur des répnses vagues disant par exemple qu un site cûte entre CHF 50.- et CHF 100' Au niveau de la précisin, ce n est pas vraiment bn. De part ces répnses et le peu d expériences que j ai, je sais que le prix d un site dépend premièrement de celui qui le dévelppe, des fnctinnalités à mettre en place, du nmbre d heures que cela demande, etc. Pur le mt de la fin, ce travail de Bachelr m a amené énrmément d expériences, que ce sit au niveau infrmatique, cnnaissances générales et techniques. ZUKANOVIC Elvis 38

48 Article en ligne Bibligraphie Raphael, C est qui le Respnsive Web Design. alsacréatins [en ligne]. Dernière mdificatin de l article le 8 juillet [Cnsulté le 14 mai 2015]. Dispnible à l adresse: KARAYAN, Raphaële, Site statique-site dynamique : le match. Jurnal du net [en ligne]. [Cnsulté le 18 juin 2015]. Dispnible à l adresse : Martin, VÉRONNEAU. L histire du dévelppement d applicatins Web. Nmédia slutins inc. [en ligne]. [Cnsulté le 18 juin 2015]. Dispnible à l adresse: Cmment l'rdinateur a-t-il évlué vers les tablettes?. CnetFrance [en ligne]. Dernière mdificatin de l article le 14 avril 2011 à 15:38. [Cnsulté le 12 mars 2015]. Dispnible à l adresse : GOLLA, Mathilde, Les ventes de smartphnes dépassent celles des mbiles classiques. Le Figar [en ligne]. Dernière mdificatin de l article le 19 aût [Cnsulté le 18 mars 2015]. Dispnible à l adresse: Blg Chisir sn rdinateur prtable transprtable, prtable u ultra-prtable?. Ja Elastica [en ligne]. Lundi 25 juin 2012, 12:08. [Cnsulté le 12 mars 2015]. Dispnible à l adresse : E-Bk MARCOTTE, Ethan, Respnsive web design [en ligne]. Paris : Eyrlles, [Cnsulté le 14 mai 2015]. ISBN Dispnible à l adresse : web%20design [accès par abnnement] POLLET-VILLARD, Sylvain, Créer un seul site pur tutes les plates-frmes : Aux surces des apprches respnsive et adaptative [en ligne]. Éd.1. Paris : Eyrlles, [Cnsulté le 19 mai 2015]. ISBN Dispnible à l adresse : %20un%20seul%20site%20pur%20tutes%20les%20platesfrmes%20%3A%20Aux%20surces%20des%20apprches%20respnsive%20et%20 adaptative [accès par abnnement] KERN, Simn, Créez un site Web avec WrdPress [en ligne]. Paris : Dund, [Cnsulté le 24 février 2015]. ISBN Dispnible à l adresse : %20vs%20sites%20Web%20avec%20WrdPress [accès par abnnement] ZUKANOVIC Elvis 39

49 DAOUST, Françis, HAZAËL-MASSIEUX, Dminique, Relever le défi du Web mbile, Bnnes pratiques de cnceptin et dévelppement [en ligne]. Paris : Eyrlles, [Cnsulté le 13 mars 2015]. ISBN Dispnible à l adresse : %20d%C3%A9fi%20du%20Web%20mbile%2C%20Bnnes%20pratiques%20de%20 cnceptin%20et%20d%c3%a9velppement [accès par abnnement] Page web NEBRA, Mathieu, Intrductin à PHP. OpenClassrms [en ligne]. Dernière mdificatin de la page le mardi 21 juillet [Cnsulté le 22 juillet 2015]. Dispnible à l adresse : NEBRA, Mathieu. Qu est-ce que le Respnsive Web Design. OpenClassrms [en ligne]. Dernière mdificatin de la page le 12 février [Cnsulté le 14 mai 2015]. Dispnible à l adresse : Respnsive Design : avantages et incnvénients. Cmment ça marche [en ligne]. Dernière mdificatin de la page en aût [Cnsulté le 14 mai 2015]. Dispnible à l adresse : Le Respnsive Web Design : qu'est-ce que c'est?. Lauyan Sftware [en ligne]. [Cnsulté le 14 mai 2015]. Dispnible à l adresse : NEBRA, Mathieu, Apprenez à créer vtre site web avec HTML5 et CSS3. OpenClassrms [en ligne]. Dernière mdificatin de la page le mardi 21 aût [Cnsulté le 31 aût 2015]. Dispnible à l adresse : Travail de Bachelr KOHUT, Edit, Système de gestin de cntenu de libre accès [en ligne]. Genève : Haute écle de gestin de Genève. Travail de Bachelr. [Cnsulté le 7 juillet 2015]. Dispnible à l adresse : Wikipédia CUVILLIER, Damien, et al., Site web adaptatif. L encyclpédie libre [en ligne]. Dernière mdificatin de la page le 28 aût 2015 à 8:39. [Cnsulté le 1er avril 2015]. Dispnible à l adresse : MONGENET, Marc, et al., Site web. L encyclpédie libre [en ligne]. Dernière mdificatin de la page le 22 aût 2015 à 20:18. [Cnsulté le 1 er avril 2015]. Dispnible à l adresse : MARGAIL, et al., Web mbile. L encyclpédie libre [en ligne]. Dernière mdificatin de la page le 5 mars 2015 à 21:12. [Cnsulté le 8 avril 2015]. Dispnible à l adresse : MARTIN', et al., Applicatin mbile. L encyclpédie libre [en ligne]. Dernière mdificatin de la page le 31 aût 2015 à 18:48. [Cnsulté le 8 avril 2015]. Dispnible à l adresse : ZUKANOVIC Elvis 40

50 AOINEKO, et al., Ordinateur persnnel. L encyclpédie libre [en ligne]. Dernière mdificatin de la page le 28 mai :55. [Cnsulté le 12 mars 2015]. Dispnible à l adresse : ZYTHÈME, et al., Révlutin numérique. L encyclpédie libre [en ligne]. Dernière mdificatin de la page le 16 aût 2015 à 07:24. [Cnsulté le 12 mars 2015]. Dispnible à l adresse: BOISM, et al., Ordinateur prtable. L encyclpédie libre [en ligne]. Dernière mdificatin de la page le 17 aût 2015 à 18:04. [Cnsulté le 12 mars 2015]. Dispnible à l adresse : REYK, et al., Gavilan SC. L encyclpédie libre [en ligne]. Dernière mdificatin de la page le 17 mai 2015 à 13:48. [Cnsulté le 12 mars 2015]. Dispnible à l adresse : SENS-MÉYÉ, Bastien, et al., Phablette. L encyclpédie libre [en ligne]. Dernière mdificatin de la page le 5 mai 2015 à 11:28. [Cnsulté le 12 mars 2015]. Dispnible à l adresse : MEDBOT, et al., Smartphne. L encyclpédie libre [en ligne]. Dernière mdificatin de la page le 25 aût 2015 à 16:16. [Cnsulté le 12 mars 2015]. Dispnible à l adresse : ZUKANOVIC Elvis 41

51 Annexe 1 : Platefrme à l université de Saint-Gall ZUKANOVIC Elvis 42

52 Annexe 2 : Frmulaire pur les étudiants srtants ZUKANOVIC Elvis 43

53 Annexe 3 : Frmulaire Learning Agreement pur un échange en Eurpe ZUKANOVIC Elvis 44

54 Annexe 4 : Frmulaire Learning Agreement pur un échange HE ZUKANOVIC Elvis 45

55 Annexe 5 : La vue depuis un rdinateur (site web de Genève) Site classique : Site web mbile : ZUKANOVIC Elvis 46

56 Annexe 6 : La vue depuis un smartphne (site web de Genève) Site classique : Site web mbile : Pas d applicatin dispnible. ZUKANOVIC Elvis 47