<!--
// Les réalisations de Trafic3w

// Tableau des noms des différents projet
var realisations_nom = new Array(
						"CIMMI",
						"Michel Saulnier",
						"CERFO",
						"CSSS du Grand Littoral",
						"Conseil franco-québécois de coopération universitaire (CFQCU)",
						"Carnet interactif de la culture",
   					    "L'Ombusdsman de l'Université Laval",
						"Institut de technologie agroalimentaire",
						"Americ Disc",
						"Réseau des carrefours jeunesse-emploi du Québec (RCJEQ)",
						"Groupe GCS",
						"Institut québécois des hautes études internationales (HEI)",
						"Ehook",
						"Mon Ourson virtuel",
						"Services Québec - entreprises",
						"Université Laval - Service des affaires étudiantes",
						"BIDULZ - banque d'images pour les activités éducatives",
						"Réseau pêches et aquaculture Québec",
						"Informatique Stratégique",
						"Académie de formation informatique",
						"Galerie Charles et Martin Gauthier",
						"Centre de santé et de services sociaux de la Vieille-Capitale",
						"École Les Bocages",
						"Équipe Québec aux Jeux du Canada",
						"Réseau québécois de l’ISPJ",
						"LORAN Technologies",
						"Gîte Nimba",
						"Ministère de l’Agriculture, des Pêcheries et de l’Alimentation du Québec",
						"Commission d’étude sur la gestion de la forêt publique québécoise",
						"Clicfrançais",
						"Conseil des ministres de l'Éducation (Canada)",
						"Autres réalisations en design et communication publicitaire »"
						);

// Noms des images pour toutes les réalisations

var csssvc = new Array("wCSSSVC_accueil_p.jpg","wCSSSVC_centreHeber_p.jpg","wReseauLocal_accueil_p.jpg");

var ita = new Array("wITA_accueil_p.jpg","wITA_campusPocatiere_p.jpg","wITA_formationContinue_p.jpg");

var ise = new Array("wInfoStrateg_accueil_p.jpg","wInfoStrateg_entreprise_p.jpg");

var ehook = new Array("wEhook_accueil_p.jpg");

var ggauthier = new Array ("wGGauthier_accueil_p.jpg","wGalerieGauthier_artiste_p.jpg","wGGauthier_artPhotos_p.jpg");

var equipeqc = new Array ("wEquipeQc_accueil_p.jpg","wEquipeQuebec_disciplines_p.jpg","wEquipeQuebec_equipe_p.jpg","wEquipeQc_msgOfficiels_p.jpg");

var comforet = new Array ("wComForet_accueil.jpg","wComForet_membres_p.jpg");

var bidulz = new Array ("wBidulz_accueil_p.jpg", "wBidulz_Images_p.jpg");

var vtb = new Array ("wVTB_jeu_p.jpg","wVTB_nourrirOurson_p.jpg","wVTB_cacheCache_p.jpg","wVTB_Historique_p.jpg","wVTB_visiteOurson_p.jpg");

var rcjeq = new Array ("wRCJEQ_accueil_p.jpg","wRCJEQ_jeunes1635_p.jpg","wRCJEQ_aPropos_p.jpg");

var sae = new Array ("wSAE_accueil_p.jpg","wSAE_baa_p.jpg");

var pgse = new Array ("wPGSE_accueil_p.jpg","wPGSE_gererEnt_p.jpg","wPGSE_ministeres_p.jpg","wPGSE_recherche_p.jpg");

var mapaq = new Array ("wMAPAQ_accueil_p.jpg","wMAPAQ_prodsAniVeg_p.jpg");

var loran = new Array ("wLORAN_accueil_p.jpg","wLORAN_offre_p.jpg");

var gcs = new Array ("wGrGCS_accueil_p.jpg","wGrGCS_espacesL_p.jpg");

var gitenimba = new Array ("wGiteNimba_accueil_p.jpg","wGiteNimba_leGite_p.jpg","wGiteNimba_chambres_p.jpg");

var hei = new Array("wHEI_accueil_p.jpg","wHEI_lesHEI_p.jpg","wHEI_PSI_p.jpg");

var ombusdman = new Array("wOmbudsman_accueil_p.jpg");

var clicfrancais = new Array("wClicFr_accueil_p.jpg","wClicFr_accEleves_p.jpg","wClicFr_magazine_p.jpg");

var cci = new Array ("wCIC_accueil_p.jpg","wCIC_carnetDessin_p.jpg","wCIC_profilCarriere_p.jpg","wCIC_vieCulturelle_p.jpg","wCIC_2pas1danse_p.jpg");

var afi = new Array ("wAFI_Accueil_p.jpg","wAFI_Equipe_p.jpg");

var bocage = new Array ("wEcBocages_accueil_p.jpg","wEcBocages_editorial_p.jpg","wEcBocages_projets_p.jpg");

var cme = new Array ("wConseilEdu_accueil_p.jpg");

var rpaq = new Array ("wReseauPech_accueil_p.jpg", "wReseauPech_tableFil_p.jpg");

var ispj = new Array ("wReseauQCISPJ_accueil_p.jpg");

var ad = new Array ("wDiscAme_accueil_f.jpg");

var cfqcu = new Array ("wCFQCU_accueil_p.jpg");

var csssgl = new Array("wCSSSGL_accueil_p.jpg");

var cerfo = new Array("wCERFO_accueil_p.jpg");

var michelSaulnier = new Array("wMSaulnier_accueil_p.jpg");

var cimmi = new Array("wCIMMI_accueil_p.jpg");

// Titre des images pour tous les réalisations

var csssvc_titre = new Array("Accueil","Centres d'hébergement","Répertoire des ressources du réseau local");

var ita_titre = new Array("Accueil","Campus de la Pocatière","Formation continue");

var ise_titre = new Array("Accueil","L'entreprise");

