RAPPORT DE PROJET CREATION SITE WEB POUR L ASSOCIATION PETITS PRINCES DE L OUED

Dimension: px
Commencer à balayer dès la page:

Download "RAPPORT DE PROJET CREATION SITE WEB POUR L ASSOCIATION PETITS PRINCES DE L OUED"

Transcription

1 RAPPORT DE PROJET CREATION SITE WEB POUR L ASSOCIATION PETITS PRINCES DE L OUED Tuteurs du projet : Julien LORRAIN Thomas SERMIER Licence Pro SIL CDOOAM 2012/2013 1

2 SOMMAIRE REMERCIEMENTS... 3 I. INTRODUCTION Présentation de l association Présentation du projet... 5 II. CONTEXTE DU PROJET... 6 III. CONCEPTION Langages et choix des outils utilisés Base de données Les différentes étapes du développement A. La Programmation..10 B. Le Design Résultats obtenus Problèmes rencontrés IV. PROPOSITIONS D AMELIORATION V. PLANNING PREVISIONNEL ET REEL VI. CONCLUSION VII. ANNEXES Webographie Cahier des charges site internet Petits princes de l oued

3 REMERCIEMENTS Nous tenons particulièrement à remercier dans un premier temps, nos tuteurs de projet LORRAIN Julien et SERMIER Thomas Ingénieurs informatiques au laboratoire informatique de l UFR Sciences et Techniques de Besançon pour leur disponibilité et leurs précieux conseils tant sur la partie conception que sur la partie rédaction du rapport qui nous ont permis de mener à bien ce projet. Nous remercions également Mr François BONNEVILLE, enseignant, de par sa disponibilité à répondre à toutes les questions liées à la réalisation de certaines fonctionnalités. Nos remerciements sont adressés aussi à toute l équipe pédagogique de la licence pro, notamment pour l ensemble des connaissances acquises qui nous ont permis de réaliser ce projet. 3

4 I. INTRODUCTION Dans le cadre de notre projet de la licence pro SIL, nous avons choisi la réalisation d un site internet d une association créée dans un esprit humanitaire, écologique et sportif par Claire Delteil et Rémy Schwartzler dans le désert marocain : Petits princes de l Oued. Nous avons une idée en tête quand notre responsable pédagogique nous a parlé de projet à réaliser par binôme. L idée était la création d une application Web et ainsi choisir la proposition de M. LORRAIN Julien et de M. SERMIER Thomas qui proposaient aux étudiants de réaliser un site Internet pour cette association. Le but est également d apprendre à gérer un projet professionnel de la reformulation du cahier des charges jusqu à sa réalisation complète en respectant les exigences du client. Vous verrez également dans ce projet une application directe des compétences acquises au cours de notre licence professionnelle notamment en ce qui concerne les langages PHP, HTML et CSS. Le projet s est déroulé en trois étapes : - La définition du projet qui consiste à éditer un cahier des charges fonctionnel avec le client. Dans notre cas ce dernier étant déjà fait, nous devrons faire une reformulation de celui-ci avec le client. - La conception et la réalisation du projet : nous évoquerons dans cette partie le choix des outils et des langages utilisés pour la réalisation du site, la base de données créée pour stocker les différentes informations, du développement proprement dit le codage, le design du site. Nous parlerons aussi des résultats obtenus, des problèmes rencontrés lors de la conception et enfin nous proposons quelques idées d amélioration du site. - Le planning : celui-ci nous a permis de mesurer l avancement de nos travaux et l atteinte de nos objectifs. Nous ne parlerons pas de la mise en ligne du site car cette partie a été gérée par M. LORRAIN Julien et de M. SERMIER Thomas. Dans les lignes qui suivent nous allons détailler le développement de chacune de ces parties en étant le plus précis possible pour que le lecteur de ce rapport soit éclairé sur les différentes étapes de ce travail qui demande beaucoup de temps et qui tout de même est vraiment passionnant. 4

5 1. Présentation de l association C est une association loi 1905 qui a pour but de participer au 16 e raid 4L Trophy L Trophy est un raid humanitaire dans le désert marocain mené par des étudiants venus de toute l Europe à bord de Renault 4L. Les maîtres mots de la compétition : DONNER en contribuant au développement du système éducatif marocain par l apport de dons et de matériel scolaire SE DEPASSER dans cette grande aventure pour avancer quelques soient les obstacles RESPECTER la terre d accueil qu est le Maroc et son environnement. Tous les ans, une dizaine d équipages sélectionnés par DELOITTE 4L Eco Challenge vont encore plus loin dans leur engagement. Leur objectif? Mener à bien un projet à visée écologique comme l installation de panneaux solaires et de puits, la plantation d arbres, la réduction de l empreinte écologique du rallye, etc. Petits Princes de l Oued souhaite relever ce Challenge et leur projet est actuellement en cours de conception. 2. Présentation du projet Pour assurer la communication de leur équipe (Petits Princes de l Oued) pendant l évènement 4LTrophy, l association a émis le désir de créer un site Web dans le but d informer son public des différentes actualités et de se faire connaître et attirer des sponsors. Un site Web attractif, dynamique et interactif, autant pour son administration que pour son utilisation, est alors nécessaire au bon fonctionnement et à la communication interne et externe d une telle structure. 5

6 II. CONTEXTE DU PROJET Afin d effectuer ce projet, un cahier des charges nous a été fourni. Celui-ci est assez explicite, non seulement il nous donne les données nécessaires au site mais il indique également la manière dont ils doivent être disposées. L association veut un site Internet basique composé, premièrement, d une page d accueil composée d articles et d asides et présentant l association et le 4L Trophy. Puis d une seconde page, Journal de bord, qui doit regrouper tous les articles de l équipe à la manière d un blog avec un affichage par ordre chronologique. La troisième page concerne l équipe, on y présente les deux chauffeurs de l association ainsi que leur équipe. Dans la quatrième page, la page sponsors, y figure un message permettant d attirer de nouveaux sponsors, une seconde partie avec les logos des sponsors actuels et un tableau récapitulatif des dons reçus. Enfin, nous terminons par une simple page contact avec les informations relatives à l association. Ensuite, nous retrouvons dans le cahier des charges une petite charte graphique concernant les couleurs à employer et la mise en forme de la police de caractères. Le cahier des charges se termine finalement par une simple demande concernant le nom de domaine du site. 6

7 III. CONCEPTION Dans cette partie, nous allons détailler les étapes du développement du site, les langages et le choix des outils dans un premier temps, puis un descriptif de la base de données, les étapes de la programmation avec son design, un aperçu du résultat obtenu et enfin les principales difficultés rencontrées. 1. Langages et choix des outils utilisés HTML/CSS Le HTML («HyperText Mark-Up Language») est un langage dit de «balisage» ou de «structuration» permettant la conception de pages web avec des balises de formatage. Les balises permettent d'indiquer la façon dont doivent être présentés le document et les liens qu'il établit avec d'autres documents. Le CSS («Cascading Style Sheets» : feuilles de style en cascade) est un langage informatique complétant le HTML. Alors que le HTML structure la page Web, le CSS va la mettre en forme en y apportant du style. PHP/MySQL Le PHP est un langage de script exécuté du côté serveur (comme les scripts CGI, ASP,...) et non du côté client (un script écrit en JavaScript ou une applet Java s'exécute sur son ordinateur...). La syntaxe du langage provient de celles du langage C, du Perl et de Java. Ses principaux atouts en font un des langages web le plus utilisé : Une grande communauté de développeurs partageant des centaines de milliers d'exemples de script PHP ; La gratuité et la disponibilité du code source ; La simplicité d'écriture de scripts ; La possibilité d'inclure le script PHP au sein d'une page HTML L'intégration au sein de nombreux serveurs web (Apache, Microsoft IIS, etc.). C est également un langage simple à utiliser avec des bases de données (de nombreux SGBD sont supportés, mais le plus utilisé avec ce langage est MySQL, un SGBD gratuit disponible sur de nombreuses plateformes : Unix, Linux, Windows, MacOs X, ) ; 7

