Denis Poussart
revu le 25 mars 2001
Dans ce cours, vous présenterez la plupart de vos travaux en les déposant dans un site www. Ce document précise la raison d'être de cette approche et présente des conseils et consignes que je vous demande de bien prendre en compte.
Lorsque le www a commencé à devenir une ressource courante, beaucoup de professeurs l'ont adopté comme un moyen privilégié de diffusion d'information vers leur classe. C'est ainsi que de nombreux cours, dans nos programmes, sont accompagnés d'un site web où on retrouve diverses informations - notes de cours, exercices, notes bibliographiques, etc. J'ajouterais que nous avons une longue expérience en la matière: nous utilisons les ressources de l'internet depuis plus de 20 ans, et le site www du département compte parmi les plus anciens en Amérique.
Au cours des dernières années, j'ai eu l'idée d'utiliser aussi le www comme un véhicule de communication fonctionant dans l'autre direction, c'est-à-dire de l'étudiant vers le professeur.
Ou plutôt de l'étudiant vers ses collègues et le professeur!
En effet ce mode de communication m'est apparu comme susceptible de produire une dynamique de travail tout à fait nouvelle et potentiellement baucoup plus riche que celle - traditionnelle - où vous remettiez un document imprimé.
Dans le passé, j'avais déjà utilisé le moyen de communication par affiches, qui visait de semblables objectifs. Le www prolonge cette expérience de manière beaucoup plus puissante. Voici quelques années que je l'expérimente dans mes enseignements en système et je suis profondément persuadé que ceci constitue une utilisation puissante de la technologie www. Je vous invite donc à vous y investir avec détermination.
Simplicité et élégance plutôt que surcharge et feu d'artifice technologique!
Il existe un nombre énorme de volumes et documents traitant de la conception d'un site Web. Les outils pour le faire sont maintenant trés perfectionnés. Avec eux s'est considérablement accrue la possibilité - et le danger - de sur-utiliser les moyens technologiques au détriment de la clarté, de l'élégance bien maitrisée. Il ne faut jamais perdre de vue que votre site doit être facilement visible du plus grand nombre et que chaque utilisation d'une technologique exotique en diminue l'accessibilité et l'utilisabilité. Des pages surchargées, remplies d'animations qui n'ajoutent rien d'essentiel, sont le signe immédiat d'inexpérience de leur concepteur! L'expertise réelle se mesure à la capacité de savoir jauger les moyens à utiliser par rapport aux avantages et inconvénients qui les accompagnent. Dans le doute, la simplicité et l'élégance sont les meilleurs conseillères ...
Consulter sans faute le site de Jakob Nielsen, http://www.useit.com/jakob/, considéré comme une référence mondiale en matière d'interface personne-machine et imprégniez vous de sa philosophie. Regardez notamment le document Top Ten Mistakes in Web Design, http://www.useit.com/alertbox/9605.html. Nielson a récemment publié un volume qui résume le fruit de sa grande expérience, Designing Web Usability: The Practice of Simplicity. Si vous êtes sérieusement intéressé dans la création Web, obtenez le sans faute: http://www.useit.com/jakob/webusability/
Regardez la page d'entrée www.google.com, un excellent exemple de simplicité. Une parfaite introduction à la qualité de ce que beaucoup considèrent comme un des tout meilleurs engins de recherche disponble sur la planète!
Les documents suivants sont également des références de qualité:
Vous êtes instammnt priés de vous conformer aux exigences suivantes dans la réalisation de votre site.
Votre site doit pouvoir être transféré sur un autre serveur ou copié sur un CD sans exiger le moindre changement dans le libellé où la structure des adresses URL de vos propres documents. Ceci signifie que toutes leurs adresses doivent être relatives (et non absolues) par rapport à la page d'entrée. Seules les références externes sont absolues. Ayiez toujours en tête qu'à la fin du trimestre vous souhaiterez sans doute brûler un CD comme souvenir, ou inclure votre site sur votre CV qui lui aussi sera enregistré sur CD. Ce qui ne devrait être qu'une formalité de quelques minuytes se transformera en cauchemar si vous n'avez pas suivi cette consigne! A l'occasion, quand nous avons archivé certains sites, il nous a fallu perdre beaucoup de temps - et rédiger des scripts automatiques - pour corriger automatiquement (et vérifier) des centaines d'adresses...L'architecture du site est une pyramide dont le point d'entrée est un fichier que vous appelerez obligatoirement index.html.
Réfléchissez soigneusement à l'architecure et l'organisation de votre site avant de vous commettre dans son implantation. Identifiez les principales sections et sous-sections de manière cohérente et les repères de navigation. Comme pour le design du projet, il s'agit là d'un excellent investissement de votre temps, les erreurs initiales étant les plus coûteuses à corriger par la suite. Papier et crayon sont les meilleurs outils à cette étape. Valider cette architecture en rédigeant les documents clés sous la forme de fichier "bidon", qui ont déjà le bon nom qui dont le contenu est simplement du genre "ici on décrit le processus de validation de l'interface X". Le réel contenu sera écrit bien plus tard. N'oubliez pas le titre du document.
Les noms de fichiers doivent refléter leur contenu pas simple association logique pour faciliter le travail de conception et la gestion subséquente. Pour valider le nom, projettez vous dans le futur dans une situation où vous devez fouiller ...
Assurer vous que la largeur absolue de vos pages ne dépasse pas 700 pixels, de manière à garantir sa lecture sur tout moniteur raisonnable.Evitez les fonds de couleur sombre qui rendent typiquement la lecture difficile (par ex. une écriture jaune sur fond noir!). Rares sont les situations où on utilise de l'encre blanche sur du papier noir! De même éviter des fonds de texture complexes ou aggressives qui interférernt avec le confort visuel.
Evitez abolument toute animation ou clignotement qui n'ajoute rien et qui ne fait que ralentir le processus de chargement. L'animation est certainement une caractéritique qui peut ajouter une dimension irremplaçable en de multiples occasions. Par exemple une séquence vidéo illustrant l'exploration effectuée par votre robot ou un applet java illustrant les principes d'une stratégie de navigation peuvent être pleinement justifiés et ajouter beaucoup àa la compréhension de votre contribution. Mais utiliser java pour simplement animer une barre d'animation est un bon exemple de manque de maturité et d'inexpérience.
N'utilisez pas l'approche "frame" qui est source de grande confusion dans la cartographie mentale que se construit un usager quand il visite un site en plus d'entraver une fonctionalité élémentaire comme celle d'envoyer un URL à un collègue. Voir ce que Nielsen en pense! http://www.useit.com/alertbox/9605.html.
Valider la fluidité de navigation auprès de collègues / amis qui ne sont pas au fait du projet.
Une section décrivant les personnes impliquées, avec photos, deviendra un beau souvenir dans 10, 20 ans!
Ne recopier ni texte ni image sans donner crédit à moins que ceci ne soit évident du contexte où qu'il s'agisse d'informtion publique. Il est important de respecter les droits d'auteurs.
Un document html ne doit contenir que des informations encodées en mode texte, c'est-à-dire en ASCII 7 bits. Tous les caractères accentués doivent être représentés selon la convention ISO8859, par exemple "é" pour la lettre "é". L'encodage sur 8 bits varie avec les plate-formes (par ex. le code binaire du é sont différents sur Win et Mac). C'est précisément ce choix qui a fait du Web une application d'envergure planétaire. Je trouve encore trop souvent des pages incorrectes à cet égard.Pour une liste des caractères spéciaux et de leur codage, voir par exemple
http://mirror.subotnik.net/jkorpela/HTML3.2/latin1.htmlEviter de forcer l'utilisation d'une fonte spécifique.
N'utilisez pas les facilités d'écriture html qui sont maintenant inclues dans les logiciels de traitement de texte, comme Word ou Frame par exemple. Le code html ainsi généré est généralement obèse et franchement horrible, souvent avec des aspects proriétaires qui en limitent la portabilité.
Il existe de nombreuses ressources permettant de valider la qualité et la conformité du code html. Plusieurs sont gratuites et accessibles en ligne:
http://www.softwareqatest.com/qatweb1.html#VALIDATE.Par exemple, soumettez votre site à un engin tel que http://www.htmlhelp.com/tools/validator/
et vours recevrez rapidement un diagnostic.N'oubliez évidemment de soigner la langue, tant pour la syntaxe que pour l'orthographe.
Le format PDF est excellent pour produire un document destiné à être imprimé, notamment parce qu'il comprend à la fois texte et images et parce que son formatage est relativement bien protégé. Une copie PDF de votre rapport final devrait être disponible sur votre site.
Dans ce qui a précédé, je me suis placé dans le contexte d'un processus de communication technique, dont clarté, clarté et clarté doivent être les 3 qualités principales. Il s'agit d'une situation différente, par exemple, de celle d'une communication en marketing ou en commerce électronique. Mais si vous examinez par exemple The Art of E-Biz Web Design, http://www.informationweek.com/773/design.htm, vous constaterez que les mêmes principes de base sont pertinents.
Votre site est une expression de votre compétence et un reflet de votre personalité. Assurez-vous que sa qualité authentique vous rend justice!