var ehook_titre = new Array("Accueil");

var ggauthier_titre = new Array ("Accueil","Page artiste","Oeuvres choisies");

var equipeqc_titre = new Array ("Accueil","Disciplines sportives","Équipes","Messages officiels");

var comforet_titre = new Array ("Accueil","Membres et organisation");

var bidulz_titre = new Array ("Accueil", "Banque d'images");

var vtb_titre = new Array ("Accueil","Nourrir ton ourson","Jouer à cache-cache", "Historique des repas","Visite l'ourson d'un ami");

var rcjeq_titre = new Array ("Accueil","Jeunes 16 à 35 ans", "À propos du RCJEQ");

var sae_titre = new Array ("Accueil","Bureau d’accueil et d’animation");

var pgse_titre = new Array ("Accueil", "Gérer son entreprise", "Ministères et organisations", "Recherche par sujet");

var mapaq_titre = new Array ("Accueil","Productions animale et végétale");

var loran_titre = new Array ("Accueil","Offre de services");

var gcs_titre = new Array ("Accueil","Espaces à louer");

var gitenimba_titre = new Array ("Accueil","Le Gîte","Les chambres");

var hei_titre = new Array ("Accueil","Les HEI","Programme Paix et sécurité internationales");

var ombusdman_titre = new Array ("Accueil");

var clicfrancais_titre = new Array ("Accueil", "Accueil de l'élève", "Création de magazines");

var cci_titre = new Array ("Accueil", "Mon carnet de dessins", "Mon profil de carrière en culture", "Ma vie culturelle", "Deux pas, une danse");

var afi_titre = new Array ("Accueil","L'équipe");

var bocage_titre = new Array ("Accueil", "L'éditorial", "Projets et activités");

var cme_titre = new Array ("Accueil");

var rpaq_titre = new Array ("Accueil","Table filière de l'aquaculture en eau douce du Québec");

var ispj_titre = new Array ("Accueil");

var ad_titre = new Array ("Accueil de l'extranet");

var cfqcu_titre = new Array ("Accueil");

var csssgl_titre = new Array ("Accueil");

var cerfo_titre = new Array ("Accueil");

var michelSaulnier_titre = new Array("Accueil");

var cimmi_titre = new Array ("Accueil");

// descriptions des projets (0 -> Nature du projet, 1 -> Solution apportée)
var csssvc_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Création du site Web du <a class='lien_orange' target='_blank' href='http://www.csssvc.qc.ca/' title='CSSS de la Vieille-Capitale'>CSSS de la Vieille-Capitale</a>, organisme regroupant 7 CLSC de la région, 8 centres d’hébergement et de nombreux autres services du domaine public de la santé et des services sociaux. Le projet consistait à créer entièrement un site Web facile à gérer et évolutif, qui intègre de façon efficace un volume important de contenus.</li><li><span class='gras'>Solution apportée</span> : Le Service des communications du Centre de santé et de services sociaux de la Vieille-Capitale souhaitait s’impliquer activement dans le projet. Le site a été développé grâce à un partenariat créatif et dynamique. Les menus, le fil d’Ariane et le plan du site sont tous générés dynamiquement, à partir d’un seul fichier. Des pages peuvent donc facilement et rapidement être ajoutées au site. Des outils de gestion dynamique de contenus ont également été développés pour plusieurs sections : gestion des installations, des horaires et des services, conseils santé, offres d’emploi, publications, agenda. Couplés à un module de gestion des utilisateurs, ces outils permettent de décentraliser la gestion de certains contenus de manière structurée à des utilisateurs non spécialisés en programmation HTML. Enfin, une liste de diffusion permet de communiquer efficacement aux abonnés les renseignements relatifs au CSSS de la Vieille-Capitale et à ses services. Une fonction d’ajustement de la taille du texte permet aussi aux visiteurs d’adapter le visuel du site en fonction de leurs goûts et de leurs besoins. Un outil de recherche intégré à toutes les pages du site facilite également la recherche d’information.</li></ul></div>";

var csssvc_ress_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Création du répertoire des ressources du réseau local du CSSS de la Vieille-Capitale, organisme regroupant 7 CLSC de la région, 8 centres d’hébergement et de nombreux autres services du domaine public de la santé et des services sociaux. Le projet consistait à créer un répertoire dynamique permettant la gestion et la consultation selon différents critères de recherche des ressources du réseau local (organismes, horaires, services, clientèles, personnes contact, etc.).</li><li><span class='gras'>Solution apportée</span> : Le Service des communications du Centre de santé et de services sociaux de la Vieille-Capitale souhaitait s’impliquer activement dans le projet. Le site a été développé grâce à un partenariat créatif et dynamique. Le répertoire des ressources du réseau local a été développé dans une optique d’évolutivité et de décentralisation de la gestion de l’information. Ainsi, on y retrouve notamment des fonctionnalités :<ul style='margin-left: 0; margin-top: 10px;'><li>Permettant de gérer les utilisateurs et de leur attribuer des rôles leur donnant accès à la gestion de l’ensemble des ressources ou de ressources spécifiques;</li><li>Permettant aux utilisateurs de générer des listes de ressources personnalisées et de les sauvegarder dans leur profil;</li><li>Permettant de générer des listes de ressources de différents formats (répertoire, bottin, étiquettes, etc.);</li><li>Permettant aux visiteurs du site de suggérer des mises à jour des ressources et aux gestionnaires du répertoire de gérer ces suggestions;</li><li>Etc.</li></ul></li></ul></div>";