8 JavaScript Le JavaScript est un langage de script incorporé dans un document HTML. Historiquement il s'agit même du premier langage de script pour le Web. Ce langage est un langage de programmation qui permet d'apporter des améliorations au langage HTML en permettant d'exécuter des commandes du côté client, c'est-à-dire au niveau du navigateur et non du serveur web. WampServer «WampServer est une plate-forme de développement Web sous Windows pour des applications Web dynamiques à l aide du serveur Apache2, du langage de scripts PHP et d une base de données MySQL. Il possède également PHPMyAdmin pour gérer plus facilement vos bases de données.» Nous avons décidé d utiliser WampServer car c est un logiciel que nous avons déjà utilisé et c est celui que nous connaissons le mieux. De plus il est régulièrement mis à jour et propose le français parmi ses langues d utilisation. Opera Mobile Emulator Opera Mobile Emulator est un logiciel gratuit créé par Opera Software. Il permet d émuler le navigateur Opera avec la résolution d écran de différents terminaux mobiles tels que des tablettes ou des Smartphones. Il nous a été très utile lors de la mise en place design, nous permettant de visualiser le site web sur de petits écrans. Nous avons ainsi pu faire quelques réajustements. 8

9 2. Base de données Comme pour tout site web, la réalisation de celui-ci a requis la création d une base de données. Dans notre cas, il nous a tout d abord fallu créer des identifiants pour la gestion administrateur du site. L inscription des visiteurs au site n étant pas requis, nous avons tous simplement créer une table «Admin» avec un champ pour le pseudonyme et un autre pour le mot de passe. Puis, lorsque nous avons commencé le journal de bord, nous avions tout d abord seulement créé une table pour les articles qui était composé du titre, du contenu, du chemin de l image, de la date, de l heure et d un id. Mais, nous avons par la suite rajouté la possibilité d insérer plusieurs images. Il nous a donc fallu rajouter une seconde table qui contenait seulement les chemins des images que nous avons identifiés par l identifiant de l article et celui de l image. Finalement, nous avons intégré la possibilité de commenter les articles ce qui nous a valu une troisième table commentaire avec un pseudo, le mail, son message, sa date et l heure. Enfin, nous avons une dernière table concernant le tableau récapitulatif des dons perçus par l association avec le nom du donateur et le montant. 9

10 3. Les différentes étapes du développement A. LA PROGRAMMATION Nous avons dans un premier temps mis en place la structure du site en créant les cinq pages du menu avec pour chacune sa mise en forme par des cadrages basiques en fonction des articles et asides regroupés par section. Cette première partie est principalement axée sur le côté HTML quasiment sans aucun design, par exemple, le menu était seulement composé de simples liens avec pour chaque page, l insertion des textes et des images fournis par le cahier des charges. Ensuite, dans un second temps, nous avons attaqués la programmation en PHP avec l ajout des fonctionnalités en commençant par la création des articles dans la page journal de bord. Cette page liste tous les articles, en limitant le nombre d articles à 5 par pages, avec leur image, leur titre et les 200 premiers caractères de l article. Nous avons utilisé cette même méthode pour afficher le dernier article directement sur la page d accueil. L utilisateur qui veut consulter l article en entier aura la possibilité de lire la suite grâce à un lien cliquable. Afin que l administrateur puisse gérer les articles, celui-ci doit se connecter avec ses identifiants pour pouvoir ajouter un ou plusieurs articles. Nous avons également créé la possibilité de modifier ou supprimer les articles soit directement depuis la liste soit lors de la visualisation de l article complet. L ajout et la modification des articles se font par le biais d un formulaire. De plus pour la modification, le formulaire récupère les informations de l article à modifier dans les champs correspondants. 10

11 Puis, nous avons mis en place le tableau récapitulatif des dons (Opération 1 =1Km). Pour cela, un tableau de deux colonnes, une pour les noms des donateurs et l autre pour les kilomètres correspondant aux montants perçus, a été inséré dans la page soutien/sponsors. Pour la gestion administrateur du tableau, nous avons utilisé le même principe que pour les articles avec la possibilité d ajouter ou de modifier un don à l aide d un formulaire ou de le supprimer. Dans le cas où le nombre de dons reçus est trop important, nous avons limité la hauteur du tableau et en insérant une «scroll bar» (ascenseur) pour faire défiler la listes des dons. La gestion des articles, plus particulièrement la partie concernant les images n étant pas optimale, il nous a fallu revenir dessus. Il faut tout d abord savoir que les images ne sont pas stockées directement dans la base de données ; celle-ci ne contient que le lien de l image. En effet, à cette étape du projet pour ajouter un article, il fallait entrer le lien courant de l image dans une zone de texte du formulaire après avoir préalablement copié l image dans le dossier de destination. Il nous a donc fallu, en premier lieu, gérer le téléchargement du fichier à partir des dossiers personnels vers le serveur. Toutefois, nous voulions ajouter une nouvelle fonctionnalité à la gestion des articles : la possibilité d y insérer plusieurs images. Pour cela, une nouvelle table était requise car le nombre d images devant être géré dynamiquement, il n était pas possible de le faire avec une seule table. Ne connaissant pas le nombre d images qui figurera sur chaque article, nous avons fait en sorte que le formulaire d ajout (ou de modification) d un article ne contienne au départ seulement qu un champ parcourir. A l aide du langage JavaScript, nous avons créé un lien permettant d insérer un nombre indéfini de champs pour ainsi pouvoir ajouter plusieurs images. Quant à l affichage du résultat, du côté de la liste des articles il n y eu aucun changement, l image figurant à côté de chaque article est le premier à avoir été ajouté. Pour l affichage complet d un article, s il y a plusieurs images, celles-ci sont toutes affichées en dessous du texte. 11

12 Dans le cahier des charges, il nous a été demandé, si nous avions le temps, de créer la possibilité de commenter les articles. Premièrement, nous avons créé la table commentaire. Mais comme le site ne prévoyait pas la possibilité de s enregistrer et de se connecter, il nous a tout simplement fallu insérer un champ proposant au visiteur de s identifier par un pseudonyme et un mail. Le formulaire et tous les commentaires ont finalement été placés en-dessous de l article complet. 12

13 B. LE DESIGN Comme nous l avons mentionné dans la partie programmation, en créant les pages, nous avons fait une mise en forme basique avec des cadrages pour délimiter les différentes zones de chaque page. Nous avons choisi de commencer avec un design basique, de développer les différentes fonctionnalités pour finir avec une mise en forme finale. Sur ce premier design, nous distinguons trois parties séparées, l en-tête (header), le corps composé de sections et d asides et le bas de page (footer). L ensemble possédait un encadrement et était fixe, en partant des conteneurs jusqu aux contenus. Nous avons pour cela paramétré les hauteurs et largeurs avec des valeurs en pixels. Le header contenait le logo de l association avec son nom, le temps de recevoir la bannière destinée à y figurer. Dans le header, on retrouve également le menu créé à partir de simples liens. Pour le bas de page, le cahier des charges proposait le copyright avec le nom des webmasters et un lien vers la page contact. Voici le design de départ : 13

14 Après avoir fini la conception de toutes les fonctionnalités prévues, nous avons utilisé, comme indiqué dans le cahier des charges, pour le design final des couleurs qui nous semblent mieux adaptées avec le fond uni. Pour le menu, nous avons ajouté une bande marron, de sorte que si l utilisateur passe la souris dessus, la page demandée se met en vert et informe ce dernier de la page activée. Avec le logiciel Photoshop, nous avons utilisé la couleur sable du fond pour créer un dégradé que nous avons insérer sur toutes les pages de sorte à pouvoir visualiser les textes avec une réelle facilité de lecture pour l internaute. Puisque dans les différentes pages du site le logo n apparaît pas, une page entière avec le logo cliquable a été ajoutée, celle-ci renvoie à la page d accueil par le biais d un lien. L en-tête a été finalisé avec la bannière. Pour le titre, nous avons gardé le nom de l association et y ajouter celui de l évènement. Le bas de page (footer) étant bref nous avons réduit la police du texte avec une bande en couleur également marron créé à l aide d image qui s adapte avec le fond uni. Afin que l affichage du site se fasse de manière dynamique par rapport à la résolution de l écran de l utilisateur et pour adapter le site sur tout support (tablette, mobile..), nous avons modifié les valeurs du fichier CSS de la largeur, la hauteur et des marges en pourcentages pour chacun des éléments structurant le site web. Ainsi nous avons pu effectuer nos différents tests sur différents navigateurs et en réduisant leur taille. Cependant, le site n étant pas encore ligne, nous ne pouvions pas effectuer nos tests sur les terminaux mobiles à notre disposition. Après quelques recherches sur internet, nous avons trouvé le logiciel Opera Mobile Emulator qui nous a permis de terminer nos tests. 14

15 4. Résultats obtenus Après beaucoup d investissement, nous sommes satisfaits du résultat obtenu qui nous paraît être en adéquation avec le cahier des charges. Néanmoins ce site peut encore énormément évoluer grâce à l ajout de nouvelles fonctionnalités. Ceci dépend des souhaits de l association. 15

