Travail pratique 2 - WordPress.com

Corrigés des exercices du livre XHTML et CSS Jean Engels Éditions Eyrolles
2006. Exercices du chapitre 2. Exercice 1. La déclaration XML est-elle obligatoire
? ... <meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />.
Exercice 3. À quel emplacement est définie la DTD utilisée dans le document ?

Part of the document

Sommaire Identification D'un cours de 2 à 4 périodes qui a été donné 4 Explication briève de la place, le rôle du cours dans le programme et le
lien avec ce qui a précédé et ce qui va suivre cette partie de cours 4 Interprétation de l'énoncé de compétence rattaché à ce cours 5 Interprétation en terme de savoir, savoir-être et savoir-faire 6 Présentation des contenus essentiels couverts durant les périodes 7 Description des étapes du processus-type d'apprentissage impliquées 7 Présentation : comment cette partie de cours a été évaluée 9 Identification des articles de la PIÉA visées pendant cette partie de
cours 9 (1) Élaboration - Questions aux étudiants 10 (2) Début d'organisation - Capsules théoriques alternées avec les essais
10 (3) Début d'application - Le site d'essai-école 10 (4) Organisation - Tableau synthèse des connections 10 (5) Application - La décoration de son propre site web 11 (5) Évaluation sommative de cet élément du projet 11 ANNEXE : Résumé des activités du plan de leçon 13 (1) Élaboration 13 Questions aux étudiants 13 (2) Début d'organisation 13 Capsules théoriques alternées avec les essais 13 (3) Début d'application 14 Le site d'essai-école 14 (4) Organisation 14 Tableau synthèse des connections 14 (5) Application 14 La décoration de son propre site web 14 Annexe : extrait de la PIÉA (Cégep de Matane, 2010) utilisé dans ce travail
15 1.4 Principes généraux de l'évaluation 15 2.1 Règles relatives à l'évaluation 15 2.5 Modalités de participation au cours 15 3.1 Partage des responsabilités : L'étudiant 15 3.2 Partage des responsabilités : L'enseignant 15 3.2 Partage des responsabilités : L'assemblée départementale 15 Bibliographie 17 Identification D'un cours de 2 à 4 périodes qui a été donné
Le cours du 30 mars 2010 : Introduction aux feuilles de style CSS, une
leçon de 2 périodes.
Explication briève de la place, le rôle du cours dans le programme et le
lien avec ce qui a précédé et ce qui va suivre cette partie de cours
Explication juste de la place et du rôle du cours dans le
programme d'études 5% Il s'agit du premier cours de CSS dans le cours d'Interfaces utilisateur,
un cours de session II dans un cursus de 6 sessions menant au diplôme de
Technicien en informatique.
D'une part, le cours Interfaces utilisateur (aussi dénommé 'Conception
d'interfaces utilisateur') se situe du début du cursus académique en
Techniques informatiques car il sert à sensibiliser les étudiants aux
points de contact entre l'humain utilisateur et l'ordinateur qui rend un
service à ce dernier.
En résumé, l'ensemble du cours présente les sujets suivants :
. Ergonomie des interfaces, design
. Design de formulaires et choix des types de contrôles
. Programmation d'interfaces utilisateur sur le poste client (en Visual
Basic)
. Particularité de l'ergonomie des interfaces dans le contexte web
. Programmation d'interfaces web
Ce cours se situe donc dans le dernier sujet du cours : la programmation
d'interfaces web. La programmation d'interfaces web comporte
l'apprentissage de trois langages informatiques :
[pic]
Plus précisément, ce cours se place à la suite de l'apprentissage du HTML,
le langage de format de données pour les pages web, et précède le cours de
mise en page CSS et aussi le cours de Javascript car il est nécessaire de
savoir adresser les éléments du HTML avec les CSS, à l'aide d'étiquettes
(pouvoir connecter l'interface avec les fonctionnalités logicielles en
utilisant les mêmes étiquettes) avant de prétendre à faire des mises en
page web.
Pour plus de détail, il convient de consulter l'outil de communication
(Lévesque, 2010) qu'est le plan d'études (St-Amand, 2010).
Interprétation de l'énoncé de compétence rattaché à ce cours
Analyse juste et cohérente de la cible de formation visée dans le
cours 3% Voici l'énoncé de compétence rattaché à ce cours tel qu'il est présenté
dans le plan de cours (St-Amand, 2010) et qui provient du devis ministériel
de notre programme (Ministère de l'éducation). |Éléments de la compétence|Critères de performance |
|5. Procéder à la |5.1 Création des éléments selon les |
|programmation de |caractéristiques de présentation choisies. |
|l'interface utilisateur. | |
| |5.2 Positionnement des éléments selon |
| |l'organisation spatiale retenue. |
| |5.3 Établissement des liens entre les éléments|
| |et les programmes de l'application. |
| |5.4 Validation du fonctionnement de |
| |l'interface. |
Cet énoncé de compétence est formulé d'une manière assez générale puisque
dans mon domaine d'enseignement, les connaissances, les technologies et les
manières de faire en interface évoluent très rapidement en plus de dépendre
de diverses orientations, plateformes sous-jacentes, des acteurs influents
et des écoles de pensées.
Il serait utopique de vouloir présenter dans un seul cours collégial toutes
les diverses manières de faire des interfaces dans les divers
environnements et plateformes. Juste pour les interfaces utilisateurs, il
faudrait créer une AEC pour présenter exhaustivement toutes les techniques
et toutes les approches ! Par ailleurs, cela ne serait que de peu
d'intérêt pour la majorité de nos étudiants, certaines de ces approches
seraient déjà dépassées à la fin de leurs études ! et nous ne formons pas
des graphistes mais des programmeurs-analystes pour qui les interfaces ne
sont qu'un des aspects d'un bon logiciel.
Dans notre département, nous avons interprété cet élément de compétence en
regard de l'état actuel de la pratique en informatique. Notre veille
technologique (et l'expérience du milieu par certains) a révélé
qu'il existe trois grands type d'interface utilisateurs et qu'il serait
nécessaire de familiariser les étudiants avec deux de ces trois univers
pour le moment : les interfaces des logiciels d'ordinateur et les
interfaces web alors que les interfaces embarquées pourraient
éventuellement faire l'objet d'une spécialisation.
Puisque la seconde moitié de 420-234-MT Interface utilisateur est consacrée
au web, c'est dans cette partie du déroulement du cours que s'insère
l'enseignement et l'apprentissage de l'élément de compétence visé (Procéder
à la programmation de l'interface utilisateur) dans le contexte du
développement web.
Nous avons choisi d'enseigner pour ce faire la manière la plus standard de
l'industrie, celle appuyée par les formats libres et ouverts. Les outils
enseignés, les langages (XHTML et CSS) ont donc de grande chance d'exister
tout au long de la carrière de nos étudiants et même d'être à la base de
futures évolutions du web.
NOTA : l'apprentissage de cet élément de compétence dans le contexte des
logiciels sur ordinateur se fait dans la première moitié du cours avec le
langage Visual Basic pour une introduction puis se poursuit à la session
III avec le cours de Java. Tous les critères de performances sont
travaillés au long de ce cours introductoire Interface utilisateur.
5.1 Création des éléments selon les caractéristiques de présentation
choisies.
Les étudiants ont d'abord été invités lors des cours précédents à faire la
différence entre la nature des éléments et leur présentation. Avec le
cours sur les CSS il leur sera maintenant possible d'attribuer les
caractéristiques de présentation désirées SANS POUR AUTANT DÉNATURER la
qualité des éléments choisi (les deux sont indépendants). De nombreuses
activités ont servi à faire cette nuance et à la garder en tête.
5.2 Positionnement des éléments selon l'organisation spatiale retenue.
La leçon analysée dans le présent exercice sert de préalable afin de
pouvoir mettre en ?uvre le positionnement. En fait l'étiquetage et
l'association de déclaration décoratives CSS est une habileté nécessaire à
cette performance ainsi que la connaissance et la maîtrise des propriétés
de positionnement et dimensionnement des objets XHTML. 5.3 Établissement des liens entre les éléments et les programmes de
l'application.
C'est très exactement et précisément le critère de performance qui est
travaillé lors de cette leçon. Les étiquettes apposées dans le XHTML
permettent de faire le lien entre les éléments décoratifs CSS et le
programme (qui est ici présenté par le XHTML).
5.4 Validation du fonctionnement de l'interface.
Deux techniques sont utilisées pendant la leçon pour valider le
fonctionnement de l'interface.
. Premièrement, des validateurs XHTML et CSS (ce sont des outils
logiciels) permettent de valider la conformité technique du langage
employé (langage sans faute, comme du français sans faute).
. Deuxièmement, l'inspection visuelle permet de vérifier rapidement si
la décoration s'est appliqué tel que désiré, donc si les bons choix
ont été fait et si les déclarations ont l'effet voulu.
Interprétation en terme de savoir, savoir-être et savoir-faire
Voici donc notre interprétation de l'énoncé de compétence
SAVOIRS : syntaxe des déclarations CSS, des liens CSS-XHTML (notion de
sélecteur) et des étiquettes XHTML
SAVOIRS-ÊTRE : ne pas confondre la nature des fonctionnalités et leur
présentation qui sont dissociables et doivent êtr