var ita_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : L’Institut de technologie agroalimentaire (ITA) est un établissement de niveau collégial qui offre des programmes de formation et des cours en agriculture, en horticulture et en transformation des aliments.<p style='margin-left: 0; width: 330px;'>Dans le but de se démarquer auprès de ses clientèles étudiante et adulte, et de mieux positionner son offre de formation, l’ITA désirait faire une refonte de son site  Internet. De plus, l’Institut, qui regroupe les campus de Saint-Hyacinthe et de La Pocatière, voulait présenter ses services de façon distincte pour l’un et l’autre des campus, tout en conservant un fort lien d’unité entre ces deux entités. Enfin, le secteur de la formation continue de l’ITA, qui offre de la formation et des services adaptés aux besoins des personnes et des entreprises, devait se démarquer au sein du nouveau site.</p></li><li><span class='gras'>Solution apportée</span> : Trafic3w, en collaboration avec la direction des communications du MAPAQ, a repensé l’architecture informationnelle et le design du site de l’ITA, en proposant un accès direct et promotionnel à partir de l’accueil vers ses programmes de formation initiale de type DEC. De plus, une emphase a été placée sur les installations de l’Institut, qui sont l’un de ses principaux pôles d’attraction auprès de la clientèle étudiante. Afin de dynamiser le site, le design graphique présente des couleurs jeunes et toniques, ainsi que des formes courbes inspirées de la nature.<p style='margin-left: 0; width: 330px;'>Chacun des campus se voit doté d’un sous-site qui permet de présenter individuellement ses installations, ses programmes de formation et ses actualités, en plus d’offrir une vitrine sur la vie étudiante, les services aux étudiants et la région.</p><p style='margin-left: 0; width: 330px;'>Enfin, la section « Formation continue », qui se démarque visuellement du site principal tout en conservant la même logique de navigation, présente des programmes de perfectionnement et de formation de type AEC et DEP, ainsi qu’un babillard et plusieurs autres rubriques d’information destinées à sa clientèle distincte.</p><p style='margin-left: 0; width: 330px;'>Les menus permettent de naviguer de façon intuitive et transparente entre les principaux secteurs de l’ITA. Puisqu’il s’agit d’un organisme paragouvernemental rattaché à un ministère (MAPAQ), le site devait se plier aux normes graphiques du programme d’identification visuelle du Gouvernement du Québec, ce qui explique la présence du bandeau en haut de page.</p></li></ul></div>";


var ise_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : La firme IS, spécialisée en sécurité informationnelle, a connu une croissance importante au cours des dernières années. Elle désirait renouveler son site de manière à ce qu’il représente mieux son approche de travail et son offre de services. Le site devait ainsi devenir un important outil de développement des affaires.</li><li><span class='gras'>Solution apportée</span> : Un site Web conçu de manière à faire ressortir la qualité et l’originalité de l’entreprise. L’ergonomie du site permet aux visiteurs d’accéder rapidement à l’ensemble des renseignements du site. Des conseils personnalisés sont offerts aux différents types d’intervenants afin de leur permettre d’amorcer une réflexion sur la sécurité informationnelle de leur organisation.Le site est essentiellement informationnel. Toutefois, la gestion de ses menus a été centralisée au sein d’un seul fichier de manière à en faciliter l’évolution et la mise à jour.</li></ul></div>";

var ehook_desc = "";

var ggauthier_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : La Galerie Charles et Martin Gauthier désirait présenter sur Internet différentes œuvres des artistes contemporains qu’elle représente.</li><li><span class='gras'>Solution apportée</span> : Un site Web conçu de manière à faire ressortir la qualité de l’entreprise et de l’œuvre des artistes qu’elle représente. L’ergonomie du site permet aux visiteurs d’accéder facilement au portfolio de chacun des artistes ainsi qu’à leur curriculum vitae. Le site a également été conçu de manière à en permettre l’évolution et l’enrichissement de manière simple et rapide.</li></ul></div>";

var equipeqc_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Refonte du site Web Équipe Québec au Jeux du Canada. Le ministère des Affaires municipales, du Sport et du Loisir désire faire la promotion des athlètes de la relève et bénévoles québécois qui participent à ces Jeux.</li><li><span class='gras'>Solution apportée</span> : Un nouveau site Web qui diffuse de l’information, des nouvelles et des communiqués sur les Jeux du Canada et sur les athlètes qui participeront aux Jeux de Régina, à l’été 2005. Lors des Jeux, le site donnera accès au calendrier des compétitions, aux résultats par discipline ainsi qu’au tableau des médailles de l’équipe du Québec.<p style='margin-left: 0; width: 330px;'>Des outils de gestion dynamique de contenus ont été développés pour ce site. Ces fonctionnalités permettront au Ministère de maintenir à jour, de façon simple et conviviale, le contenu de plusieurs sections du site telles les nouvelles, les communiqués, les médailles remportées par Équipe Québec, etc. De plus, une base de données sur les athlètes, les entraîneurs, les artistes et les gérants a été créée. Elle permet, entre autres, à l’utilisateur du site de rechercher des résultats de compétitions et des fiches d’information sur les athlètes.</p></li></ul></div>";

var comforet_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Conception et réalisation du site Web de la Commission.</li><li><span class='gras'>Solution apportée</span> : Un site Web conçu de manière à remplir les objectifs de la Commission : démontrer une totale transparence tout au long de ses travaux ainsi qu'une grande accessibilité aux citoyens du Québec. Pour atteindre ces objectifs, il importait de rendre disponible de façon simple, efficace et conviviale un maximum d'information relative à ses travaux.</li></ul></div>";

var bidulz_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Création du site Bidulz, une banque d’images dont l’utilisation est gratuite aux fins d’activités éducatives non commerciales.</li><li><span class='gras'>Interventions de Trafic3w</span> : En tant que partenaire du projet Bidulz, Trafic3w a pris en charge les tâches suivantes : élaboration de l’arborescence du site, conception et réalisation visuelle (les illustrations ont été réalisées par Daniel Boulanger), rédaction Web et intégration HTML.</li><li><span class='gras'>Solution apportée</span> : Bidulz désigne un ensemble de personnages fantaisistes qui peuvent être utilisés de multiples façons dans le cadre d’activités éducatives. Les Bidulz ont des postures et des expressions variées : ils se prêtent particulièrement bien à l’accompagnement de projets scolaires. Le site Web développé se devait d’être simple d’utilisation, évolutif et facile à mettre à jour.</li></ul></div>";