16 5. Problèmes rencontrés Programmation Les principaux problèmes rencontrés étaient principalement dus à des erreurs d inattention. Le seul problème qui mériterait d être cité concernait le téléchargement des images pour les articles. Pendant la conception de cette fonctionnalité, nous avons fait nos tests avec de petits fichiers pas très lourds bien que nous avons limité la taille des images pouvant être téléchargées à 5Mb. Mais lorsque des articles réels devant figurer sur le site nous ont été remis avec leurs images, le volume de certains d entre eux dépassait 5 Mb. Nous avons donc rehaussé cette limite à 10Mb. Mais le transfert de l image fut tout de même refusé. C est seulement après quelques recherches que nous avons découvert que WampServer avait également sa propre limite. Dans ce projet, nous avons des fonctionnalités qui sont similaires par exemple l ajout, la suppression et la modification des articles ou des dons. Nous avons mis beaucoup de temps à développer la partie modification. Nous sommes arrivés après avoir parcouru beaucoup de tutoriels à réussir cette fonctionnalité, il restait juste l adaptation du code pour la gestion des dons. Design Pour effectuer les cadrages basiques du 1 er design, il nous a fallu parcourir beaucoup de tutoriels (voir webographie) sur le CSS pour arriver aux objectifs attendus. Concernant le design, la principale difficulté était liée à l adaptation du site pour tout support (mobile, tablette ). De plus, le nombre important de sections ou de tableaux a rendu cette tâche plus difficile. 16

17 IV. PROPOSITIONS D AMELIORATION Un site Internet nécessite toujours une amélioration qui est liée à l évolution de la société et des nouveaux modes de vie. Concernant ce site plusieurs fonctionnalités peuvent être apportées, nous parlerons dans les lignes qui suivent de certaines qui nous viennent en tête. D abord dans la page «Journal de Bord» avec les articles commentés, un recaptcha peut être mis en place pour être sûr que c est bien un humain qui cherche à ajouter un commentaire et non pas un robot qui cherche à envoyer des spammes. Puisque l objectif est d attirer des sponsors qui peuvent venir de partout. Aussi le rallye est international et se déroule à l étranger, nous pensons que la possibilité de récupérer les adresses IP des visiteurs de tout coin qui permettrait d établir des données, serait intéressant pour l association. Dans les forums sur internet, nous pouvons constater l existence de commentaires de tout type. Il serait aussi important d ajouter un autre point celui d ajouter la possibilité de supprimer tous commentaires injurieux. Le rallye étant international avec des participants venant de partout, il serait aussi intéressant de concevoir le site en plusieurs langues. 17

18 V. PLANNING PREVISIONNEL ET REEL L association souhaitait un site internet basique pour informer son public et attirer des nouveaux sponsors. Mais nous voulions prendre un maximum de temps pour effectuer de manière optimale la programmation et le design tout en essayant de tenir les délais. A ce niveau, nous avons, plus ou moins, pu finir toutes les fonctionnalités dans le temps que nous nous étions donnés. Semaine réel semaine n Contexte cahier des charges Base de données Développement et Design Test sur différents terminaux et navigateurs Rapport Soutenance réalisation Prévision 18

19 VI. CONCLUSION Le projet de création de site Web pour cette association n a pas été aussi difficile du fait que cette dernière voulait un site basique qui a pour objectifs d informer son public et attirer des sponsors. S il y a un point qu il fallait réussir tout de même c est la partie «administrateur» pour que les responsables puissent administrer son site Internet sans aucun problème. Nous avons durant la réalisation de ce projet appliqué directement les connaissances acquises en cours. Pour réaliser un travail aussi important, nous avons fait beaucoup de recherches (bibliographie ou webographie) pour atteindre nos objectifs. Nous avons été aussi conscients que ce site peut évoluer dans l avenir et donc il faut vraiment au niveau du développement faire un travail précis et clair afin de faciliter le travail de la personne qui le reprendra. Nous avons réussi de manière efficace l association de plusieurs langages. Pour arriver à ce résultat, nous avons fait preuve de beaucoup de patience pour arriver à coder correctement. La discussion entre collègues de promotion a été aussi bénéfique pour la réalisation de certaines parties du code. La répartition du travail a été efficace car ça nous a permis de respecter les délais de réalisation. Ce projet a été vraiment passionnant et nous sommes fiers de cette réalisation. 19

20 VII. ANNEXES 1. Webographie Langages utilisés : texte -> inspiré de Wikipédia Langages utilisés : image PHP -> source Site du zéro Choix des outils : description WampServer -> source WampServer.com Pour les tutoriels nous nous sommes fait aider des sites suivants : o Site du zéro o Développez.com o PHP débutant o Le manuel PHP en ligne 20

21 2. Cahier des charges site internet Petits princes de l oued L'objectif du site Présenter notre association et notre projet à un public le plus large possible afin de nous faire connaître et attirer les sponsors. Informer le public et les gens qui nous suivent régulièrement de l avancée de notre projet. Cela prendra la forme d'une page «journal de bord» où nous pouvons poster régulièrement des articles avec photo correspondant à nos actualités. Si les articles peuvent être commentables comme sur un blog ca peut être chouette. Sinon on s'en tiendra au facebook pour entretenir une relation avec les gens. Les contenus Nombre de pages estimées : 5 pages 1 accueil 1 journal de bord 1 présentation de l'équipage 1 soutient/sponsors 1 contact L'arborescence DETAIL DES PAGES : => Page d'acceuil : Schéma de la page principale d'accueil : voir schéma site joint. HEADER : - Le logo en haut à gauche (non encore disponible, en cours de numérisation) - <nav> avec 5 liens (contenu détaillé ci-dessous) o Accueil qui est la page principale divisé en articles et aside Présentation du 4L trophy Présentation de notre projet humanitaire Présentation de notre projet écolo etc. o Journal de bord : Page nouvelle avec nos articles au jour le jour, il nous faut donc une possibilité de se connecter au site pour poster un article. o Equipage : Page nouvelle avec une présentation simple de notre équipe technique et de nous environ 10 photos nos motivations 21

22 o sponsors /soutient : pourquoi nous soutenir? les logos de nos sponsors opération 1, 1km : sous forme de tableau avec 1 colonne de km et 1 colonne nom de la personne qui a payé pour la réalisation de ce km. (6000km) doit pouvoir être actualisable à chaque fois que l on reçoit un don. Budget prévisionnel o Contact : Page simple avec adresse siège social etc. BANNIERE L esprit de la bannière c est de mettre en avant le dernier article que l on aura posté sur «journal de bord». Une photo, le titre de l article et un bouton cliquable qui renvoie sur l article complet. ARTICLE 1) Qui sommes nous? Petits Princes de l'oued est une association loi 1901 créée dans un esprit humanitaire, écologique et sportif par Claire Delteil et Rémy Schwartzler. Elle a notamment pour but de participer au 16 ème raid 4L Trophy association loi 1901 = > cliquable et envoi vers 1 document pdf (ci-joint : «association loi 1901.pdf») si possible. 2) Qu est-ce que le 4L Trophy? C'est un raid humanitaire dans le désert marocain mené par des étudiants venus de toute l'europe à bord de Renault 4L. Les maîtres mots de la compétition : DONNER en contribuant au développement du système éducatif marocain par l apport de dons et de matériel scolaire SE DEPASSER dans cette grande aventure pour avancer quelques soient les obstacles RESPECTER la terre d'accueil qu'est le Maroc et son environnement 3) Une asso d esprit écolo? Tous les ans, une dizaine d'équipages sélectionnés par DELOITTE 4L Eco Challenge vont encore plus loin dans leur engagement. Leur objectif? Mener à bien un projet à visée écologique comme l'installation de panneaux solaires et de puits, la plantation d'arbres, la réduction de l'empreinte écologique du rallye, etc. Petits Princes de l'oued souhaite relever ce Challenge et leur projet est actuellement en cours de conception. 22

