DUCLAUX Jean-Jacques
Rapport Staf 2x Exercice 1
Objectif de l'exercice:
Analyser le code écrit précédemment
Isoler les disfonctionements.
Nettoyer le code, en adoptant une implémentation standardisée.
Conceptualiser les améliorations nécessaires.
Implémenter les modifications et ou fonctions supplémentaires.
Rendre l'utilisation du code possible par une tierce personne, en ajoutant des commentaires.
Démarche conceptuelle
La première phase a été une analyse de l'existant, le code de base étant celui-ci:
Formulaire HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Quiz sur l'ergonomie des sites web destinés aux enfants</title>
<link rel="stylesheet" type="text/css" href="my.css">
</head>
<body>
<h3>Quiz basé sur les critères d'ergonomie exposés dans un <a href="http://www.useit.com/alertbox/20020414.html">article</a> de Jakob Nielsen.</h3>
<h2>Pour connaitre le contexte et les critiques sur la réalisation de ce dispositif <a href="http://tecfa.unige.ch/staf/staf-i/duclaux/staf14/ex3/comment.html">rapport</a>
<FORM action="envoiform.php" method="POST" name="formulaire Ergo" enctype="multipart/form-data">
<p>Utilisez vous des illustrations ? <br> Oui <INPUT TYPE="RADIO" name="q1" value="1" id="1" checked >non <INPUT TYPE="RADIO" name="q1" value="0" id="1"></p>
<p>Utilisez-vous des effets sonores ? <br> Oui <INPUT TYPE="RADIO" name="q2" value="1" id="1" checked >non <INPUT TYPE="RADIO" name="q2" value="0" id="1"></p>
<p>Utilisez-vous desimages reactives au passage de la souris ? <br> Oui <INPUT TYPE="RADIO" name="q3" value="1" id="1" checked >non <INPUT TYPE="RADIO" name="q3" value="0" id="1"></p>
<p>est ce que vous placez le visiteur dans une metaphore ? <br> Oui <INPUT TYPE="RADIO" name="q4" value="1" id="1" checked >non <INPUT TYPE="RADIO" name="q4" value="0" id="1"></p>
<p>L'utilisateur scroll down pour acceder au contenu <INPUT TYPE="RADIO" name="q5" value="1"> <br>
Le contenu s'affiche entierement, pas de scroll down <INPUT TYPE="RADIO" name="q5" value="0" checked >
</p>
<p>Avez vous mis en ligne un guide pour l utilisation de ce site ? <br> Oui <INPUT TYPE="RADIO" name="q6" value="1" id="1" >non <INPUT TYPE="RADIO" name="q6" value="0" id="1" checked></p>
<p>Veuillez indiquer votre prenom <INPUT TYPE="TEXT" name="sender_surname" value="prenom" maxlength="80"> </p>
<p>Veuillez indiquer votre nom <INPUT TYPE="TEXT" name="sender_name" value="nom" maxlength="80"> </p>
<p>Adresse e-Mail <INPUT TYPE="TEXT" name="sender_email" value="Votre adresse" maxlength="80"></p>
<p>Des commentaires, des questions, n'hesitez pas !!!<TEXTAREA name="commentaires" rows="10" cols="40" wrap="VIRTUAL"></TEXTAREA></p>
<INPUT TYPE="SUBMIT" name="Envoyer">
</FORM>
</body>
</html>
Problèmes identifiés dans la version précédente:
-Le code n'est pas identé
-la syntaxe xhtml n'est pas respectée (exemple avec l'utilisation de balises <br>...
-Il n'y a aucun fichier php qui traite les données, le tout étant envoyé par mail
-Il n'y a pas de vérification des informations saisies
Afin d'améliorer la lisibilité j'ai déclaré les variables en début de script.
Utilisation exhaustive de commentaires au fur et à mesure de l'écriture du code.
Pour assurer une structure au code j'ai utilisé des boucles conditionnelles.
Utilisation d'une fonction, ce qui permet, si besoin est de pouvoir utiliser plusieurs fois une fonction sans répéter son code.
pseudo-code
1-supprimer l'affichage des messages d'erreur php
ceux ci n'ayant pas d'utilité pour l'utilisateur
2-/*récupération des données postées du formulaire html par la méthode post
attribution des valeurs postées à des variables afin de pouvoir analyser les données
par exemple vérifier si un champ n'a pas été remplis*/
3-//test si la variable $nom est vide
//si la variable est vide, celà signifie que l'utilisateur n'a pas répondu à la question
4-//dans le cas ou la variable est vide un message est affiché à l'utilisateur afin que celui ci remplisse
//Le champ en question
5-//test de la variable $prenom
6-affichage en cas d'erreur
7-//test si le champ mail est bien remplit
8-//test si l'utilisateur a bien répondu à la question
9-//renvoie un message dans le cas ou l'utilisateur n'a pas répondu
//le message indique la question à laquelle il n'y a pas eu de réponse
10-idem jusqu'à la question 6
11-/*validation de l'adresse mail extrait de :http://codewalkers.com/tutorials/73/1.html
cette fonction vérifie si l'adresse mail est bien formée
cette fonction vérifie également si le nom de domaine existe véritablment
*/
12-pattern d'expression régulière permet de vérifier la forme de la string passée à la fonction
13-rassemble les variables sous forme de tableau
14-renvoie TRUE si le domaine existe
15-affichage du feedback utilisateur
Evaluation de l'algorithme fonctionnel
Le dispositif implémenté est opérationnel, les données envoyées par le formulaire sont traitées par le fichier php. Les réajustements pour l'utilisateur sont donc possibles.
problèmes rencontrés:
La partie qui a été la plus complexe concerne le pattern d'expression régulière de la fonction eregi. En effet, nombreux sont les exemples sur internet, néanmoins leur fiabilité est assez rare.
Le pattern utilisé fonctionne, de plus il est complété par une partie du code qui vérifie si le domaine existe ou non, ce qui empêche notamment les adresses mail farfelues du genre jojo@nomDeDomaineQuiExistePas.chc.
Le code HTML du formulaire concernant cet exercice se trouve ici
http://tecfa.unige.ch/staf/staf-i/duclaux/staf2x/ex1/formulaire.html
Le code php qui traite les données envoyées par le formulaire se trouve ici
http://tecfa.unige.ch/staf/staf-i/duclaux/staf2x/ex1/verif.php
Les sources:
http://phpdebutant.org/
http://codewalkers.com/tutorials/73/2.html