var vtb_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Au fil des ans, Trafic3w s’est impliquée dans la réalisation de nombreux projets éducatifs sur le Web. Dans le cadre du projet Mon ourson virtuel, Trafic3w désirait développer une activité en ligne qui permettrait de sensibiliser les jeunes de 4 à 12 ans à l’importance d’adopter de saines habitudes de vie.</li><li><span class='gras'>Solution apportée</span> : Le jeu Mon ourson virtuel consiste à « adopter » un ourson virtuel, à le visiter et à le nourrir. Il initie les jeunes aux principes de base d’une bonne alimentation, il leur apprend à différencier les groupes alimentaires et leur fait expérimenter, avec un humour convaincant, les effets de l’alimentation sur la santé. Ainsi, la qualité des repas que les enfants offrent quotidiennement à leur ourson, de même que la quantité d’aliments, influenceront progressivement sa couleur et son poids.<p style='margin-left: 0; width: 330px;'>Il sensibilise également les jeunes à l’importance de l’activité physique par le biais d’un jeu de cache-cache. En plus d’être amusant et de développer les réflexes des jeunes, cette activité influence également l’apparence de leur ourson.</p><p style='margin-left: 0; width: 330px;'>Offert gratuitement, Mon ourson virtuel s’inspire du Guide alimentaire canadien.</p></li></ul></div>";

var rcjeq_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Pour ses 10 ans d’existence, le Réseau des carrefours jeunesse-emploi du Québec désirait mettre en ligne un site qui projetait une image dynamique en lien avec sa mission, tout en permettant une mise à jour facilitée. Le site devait être doté de 2 sections distinctes : la première devait rejoindre les jeunes de 16 à 35 ans ciblés par les carrefours jeunesse-emploi, et la seconde devait servir de vitrine au RCJEQ auprès de ses partenaires, du milieu corporatif et des CJE.<p style='margin-left: 0; width: 330px;'>De plus, la création d’un extranet devait permettre à ses membres de participer activement aux activités du réseau.</p></li><li><span class='gras'>Solution apportée</span> : Trafic3w a conçu un site qui permet une intégration harmonieuse des contenus du RCJEQ par un design sobre et ergonomique. Le site a été séparé en 2 sections, l’une s’adressant spécifiquement aux jeunes et l’autre présentant les renseignements corporatifs.<p style='margin-left: 0; width: 330px;'>La structure du site simplifie les mises à jour, elle permet de l’enrichir sans devoir remanier les interfaces graphiques.</p><p style='margin-left: 0; width: 330px;'>L’extranet du RCJEQ, également développé par Trafic3w, regroupe plus de 1000 membres-utilisateurs. Il constitue une communauté dynamique d’échange d’information et de gestion d’événements et activités au sein du Réseau des carrefours jeunesse-emploi du Québec.</p></li></ul></div>";

var sae_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Refonte des sites Web du Service des affaires étudiantes de l’Université Laval et de 5 unités sous-jacentes.</li><li><span class='gras'>Interventions de Trafic3w</span> : Dans le cadre de ce mandat, Trafic3w a accompagné le SAE dans l’ensemble des étapes de la conception des sites : élaboration de l’arborescence des sites, préparation d’interfaces fonctionnelles, préparation d’une description fonctionnelle des applications des sites, conception et réalisation visuelle et rédaction d’un cahier de normes visuelles.</li><li><span class='gras'>Solution apportée</span> : Le SAE désirait actualiser son propre site Web de même que ceux de 5 unités sous sa responsabilité, de manière à en améliorer l’ergonomie. L’objectif était d’actualiser et d’harmoniser la présentation visuelle et la navigation des sites des différentes unités et de les rendre conformes aux normes de présentation visuelle de l’Université Laval. Trafic3w a donc conçu des sites Web complètement renouvelés, faciles à gérer et évolutifs, qui respectent les normes de l’Université Laval. La grille graphique et la navigation sont harmonisées pour l’ensemble des sites. Toutefois, chaque site se distingue par la palette de couleurs utilisée et les photographies qu’il comporte.</li></ul></div>";

var pgse_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Le développement et la mise en place de la deuxième étape du Portail gouvernemental de services aux entreprises (PGS-E) s’inscrivent dans la lignée des orientations stratégiques gouvernementales et constituent l’un des domaines du Portail gouvernemental de services. <p style='margin-left: 0; width: 330px;'>Le PGS-E vise à améliorer les services offerts aux entreprises et aux futurs entrepreneurs, en mettant à leur disposition un site convivial et adapté à leurs besoins tout en accentuant leur performance. Les grands objectifs auxquels la mise en oeuvre de la deuxième étape du PGS-E se rattache sont les suivants :</p><ul style='margin: 10px 0 0 0;'><li>Simplifier l'accessibilité aux produits et services offerts par les différentes instances publiques en centralisant l’accès aux informations;</li><li>Offrir des contenus à jour et de qualité;</li><li>Fournir des services sécurisés et fiables;</li><li>Développer l'offre de service interactionnel et transactionnel;</li><li>Ajouter de la valeur à l’outil de travail et de référence (PGS-E) pour les entrepreneurs;</li><li>Capitaliser sur les acquis amenés par la mise en ligne de la première étape du PGS-E.</li></ul></li><li><span class='gras'>Solution apportée</span> : À titre de partenaire des firmes DMR conseil et Groupe LGS, Trafic3w a participé à l’élaboration de l’architecture du portail, la conception et la réalisation fonctionnelle et visuelle des interfaces, la rédaction de normes d’interfaces détaillées et la rédaction du guide utilisateurs du système de gestion des contenus (CMS).</li></ul></div>";