23 ASIDE Le 4L Trophy en Chiffres : L conduites par 2700 étudiants sont lancées pendant 10 jours sur 6000 km de route et de piste jusqu'à Marrakech. Une équipe technique de plus de 200 personnes dont 50 mécaniciens travaillant jour et nuit sur le bivouac. En 2012 l'opération a permis la création de 3 salles de classes, 3 blocs sanitaires, et la collecte de 63 tonnes de matériel scolaire, relayé par l'association Enfants du Désert. C'est ainsi que depuis 15 ans, plus de enfants ont été scolarisés dans de bonnes conditions. FOOTER Copyright Petits prince de l oued. Webmaster : Julien Lorrain (si t es ok pour que ton nom apparaisse là) Nous contacter (lien cliquable qui renvoie sur la page Contact) => Page journal de bord : Possibilité de poster des articles qui se retrouveraient tous sur la même page avec un affichage dans ordre chronologique type blog; séparés les uns des autres par un encadrement simple. => Page équipage : aside gauche : une photo de Claire («photo_claire») avec un mini texte aside droite : une photo de Rémy («photo_rémy») avec un mini texte au centre : article 1 : photo de l'équipage total + texte article 2 : Coach sportif article 3 : VP info article 4 : VP Folk article 5 : VP Design article 6 : VP Com' article 7 : VP Logistique 23

24 article 8 : VP Relation internationales article 9 : Membre d'honneur => Page sponsors : aside 1 droite : budget prévisionnel : image réduite cliquable et agrandissable si possible. («image_budget») aside 2 droite (en dessous du 1) : opération 1 = 1km : sous forme de tableau avec 1 colonne de km et 1 colonne nom de la personne qui a payé pour la réalisation de ce km. (6000km) doit pouvoir être actualisable à chaque fois que l on reçoit un don. article 1 : pourquoi nous soutenir? Le 4L Trophy est une grande aventure sportive mais également une importante expédition humanitaire. Nous pouvons vous permettre de partager ses valeurs de sérieux, de solidarité et de générosité et de participer à un projet de renommée internationale et à un événement incontournable de la vie étudiante, animé par la motivation incontestable d'étudiants soutenus par l'expérience de professionnels. De plus le 4L Trophy est un événement médiatique de grande importance qui vous permettrait de véhiculez votre image sur les routes franc-comtoises, françaises, espagnoles et marocaines au moyen d'un support publicitaire dynamique et original, notre 4L elle-même, et ce autant avant la course que pendant le raid. Article 2 : logos de nos sponsors images qui seront ajoutée sans texte au fur et à mesure. => Page contact : Petits Princes de l'oued Siège social : 3 route de Lyon, Beure Mail : Claire Delteil 24

25 Rémy Schwartzler Pour plus d'information sur le 4L Trophy : Charte graphique Fond uni : (couleur sable) background-color:#ffffcc Police : - Tous les titres d article/aside : o Color : maroon o Trebuchet o Taille : gros - Les boutons de nav : o trébuchet o Noir o Quand on passe la souris dessus ca les souligne et les met en maroon o Taille : moyen - Texte d article : o Trébuchet o Noir o Taille : petit Le nom du site Si possible petitsprincesdeloued. Nom de domaine.fr,.com,.net, etc comme c'est possible. 25

Ce code peut s insérer à plusieurs endroits entre les balises head (le plus souvent) ou directement à l intérieur des balises body.

Ce code peut s insérer à plusieurs endroits entre les balises head (le plus souvent) ou directement à l intérieur des balises body. A/ Utilisation de Javascript UE Libre : Internet et composition de pages Web TP n 3 Le Javascript est un langage de script incorporé dans un document HTML. Historiquement il s'agit même du premier langage

Plus en détail

Aide à l utilisation du logiciel IziSpot.Mobi

Aide à l utilisation du logiciel IziSpot.Mobi 1 Sommaire 1. Description logiciel (explication des menus)... 3 1.1. Description de la barre de menu... 3 2. Onglet configuration... 4 2.1. Gestion du logo... 4 2.1.1. Affichage du zoom... 4 2.1.2. Disposition

Plus en détail

Rapport de stage. Création d un site web. Stage du 20/01/2013 au 21/02/2013

Rapport de stage. Création d un site web. Stage du 20/01/2013 au 21/02/2013 Rapport de stage Création d un site web Stage du 20/01/2013 au 21/02/2013 Auteur : Antoine Luczak Tuteur professionnel : M. Tison Tuteur scolaire : Mme Girondon Année scolaire : 2013/2014 1 Table des matières

Plus en détail

CATALOGUE DES FORMATIONS

CATALOGUE DES FORMATIONS CATALOGUE DES FORMATIONS WEB / GRAPHISME ADOBE ACROBAT PRO... 1 ADOBE PHOTOSHOP... 2 ADOBE INDESIGN... 3 ADOBE DREAMWEAVER... 4 ARTISTEER... 5 PREZI... 6 LE LANGAGE HTML... 7 LES FEUILLES DE STYLE CSS...

Plus en détail

ARCHITECTURE CLIENT / SERVEUR

ARCHITECTURE CLIENT / SERVEUR ARCHITECTURE CLIENT / SERVEUR ARCHITECTURE CLIENT/SERVEUR Définition : L'architecture client serveur s'appuie sur un poste central, le serveur, qui envoit des données aux machines clientes. Des programmes

Plus en détail

Sommaire : Pourquoi créer un site web? Qu est-ce qu un site Web? Les différents types de sites. Quelles solutions peuvent être employées?

Sommaire : Pourquoi créer un site web? Qu est-ce qu un site Web? Les différents types de sites. Quelles solutions peuvent être employées? Sommaire : Pourquoi créer un site web? Qu est-ce qu un site Web? Les différents types de sites Quelles solutions peuvent être employées? Présentation d une des solutions Conclusion Aujourd hui le web est

Plus en détail

Site web pour les Trompes du Débuché de Céry

Site web pour les Trompes du Débuché de Céry Richardot Émilian Laissue Mathieu Année 2014/2015 Site web pour les Trompes du Débuché de Céry Licence informatique 3 ème année Responsable de projet : Jean-Christophe Lapayre Sommaire Introduction...4

Plus en détail

INTEGRATEUR DEVELOPPEUR

INTEGRATEUR DEVELOPPEUR www.emweb.fr INTEGRATEUR DEVELOPPEUR FORMATION ELIGIBLE AU DIF/CIF DURÉE : 700 h de formation PRE REQUIS Avoir un esprit logique Etre motivé(e)! OBJECTIF A l issue de cette formation, vous serez capable

Plus en détail

INTERNET est un RESEAU D ORDINATEURS RELIES ENTRE EUX A L ECHELLE PLANETAIRE. Internet : interconnexion de réseaux (anglais : net = réseau)

INTERNET est un RESEAU D ORDINATEURS RELIES ENTRE EUX A L ECHELLE PLANETAIRE. Internet : interconnexion de réseaux (anglais : net = réseau) CS WEB Ch 1 Introduction I. INTRODUCTION... 1 A. INTERNET INTERCONNEXION DE RESEAUX... 1 B. LE «WEB» LA TOILE, INTERCONNEXION DE SITES WEB... 2 C. L URL : LOCALISER DES RESSOURCES SUR L INTERNET... 2 D.

Plus en détail

Créez votre premier site web De la conception à la réalisation

Créez votre premier site web De la conception à la réalisation Chapitre 1 : Introduction A. Introduction 17 Chapitre 2 : Les langages A. L objectif 21 B. L HTML 21 1. L état des lieux 21 2. Les éléments HTML 21 3. Les attributs 22 4. Les caractères 23 5. Les espaces

Plus en détail

4. Personnalisation du site web de la conférence

4. Personnalisation du site web de la conférence RTUTORIEL Prise en main de la plateforme 1. Création de l espace conférence Connectez- vous sur le portail http://test- www.sciencesconf.org avec le compte : - Identifiant : «admin1» - Mot de passe «1234»

Plus en détail

Optimiser pour les appareils mobiles

Optimiser pour les appareils mobiles chapitre 6 Optimiser pour les appareils mobiles 6.1 Créer un site adapté aux terminaux mobiles avec jquery Mobile... 217 6.2 Transformer son site mobile en application native grâce à PhoneGap:Build...

Plus en détail

SITE WEB. Définition. Ensemble de fichiers reliés entre eux et déposés sur un serveur internet. Ordinateur connecté au réseau

SITE WEB. Définition. Ensemble de fichiers reliés entre eux et déposés sur un serveur internet. Ordinateur connecté au réseau SITE WEB Définition Ensemble de fichiers reliés entre eux et déposés sur un serveur internet. Ordinateur connecté au réseau Comment mon site est sur internet Je crée mon site sur mon ordinateur, en local.

Plus en détail

OFFRE DE SERVICE. www.votreentreprise.com

OFFRE DE SERVICE. www.votreentreprise.com 2011 NOM ENTREPRISE OFFRE DE SERVICE CONCEPTION, REALISATION ET HEBERGEMENT SITE WEB www.votreentreprise.com AFConsulting Web Services Page 1 sur 19 SOMMAIRE Lettre, offre de services --------------------------------------------

