Université de Montréal, École de bibliothéconomie et des sciences de l’information, Certificat en gestion de linformation numérique et maîtrise en sciences de l’information, 3 crédits.
Les cours ont lieu les mardis de 18h00 à 22h00 dans les locaux B-2245 du pavillon 3200 Jean-Brillant (cours théorique) et C-3001 du pavillon Lionel-Groulx (laboratoire).
Plan de cours au format pdf
Description
Historique du Web. Normes du W3C. Méthodologie de développement. Langage XHTML. Intégration de contenu multimédia. Feuilles de style CSS. Ergonomie et accessibilité. Design et graphisme. Intégration de JavaScript. Référencement. Sécurité.
Contenu du cours
Ce cours vise à introduire les étudiants à la conception et au développement de sites Web. Le contenu thématique du cours est divisé en trois parties principales :
- [T1] Internet et langage de balisage. Dans cette partie du cours seront abordés les concepts fondamentaux et les techniques avancées de conception et de développement de sites Web. Un volet de cette partie sera aussi consacré à la présentation de plusieurs aspects de l’Internet (navigateurs, consortium W3C, etc.). Après avoir distingué les différents langages de balisage, nous nous attarderons principalement sur la norme XHTML 1.0 strict.
- [T2] Feuilles de style. Cette partie du cours portera sur les principales techniques et méthodes de présentation des documents structurés. Nous présenterons de manière détaillée les principes et les caractéristiques de la norme CSS 2.1.
- [T3] Méthodologie de développement, ergonomie, accessibilité, intégration de JavaScript, référencement, sécurité et moteurs de recherche. Divers volets de la conception et du développement de sites Web seront présentés dans cette partie. Ainsi, nous exposerons des considérations traitant de l’ergonomie et de l’accessibilité des sites Internet. Nous traiterons, en outre, des divers formats de documents adaptés à la diffusion sur le Web. Nous présenterons quelques techniques de JavaScript, en insistant surtout sur leur intégration dans les documents XHTML. Finalement, nous présenterons les concepts fondamentaux de la gestion de projets Web, de l’indexation et de la recherche dans les sites Web.
Objectif général
À titre d’objectif général, ce cours cherche à développer chez les étudiants les habiletés intellectuelles et techniques nécessaires à la conception et au développement de sites Web. La réalisation de cet objectif implique que les étudiants soient en mesure, au terme du cours, de témoigner de leurs habilités à réaliser de manière concrète un certain nombre de tâches et d’opérations reliées au développement de sites Web.
Objectifs spécifiques
Au terme de ce cours, les étudiants devront être en mesure :
- d’identifier les principales étapes de l’histoire du Web et d’identifier les rôles des différents acteurs qui y sont associés;
- de créer des pages Web conformes à la norme XHTML 1.0;
- de créer des feuilles de style en cascade conformes à la norme CSS 2.1;
- d’intégrer dans des pages Web divers éléments (images, documents PDF, etc.);
- d’appliquer certains principes fondamentaux relatifs à l’ergonomie des sites Internet;
- de créer des pages Web conformes aux principes de base du Web Content Accessibility Guidelines 1.0 proposé par le Web Accessibility Initiative (WAI);
- de comprendre les principes fondamentaux du langage JavaScript et d’intégrer efficacement des scripts au sein de documents XHTML;
- de comprendre les concepts fondamentaux de la gestion de projets Web.
Méthodes pédagogiques
La majorité des cours seront divisés en deux parties : un volet théorique et un volet pratique.
Les volets théoriques, sous forme d’exposés magistraux et de démonstrations en classe, porteront sur les notions et techniques relatives à la matière étudiée. Lors de ces exposés, les étudiants seront invités à intervenir activement pour discuter de la matière au programme.
Les volets pratiques, sous forme d’ateliers en laboratoire, viseront à expérimenter les diverses techniques présentées. Ces ateliers, sous la supervision du responsable du cours, auront pour objectif d’approfondir certaines notions et de permettre aux étudiants une prise de contact directe avec les techniques et les logiciels vus en classe.
Pour ce cours, la présentation des exposés magistraux sera soutenue par des documents PowerPoint. Cependant, ces documents ne sauraient en aucun cas remplacer les exposés magistraux. La maîtrise des techniques et des concepts abordés dans le cours repose principalement sur la présence et la participation aux exposés et aux périodes de laboratoire. Les documents ne constituent donc que le support de diffusion pédagogique du contenu du cours. Les étudiants pourront télécharger ces documents à partir du site Internet du cours. Ce site Internet servira aussi de lieu d’interaction entre le professeur et les étudiants. Il est donc fortement recommandé de consulter régulièrement ce site. En plus des documents relatifs à chaque cours, des textes et des informations supplémentaires en rapport avec la matière présentée en classe seront mis à la disposition des étudiants.
Calendrier des activités
| Cours | Date | Contenu du cours | Remarques |
| 1 | 12.01.2010 | Exposé : [T1] Présentation du plan de cours et des modalités d’évaluation. Introduction : historique du Web |
|
| 2 | 19.01.2010 | Exposé : [T1] Introduction à XHTML, structure d’un document XHTML, balises de bloc et en ligne, texte, validation. Laboratoire : Conception d’une page Web intégrant des balises de base de la norme XHTML 1.0 |
|
| 3 | 26.01.2010 | Exposé : [T1] Liens hypertextes, images et multimédia (exemples). Laboratoire : Intégration des liens hypertextes, d’images et de fichiers multimédia |
|
| 4 | 02.02.2010 | Exposé : [T1] Tableaux, listes et formulaires (exemples). Laboratoire : Intégration de tableaux, de listes et de formulaires |
|
| 5 | 09.02.2010 | Exposé : [T3] Méthodologie de développement de sites Web (maquettes de documents). Laboratoire : Réalisation du TP1 |
|
| 6 | 16.02.2010 | Exposé : [T2] Introduction à CSS 2.1, gestion des couleurs, validation. Laboratoire : Conception d’une feuille de style de base respectant la norme CSS 2.1 |
Remise du TP1 |
| 7 | 23.02.2010 | Exposé : [T2] Bordures, marges et espacements, styles de texte, listes et tableaux. Laboratoire : Intégration de bordures, de marges et d’espacements, de listes et de tableaux, application de styles de texte |
|
| 8 | 02.03.2010 | Semaine de lecture | |
| 9 | 09.03.2010 | Exposé : [T2] Mise en page : dimension et positionnement. Laboratoire : Dimension et positionnement |
|
| 10 | 16.03.2010 | Exposé : [T3] Accessibilité Laboratoire : Modification du contenu d’une page Web selon le Web Content Accessibility Guidelines 1.0 |
Remise du TP2 |
| 11 | 23.03.2010 | Exposé : [T3] JavaScript Laboratoire : Intégration de JavaScript |
|
| 12 | 30.03.2010 | Exposé : [T3] Référencement et optimisation pour les moteurs de recherche | |
| 13 | 06.04.2010 | Exposé : Réalisation du travail final | |
| 14 | 13.04.2010 | Exposé : Réalisation du travail final | |
| 15 | 20.04.2010 | Examen final | Remise du travail final |
Évaluation
Pour réussir ce cours, il est essentiel d’assister aux exposés magistraux et de participer activement aux laboratoires. L’évaluation du niveau de compréhension des notions et de la maîtrise des habiletés techniques se fera au moyen de plusieurs évaluations.
Description détaillée de l’évaluation proposée
- Deux travaux pratiques (évaluation en équipe de deux personnes) [30%] :
- [15%] – Travail pratique 1. Création d’une page Web intégrant l’ensemble des concepts vus dans les cours 1 à 4. Remarque : le travail pratique 1 porte sur l’ensemble des concepts vus dans les cours 1 à 4 et mis en application lors des séances de laboratoire des cours 2 à 4. Ce travail pratique est la somme de la mise en application des concepts lors des périodes de laboratoire. La réalisation de ce travail pratique est donc directement reliée à la réalisation des exercices faits en laboratoire. La remise du travail pratique s’effectuera au début du cours indiqué dans le plan de cours.
- [15%] – Travail pratique 2. Création d’une feuille de style intégrant l’ensemble les concepts vus dans les cours 6 à 8 et application de cette feuille de style à la page Web du TP1.Remarque : le travail pratique 2 porte sur l’ensemble des concepts vus dans les cours 6 à 8 et mis en application lors des séances de laboratoire correspondantes. Ce travail pratique est la somme de la mise en application des concepts lors des périodes de laboratoire. La réalisation de ce travail pratique est donc directement reliée à la réalisation des exercices faits en laboratoire. La remise du travail pratique s’effectuera au début du cours indiqué dans le plan de cours.
- Un examen final portant sur l’ensemble de la matière vue en classe (évaluation individuelle) [30%].
- Un travail de session (évaluation en équipe de deux personnes). Création d’un site Web intégrant l’ensemble des concepts vus dans le cours [40%].
Notation
La notation de ce cours est faite selon un système littéral où chaque lettre correspond à un nombre de points selon le barème indiqué à la page 26 du Guide de l’étudiant.
Politiques
L’ensemble des politiques, règlements et directives énoncés dans le guide étudiant s’appliquent. Une attention particulière est à porter aux éléments suivants:
- Règlement disciplinaire sur le plagiat ou la fraude concernant les étudiants (Guide de l’étudiant, pp. 29-30). Toute infraction au règlement sur le plagiat ou la fraude sera traitée suivant la procédure indiquée dans le règlement.
- Délais et dates de remise des travaux (Guide de l’étudiant, p. 29). Tout retard non justifié dans la remise d’un travail sera sanctionné : 5% de la note est retranché par jour de calendrier de retard jusqu’à un maximum de 35%; à la 8ième journée de calendrier, la note F (échec) ou zéro est accordée.
- Qualité de la langue (Guide de l’étudiant, p. 28). Un maximum de 10% de la note globale d’un travail pourra être retranché pour la qualité de la langue.
- Il est attendu que tous les étudiants inscrits au cours respectent le code d’honneur de l’EBSI (www.ebsi.umontreal.ca/sout/code-honneur.html).
Ressources (liste de ressources mise à jour régulièrement)
Monographies
Addison, D. (2006). Web site cookbook. Sebastopol, CA, O’Reilly.
Barroca, C. (2003). Graphisme et ergonomie des sites Web. Paris, Dunod.
Batschelet, M. (2007). XHTML/CSS basics for Web writers. Upper Saddle River, N.J., Pearson Prentice Hall.
Engels, J. (2006). XHTML et CSS : cours et exercices. Paris, Eyrolles.
Krug, S. (2000). Don’t make me think! : a common sense approach to Web usability. Indianapolis, Ind., New Riders.
Lawrence, D. et S. Tavakol (2006). Balanced Website design: optimising aesthetics, usablity and purpose. Berlin ; New York, Springer.
Meyer, E. A. (2004). Cascading style sheets, the definitive guide. Sebastopol, CA, O’Reilly.
Morville, P. (2006). Information architecture for the world wide Web. Sebastopol, CA, O’Reilly.
Musciano, C. et B. Kennedy (2002). HTML and XHTML, the definitive guide. Sebastopol, CA, O’Reilly.
Negrino, T. et D. Smith (2004). JavaScript for the World Wide Web. Berkeley, CA, Peachpit.
Nielsen, J. (2000). Designing Web usability. Indianapolis, Ind., New Riders.
Nielsen, J. et H. Loranger (2006). Prioritizing Web usability. Berkeley, CA, New Riders.
Shea, D. et M. E. Holzschlag (2006). Le zen des CSS. Paris, Eyrolles.
Sites Web
Access-Key. Access-Key. Les clés de l’accessibilité. (Page consultée le 13 janvier 2009). (lien repéré par S. Roy, étudiante à l’EBSI)
AccessibilitéWeb. AccessibilitéWeb : pour un accès universel au Web. (Page consultée le 13 janvier 2009).
AccessibilitéWeb. Évaluation AccessibilitéWeb 2007 – Top 200 des sites Web accessibles au Québec. (Page consultée le 13 janvier 2009).
AccessiWeb. Accessibilité du Web – Label AccessiWeb – Critères AccessiWeb. (Page consultée le 13 janvier 2009).
Communautique. Le gouvernement en ligne pour les personnes handicapées. (Page consultée le 13 janvier 2009). (lien repéré par S. Roy, étudiante à l’EBSI)
Gouvernement du Québec. Version enrichie du standard sur l’accessibilité d’un site Web (version 0.2) (document PDF). (Document consulté le 13 janvier 2009).
Griffiths, P. HTML and CSS Tutorials, References, and Articles. (Page consultée le13 janvier 2009).
Lynch, P. et S. Horton. Web Style Guide, 2nd Edition. (Page consultée le 13 janvier 2009).
MeyerWeb. Browser history timeline. (Page consultée le 13 janvier 2009). (lien repéré par A. Crédeville, étudiante au doctorat à l’EBSI)
Neilsen, J. useit.com: Jakob Nielsen on Usability and Web Design. (Page consultée le 13 janvier 2009).
Section 508. The road to accessibility. (Page consultée le 13 janvier 2009).
University of Minnesota Duluth – ITSS. Web design references. (Page consultée le 13 janvier 2009).
W3 Schools. W3Schools Online Web Tutorials. (Page consultée le 13 janvier 2009).
W3Québec. Promotion des normes, standards ouverts et bonnes pratiques du Web et du multimédia au Québec. (Page consultée le 13 janvier 2009). (lien repéré par S. Roy, étudiante à l’EBSI)
Wikipedia. Type MIME. (Page consultée le 13 janvier 2009).
World Wide Web Consortium. World Wide Web Consortium. (Page consultée le 13 janvier 2009).