var mapaq_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Refonte du site Web du ministère de l’Agriculture, des Pêcheries et de l’Alimentation du Québec </li><li><span class='gras'>Interventions de Trafic3w</span> :<ul style='margin: 10px 0 0 0;'><li>Élaboration de l’architecture informationnelle globale et détaillée</li><li>Élaboration du concept visuel du site et de ses différentes sections</li><li>Participation aux tests d’utilisation du site</li><li>Préparation de normes détaillées en ce qui a trait aux interfaces du site, à sa présentation visuelle et à la rédaction de ses contenus</li><li>Supervision et coordination de l’équipe de rédaction</li><li>Coordination et support des fournisseurs de contenus</li><li>Intégration des maquettes et des éléments Flash du site</li><li>Préparation et réalisation de la formation sur MCMS des ressources du MAPAQ impliquées dans la gestion du site Web</li></ul></li><li><span class='gras'>Solution apportée</span> : Un nouveau portail qui constitue la porte d’entrée de l’ensemble des services électroniques du Ministère. Ce nouveau portail, comportant plusieurs milliers de pages Web, est axé sur les besoins des clientèles du MAPAQ et sur l’accessibilité de l’information. Le nouveau site donne accès aux contenus d’une manière globale et intégrée, tout en respectant le dynamisme et les particularités régionales des différents secteurs du Ministère.<p style='margin-left: 0; width: 330px;'>Un système de gestion de contenus (le CMS de Microsoft) a été mis en place à l’intention des nombreux intervenants provenant des divers secteurs de l’organisation. En permettant la gestion autonome des contenus par leurs auteurs, le Ministère favorise leur actualité. La qualité de l’information de même que le respect des normes du site sont également maintenus à l’aide d’un processus systématique d’approbation et de publication.</p></li></ul></div>";

var loran_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Refonte du site Web de l’entreprise.</li><li><span class='gras'>Solution apportée</span> : Un site Web conçu selon les besoins de communication de cette entreprise. Le site a pour objectif de démontrer la qualité des services offerts par Loran dans un domaine spécialisé : les services conseils liés à l'intégration et à l'architecture de systèmes. Le site Web permet aux visiteurs de trouver rapidement les informations clé de l’entreprise : description de Loran, de ses services et de ses réalisations.</li></ul></div>";

var gcs_desc = "";

var gitenimba_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Conception et réalisation du site Web de l’entreprise.</li><li><span class='gras'>Solution apportée</span> : Un site Web conçu de manière à faire ressortir la qualité et l’originalité de l’établissement ainsi que les attraits touristiques situés à proximité. L’ergonomie du site permet aux visiteurs d’accéder rapidement à l’ensemble des renseignements utiles pour planifier leur séjour.</li></ul></div>";

var hei_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : L’Institut québécois des hautes études internationales (HEI) est un institut d'études supérieures voué à la recherche et à l’enseignement en études internationales. Il vise à accroître la cohérence scientifique des études poursuivies en ce domaine à l’Université Laval.<p style='margin-left: 0; width: 330px;'>Il désirait se doter d’un site Internet qui lui permettrait de rejoindre facilement la communauté universitaire ainsi que les anciens étudiants. Le site, décliné en 3 langues, devait aussi être un outil promotionnel permettant de recruter des étudiants canadiens et étrangers, et devait se démarquer sur le plan international.</p></li><li><span class='gras'>Solution apportée</span> : Mandatée pour réaliser l’architecture et la conception graphique du site, Trafic3w a opté pour la simplicité dans la navigation et a eu recours à un design jeune et raffiné afin de rejoindre une clientèle universitaire d’études supérieures, tout en mettant en valeur le caractère humain des HEI.<p style='margin-left: 0; width: 330px;'>Dans l’accueil, une section « En vedette aux HEI » présente des faits saillants accompagnés de photos. La page d’accueil est complétée par une section « Nouvelles et nouveautés » ainsi qu’une section décrivant les activités à venir.</p><p style='margin-left: 0; width: 330px;'>Le site s’inscrit dans les normes d’interfaces de l’Université Laval.</p></li></ul></div>";

var ombusdman_desc = "";

var clicfrancais_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Réalisation du site clicfrançais destiné aux élèves du secondaire ayant des difficultés d'apprentissage en français et à leurs enseignants.</li><li><span class='gras'>Solution apportée</span> : Un site totalisant plus de cinquante activités d'apprentissage interactives programmées en Flash. Il est doté de multiples fonctionnalités permettant aux enseignants et aux élèves d'interagir et de s'entraider. Chaque élève dispose d'un portfolio personnalisé où l'enseignant peut suivre son cheminement dans le site et être régulièrement informé de son parcours d'apprentissage. Le site compte aussi des forums de discussion et une messagerie privée. Des fonctionnalités de gestion des comptes utilisateurs, en plus d'outils pratiques (carnet de notes, dictionnaire personnalisé) ont aussi été développées et adaptées aux besoins de la clientèle.</li></ul></div>";