Plus en détail

Evolutions du Web et des langages

Evolutions du Web et des langages Evolutions du Web Evolutions du Web et des langages WEB statique Ces pages sont écrites en HTML Les pages demandées sont identiques quelque soit La personne qui les demande L heure de la demande Etc. WEB

Plus en détail

Chapitre 2 Créer son site et ses pages avec Google Site

Chapitre 2 Créer son site et ses pages avec Google Site Réaliser un site internet à l aide de Google Site 10 Chapitre 2 Créer son site et ses pages avec Google Site 1. Créer un Google site 1. Rendez-vous sur www.google.be et connectez-vous à votre compte Gmail

Plus en détail

TUTORIAL. www.benevolat.org TUTORIAL. Créez en quelques minutes votre site Internet!

TUTORIAL. www.benevolat.org TUTORIAL. Créez en quelques minutes votre site Internet! Créez en quelques minutes votre site Internet! SOMMAIRE : Choisir une interface graphique - Nommez votre site... page 03 5 étapes de création... page 04 Les outils de création graphique... page 05 Mise

Plus en détail

Le logiciel de création de site internet IZISPOT est un outil très puissant et qui est assez simple après quelques temps d utilisation.

Le logiciel de création de site internet IZISPOT est un outil très puissant et qui est assez simple après quelques temps d utilisation. 1 Le logiciel de création de site internet IZISPOT est un outil très puissant et qui est assez simple après quelques temps d utilisation. Voici un mode opératoire qui vous guidera dans l utilisation de

Plus en détail

REFONTE DU SITE DE LA FEDERATION ALGERIENNE DE FOOTBALL

REFONTE DU SITE DE LA FEDERATION ALGERIENNE DE FOOTBALL REFONTE DU SITE DE LA FEDERATION ALGERIENNE DE FOOTBALL CAHIER DES CHARGES TECHNIQUE Client Fédération Algérienne de Football (FAF) Chef de projet WEBQAM Marine CHARLES Solution retenue WordPress multilingue

Plus en détail

Guide de démarrage Débuter avec e-monsite Les termes spécifiques à e-monsite

Guide de démarrage Débuter avec e-monsite Les termes spécifiques à e-monsite Guide de démarrage Débuter avec e-monsite... page 2 Les termes spécifiques à e-monsite... page 2 Le manager... page 2 Les modules... page 3 Les widgets... page 3 Les plugins... page 4 Ajouter du contenu...

Plus en détail

Introduction à Dreamweaver CS4

