Articles étiquettés avec ‘ jquery ’

Articles étiquettés ‘jquery’


Site institutionnel du cégep de Saint-Laurent

6.2010 | Portfolio, Sites Internet

Page d'accueil au 14 février 2012

Employeur:
Le Cégep de Saint-Laurent, Montréal, Québec

Description du projet:
Dans le cadre de mon travail d’analyste-webmestre au cégep de Saint-Laurent, j’ai été le chef de projet et développeur en charge de la refonte complet du site Internet du Collège.  Le défi était de taille puisque le cégep dépendait d’un fournisseur externe pour la gestion et l’hébergement de son site et souhaitait se réapproprier l’ensemble du contenu, de l’hébergement et de l’expertise du site à l’interne.  L’ancien site comptait des centaines de pages intégrées à un CMS propriétaire qui n’avaient pas été mises à jour depuis plusieurs mois, voire année.  Il a donc fallu migrer, tirer, réorganiser et mettre à jour ce contenu dans une nouvelle plate-forme web interne.  En plus du contenu, nous devions repenser la coquille du site au complet, revoir la navigation afin d’améliorer l’ergonomie et l’expérience utilisateur pour l’internaute.

Pour réaliser ce projet, j’ai décidé de construire le site de la même manière que je l’avais fait le projet des zones d’études l’année précédente.  Chaque rubrique du site a donc fait l’objet d’une nouvelle « zone », c’est-à-dire un micro-site sur notre plate-forme WordPress 3.0 en configuration Multi-Site.  Au total, plus d’une vingtaine de sites supplémentaires ont été développés.

J’ai conçu un concept visuel qui reprenait aussi le travail des zones d’études effectués en 2009 en y apportant plusieurs améliorations.  D’abord, la navigation a fait l’objet de plusieurs « focus groupes » où des utilisateurs se sont prêtés à la technique de « tri de cartes », qui a permis d’accoucher à une navigation efficace.  La conception de la page d’accueil a aussi été tout un défi puisqu’il s’agissait de mettre en valeur le dynamisme du Cégep et avant tout, les programmes offerts.  Finalement, nous avons développées de nouvelles fonctionnalités afin d’améliorer l’ergonomie du site et l’accès à l’information pour les internautes.  En voici quelques-unes :

  • De nouvelles fonctionnalités permettant plus d’interactivité :
    • Un moteur de recherche intégré au site, basé sur la technologie Google
    • La possibilité de partager les pages du site sur les réseaux sociaux, comme Facebook et Twitter
    • La possibilité de choisir le thème visuel de la page que vous visitez (plus de 80 thèmes visuels ont été conçus au total)
    • La possibilité de signaler une coquille sur le site
  • Une plus grande visibilité offerte aux activités étudiantes et au rayonnement de nos étudiants
  • L’intégration des visites virtuelles qui permettent à l’internaute de visiter les locaux les programmes sur 360°

Dans ce projet, j’ai été aidé par une édimestre et une intégratrice web, en plus de divers comités qui m’ont épaulés dans mes choix.  Pour le détail des crédits, visitez cette page.

Tour guidé:

Un tour guidé web a été mis en ligne pour permettre à tous d’explorer ce nouveau site.  Visionnez-le en cliquant sur ce lien.

Composantes:

  • Développement d’un thème intelligent et spécifique pour WordPress 3.0
  • Conception de la ligne graphique avec Adobe Photoshop
  • Intégration de plusieurs effets d’animation grâce à jQuery, prettyPhoto et autres libraries Javascript open-source
  • Gestion du projet et coordination des différents acteurs impliqués
  • Formation du personnel
  • Compatibilité avec Firefox 3+, IE 6+, Safari 4

Technologies utilisées:

  • Côté serveur: PHP 5, WordPress 3, MySQL 5
  • Côté client: XHTML 1.1, CSS 2.1, jQuery

Status:

En ligne