var clicfrancais_mag_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Ajout d’un module pour la création de magazines en ligne dans le site clicfrançais.</li><li><span class='gras'>Solution apportée</span> : Le module de création de magazines du site clicfrançais, destiné aux élèves en cheminement particulier de formation au secondaire ainsi qu’à leurs enseignants, offre toutes les fonctionnalités nécessaires pour la rédaction de textes et leur assemblage dans un magazine pouvant être diffusé en ligne ou de façon traditionnelle, sur papier.<p style='margin-left: 0; width: 320px;'>Tout en demeurant simple d’utilisation, la solution mise en place offre de nombreuses possibilités et fonctions :</p><ul style='margin-left: 0; width: 330px;'><li>L’enseignant est en mesure de créer des magazines relatifs à sa classe ou à son école.</li><li>L’élève peut créer les textes de son choix en sélectionnant leur type (éditorial, chronique, critique, etc.), leur thème, leur présentation visuelle... En tout temps, l’élève peut obtenir des renseignements et des conseils de rédaction personnalisés en fonction du type de texte choisi.</li><li>Une fois son texte complété, l’élève le transmet à son enseignant qui pourra le valider, le retoucher ou, au besoin, demander à l’élève de le retravailler.</li><li>Une fois le texte complété et approuvé par l’enseignant, ce dernier est en mesure de l’associer à un magazine et de déterminer son ordre de présentation.</li><li>C’est également l’enseignant qui détermine la date de tombée de son magazine et sa date de publication.</li><li>L’enseignant peut aussi proposer les textes de ses élèves à des magazines collectifs, publiés auprès de l’ensemble de la communauté clicfrançais.</li></ul>Le module magazine est parfaitement intégré aux autres fonctionnalités du site clicfrançais. L’enseignant et les élèves désirant en faire usage n’ont donc pas à s’inscrire de nouveau afin de l’utiliser.</li></ul></div>";

var cci_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Le projet de Culture pour tous consistait à créer une version interactive du Carnet de la culture, en y ajoutant des activités originales à réaliser en ligne.</li><li><span class='gras'>Solution apportée</span> : La version Web comporte plus de trente activités interactives dont le but est de sensibiliser les jeunes aux arts et à la culture. Ces activités ont été programmées en Flash et en HTML. Le Carnet s’adresse aux jeunes et aux enseignants du primaire.<p style='margin-left: 0; width: 330px;'>À partir des textes et des éléments visuels fournis par le client, Trafic3w a adapté les activités au format Web et pris en charge l’ensemble des travaux relatifs à la conception et à la réalisation de ce projet.</p><p style='margin-left: 0; width: 330px;'>Le site offre aux enseignants la possibilité d'inscrire et de regrouper des utilisateurs/élèves sous forme de classes et de superviser leurs travaux, en plus de gérer leurs accès aux activités. De plus, les élèves ont la possibilité de conserver des dessins commentés ou des souvenirs précieux dans leur Carnet personnalisé, d'en faire un recueil de citations ou de critiques culturelles, et même de voir leurs travaux publiés sur le site public du Carnet de la culture interactif. Des fonctionnalités de gestion des comptes utilisateurs et des outils pratiques (ajout de Ressources et liens en Art, statistiques d'utilisation, gestion de la publication des travaux d'élèves) ont aussi été développés et adaptés aux besoins des administrateurs du site.</p></li></ul></div>";

var afi_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Refonte du site Web de l’entreprise (version 2005).</li><li><span class='gras'>Solution apportée</span> : Un site Web conçu selon les besoins de communication et de vente de cette entreprise œuvrant en formation informatique. L’ergonomie du site favorise la navigation et fait en sorte que l’on accède rapidement à l’information recherchée. Divers éléments du site témoignent de sa vitalité : mises à jour régulières de la section Nouvelles et événements, accès aux plus récents calendriers et plans de cours, possibilité de s’inscrire en ligne… En résumé, il s’agit d’un espace Web stimulant correspondant aux souhaits exprimés par l’entreprise.</li></ul></div>";

var bocage_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Conception et réalisation du nouveau site Web de l’école primaire Les Bocages.</li><li><span class='gras'>Solution apportée</span> : Un site Web en harmonie avec le programme éducatif de l’école, qui facilite la communication entre les enseignants et les parents par la diffusion régulière d’informations liées à la vie de l’école. De plus, les projets de classe et de cycle sont exposés dans le site : une autre façon de s’intéresser à ce que les enfants vivent et accomplissent à l’école.<p style='margin-left: 0; width: 330px;'>Le site Web est également un lieu d’information privilégié entre le conseil d’établissement et les parents qu’il représente. Ces derniers peuvent aisément avoir accès aux procès-verbaux des réunions et être au fait des orientations et des décisions qui s’y prennent.</p><p style='margin-left: 0; width: 330px;'>Les élèves sont aussi mis à contribution. Les parents peuvent lire l’éditorial rédigé par un élève de l’école sur un sujet qui lui tient à coeur. Il s’agit d’une motivation de plus à écrire pour ces jeunes.</p></li></ul></div>";

var cme_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Réalisation d’un cédérom destiné aux formateurs et aux enseignants en français, langue première, de la maternelle à la deuxième année. Le projet s’inscrit dans une perspective pancanadienne.</li><li><span class='gras'>Solution apportée</span> : Un cédérom simple à utiliser grâce, entre autres, à sa navigation intuitive, son interface conviviale et attrayante, ainsi qu’à l’accès rapide aux ressources qu’il contient. Le produit répond donc efficacement aux besoins des enseignants tout en étant accessible aux utilisateurs peu expérimentés. Le cédérom est conforme aux normes technologiques adaptées au milieu scolaire.</li></ul></div>";

var rpaq_desc = "";

var ispj_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Réalisation du site Web du Réseau québécois de l’ISPJ, un projet pilote d’intégration des TIC dans la pratique pédagogique des enseignants et intervenants en insertion sociale et professionnelle des jeunes.</li><li><span class='gras'>Solution apportée</span> : Un site Web réalisé selon les priorités du Réseau : le partage de ressources pédagogiques et la diffusion de l’information. Le Réseau bénéficie d’une solution de gestion à distance facilitant l’ajout et le classement de ressources pédagogiques dans le répertoire. Axé sur l’efficacité, le site Web permet la gestion de l’inscription des membres au Réseau ainsi que l’envoi du bulletin électronique aux membres.<p style='margin-left: 0; width: 330px;'>La section Actualités, dévoilée en partie à l’accueil, témoigne du dynamisme de ce Réseau et invite le visiteur à s’informer. Enfin, le concept graphique du site Web rappelle celui de clicfrançais, le projet à l'origine du Réseau.</p></li></ul></div>";