Introduction à Dreamweaver CS4 Introduction à Dreamweaver CS4 Adobe Dreamweaver (anciennement Macromedia Dreamweaver) est un éditeur de site web de type «tel écrit tel écran» (cette formule remplaçant désormais dans la terminologie

Plus en détail

Administration du site (Back Office)

Administration du site (Back Office) Administration du site (Back Office) A quoi sert une interface d'administration? Une interface d'administration est une composante essentielle de l'infrastructure d'un site internet. Il s'agit d'une interface

Plus en détail

Chapitre 1 Créer votre site web avec Dreamweaver 8 11

Chapitre 1 Créer votre site web avec Dreamweaver 8 11 Chapitre 1 Créer votre site web avec Dreamweaver 8 11 1.1. Installer Dreamweaver sur votre ordinateur... 12 1.2. Découvrir l interface de Dreamweaver... 15 La manipulation de l interface... 16 La gestion

Plus en détail

CAHIER DES CHARGES. La fiche technique

CAHIER DES CHARGES. La fiche technique CAHIER DES CHARGES La fiche technique Nom du domaine : Le choix d'un hébergeur gratuit ou de l'achat d'un nom de domaine du type www.triangle.com est à faire. (voir la fiche info pour les prix). Architecture

Plus en détail

Introduction à Dreamweaver

Introduction à Dreamweaver Introduction à Dreamweaver Dreamweaver est un logiciel d édition de page web. Un site est un ensemble de pages [souvent en format html, ce qui signifie HyperText Markup Language, reliées entre elles par

Plus en détail

NOTICE D UTILISATION DE L ESPACE COLLABORATIF (POUR LES COLLABORATEURS)

NOTICE D UTILISATION DE L ESPACE COLLABORATIF (POUR LES COLLABORATEURS) NOTICE D UTILISATION DE L ESPACE COLLABORATIF (POUR LES COLLABORATEURS) Qu est-ce que l espace collaboratif? L espace collaboratif est un service vous permettant à vous, vos associés et collaborateurs

Plus en détail

Formation Webmaster : Création de site Web Initiation + Approfondissement

Formation Webmaster : Création de site Web Initiation + Approfondissement Contactez notre équipe commerciale au 09.72.37.73.73 Aix en Provence - Bordeaux - Bruxelles - Geneve - Lille - Luxembourg - Lyon - Montpellier - Nantes - Nice - Paris - Rennes - Strasbourg - Toulouse Formation

Plus en détail

Savoir utiliser les services de l ENT Outils pédagogiques SOMMAIRE

Savoir utiliser les services de l ENT Outils pédagogiques SOMMAIRE Savoir utiliser les services de l ENT Outils pédagogiques 1 Outils pédagogiques 1. Utiliser le cahier de textes 2. Utiliser le classeur pédagogique 3. Utiliser les formulaires 4. Utiliser les ressources

Plus en détail

Guide Ultra-book / 2012

Guide Ultra-book / 2012 Guide Ultra-book / 2012 Avant de commencer Le logiciel Ultra-book est optimisé pour les derniers navigateurs web standards : Firefox 10 ou 11 Chrome 18 Safari 5 Vous trouverez ces navigateurs en téléchargement

Plus en détail

//////////////////////////////////////////////////////////////////// Développement Web

//////////////////////////////////////////////////////////////////// Développement Web ////////////////////// Développement Web / INTRODUCTION Développement Web Le développement, également appelé programmation, désigne l'action de composer des programmes sous forme d'algorithme (codage).

Plus en détail

Formation au logiciel Typo3, pour les rédacteurs.

Formation au logiciel Typo3, pour les rédacteurs. 1 Formation au logiciel Typo3, pour les rédacteurs. 1 Accéder au système 2 1.1 Configuration du navigateur 2 1.2 Identification 2 2 L interface 2 2.1 Le module Web 3 2.2 Le module Media 3 2.3 Le module

Plus en détail

RAPPORT DE PROJET SITE INTERNET DE L ASSOCIATION

RAPPORT DE PROJET SITE INTERNET DE L ASSOCIATION RAPPORT DE PROJET SITE INTERNET DE L ASSOCIATION Léonard STRONG Licence Professionnelle «Réseaux, Informatique Répartie et Multimédia» Promotion 2001-2002, UFR d Informatique, Université Pierre et Marie

Plus en détail

MANUEL D UTILISATION DU SITE INTERNET (PUBLIER) Chapitre 18 : Remplir les champs pour une information, un récit,

MANUEL D UTILISATION DU SITE INTERNET (PUBLIER) Chapitre 18 : Remplir les champs pour une information, un récit, MANUEL D UTILISATION DU SITE INTERNET (PUBLIER) Chapitre 18 : Remplir les champs pour une information, un récit, (Nous ne ferons ici pas de rappel à d autres chapitres, sans quoi, chaque ligne écrite mériterait

Plus en détail

BOTZ ARIS MANUEL D UTILISATION. Gaëtan Pineau gaetan.pineaupi@orange.fr www.pineaupi.perso.cegetel.net

BOTZ ARIS MANUEL D UTILISATION. Gaëtan Pineau gaetan.pineaupi@orange.fr www.pineaupi.perso.cegetel.net BOTZ ARIS MANUEL D UTILISATION Gaëtan Pineau gaetan.pineaupi@orange.fr www.pineaupi.perso.cegetel.net INTRODUCTION Botz Aris est une galerie d albums photos. Elle permet le partage en ligne de différents

Plus en détail

CFADFrancophone.org GUIDE DE JOOMLA 2.5 Dr René-Yves HERVÉ 06-05-2012

CFADFrancophone.org GUIDE DE JOOMLA 2.5 Dr René-Yves HERVÉ 06-05-2012 CFADFrancophone.org GUIDE DE JOOMLA 2.5 Dr René-Yves HERVÉ 06-05-2012 Ce guide est un résumé des principales fonctionnalités du Système de Gestion de contenus «Joomla» (CMS pour Content Management System)

Plus en détail

WordPress : Guide à l édition

WordPress : Guide à l édition WordPress : Guide à l édition WordPress : Guide à l édition... 1 Présentation... 2 1. Accès au site... 2 2. Le tableau de bord... 2 3. Editez les contenus... 4 Quelle est la différence entre les pages

Plus en détail

Les outils du Web* : comment ça marche et à quoi ça sert?

Les outils du Web* : comment ça marche et à quoi ça sert? Sites Web Les outils du Web* : comment ça marche et à quoi ça sert? Sites marchands, e-commerce Forums Blogs Réseaux sociaux grand public : Facebook, Twitter Réseaux sociaux professionnels : Linkedin,

Plus en détail

Diffuser un contenu sur Internet : notions de base... 13

Diffuser un contenu sur Internet : notions de base... 13 Diffuser un contenu sur Internet : notions de base... 13 1.1 Coup d œil sur l organisation de cet ouvrage.............. 15 Préambule : qu est-ce qu une page web?................ 16 À propos du HTML...........................

Plus en détail

Joomla! Création et administration d'un site web - Version numérique

Joomla! Création et administration d'un site web - Version numérique Avant-propos 1. Objectifs du livre 15 1.1 Orientation 15 1.2 À qui s adresse ce livre? 16 2. Contenu de l ouvrage 17 3. Conclusion 18 Introduction 1. Un peu d histoire pour commencer... 19 1.1 Du web statique

Plus en détail

ADMINISTRATION DU PORTAIL AFI OPAC 2.0 V3 AFI OPAC 2.0

ADMINISTRATION DU PORTAIL AFI OPAC 2.0 V3 AFI OPAC 2.0 ADMINISTRATION DU PORTAIL AFI OPAC 2.0 V3 AFI OPAC 2.0 V3 Sommaire Sommaire... 2 Note :... 2 Quelques Notions... 3 Profil :... 3 Pages :... 5 Créer du contenu... 6 Identification de l administrateur :...

Plus en détail

David Prud homme Lacroix Radouan Faïd Van Khue Nguyen Sata Nambinina Randrianomenjanaharimanana. Compte rendu : AlloPlomberie

David Prud homme Lacroix Radouan Faïd Van Khue Nguyen Sata Nambinina Randrianomenjanaharimanana. Compte rendu : AlloPlomberie Aurélien Orts David Prud homme Lacroix Radouan Faïd Van Khue Nguyen Sata Nambinina Randrianomenjanaharimanana Licence NTI Compte rendu : AlloPlomberie SOMMAIRE I. Introduction II. Présentation du projet

Plus en détail

Un portail-cdi avec Google.

Un portail-cdi avec Google. Un portail-cdi avec Google. Le moteur de recherche Google, tout le monde connaît. Mais Google c est aussi un ensemble de services souvent gratuits tels qu une messagerie (Gmail), un agenda en ligne, la

Plus en détail

Création d un catalogue en ligne

Création d un catalogue en ligne 5 Création d un catalogue en ligne Au sommaire de ce chapitre Fonctionnement théorique Définition de jeux d enregistrements Insertion de contenu dynamique Aperçu des données Finalisation de la page de

Plus en détail

Ges3on de projet internet INA CPD 2014-2015

Ges3on de projet internet INA CPD 2014-2015 Ges3on de projet internet INA CPD 2014-2015 Auteur Magali Guyon Fiat Lux www.fiatlux.fr 1 Fiche pratique : la base d un site internet, le HTML et le css Structure d'une page HTML L Hypertext Markup Language,

Plus en détail

Procédures CreaWEB Guide pratique

Procédures CreaWEB Guide pratique Procédures CreaWEB Guide pratique Pour vous connecter Dans la barre d adresse d Internet, tapez www.votrenomdedomaine.com/admin Entrez votre nom d utilisateur : Votre mot de passe : Premier coup d œil

Plus en détail

OMI TP 2 : Outils numériques pour l apprentissage

OMI TP 2 : Outils numériques pour l apprentissage OMI TP 2 : Outils numériques pour l apprentissage Introduction aux Google Docs Google Documents permet de créer, stocker dans l internet et partager facilement des documents. Des outils collaboratifs permettent

Plus en détail

2 LES BASES DU HTML 19 Qu est-ce que le HTML? 20 De quand date le HTML? 20 Écrire son propre code HTML 22

2 LES BASES DU HTML 19 Qu est-ce que le HTML? 20 De quand date le HTML? 20 Écrire son propre code HTML 22 SOMMAIRE INTRODUCTION La collection Classroom in a Book TinyUrL Conditions requises Installation du programme Copie des fichiers Classroom in a Book ordre recommandé pour les leçons Démarrage instantané

Plus en détail

Formation à l administration de votre site Internet

Formation à l administration de votre site Internet Rédacteur : B2F Concept Date : 01/08/2012 Destinataire : Mairie de Drumettaz Formation à l administration de votre site Internet Introduction...2 Connexion à l administration...2 Gestion de contenu...3

Plus en détail

Version 4.0. Multinet Ressources Inc. Page 1 sur 13

Version 4.0. Multinet Ressources Inc. Page 1 sur 13 Version 4.0 Page 1 sur 13 Introduction Lorsque vous obtenez l accès à Méganet, votre site est déjà construit. C est-à-dire qu il a fait l objet d une étude de style selon les couleurs de votre entreprise

Plus en détail

de survie du chef de projet

de survie du chef de projet KIT de survie du chef de projet 01 1 2 3 4 5 6 04 03 07 07 03 03 LE SERVEUR LE CLIENT TECHNOLOGIE WEB CLIENT LE SERVEUR WEB TECHNIQUES & CADRE DE TRAVAIL APPLICATIONS 101 LE SERVEUR Un serveur informatique

Plus en détail

Félicitation, votre site est créé!

Félicitation, votre site est créé! Guide de démarrage e-monsite.com Félicitation, votre site est créé! Vous avez fait le plus difficile. A présent, découvrez comment administrer votre site web. 1 Comprendre l interface du manager de votre

Plus en détail

Vous devez IMPERATIVEMENT installer et utiliser ce navigateur

Vous devez IMPERATIVEMENT installer et utiliser ce navigateur GUIDE d utilisation Logiciels requis Les logiciels requis 3 Vous devez IMPERATIVEMENT installer et utiliser ce navigateur Mozilla Firefox (version minimum 2.0). L utilisation du navigateur Mozilla Firefox

Plus en détail

PHP/MySQL avec Dreamweaver CS4

PHP/MySQL avec Dreamweaver CS4 PHP/MySQL avec Dreamweaver CS4 Dreamweaver CS4 Jean-Marie Defrance Groupe Eyrolles, 2009, ISBN : 978-2-212-12551-1 7 Étude de cas : un site marchand Dans ce dernier chapitre, nous allons exploiter Dreamweaver

Plus en détail

Les sites Internet dynamiques. contact : Patrick VINCENT pvincent@erasme.org

Les sites Internet dynamiques. contact : Patrick VINCENT pvincent@erasme.org Les sites Internet dynamiques contact : Patrick VINCENT pvincent@erasme.org Qu est-ce qu un site Web? ensemble de pages multimédia (texte, images, son, vidéo, ) organisées autour d une page d accueil et

Plus en détail

CAHIER DE CHARGE O PRESENTATION DU PROJET O PARTIE DYNAMIQUE OBJECTIFS PUBLIC VISE USE CASE NOUBTY

CAHIER DE CHARGE O PRESENTATION DU PROJET O PARTIE DYNAMIQUE OBJECTIFS PUBLIC VISE USE CASE NOUBTY 1 1 2 CAHIER DE CHARGE O PRESENTATION DU PROJET OBJECTIFS Notre projet a pour but d'informer le client en attente, sur la progression de la file d'attente à travers une interface simple et performante

Plus en détail

Bureautique Initiation Excel-Powerpoint

Bureautique Initiation Excel-Powerpoint Module de Formation Personnalisée : Bureautique Initiation Excel-Powerpoint Durée : jours ouvrables Prix : Formation personnalisée en vue d obtenir les notions de base indispensables pour : Excel Office

Plus en détail

Guide d utilisation COMMENT ÇA MARCHE? LISTE DES PRINCIPALES FONCTIONNALITÉS DISPONIBLES DANS MOODLE A L UQAC

Guide d utilisation COMMENT ÇA MARCHE? LISTE DES PRINCIPALES FONCTIONNALITÉS DISPONIBLES DANS MOODLE A L UQAC Guide d utilisation Moodle version 2.4 est une plate-forme d'apprentissage en ligne (e-learning en anglais) servant à créer des communautés d'apprenants autour de contenus et d'activités pédagogiques.

Plus en détail

Cahier des Charges. Nom de l entreprise : Neriah Jewels Personnes à contacter dans l entreprise : Sébastien et Vincent SOMMAIRE

Cahier des Charges. Nom de l entreprise : Neriah Jewels Personnes à contacter dans l entreprise : Sébastien et Vincent SOMMAIRE Cahier des Charges Nom de l entreprise : Neriah Jewels Personnes à contacter dans l entreprise : Sébastien et Vincent SOMMAIRE 1 PRESENTATION DE L ENTREPRISE... 2 PRESENTATION DU PROJET... 2.1 ROLES...

Plus en détail

Webmaster / Concepteur Multimedia

Webmaster / Concepteur Multimedia Durée : 217 heures Objectifs : Webmaster / Concepteur Multimedia Participants : Toute personne attirée par la création de site internet professionnel. Méthodes : Mise en pratique sur micro-ordinateur.

Plus en détail

NVU, Notepad++ (ou le bloc-note), MySQL, PhpMyAdmin. HTML, PHP, cas d utilisation, maquettage, programmation connaissances en HTML, PHP et SQL

NVU, Notepad++ (ou le bloc-note), MySQL, PhpMyAdmin. HTML, PHP, cas d utilisation, maquettage, programmation connaissances en HTML, PHP et SQL Prise en main de NVU et Notepad++ (conception d application web avec PHP et MySql) Propriétés Intitulé long Formation concernée Matière Présentation Description Conception de pages web dynamiques à l aide

Plus en détail

Créer des pages WEB à l aide de KompoZer.

Créer des pages WEB à l aide de KompoZer. Document élève 1/14 Créer des pages WEB à l aide de KompoZer. Document élève 2/14 INTERNET : CREATION D UN SITE PRESENTATION Un site web (aussi appelé site internet par abus de langage) est un ensemble

Plus en détail

THEME RESPONSIVE DESIGN

THEME RESPONSIVE DESIGN THEME RESPONSIVE DESIGN Tablettes, smartphones, netbooks, ordinateurs les résolutions d écrans sont nombreuses. Adaptez vous aux nouvelles habitudes des utilisateurs en étant visible de façon optimale.

Plus en détail

Créer du contenu en ligne avec WordPress

Créer du contenu en ligne avec WordPress Créer du contenu en ligne avec WordPress La création d un blog ne demande pas de compétences particulières en informatique ou en développement. Wordpress vous permet de créer un blog via un compte en ligne

Plus en détail

Manuel de modifications des modèles

Manuel de modifications des modèles Manuel de modifications des modèles Contenu Avant propos...2 Introduction...2 Les 4 niveaux...2 Préparation...2 Quoi et pourquoi...2 Comment...2 Nommer les modèles modifiés...4 Niveau 1 Images...4 Quoi...4

Plus en détail

COURS PRATIQUE DE WORD

COURS PRATIQUE DE WORD COURS PRATIQUE DE WORD Le présent cours se rapporte à Word 2003. Sachez qu il existe d autres versions de cet outil. Il y a Office Pro, Office 2000, Office 2003, 2007 et 2010 (non commercialisé à ce jour).

Plus en détail

SOUTENANCE ORALE RAPPORT DE PROJET D INFORMATIQUE

SOUTENANCE ORALE RAPPORT DE PROJET D INFORMATIQUE SOUTENANCE ORALE RAPPORT DE PROJET D INFORMATIQUE SITE INTERNET DE L ASSOCIATION Diapositive 1 RAPPORT DE PROJET Site internet de l association INTRODUCTION 1) Je m appelle Léonard STRONG. 2) Oral de présentation

Plus en détail

Créer et faire vivre un site web pédagogique

Créer et faire vivre un site web pédagogique Créer et faire vivre un site web pédagogique 1. Créer un site web... 2 2. Utilisation d un CMS... 2 3. SPIP : Système de Publication Internet Partagé... 2 4. Le site de la Cité Scolaire Jean Moulin...

Plus en détail

Réaliser une page du site http://la-ba.lyceegutenberg.net

Réaliser une page du site http://la-ba.lyceegutenberg.net Réaliser une page du site http://la-ba.lyceegutenberg.net Réaliser une page du site http://la-ba.lyceegutenberg.net Récupérer les éléments récupérer sur le bureau de votre ordinateur à partir du serveur

Plus en détail

ContactForm et ContactFormLight - Gestionnaires de formulaire pour Prestashop Edité par ARETMIC S.A.

ContactForm et ContactFormLight - Gestionnaires de formulaire pour Prestashop Edité par ARETMIC S.A. ContactForm et ContactFormLight - Gestionnaires de formulaire pour Prestashop Edité par ARETMIC S.A. - 1 - PREAMBULE Les conditions générales d utilisation détaillant l ensemble des dispositions applicables

Plus en détail

Publier des données sur le Web

Publier des données sur le Web Publier des données sur le Web Introduction Microsoft Excel fournit les outils dont vous avez besoin pour créer et enregistrer votre classeur sous forme d une page web et le publier sur le Web. La commande

Plus en détail

Premières applications. Web 2.0. avec Ajax et PHP. J e a n - M a r i e D e f r a n c e. Groupe Eyrolles, 2008, ISBN : 978-2-212-12090-5

Premières applications. Web 2.0. avec Ajax et PHP. J e a n - M a r i e D e f r a n c e. Groupe Eyrolles, 2008, ISBN : 978-2-212-12090-5 Premières applications Web 2.0 avec Ajax et PHP J e a n - M a r i e D e f r a n c e Groupe Eyrolles, 2008, ISBN : 978-2-212-12090-5 8 Applications Ajax-PHP synchrones Pour commencer simplement, je vous

Plus en détail

La Programmation Web avec PHP

La Programmation Web avec PHP Nouvelle page 1 La Programmation Web avec PHP Qu'est-ce que php? Menu Qu'est ce que php? Les scripts PHP Installation de PHP Configuration d'un serveur IIS Mohamed SIDIR PHP est un langage de script HTML,

Plus en détail

BTS SIO. Session 2013 2015

BTS SIO. Session 2013 2015 BTS SIO Services Informatiques aux Organisations Session 2013 2015 Collé Maxime Année 2013-2014 Option : SLAM Activité professionnelle N 1 NATURE DE L'ACTIVITE : DÉVELOPPEMENT DE L APPLICATION WEB «GESTION

Plus en détail

Sorin Lucas Ricou Sander. Rapport de projet SI28

Sorin Lucas Ricou Sander. Rapport de projet SI28 Sorin Lucas Ricou Sander A14 Rapport de projet SI28 1 I. Concept Application web permettant la création d une vidéo virale type «NyanCat». L utilisateur aura à sa disposition des musiques, des fonds, des

Plus en détail

Réaliser une carte de vœux

Réaliser une carte de vœux Réaliser une carte de vœux - 6 janvier 2014 p 1 Réaliser une carte de vœux Un petit tutoriel de saison, qui utilisera les connaissances acquises autour de la gestion de vos photos, et le logiciel libre

Plus en détail

Configurer GuppY. L interface d administration présente quatre zones bien distinctes plus deux boutons de déconnexion.

Configurer GuppY. L interface d administration présente quatre zones bien distinctes plus deux boutons de déconnexion. Configurer GuppY L interface d administration présente quatre zones bien distinctes plus deux boutons de déconnexion. 1) La zone «Configuration skin» : 2) La zone «Administration générale» : 3) La zone

