Rapport de stage. BTS Services Informatique. de la mairie. Stage effectué à l'hotel de ville de Villeneuve Lez Avignon

Transcription

1 Rapport de stage Service informatique de la mairie BTS Services Informatique aux Organisations Options SLAM LEGRIS César Lycée Théodore Aubanel Académie Aix-Marseille Stage effectué à l'hotel de ville de Villeneuve Lez Avignon 2 Rue de la république BP Villeneuve Lez Avignon Cedex Sous la direction de Christophe Pothier en tant que Responsable Informatique et Télécommunication Du 26 mai au 25 juin 2015

2 Observations Page 1/10

3 Sommaire Remerciements...1 Présentation de la mairie...2 Cahier des charges...3 Conclusion...4 Page 2/10

4 Remerciements Je remercie Monsieur le Maire Jean-Marc Roubaud et toute la direction de la mairie de Villeneuve-lez-Avignon pour m'avoir permis d'effectuer ce stage. Le service informatique pour son accueil chaleureux. Christophe Pothier, mon tuteur de stage Page 3/10

5 Présentation de la mairie La mairie de Villeneuve-lez-Avignon compte 352 employés répartis en 17 services. Elle gère une commune de habitants (en 2012) grande en superficie de 18 km². Son maire est Mr Jean-Marc Roubaud (UMP) depuis Adresse : 2 rue de la République BP Avignon Villeneuve lez Activité : Gestion de commune Effectif : 352 Page 4/10

6 Cahier des charges 1/ Problèmes d'images pour un site responsive A/ Les Media Queries et les hacks 1)Media Queries 2)Hack css 2/ Les frameset A/ Les iframes Page 5/10

7 1/ Problèmes d'images pour un site responsive A/ Les Media Queries et les hack css Le problème : Une image du site ne se redimensionne pas lorsque l'on réduit la fenêtre ou lorsqu'on visite le site sur tablette ou téléphone. Définitions : Le Responsive Web design est une approche de conception Web qui vise à l'élaboration de sites offrant une expérience de lecture et de navigation optimales pour l'utilisateur quelle que soit sa gamme d'appareil (téléphones mobiles, tablettes, liseuses, moniteurs d'ordinateur de bureau). Un hack css est une technique pour contourner un problème d'interprétation et permettre à un navigateur défectueux d'aboutir à nos fins, soit en détournant une propriété de son usage, soit en utilisant des codes supplémentaires pour palier aux manques. Les media queries sont des règles à appliquer pour changer le design d'un site en fonction des caractéristiques de l'écran. Page 6/10

8 1) Media Queries J'ai donc utilisé les Media Queries pour une image qui ne se recadrait pas lorsqu'on visionnait le site sur un smartphone. Traduire la première ligne par : «Pour tous les appareils dont (la largeur maximale de l'appareil est de 480 pixels)» Page 7/10

9 2) Les hack css Je me suis servis d'un hack css pour Safari 8 ou plus à cause d'un mauvais positionnement d'images lorsque l'on visitait le site sur safari. On rajoute à la fin de la formule l'id qui doit être affecté par le css qui suit. Ce n'est cependant pas une technique viable sur le long terme car ces hack sont souvent corrigé. Page 8/10

10 2/Les frameset A/ Les iframe Le problème : Le site sur lequel je travaillai ne supporter pas le php. J'en avais besoin pour un formulaire de contact. Définitions : L'iframe est un élément qui permet d'insérer une page Web dans une autre. Cet élément faisait partie des spécifications HTML, mais a été délaissé dans XHTML en raison de sa mauvaise accessibilité. L'iframe fait néanmoins son come-back dans HTML5. 2) Les hack css On défini une hauteur et une largeur de 100% à la frame et on lui enlève les bordures. Page 9/10

11 Conclusion Ce stage au sein du service informatique de la mairie de Villeneuve-lez-Avignon a été très instructif. Il m'a permis de développer mes compétences de développeur. Ce stage a parfaitement répondu à mes attentes. En effet, cette expérience m a permis de conforter mon choix pour mon futur métier d informaticien et mon orientation professionnelle dans le secteur informatique. J'ai vraiment apprécié d'être au milieu de professionnels et de disposer de leurs conseils, leurs connaissances et leurs savoir-faire. Page 10/10