var ad_desc = "";

var cfqcu_desc = "";

var csssgl_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Le mandat du CSSSGL consistait à réaliser la refonte complète de son site Web, de façon à l’enrichir et à le moderniser, autant pour les clientèles que pour les gestionnaires du site.</li><li><span class='gras'>Solution apportée</span> : Trafic3w a réalisé l’architecture informationnelle et fonctionnelle du site, sa conception ainsi que sa réalisation infographique de même que son intégration, sa programmation et son déploiement. Dans le cadre de ce mandat, le progiciel de gestion de contenus TYPO3 a été implanté. Certains modules spécialisés ont également été développés pour la gestion des établissements, des offres d’emploi et des plaintes. Le site Web a été programmé en XHTML, PHP, TypoScript et Javascript.</li></ul></div>";

var cerfo_desc = "<div class='bloc_desc'><ul><li><span class='gras'>Nature du projet</span> : Le mandat du CERFO consistait à revoir sa signature corporative et à moderniser son site Web, autant pour les clientèles que pour les gestionnaires du site. </li><li><span class='gras'>Solution apportée</span> : Trafic3w a réalisé, en collaboration avec le client, la refonte complète de la signature corporative du CERFO. La présentation visuelle de son site Web a ensuite été entièrement revue, puis le site a été intégré à une solution de gestion de contenu (TYPO3). Trafic3w a finalement formé et accompagné le client dans l’utilisation de TYPO3. Le CERFO est ainsi en mesure de gérer l’ensemble des contenus de son site Web de manière autonome.</li></ul></div>";;

var michelSaulnier_desc = "";

var cimmi_desc = "";

// liens vers les sites web de tous les réalisations

var csssvc_lien = "http://www.csssvc.qc.ca/";

var ita_lien = "http://www.ita.qc.ca/";

var ise_lien = "http://www.infostrategique.com/";

var ehook_lien = "http://www.e-hook.com/";

var ggauthier_lien = "http://www.galeriegauthier.com/";

var equipeqc_lien = "http://www.jeuxcanada.qc.ca/";

var comforet_lien = "http://www.commission-foret.qc.ca/";

var bidulz_lien = "http://www.bidulz.com/";

var vtb_lien = "http://www.oursonvirtuel.com/ourson/index.php";

var rcjeq_lien = "http://www.cjereseau.org/";

var sae_lien = "";

var pgse_lien = "http://www2.gouv.qc.ca/entreprises/portail/quebec/";

var mapaq_lien = "http://www.mapaq.gouv.qc.ca/";

var loran_lien = "http://www.lorantech.com/";

var gcs_lien = "http://www.groupegcs.qc.ca";

var gitenimba_lien = "http://www.gitenimba.com/";

var hei_lien = "http://www.hei.ulaval.ca/";

var ombusdman_lien = "";

var clicfrancais_lien = "https://www.clicfrancais.com";

var cci_lien = "http://www.carnetdelaculture.ca/";

var afi_lien = "";

var bocage_lien = "";

var cme_lien = "";

var rpaq_lien = "http://www.rpaq.org/";

var ispj_lien = "";

var ad_lien = "";

var cfqcu_lien = "http://www.cfqcu.org";

var csssgl_lien = "http://www.csssgrandlittoral.qc.ca/";

var cerfo_lien = "http://www.cerfo.qc.ca/";

var michelSaulnier_lien = "http://michelsaulnier.com/";

var cimmi_lien = "http://www.cimmi.qc.ca/";

var realisations_img = new Array(cimmi, michelSaulnier, cerfo, csssgl, cfqcu, cci,ombusdman, ita, ad, rcjeq, gcs, hei, ehook, vtb, pgse, sae, bidulz, rpaq, ise, afi, ggauthier, csssvc, bocage, equipeqc, ispj, loran, gitenimba, mapaq, comforet, clicfrancais, cme);
var realisations_img_titre = new Array(cimmi_titre, michelSaulnier_titre, cerfo_titre, csssgl_titre, cfqcu_titre, cci_titre,ombusdman_titre, ita_titre, ad_titre, rcjeq_titre, gcs_titre, hei_titre, ehook_titre, vtb_titre, pgse_titre, sae_titre, bidulz_titre, rpaq_titre, ise_titre, afi_titre, ggauthier_titre, csssvc_titre, bocage_titre, equipeqc_titre, ispj_titre, loran_titre, gitenimba_titre, mapaq_titre, comforet_titre, clicfrancais_titre, cme_titre);
var realisations_desc = new Array(cimmi_desc, michelSaulnier_desc, cerfo_desc, csssgl_desc, cfqcu_desc, cci_desc,ombusdman_desc, ita_desc, ad_desc, rcjeq_desc, gcs_desc, hei_desc, ehook_desc, vtb_desc, pgse_desc, sae_desc, bidulz_desc, rpaq_desc, ise_desc, afi_desc, ggauthier_desc, csssvc_desc, bocage_desc, equipeqc_desc, ispj_desc, loran_desc, gitenimba_desc, mapaq_desc, comforet_desc, clicfrancais_desc, cme_desc);
var realisations_liens = new Array(cimmi_lien, michelSaulnier_lien, cerfo_lien, csssgl_lien, cfqcu_lien, cci_lien,ombusdman_lien, ita_lien, ad_lien, rcjeq_lien, gcs_lien, hei_lien, ehook_lien, vtb_lien, pgse_lien, sae_lien, bidulz_lien, rpaq_lien, ise_lien, afi_lien, ggauthier_lien, csssvc_lien, bocage_lien, equipeqc_lien, ispj_lien, loran_lien, gitenimba_lien, mapaq_lien, comforet_lien, clicfrancais_lien, cme_lien);