Plus en détail

Guide de l administrateur de rubriques du site communal d ORCHAISE

Guide de l administrateur de rubriques du site communal d ORCHAISE Guide de l administrateur de rubriques du site communal d ORCHAISE Sommaire Comment est organisé le site?... 1 Comment accéder à l interface privée?... 2 Comment se connecter?... 2 Comment modifier son

Plus en détail

Site Web du DMI : explication de code

Site Web du DMI : explication de code Site Web du DMI : explication de code I. Présentation de l arborescence du site /Site_DMI_08/ Répertoire racine du site web. /Site_DMI_08/images/ Ce dossier comporte toutes les images utilisées dans le

Plus en détail

Je me familiarise avec l ordinateur et son système d exploitation. Apprendre à utiliser les TIC dans la vie de tous les jours

Je me familiarise avec l ordinateur et son système d exploitation. Apprendre à utiliser les TIC dans la vie de tous les jours Je me familiarise avec l ordinateur et son système d exploitation Cahier de formation 1 Apprendre à utiliser les TIC dans la vie de tous les jours Programme ordinateur de Je Passe Partout Document produit

Plus en détail

Préface 3. Conventions typographiques... 3 Feedback... 4. Introduction 5. Se familiariser avec l'interface de SiteBuilder 6. Créer un site Web 8

