Rapport exercice PHP - STAF14

Natascha Michel (page travaux)

Le contenu

J'ai choisi un thème qui m'intéresse. J'ai suivi une maturité artistique et il y avait des cours d'histoire de l'art. Bien que les cours en soi de me passionnaient pas particulièrement, j'y ai appris quelques notions, surtout quant à l'art moderne qui m'a davantage intéressée. Nous n'avions pas été beaucoup plus loin. C'est pourquoi j'ai ciblé mon quizz sur l'art du 20ème siècle, avec quelques incursions dans l'art contemporain (bien que pour certain-e ces distinctions ne veulent pas dire grand chose).

De plus, en regardant les travaux des années passées, j'ai bien aimé le travail de Luis parce qu'il y avait des images et des informations en plus des réponses strictes aux questions. Ce questionnaire m'a servi pour concevoir l'idée de base de mon questionnaire.

Partant de mes souvenirs et de ce qui me plaît dans l'art, j'ai fait un peu de recherche sur Internet et dans un livre pour rédiger le contenu. Cette démarche a précédé la mise en pratique du questionnaire et du feed-back, car j'ai souvent tendance à me lancer dans le côté technique avant de vraiment savoir ce que je vais en faire, ce qui m'amène à recommencer plusieurs fois. Recommencer n'est pas négatif en soi, au contraire, ça me permet d'en apprendre beaucoup. Cependant cette fois ci j'ai voulu essayer une démarche plus rationnelle.

Cela a assez bien fonctionné, excepté un problème avec les images. J'avais fait un travail de recherche d'images, je les avais enregistrées et modifiées pour qu'elles s'adaptent bien à la page. Puis je me suis aperçue qu'ainsi je ne respectais pas les droits d'auteur-e-s. J'ai alors hésité à changer de sujets (après une journée entière à rédiger le questionnaire) puis finalement j'ai obté pour des liens vers des serveurs ayant eux-même reproduits ces images. Je suppose et espère qu'ainsi les droits d'auteur-e-s sont respectés... La mise en page a évidemment dûe être refaite, ainsi que quelques questions, lorsque les images ne jouaient vraiment pas sans être retravaillées.

Gestion du feed-back

J'ai eu envie de donner plus d'informations que simplement « c'est correct » / «  c'est incorrect ». J'ai pensé donner un feed-back de correction en fonction de l'erreur. Finalement je ne l'ai fait que pour deux questions ; celle qui demande quel est le mouvement qui pourrait qualifier l'art de Carlo et celle qui demande en quelle année à été peint Guernica. Je n'avais pas envie que les utilisateur-trices de mon quizz aient accès aux informations que j'avais récoltées seulement s'ils répondaient faux.

J'ai également choisi d'afficher des images différentes selon la réponse de l'utilisateur-trice. Là encore je ne l'ai fait que pour deux questions. À la première question, alors que je demande quelle oeuvre a été peinte par Malevitch, je montre dans le feed-back l'oeuvre choisie par l'utilisateur-trice. Cela l'empêche de voir l'oeuvre correcte mais il peut toujours la revoir en refaisant le questionnaire ;-). J'ai également choisi cette option pour les questions ci-dessus, dont le feed-back change selon la réponse.
Dans les trois cas, c'est l'oeuvre montrée dans le cas d'une réponse correcte qui est affichée s'il n'y a pas de réponse.

Lors des questions où plusieurs réponses devaient être cochées, j'ai compté deux points pour une réponse complètement correcte et un point pour une réponse en partie correcte (ce qui permet aux utilisateurs-trices du quizz de faire de toute façon un point, en cochant toutes les réponses). Ce ne serait pas idéal dans un contexte où l'évaluation est importante, mais ici c'est un quizz for fun :-). Toutes les autres questions valaient un point. Le nombre de point total est mentionné en haut de la page avec un petit feed-back du style « exellent » / « peu mieux faire »...

Le prénom / pseudo n'est pas vraiment utilisé, il est seulement repris dans le feed-back sur le nombre de points.

Ensuite, chaque réponse est détaillée, correcte ou incorrecte, et pourquoi - dans une mesure assez limitée si le quizz devait être vraiment utilisé, mais tout de même assez pour en apprendre un peu sur les sujets traités dans le quizz.

La mise en page

En début d'année j'ai conçu une feuille de style en pensant l'utiliser pour tous mes travaux, mais voilà que je m'en lasse déjà. La feuille de style de cet exercice est assez basique. La sobriété m'a paru encore plus importante que d'habitude avec la présence de nombreuses images.

Le questionnaire et le feed-back devait contenir des images, l'idée de travailler avec ce sujet était associée à l'envie de montrer de oeuvres qui me plaisent. Pour éviter une mise en page trop répétitive, j'ai voulu alterner l'alignement des images (à gauche ou à droite). Cela ne m'a pas été facile et j'ai été obligée d'utiliser des tableaux pour gérer la mise en page, après avoir essayé plusieurs méthodes en CSS. J'y ai passé beaucoup de temps.
Depuis quelques mois, je n'utilisais plus de tableau, puisque théoriquement on devrait pouvoir gérer l'affichage en n'utilisant que des div. À partir d'aujourd'hui, j'en utiliserais à nouveau si j'ai besoin de faire ce genre d'affichage compliqué, car cela représente un gain de temps assez incroyable.

J'ai également utilisé des solutions pas très élégantes pour gérer les espacements entre les unités affichées, comme des paragraphes ou des lignes de tableau vides. Je n'avais plus le courage de retoucher encore ma mise en page pour ajouter des classes supplémentaires à ma feuille de style...