var realisationNo = 0;
var imgNo = 1;

function getQueryString (nomVariable)
{
	var url = location.href.substring(location.href.indexOf("?")+1, location.href.length)+"&";
	if (url.indexOf("#")!=-1)
		url = url.substring(0,url.indexOf("#"))+"&";
	var variable=0
	{
		nomVariable = nomVariable + "=";
		var taille = nomVariable.length;
		if (url.indexOf(nomVariable)!=-1)
			variable = url.substring(url.indexOf(nomVariable)+taille,url.length).substring(0,url.substring(url.indexOf(nomVariable)+taille,url.length).indexOf("&"));
	}
	return variable;
}

function OnInit()
{
	//var h_selection = document.getElementById('h_selection');
	var elem;
	realisationNo = getQueryString('realisation');
	
	if(realisationNo.value != "")
	{
		elem = document.getElementById('realisation_' + realisationNo);
	}
	else
	{
		elem = document.getElementById("realisation_0");
	}
	
	elem.style.fontWeight='bold';
	elem.style.color='#3c3c3c';
	
	AfficherRealisation(elem.id);
}

function AfficherRealisation(elemId)
{

	
	var noRealisation = elemId.split('_')[1];
	
	var nomRealisation = realisations_nom[noRealisation];
	var lien_visiter = document.getElementById('lien_visiter');
	var desc = document.getElementById('desc');
		
	var titre_realisation = document.getElementById('titre_realisation');
	titre_realisation.innerHTML = "<h2 class=\"titre_realisation\">" + nomRealisation + "</h2>";
	
	RefreshBtn(imgNo);
	RefreshImg(noRealisation, imgNo);

	if(realisations_liens[noRealisation] != ""){
		lien_visiter.href = realisations_liens[noRealisation];
	}else{
		lien_visiter.innerHTML = "";
	}
	desc.innerHTML = realisations_desc[noRealisation];
}

function SwitchColor(elem)
{
	if(elem.style.fontWeight == 'normal')
	{
		elem.style.fontWeight='bold';
		elem.style.color='#3c3c3c';
	}
	else
	{
		elem.style.fontWeight='normal';
		elem.style.color='#808285';
	}
}

function ClearSelection()
{
	var elems = document.getElementsByTagName('a');
	
	for (i=0; i<elems.length; i++)
	{
		if(elems[i].className == 'lnk_realisation')
		{
			elems[i].style.fontWeight='normal';
			elems[i].style.color='#808285';
		}
	}
}

function OnNext()
{

	if(realisationNo < getRealisationCount())
	{
		realisationNo++;
	}
	
	window.location.href = "realisations.html?realisation=" + realisationNo;
	
}

function OnLast()
{
	
	if(realisationNo > 0)
	{
		realisationNo--;
	}
	
	window.location.href = "realisations.html?realisation=" + realisationNo;
	
}

function RefreshBtn(noImg)
{
	var bloc_btn_realisations = document.getElementById('bloc_btn_realisations');
	
	bloc_btn_realisations.innerHTML = "";
	
	for(i=1;i<=realisations_img[realisationNo].length;i++){
		if(i == noImg){
			bloc_btn_realisations.innerHTML += "<a title=\"Image " + i + "\" ><div id=\"btn" + i + "_realisation\" class=\"bt_realisation_section_on\">" + i + "</div></a>";
			imgNo = i;
		}else{
			bloc_btn_realisations.innerHTML += "<a title=\"Image " + i + "\"  class=\"lien_orange\" href=\"javascript:RefreshBtn(" + i + ");\"><div id=\"btn" + i + "_realisation\" class=\"bt_realisation_section\">" + i + "</div></a>";
		}
		
	}
	
	AjusterTexte(realisationNo, noImg);
	RefreshImg(realisationNo, noImg);
	
}

function AjusterTexte(realisationNo, noImg)
{
	var desc = document.getElementById('desc');

	switch(realisationNo)
	{
		case '16':
			
			switch(noImg)
			{
				case 1:
					desc.innerHTML = realisations_desc[realisationNo];
					break;
				case 2:
					desc.innerHTML = realisations_desc[realisationNo];
					break;
				case 3:
					desc.innerHTML = csssvc_ress_desc;
					break;
			}
			break;
			
		case '24':
			
			switch(noImg)
			{
				case 1:
					desc.innerHTML = realisations_desc[realisationNo];
					break;
				case 2:
					desc.innerHTML = realisations_desc[realisationNo];
					break;
				case 3:
					desc.innerHTML = clicfrancais_mag_desc;
					break;
			}
			break;
	}
	
		
}

function RefreshImg(noRealisation, noImg)
{
	var img = document.getElementById('img_realisation');
	var titre_section = document.getElementById('realisation_titre_section');
	
	img.src = "img/bloc_contenu/realisations/" + realisations_img[noRealisation][noImg-1];
	img.alt = realisations_img_titre[noRealisation][noImg-1];
	titre_section.innerHTML = realisations_img_titre[noRealisation][noImg-1];
	
}

function getRealisationCount()
{
	var elems = document.getElementsByTagName('a');
	var cptElem = -1;
	
	for (i=0; i<elems.length; i++)
	{
		if(elems[i].className == 'lnk_realisation')
		{
			cptElem++;
		}
	}
	
	return cptElem;
}

function PreloadReaImg()
{

	if(document.images)
	{
		
		for (i=0; i<realisations_img.length; i++)
		{
			for (j=0; j<realisations_img[i].length; j++)
			{
				img_tmp = new Image(310,230);
				img_tmp.src = "img/bloc_contenu/realisations/" + realisations_img[i][j];
				
			}
		}
	}

}

//-->