Préface 3. Conventions typographiques... 3 Feedback... 4. Introduction 5. Se familiariser avec l'interface de SiteBuilder 6. Créer un site Web 8 Parallels Panel Table des matières Préface 3 Conventions typographiques... 3 Feedback... 4 Introduction 5 Se familiariser avec l'interface de SiteBuilder 6 Créer un site Web 8 Editer un site Web 9 Utiliser

Plus en détail

Scolasite.net, le créateur de site web au service des enseignants. Guide d'administration du site Internet. Page 1

Scolasite.net, le créateur de site web au service des enseignants. Guide d'administration du site Internet. Page 1 Guide d'administration du site Internet Page 1 Scolasite permet de créer rapidement un site Internet, sans connaissances techniques particulières. Spécialement destiné aux établissements scolaires, son

Plus en détail

Diderot Manuel utilisateur

Diderot Manuel utilisateur Diderot Manuel utilisateur LOGIPRO : 2 rue Pierret Cité Négocia 43000 Le Puy Tél. : 04 71 09 15 53 Fax : 04 69 96 06 25 E-mail : logipro@logipro.com Site web :www.logipro.com TABLE DES AUTEURS/LECTEURS

Plus en détail

Documentation de CMS-gen

Documentation de CMS-gen Table des matières GÉNÉRALITÉ... 1 LA ZONE D'ADMINISTRATION... 2 LOGIN SUR LA ZONE D ADMINISTRATION... 2 EDITION DU CONTENU EN LIGNE... 3 LE MODE EDITION... 3 PUBLICATION... 3 SUPPRIMER DES MODIFICATIONS...

Plus en détail

GUIDE DE DEMARRAGE RAPIDE:

GUIDE DE DEMARRAGE RAPIDE: GUIDE DE DEMARRAGE RAPIDE: COMMENT CREER VOTRE BOUTIQUE EN LIGNE Vous voulez créer votre propre boutique en ligne? C est désormais plus simple que jamais. Suivez simplement les instructions de ce guide

Plus en détail

Introduction JOOMLA. Fonctionnalités. Avantages. Hainaut P. 2013 - www.coursonline.be 1. Joomla est un système de gestion de contenu CMS open source

Introduction JOOMLA. Fonctionnalités. Avantages. Hainaut P. 2013 - www.coursonline.be 1. Joomla est un système de gestion de contenu CMS open source JOOMLA Introduction Joomla est un système de gestion de contenu CMS open source Il permet la conception rapide de sites Web avec une présentation soignée et une navigation très simple C est l outil idéal

Plus en détail

FPSE, TECFA, Université de Genève Atelier «Utilisation de portails» Guide D utilisation

FPSE, TECFA, Université de Genève Atelier «Utilisation de portails» Guide D utilisation FPSE, TECFA, Université de Genève Atelier «Utilisation de portails» Guide D utilisation Des Outils Du Portail d Echanges et de Communication «La Voix des Jeunes» Terre Des Hommes Genève Terre des Hommes

Plus en détail

Collège Pie10. www.danielpie10.be/site.php

Collège Pie10. www.danielpie10.be/site.php Collège Pie10 www.danielpie10.be/site.php Daniel Massart Février 2007 Sommaire 1 OBJECTIFS 1 2 TYPES DE SITES 1 2.1 Les blogs 1 2.2 Les sites «bibliothèques» 2 2.3 Les sites statiques classiques 2 2.4

Plus en détail

Système de Gestion de Contenu

Système de Gestion de Contenu Système de Gestion de Contenu un site web? facile! Sommaire 1 - Présentation 3 2 - Installation 6 3 - Interface de Gestion de Contenu 3.1 - Présentation générale 10 3.2 - Administration 15 3.3 - Menus

Plus en détail

FORMATION EXCEL 2013. Livret 2 Faire des tableaux (pour débutant) THIERRY TILLIER. Produit et diffusé par coursdinfo.fr

FORMATION EXCEL 2013. Livret 2 Faire des tableaux (pour débutant) THIERRY TILLIER. Produit et diffusé par coursdinfo.fr FORMATION EXCEL 2013 Livret 2 Faire des tableaux (pour débutant) THIERRY TILLIER Produit et diffusé par coursdinfo.fr Ce support de cours est réservé à un usage personnel. Toute utilisation et diffusion

Plus en détail

Le service de création de site Internet : Mode d emploi. La Création de Site Internet

Le service de création de site Internet : Mode d emploi. La Création de Site Internet Le service de création de site Internet : Mode d emploi Sommaire 1) Comment se connecter à votre interface client? 2) Comment démarrer la création de votre site Internet? 3) Comment gérer les pages de

Plus en détail

Présentation de Microsoft PowerPoint 2010

Présentation de Microsoft PowerPoint 2010 Université du Havre UFR des Sciences et Techniques Date : 26/08/2012 Version : 1.0 Nombre de pages : 27 COURS Microsoft Office 2010 Titre du document Présentation de Microsoft PowerPoint 2010 Noms Dates

Plus en détail

La mise en page web, feuille de style, cadre.

La mise en page web, feuille de style, cadre. La mise en page web, feuille de style, cadre. L importance du navigateur, son rôle est de lire le code HTML et CSS afin d afficher un résultat visuel à l écran, le problème est que les navigateurs n affichent

Plus en détail

L OMD présente CLiKC! Guide de connexion et d accès destiné aux utilisateurs

L OMD présente CLiKC! Guide de connexion et d accès destiné aux utilisateurs L OMD présente CLiKC! Guide de connexion et d accès destiné aux utilisateurs 1/25 SOMMAIRE 1. INTRODUCTION... 3 COMMENT UTILISER CE GUIDE... 3 REMARQUE... 3 2. QUELS SONT LES PRE REQUIS TECHNIQUES?...

Plus en détail

Projet Web. Tim Burton. Refonte complète du site de Tim Burton en utilisant les dernières technologies du web : HTML 5 / CSS 3 / JavaScript...

Projet Web. Tim Burton. Refonte complète du site de Tim Burton en utilisant les dernières technologies du web : HTML 5 / CSS 3 / JavaScript... Projet Web Tim Burton Refonte complète du site de Tim Burton en utilisant les dernières technologies du web : HTML 5 / CSS 3 / JavaScript... Par Omar EDDASSER L3 ISC parcours MIAGE Sous l enseignement

Plus en détail

MODE D'EMPLOI. Rédiger ou modifier un article. Vincent Blanchard Informatique Page 1

MODE D'EMPLOI. Rédiger ou modifier un article. Vincent Blanchard Informatique Page 1 MODE D'EMPLOI Rédiger ou modifier un article Vincent Blanchard Informatique Page 1 SOMMAIRE Chapitre 1 : Présentation de votre outil rédactionnel page 3 Chapitre 2 : les attributs d un article..page 7

Plus en détail

jquery Mobile La bibliothèque JavaScript pour le Web mobile Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2

jquery Mobile La bibliothèque JavaScript pour le Web mobile Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2 jquery Mobile La bibliothèque JavaScript pour le Web mobile É r i c S a r r i o n Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2 1 Installation de jquery Mobile

Plus en détail

Groupe Eyrolles, 2003, ISBN : 2-212-11317-X

Groupe Eyrolles, 2003, ISBN : 2-212-11317-X Groupe Eyrolles, 2003, ISBN : 2-212-11317-X 3 Création de pages dynamiques courantes Dans le chapitre précédent, nous avons installé et configuré tous les éléments indispensables à la mise en œuvre d une

Plus en détail

DOCUMENTATION MISE A JOUR ANTIBIOGARDE. V4.0 en v4.1

DOCUMENTATION MISE A JOUR ANTIBIOGARDE. V4.0 en v4.1 DOCUMENTATION MISE A JOUR ANTIBIOGARDE V4.0 en v4.1 Version d Antibiogarde 4.1 Version du document 1.0 Date dernière mise à jour du document 15/06/2010 Retrouvez cette doc à jour sur : http://www.antibiogarde.org/activation/

Plus en détail

CMS MWC. Outil pour la gestion du site Internet DOCUMENTATION UTILISATEUR [version du 23/03/2009]

CMS MWC. Outil pour la gestion du site Internet DOCUMENTATION UTILISATEUR [version du 23/03/2009] CMS MWC Outil pour la gestion du site Internet DOCUMENTATION UTILISATEUR [version du 23/03/2009] 1. Authentification 2. Interface d édition MWC 3. Mise en page 4. Gestion des fichiers 5. Gestion des événements

Plus en détail