Sur le plan technique : PHP

Je vais d'abord mentionner un petit problème avec l'utilisation de XEmacs : je n'avais pas le mode PHP et comme j'ai travaillé cet exercice juste avant la période 4 je n'avais plus vraiment le temps de demandé pourquoi / comment... Du coup j'ai travaillé en mode "fundamental" lorsque je travaillais sur le code PHP et en mode xml lorsque je travaillais sur le texte en XHTML. Je me suis un peu pris la tête pour l'indentation du PHP (et j'ai bossé sans la coloration syntaxique, arg !).

Finalement ce qui comptait était d'apprendre PHP. J'attendais ça depuis le début de l'année, PHP était un mystère pour moi jusqu'ici. Avant de commencer TECFA, j'avais tenté d'en apprendre les bases à l'aide de tutoriels sur Internet, mais je n'y arrivais pas. Je ne trouvais pas d'explications à mes questions de bases. L'introduction que nous avons eu à la semaine présentielles me les a fournies.

J'ai rencontré ma première difficulté dès le début. J'avais travaillé mon questionnaire en XHTML et je voulais que le feed-back soit également en XHTML, hors la déclaration d'encoding, dans une balise <?, générait une erreur php (étant lue comme du PHP). Comme ne pas déclarer l'encoding aurait était faux puisque j'utilise l'ISO-8859-1, j'ai cherché un peu sur Internet comment m'y prendre. J'ai trouvé sur ce site une solution qui consiste simplement à déclarer l'encoding dans une balise php avec echo. Cependant je n'ai ajouté cette balise qu'à la fin de la construction de mon feed-back car cela empêchait XEmacs de travailler en mode XML...

J'ai commencé par le plus simple, en reprenant la réponse à chaque question et en annonçant si c'était juste ou faux. La mise en place du feed-back pour les boutons radios fut assez facile, j'ai eu plus de difficultés avec les checkbox. J'ai relu les notes de DKS sur le sujet et me suis aperçue que je devais traiter les données dans un array en mettant des crochets dans le name de mes checkbox - ce que j'ai fais. Ensuite, il m'a fallu adapter l'exemple à mon cas.

Et là ça s'est carrément compliqué car j'ai dû comprendre que je devais utiliser des expressions régulières avec la fonction ereg. Je voulais afficher un feed-back différent selon que :

  1. toutes et seulement les bonnes réponses avaient été cochées ;
  2. toutes les bonnes réponses n'avaient pas été cochées ou elles étaient associées à des réponses incorrectes ;
  3. il n'y avait que des réponses incorrectes ;
  4. ou, bien sûr, l'absence de réponse.

Je pensais d'abord à une condition du type if ($_POST['question'] == "*reponse*") {$feed-back = "feed-back";}, mais j'ai trouvé ici que l'astérisque signifie plusieurs éléments précédents l'astérisque (donc e, en l'occurence...). J'ai testé différentes possibilités avec les astérisques, points d'interogations, parenthèses... et ne suis arrivée à rien. J'ai lu la fin de la page et ai alors pris connaissance de la fonction ereg. Je me suis aidée sur cette page pour comprendre mieux comment l'utiliser (syntaxe). Ereg m'a permis d'afficher mon feed-back comme je le voulais pour les deux questions checkbox de mon questionnaire.

Une dernière difficulté a été rencontrée alors que j'ai ajouté le error_reporting(E_ALL); en haut de mon fichier PHP. Des erreurs que je ne comprenais pas apparaissent et j'ai posté un message dans le forum de staf14. Après avoir lu la réponse de DKS, je me suis aperçue que le problème était le même que d'autres personnes de ma volée avait rencontré, lié à l'utilisation d'une variable qui n'existe pas.
En mettant mon code en place, je pensais avoir contourné ce problème, mais la condition que j'avais utilisé ne fonctionnait pas car elle-même faisait appel à la variable en question. Pour afficher le pseudo, par exemple, ma condition était : if ($_POST['pseudo'] != NULL) { $pseudo = $_POST['pseudo'] . ", "; }. Pour éviter le problème, j'ai ajouté une condition supplémentaire, ou remplacer la condition, selon les cas : array_key_exists('pseudo', $_POST).

Il y a quelques incohérences dans les formulaires (x)html... Il n'y a pas besoin du value dans les select, les différentes options du select doivent contenir des balises d'ouvertures et de fermeture pour que le code soit valide, alors que dans les input type radio, la balise doit être vide.

Et maintenant que j'ai quelques notions de PHP, la prochaine étape que j'attends : MySQL. Bon, puisque javascript, SVG et VRML m'intéresse aussi, je saurai patienter.

Sources

code PHP

Déclaration encoding XML dans une page PHP
Notes de DKS
Expressions régulières
Expressions régulières (syntaxe PHP)

informations histoire de l'art

Norbert Lynton (1980, 1989). L'art Moderne. Paris: Flammarion.
dadaïsme
guernica
art abstrait

images de tableaux

images Malevitch, Marilyn, Kandinsky, Klee
images Malevitch
images art brut
image Cézanne
images Picasso
image Picasso : Guernica
image Picasso : la vie
image Man Ray
images Facteur Cheval
images Palais du Facteur Cheval
image Duchamp
image dada
images Klee, Rothko, Mirò
image pop-art
Last modified: Sat Mar 05 16:39:13 Paris, Madrid 2005
Valid XHTML 1.0! Valid CSS!