Page Moodle du cours pour H2016.
Description
Le web est devenu un medium de communication incontournable qui ne pourrait exister sans l’informatique et les informaticiens qui continuent à le développer; il est donc essentiel que nos étudiants puissent assez tôt en comprendre les principes sous-jacents.
Le but du cours est d’initier les étudiants au développement Web moderne en motivant le balisage sémantique plutôt que de présentation. Les pages web devront être indépendantes de leur présentation pour en faciliter la réutilisation et la présentation sur plusieurs types d’appareils.
Les travaux pratiques de programmation sont importants car ils font partie intégrante d’une formation en informatique au même titre que les laboratoires dans les sciences traditionnelles. Ces travaux seront effectués dans l’environnement du réseau IRO. En plus de deux projets web de plus grande envergure, il y aura chaque semaine des exercices à compléter dans le cadre des démonstrations.
Manuel recommandé
Terry Felke-Morris, Web Development and Design Foundations with HTML5, Pearson Addison-Wesley, 2014.
Horaire
Jour | Heure | Lieu | Type |
---|---|---|---|
Lundi | 15h30-16h30 | Z-210 | Cours |
Mercredi | 11h30-13h30 | Z-337 | Cours |
Lundi | 16h30-18h30 | AA-1340 | Démonstration |
22 fév | 15h30-17h30 | N-615 | Intra |
25 avr | 15h30-18h15 | Y-115 | Final |
Le choix des salles n'est pas sous mon contrôle et est parfois changé sans préavis, donc dans le doute, faites plutôt confiance au formulaire insupportable de Synchro
Démonstrateurs
Pas encore connu.Évaluation
Il y aura 2 travaux pratiques (pour un total de 45 points) et deux examens de 25 points chacun, plus 5 points sur les exercices hebdomadaires. La note finale sur 100 sera convertie en note litérale à la fin du cours seulement, selon un barème qui dépendra de la moyenne du groupe et de la répartition des notes des étudiants. Un total aux deux examens inférieur à 25 points (i.e. la moitié des points) est éliminatoire.
Les travaux pratiques sont à faire en groupe de 2 (jamais plus, et très rarement moins). Les exercices sont à faire seuls. Et les examens se font à livre fermé: vous n'avez droit qu'à une page de notes (recto) écrite à la main, pas de livre ni de calculatrice autorisés.
Rappel
Le plagiat et la copie sont des fautes graves passibles de sanctions disciplinaires. Dans ce cours, nous prendrons toutes les mesures que nous jugeons nécessaires pour dépister et contrer ce genre d'activités.
Envoyez vos courriels depuis une adresse à umontreal.ca
plutôt que turlutu.fr
si vous voulez qu'il soient pris au
sérieux plutôt qu'ils tombent dans l'oubliette du dossier spam
.
La page Moodle du cours inclus un forum de discussions que je vous encourage à utiliser.
Notes de cours
Ces notes sont tirées de celles de Guy Lapalme, sauf les erreurs bien sûr.
IntroductionLangages de balisage
Validation XML
Balises HTML
Interlude Emacs
Feuilles de style
Images
Mise en page
Tableaux
SVG
HTTP et formulaires
Javascript
Sécurité
Vitesse
Démonstrations
Les données de chaque démonstration seront placées ici.
Les exercices sont à faire individuellement, pas en groupe.
Exercices 1 à faire à la démo du 25 janvier.
Exercices 2 à rendre avant la démo du 1e février.
Exercices 3 à faire à la démo du 1e février.
Exercices 4 à rendre avant la démo du 8 février.
Exercices 5 à faire à la démo du 8 février.
Exercices 6 à faire à la démo du 15 février.
Exercices 7 à faire à la démo du 7 mars.
Exercices 8 à rendre avant la démo du 14 mars.
Exercices 9 à faire à la démo du 21 mars.
Exercices 10 à rendre avant la démo du 4 avril.
Exercices 11 à faire à la démo du 4 avril.
Exercices 12 à rendre avant la démo du 11 avril.
Exercices 13 à faire à la démo du 11 avril.
Travaux Pratiques
Les travaux pratiques sont à faire par groupes de deux.
TP #1
La donnée du travail.
TP #2
La donnée du travail.
Liens pour Emacs
GNU Emacs est l'éditeur
recommandé dans ce cours pour écrire les programmes et les rapports.
Parmi les bonnes ressources pour ce qui a trait à Emacs, nous trouvons le
Emacs Manual en-ligne disponible dans le menu Help,
l'Introduction to Emacs Lisp dans le menu Help (sous-menu More
Manuals), le Emacs Lisp Reference dans le même sous-menu, la
commande 'i' dans ces manuels, le groupe de discussion
gnu.emacs.help, le
Wiki, et la "refcard" qui est
distribuée avec Emacs, dans un fichier nommé quelque chose comme
/usr/share/emacs/24.5/etc/refcard.pdf
.
Emacs est préinstallé sur toutes les machines GNU/Linux du DIRO. Pour l'installer sur votre propre machine, la procédure habituelle ressemble à:
apt-get install emacs24 emacs24-el emacs24-common-non-dfsg
(sur les systèmes GNU/Linux dérivés de Debian).
apt-get install emacs
marche aussi, bien sûr, mais les packages *-el et *-common-non-dfsg ajoutent de la documentation que je recommande.yum install emacs
(sur les systèmes GNU/Linux dérivés de Fedora).- Precompiled version for Windows.
- Precompiled version for Mac OS X.
Completion dans Emacs
Pour des raisons historiques, la completion en Emacs se fait par défaut avec la toucheM-TAB
, qui depuis quelques années est
généralement réquisitionnée par votre environnement (i.e. Emacs ne la reçoit
pas). Pour cette raison, je vous recommande d'ajouter la ligne suivante
dans votre fichier ~/.emacs
:
(setq tab-always-indent 'complete)
qui permet d'utiliser la touche TAB
autant pour faire
l'indentation automatique que pour faire la completion.
HTML5 dans Emacs
Par défaut, Emacs utilise html-mode
pour éditer les pages HTML,
qui est un mode d'édition trop permissif pour les besoins de ce cours (il
n'offre pas de validation) et plutôt primitif.
À la place, il vous faudra utiliser le mode nXML.
Cependant, Emacs n'est distribué à l'heure actuelle qu'avec le schéma de
HTML4. Vous pouvez corriger ce problème en installant le paquet
html5-schema
disponible dans GNU
ELPA. Pour ce faire, il suffit de démarrer Emacs et d'y faire: M-x package-install RET html5-schema RET
Une fois cela fait, Emacs utilisera le schéma HTML5 avec
nxml-mode
pour vos fichiers HTML.
Une autre manière de faire l'installation est de faire (toujours depuis
Emacs) M-x list-packages RET
qui devrait vous
donner une liste de paquets (qui devrait inclure html5-schema
)
et vous permettre d'en faire alors l'installation.
RelaxNG Compact dans Emacs
Le mode nXML distribué avec Emacs sait utiliser les fichiers au format RelaxNG Compact pour valider vos fichiers XML, mais il n'offre pas de soutient particulier pour éditer les fichiers RelaxNG Compact.
Donc avant d'éditer de tels fichiers, je vous recommande d'installer le
package rnc-mode
disponible dans GNU ELPA. Pour ce faire,
il suffit de démarrer Emacs et d'y faire: M-x
package-install RET rnc-mode RET