You are on page 1of 17





 
1. Une formation pour les enseignants.
Dans le cadre du projet "Le Campus Virtuel"1, il s'est avr ncessaire de former les personnes devant crer les documents pouvant tre visualiser par les enseignants et les lves de l'universit. Mais les former quoi? La liste des cours tout comme la spcification de leur contenu a t dfinie par des groupes de personnes comprenant des informaticiens, des enseignants, pdagogues, etc. Afin de les mettre disposition, ils doivent tre mis sous une certaine forme que je qualifierai "d'lectronique". Le projet a adopt le WEB et ses technologies comme support de l'information. Plus prcisment, l'information sera consultable au travers de fichiers pouvant tre de diffrents formats : HTML, images (JPEG et GIF), son RealAudio, WAV ou AU, vido QuickTime, AVI ou MPEG, etc. et ceci partir d'un navigateur Internet. L'quipe du Campus Virtuel a alors dcid que ce devait tre aux enseignants de raliser les documents et ce pour plus de flexibilit. La majorit des enseignants utilise quotidiennement des micro-ordinateurs de diffrentes sortes (PC, Apple Macintosh, Station de travail) et sous diffrents systmes d'exploitations (Windows 95 et NT, Linux, IRIX, Solaris, MacOS). Nanmoins, j'ai not des niveaux d'habilit comprendre leur fonctionnement, les manipuler, utiliser avec aisance tel ou tel logiciel (principalement en rapport avec le WEB). Il s'est donc rvl ncessaire d'organiser des sessions de formations des enseignants. Elles avaient pour buts : d'introduire la cration de document WEB par un petit historique du rseau, d'enseigner les diffrentes phases de la conception d'un site, de mettre en pratique ces enseignements au travers de travaux concrets, tel que la ralisation de pages WEB avec un outil simple et facilement accessible. Dans la partie suivante seront prsentes les diffrents thmes abords lors de la formation des enseignants. C'est en quelque sorte le cours que j'ai donn ces enseignants. Il avait une vocation plus gnrale que la ralisation de documents pour le projet Virtual Campus. En effet, il a souvent t accompagn par des rappels et/ou une initiation l'environnement Windows 95 et l'utilisation de PC.
1

Information disponible l'adresse suivante : http://www.unimas.my/html/fit_research.html

2. Conception : la phase la plus importante.


Derrire un site Internet, on entend trop souvent qu'il n'y a que du code HTML. Certes, cela est vrai mais cette phase de codage, comme lors de la ralisation d'un programme informatique, doit toujours tre prcde par une phase de conception.

Pourquoi un site Internet?


Avant mme de poser le moindre doigt sur le clavier, il convient de se poser une question qui peut paratre simple mais qui est trs importante : "Quel est mon objectif en crant un site Internet?". Vaste question il peut y avoir un tas de raisons qui font que j'ai besoin de crer un site car l'Internet offre aujourd'hui des possibilits (avec un certain avantage au niveau financier) qui n'taient pas accessibles auparavant. Dans tous les cas, il faut absolument, dans la mesure o le site n'est pas personnel, valuer son audience (s'il est personnel, rien ne nous empche d'en parler autour de nous, commencer par soi-mme). Voici quelques raisons qui peuvent tre voques ; elles sont classes par intrt (la liste n'est pas exhaustive) :

"Je veux crer un site pour"


Promouvoir un produit, un service Vendre un produit, des services Informer sur mon entreprise Amliorer l'image de mon entreprise /

 

Informer le public sur mon universit, ma facult Publier des cours

 
Parler de moi

Publier une information utile sur un sujet, une Diffuser des publications exprience personnelle Rechercher un emploi Informer les tudiants sur Informer les cours, examens Rencontrer des gens Enseignement interactif Devenir clbre  / /

Pour qui? qui est-il destin?


Une fois l'objectif bien cibl, il convient alors de se poser cette question. En effet, " qui je destine principalement mon site?". Certes, dans certains cas, seul "mes clients" par exemple ou "le personnel" de ma facult y aura accs ; tout dpend de

l'objectif. Quelques autres cibles possibles : des amis, des journalistes, des graphistes, mes tudiants, des entreprises du BTP mais cela peut aussi tre destin des gens ayant un accs rapide, ceux qui ont la dernire version de tel navigateur Exemple : lment appartenant la fiche des personnes cibles pour l'objectif suivant : proposer un cours sur le langage Java.

 
        
     

            

 
 
          

Voici d'autres critres dont il faut tenir compte :        : il peut permettre de dterminer les couleurs utiliser et la typographie (couleurs vives pour des enfants, taille de la police plus importante pour des personnes ges) ; le langage utiliser, etc.  
 
 
 : permet de dterminer le temps passer par la personne sur le WEB. On inclut galement le pays o se trouve la personne. Un professionnel aura plus tendance aller directement l'information dont il a besoin alors que, par exemple, "un surfeur" se baladera volontiers sur tout le site, suivant son intrt.       
 : la plupart des surfeurs paye pour avoir un accs a l'Internet. Cette information est surtout importante si vous dsirez vendre un produit mais aussi si votre site se veut riche du point de vu du graphisme.   
  
  : votre page devra tre au niveau du lecteur cibl: aurat-il besoin d'tre guid? Aurons-nous besoin de lui indiquer explicitement o chercher les informations?   
  !    : ces lments sont trs importants car ils conditionnent la ralisation du site. La rapidit de chargement, dpendant aussi de la machine, ne sera pas la mme si l'utilisateur est derrire une ligne T1, un modem 28800 bps, une ligne ISDN, etc.  "  #
$#
 
 % : votre site doit tre lisible et ces lments doivent tre pris en compte pour que cela ne pose aucun problme au public

vis (utilisation de plug-ins, effets sonores, millions de couleurs au niveau de l'affichage). /

En rsum, il faut se mettre en tte qu'avant de commencer tout dveloppement, il est impratif de savoir pourquoi je vais crer un site WEB, qui va le consulter et l'utiliser et comment il va tre utiliser? Tous ces lments permettront, en partie, de raliser un bon site WEB, tant au niveau du fond qu'au niveau de la forme.

Consultation et organisation du site.


Un site Internet qui n'est pas personnel ne se fait pas tout seul. Qu'il soit pour une entreprise, une universit ou un organisme, il est trs important de consulter son entourage dans le cas o l'on aurait t nomm "responsable" de la ralisation du site. Un Brainstorming? C'est cela mme! Aprs avoir fait sa petite sance, le responsable a une bonne liste (qui peut devenir trs importante suivant le type de site a crer) d'ides, de mots... Vient alors la phase de tri puis une organisation cohrente qui permettra, entre autres, de crer la structure du site, son squelette. Exemple : Page personnelle d'un tudiant.

Page principale
Informatique Histoire Linux Java POV-Ray Musique Groupe IAM DISCO Folklore Voyages Maroc Syrie Bolivie Malaisie
Introduction La culture Le paysage La technologie

Cuisine Th Couscous Tagine

Dans la mesure o l'on a consult des gens pour avoir des ides, il convient de valider avec eux la structure du site. En rgle gnrale, il vaut mieux consulter chaque tape plutt que de tout recommencer!

L'organisation doit tre cohrente et bien gre afin permettre l'utilisateur cibl de raliser ses objectifs, c'est dire ce pour quoi vous avez cr ce site. De plus, un site mal construit sera difficilement maintenable et son volution peut se trouver compromise. C'est au crateur de bien faire attention ce travail qui doit tre fait en amont. Une chose laquelle il faut aussi penser et qui a son importance : consignez ce que vous faites dans une "petite base de donnes" qui ne doit pas tre ncessairement informatise (mme si cela est conseill). En effet, afin de faire voluer un site, une page, il est impratif de savoir quelle a t la taille, la couleur de la police utilise pour les images par exemple, les filtres pour les photos, etc.

Charte graphique.
La charte graphique peut tre dfinie comme tant une convention graphique adopte par le(s) concepteur(s) d'un site. Cette convention touche plus particulirement l'aspect, la prsentation des pages. Cette phase de conception peut son tour tre divise en trois : 1. En effet, le premier point qu'il convient d'aborder concerne tout ce qui touche au contenu mais qui va conditionner l'aspect. Nous sommes alors amens nous poser les questions suivantes :


       
 
    
  
 
          
              

  ! " 
       #
2. Le second point est directement li l'aspect "prsentation", graphique et artistique (les deux ne sont pas indpendants) :


   
  $%   & 
    $  
& '%
  (  $
  ( & )
  $ *& + 
 , -
  . 
 /  01

3. Le troisime et dernier point relve du choix des technologies utilises par le site WEB. Un commercial dsirant vendre un produit n'aura pas la mme dmarche en ce qui concerne la conception et la ralisation qu'un enseignant voulant publier des articles ou ses cours. L'analyse au pralable de la catgorie de personnes vises dterminera alors ses possibilits principalement matrielles et les ventuelles technologies pouvant tre utiliser.

2 .  345 6 0


 7 4' 2 8  /  01 032 9       + 
 , -
  . 
 /  01
Si de nombreux utilisateurs se sentent l'aise en parcourant un site dont le fond les intresse, ils resteront volontiers plus longtemps et apprcieront cette exprience. L'interface homme/machine joue un rle important. Nous sommes souvent tents d'tre diffrents et originaux au niveau de la cration d'interfaces. Ce sera sans doute le cas, en prenant l'exemple d'une facult des arts. Mais il ne faut pas oublier une chose : le public que nous avons en face de nous ragit plus facilement et est plus l'aise devant une "interface conventionnelle". Oui, on peut parler du paradigme "Interface conventionnelle" car il gravite tout autour de cette expression des termes, des images, des habitudes d'utilisateurs et autres "raccourcis clavier", etc. Illustrons-nous par quelques exemples.



  
   
        
 

      


     
  
       !   
"  #$   
!     

Mais il n'est pas toujours facile de trouver une image reprsentative d'une page, d'un chapitre On pourrait se contenter de textes mais reproduire exactement un document texte n'a que peu d'intrt. Ainsi, comme dans ce dernier exemple, il est possible d'indiquer directement quoi correspond la rubrique. Pour ceux qui ne dsirent pas intgrer de texte, les dernires versions des navigateurs les plus utiliss2 utilisent une information que le concepteur peut donner lors de la phase de programmation. Lorsque l'internaute passera la souris au-dessus de l'image, une petit "rectangle" apparatra et affichera cette information. Du point de vu du codage HTML, on utilise l'option ALT dans la balise IMG. <IMG SRC="photo/jamah.jpg" ALT="Place Jamah-al-Fna" ALIGN=LEFT WIDTH="135" HEIGHT="102" BORDER="0">

L'utilisation directe d'un sous-titre avec l'image reste ce qu'il y a de plus utilis car tout le monde (notamment les entreprises) n'a pas la dernire version du dernier navigateur la mode. Exemple :

 
   

 
   

   

Netscape Navigator 4 (http://www.netscape.com) et Internet Explorer 4 (http://www.microsoft.com)

Le fait de suivre cette technique ne doit pas tre vu comme une contrainte. Il peut arriver, toujours en fonction du public vis, que cela ne corresponde finalement pas aux objectifs fixs. Il faut surtout conserver une certaine cohrence ; si par exemple, sur une page se trouve un dessin reprsentant un journal (lien vers les nouvelles sur l'universit), ce journal, prsent sur une autre page doit renvoyer vers le mme lien.


Responsable de la cration de l'environnement (esthtique) du site, les utilisateurs ne doivent rencontrer aucune difficult pour "fureter". Que l'on utilise les dessins ou icnes les plus standards ou ses propres crations, une certaine cohrence avec l'arborescence et l'ergonomie gnrale du site doit tre prsente.

Mise en page
La matrise de la mise en page d'une page WEB n'est pas aussi facile que celle d'un document au format A4 par exemple. Nous pouvons dj le constater pour du simple texte. Mettre fin a un paragraphe doit se faire par l'ajout d'un TAG spcial. De plus, suivant la rsolution de l'cran et la taille de la fentre du navigateur, le retour la ligne ne se fera pas ncessairement au mme niveau.

Lorsque l'utilisateur change la taille de sa fentre ou la rsolution de son cran, des barres de dfilement (scrolling) apparaissent horizontalement et verticalement ( moins qu'elles ne soient dj prsentes). Mme si leur prsence est ncessaire pour la lecture du site, ces lments peuvent se rvler gnant au niveau du design mais aussi au niveau de la facilit de lecture. Nous serions alors tents de crer un document, de l'enregistrer sous la forme d'une image et de le publier directement. ce niveau, nous serions confronts un srieux problme de temps de chargement de cette image, mme pour une consultation

Site officiel de la NBA http://www.nba.com La superposition de couches (layer) a permis l'incrustation de l'image par-dessus le texte. Avec de simples tableaux, il a t possible de crer des colonnes et d'y insrer des images.

en local ou en Intranet! Cela dit, avec l'avnement de nouvelles techniques dont celles incluses dans la norme HTML 4.03, il devient possible de publier un document comme s'il tait une page de magazine. cela s'ajoute bien sr les dernires technologies du monde multimdia : vido, son, animation, interactivit qui demeurent, certes, gourmandes en bande passante. C'est ce que le WEB apporte de plus par rapport aux moyens de communication traditionnels. Il convient toujours de vrifier que le public vis possde les outils ncessaires la visualisation du site. Comme nous l'avons vu prcdemment, la rsolution de l'cran a son importance. Dans la majorit des cas, les rsolutions possibles sont les suivantes (en pixels),: 640x480, 800x600, 1024x768 et 1280x1024. Le nombre de couleurs (o plutt de nuances) est soit de 16 (codage sur 4 bits), 256 (codage sur 8 bits), 65.536 (codage sur 16 bits) ou 16.777.216 (codage sur 24 bits). Dans un souci d'harmonisation des diffrentes pages qui composent le site, il convient de conserver tout au long de la phase de cration la mme charte graphique et la mme mise en page. Il peut y avoir des cas ou un changement de style peut sembler tre naturel (exemple : un voyageur qui raconte ses aventures et dont le style change en fonction de la destination). On peut, afin d'tre aid, crer un storyboard. Cette technique est gnralement utilise afin de planifier les squences d'un film, d'une animation, d'une prsentation multimdia, etc. Dans le cas d'un site, cela permet la fois de visualiser la prsentation graphique (positionnement, etc.) mais aussi de reprer facilement les liens entre les diffrentes pages et leur position par rapport l'ensemble du site.

Couleur, police et style.


Ces trois lments doivent tre vus comme de vritables atouts dans le design d'un site et nom comme une contrainte. Ils nous aideront mieux faire passer le message et le mettre en valeur.

Informations disponibles sur le site du World Wide Web Consortium (http://www.w3c.org)


 
Avant de faire un choix quelconque, il faut avoir en tte que l'harmonie des couleurs est importante et que certaines couleurs et combinaisons peuvent convaincre (pas directement) alors que d'autres peuvent rebuter. On utilise plus volontiers des

dnominations spciales pour dfinir des couleurs et autres nuances, qui ont plus tendance suggrer, faire ressentir ce que l'on dsire faire passer par son intermdiaire. On ne parlera de "code HTML" ou de "valeur RGB" que pour la ralisation. Quelques exemples :      Bleu ocan Orange flamme Vert naturel Rouge romantique Blanc troublant

Par ailleurs, il est aussi possible de jouer sur d'autres paramtres afin de donner l'effet voulu par la couleur comme le contraste, la correction gamma, les valeurs RGB, etc. L'apprciation d'une couleur peut aussi se rvler tre "standardiser" par nos habitudes et notre culture. En effet, par exemple, les gens associent trs souvent le rouge "STOP" ou "HOT" et le vert "GO". Voici une petite liste des associations les plus courantes :

Choix des couleurs Avec l'outil Paint Shop Pro 5 (http://www.jasc.com), il est possible de choisir les couleurs ou les nuances.

Rouge
Chaleur Stop Tristesse Jalousie Eau Beaut Erreur Mlancolie Dbutant Homme Enfant Islam Agression Feu

Marron
Salet

Vert
Nature

Bleu
Paix

Rose
Femme

Ces thories sur les couleurs ont t tudies depuis longtemps par des mdecins, des psychologues, des artistes La littrature ce sujet abonde mais comme indiqu prcdemment, ce ne sont que des thories : on ne peut pas dire qu'il y ait vraiment des rgles respecter absolument. Par contre, le choix des couleurs doit tre judicieux afin de permettre une bonne lecture des pages. En effet, choisir un texte en bleu fonc sur un fond noir rend le document tout simplement illisible.

      
Par dfaut, les navigateurs Internet utilisent une certaine police de caractre ayant une certaine taille. Par exemple, pour Netscape Navigator, la taille par dfaut est de 12 points et la police est Times Cette police est Roman. normalement disponible sur de trs nombreux systmes (plus ou moins Changement de la police rcents) existant : Windows 3.x, 95 Dans le navigateur Netscape Navigator, l'utilisateur a la et NT, UNIX, Solaris, IRIX, AIX, libert de choisir la police par dfaut. Linux, MacOS, etc Lorsque nous travaillons sur un document devant tre par la suite imprim puis publi, nous pouvons utiliser n'importe quelle police et style de caractre car le support final est la feuille de papier. Or, dans le cas de l'Internet, le "support final" sera le poste client qui ne possde pas ncessairement les polices que vous utilisez. Ce sera le concepteur, qui, en fonction du public vis, dcidera si telle ou telle police de caractre devra tre utilise. Par exemple, dans le cadre du projet "le campus virtuel", les tudiants et les enseignants qui auront accs au systme le feront au travers de micro-ordinateur de type PC quip du systme d'exploitation Windows 95. Par consquent, l'utilisation des polices du systme est possible. Malgr cela, un autre problme est prendre en compte. L'utilisateur a la possibilit de changer la police utilise par dfaut par son navigateur ce qui peut affecter ou pas votre design. Le choix de la police (ou des polices), des tailles, etc doit se faire judicieusement pour qu'il n'y ait aucun problme de lisibilit et que le parcourt du site se fasse le plus confortablement possible. On espre dans la plupart des cas que l'utilisateur ne va changer la police par dfaut et sa taille, ce qui est d'ailleurs trs souvent le cas.

    
En rgle gnrale, il est convenu qu'une moyenne de 60 caractres par ligne permet une bonne lecture d'un texte. En effet, des lignes trop longues fatiguent et ne facilitent pas la lecture et la comprhension d'un document. Un texte sur une seule et longue ligne par exemple ne permet pas aux yeux de s'arrter et il est plus facile de perdre le fil. Un document WEB, s'il ne contient que du texte brut (mme avec des retours la ligne) sera interprt par le navigateur de cette faon : les retours chariots ou sauts de paragraphes ne seront pas reconnus. Le navigateur affichera alors le texte, jusqu' la fin de la fentre puis ira la ligne. Le mise en page s'effectue avec des balises HTML spciales. Deux exemples (les balises sont en bleues) : 1. <P>Le texte que je veux mettre en page</P> : Cration d'un paragraphe ; l'option ALIGN permet d'aligner le texte gauche (option par dfaut), droite ou de le justifier. 2. Un texte seul<BR> : Retour la ligne. Aujourd'hui, des outils avec des interfaces graphiques trs volues permettent de crer des documents publiables sans entrer la moindre ligne de code HTML : en les utilisant, les retours la ligne effectus par le dveloppeur sont pris en compte.

Le magazine Net@scope (http://www.netscope.org) a choisi une prsentation par colonne : Titre en haut, sommaire gauche, nouveaut au centre Les articles sont aussi prsents en colonnes.

La mode sur le Ouaib4 est aux colonnes, et oui, il y a aussi des cyber-modes! Il est clair que les colonnes rendent la lecture d'un texte plus facile. Une preuve? Les journaux ont conserv cette faon de mettre en page le texte depuis plus d'un sicle et les lecteurs ne s'en plaignent pas. Pour le cas d'un site, il faut bien entendu veiller sur la bonne prsentation des informations mises en colonnes, l'espacement entre ces dernires, leur largeur, longueur, etc.

Images et graphisme
Le WEB volue une telle vitesse qu'il devient de plus en plus difficile de le suivre. Nous sommes loin des premiers pas, navigateurs, prestataires, etc. Aujourd'hui, il est rare de rencontrer une page sans illustrations graphiques. C'est sans doute l'un des lments qui l'a rendu aussi attirant et c'est dans ce but qu'elles doivent tre utilises : relever le contenu du site, moins que, par exemple, le site ne soit consacr une exposition photographique ou artistique. Cela dit, l'absence de contrle de l'insertion d'images peut se rvler dsastreux. En effet, personne n'a envie d'attendre une heure devant son poste le temps qu'une simple image s'affiche, surtout si elle n'est pas ncessaire la comprhension d'un document (une illustration de cours, par exemple, peut tre indispensable). Il convient donc de faire trs attention au format de l'image, sa qualit et sa taille de l'image. ce niveau, plus l'image sera de petite taille, mieux ce sera.

   


GIF (Graphics Interchange Format) et JPEG (Joint Photographic Experts Group) sont les deux formats d'images utiliss sur le World Wide Web. Le format GIF est utilis afin de crer des images bitmap compresses donc de plus petite taille, facilitant ainsi le transfert. Il est particulirement utilis pour des illustrations et images ayant au maximum 256 couleurs ( viter donc pour les photographies). Plus il y a de couleurs et plus la taille de l'image sera importante. Ce format permet galement de dfinir une couleur comme tant transparente ce qui donne plus de libert aux crateurs quant l'intgration d'images sur un site ayant une couleur de fond diffrente. Voici un exemple quand le fond est un motif :

Le violet a ensuite t dfini comme tant la couleur transparente

criture franaise adopte par les internautes francophones pour designer le WEB

.

Le format JPEG est gnralement utilis pour des images ayant un grand nombre de couleurs telles que les photographies par exemple. Cela dit, cette mthode de compression ne permet pas de restituer la qualit de l'image de dpart : il y a ncessairement des pertes sauf si le taux de compression est nul! Voici une illustration, sur la gauche, avec le logiciel ThumbsPlus5 (il s'agit d'un logiciel permettant de visualiser des images, de les rechercher et organiser
Le logiciel ThumbsPlus Offre la possibilit de rgler le taux de compression et d'avoir un aperu immdiat du rsultat.

grce un systme de base de donnes, convertir, filtrer). Comme pour le format GIF, JPEG permet le chargement

progressif de l'image. Le choix de la charte est libre ainsi que celle du type de graphisme ; seule la cohrence doit en gnral tre conserve. Un style BD? Journal? Rock? vous et votre groupe de travail de voir. Gardez l'esprit que vous ne serez sans doute pas les seuls le consulter et certainement pas en local!

Phases de tests
Une fois le site termin, il doit dans un premier temps parfaitement fonctionner sur un poste, en local. Mais comment cela se passera-t-il en rseau, s'il est sur un poste serveur? Et avec une ancienne et une nouvelle version de navigateur? Certaines questions ont dj leurs rponses (phase de rflexion). L'tape de tests ne doit pas tre nglige et prend du temps contrairement ce que l'on pourrait croire.

 
Comme nous l'avons vu prcdemment, il faut avoir eu un travail de rflexion en amont notamment sur l'architecture du site et son design afin que son transfert sur le serveur ne pause aucun problme. Ce serveur devra par ailleurs tre capable de rpondre aux exigences de votre site. Il convient de ne pas travailler directement sur ce
5

Informations disponibles l'adresse suivante http://www.cerious.com

poste serveur (pouvant dj tre trs sollicit) car les utilisateurs risquent d'avoir des surprises en consultant vos pages non acheves ou en n'ayant pas accs aux documents dj ouverts. Une erreur courante chez les dbutants est de laisser les rfrences des pages locales et des images avec le chemin complet. Or, ce chemin convient parfaitement sur votre disque dur local mais certainement pas sur celui du serveur. Voici un exemple :
<IMG SRC="photo/meknes.gif" BORDER=0 ALT="La ville de Meknes">

Ici, la rfrence est relative l'emplacement du fichier HTML contenant le code. Ainsi, pour trouver l'image meknes.gif, le navigateur partira du rpertoire o se trouve le fichier, puis ira dans photo/ .
<IMG SRC="file:///C:/WWW/Images/Malaisie/malaisie.jpg" ALT="Carte de la malaisie">

Ici, la rfrence est absolue : le navigateur part du disque dur C et parcourt les diffrents rpertoires indiqus. Si l'architecture sur le serveur est diffrente (ce qui est notamment le cas des serveurs UNIX), les images ne s'afficherons pas. Le choix de la rfrence relative semble donc tre le plus judicieux. Il faut vrifier tous les liens vers des documents HTML ou des sites WEB, internes ou externes et l'apparition des images aussi. De plus, beaucoup d'internautes naviguent sans les images afin de gagner du temps donc le test de consultation des documents sans les images doit aussi tre ralis. Cette option est accessible dans le menu de configuration de n'importe quel navigateur, mme dans la version 1.1 de Netscape Navigator. L'utilisation de l'option ALT dans le TAG IMG comme dcrite plus haut permettra l'utilisateur d'avoir une ide de ce qu'est l'image.

Site de Silicon Graphics http://www.sgi.com Avec l'utilisation de l'option ALT, il est possible de naviguer sur ce site (en sachant ou l'on va) sans les images.

 
Bien souvent, sur l'Internet, on trouve des sites se disant "Optimis pour Netscape Navigator" ou "Fait pour Internet Explorer". Il est vrai que ce sont les navigateurs les

plus utiliss en ce moment. Cela dit, un site bien conu et programm doit avant tout respecter la norme HTML dfinie par le World Wide Web Consortium6. Et malheureusement, il est facile de constater que les deux navigateurs cits ci-dessus interprtent diffremment cette norme. Prenons l'exemple de la dfinition des bordures lors de la cration de frames. En langage HTML, voici comment nous dfinissons par exemple un document spar en trois parties de telle faon que les sparations (bordures) n'apparaissent pas :
<HTML> <HEAD> <TITLE>La page sur mon langage</TITLE> </HEAD> <FRAMESET ROWS="*,22" FRAMEBORDER="0"> <FRAME SRC="garde.html" NORESIZE NAME="principale"> <FRAME SRC="sommaire.html" NORESIZE SCROLLING="no" NAME="sommaire"> </FRAMESET> </HTML>

Le logiciel Navigator n'affiche aucune bordure alors que Internet Explorer en met quand mme une, trs fine (paisseur de 1 ou 2 pixels). Il existe d'autres navigateurs qui respectent mieux les spcifications du W3C et qui sont aussi rapide et efficace (exemple : Opra). Mais ils restent peu connus du grand public car les entreprises dveloppant ces logiciels ont moins de moyens que Netscape et Microsoft. La manire dont vous allez vrifier votre site dpendra aussi du public vis. Nous en avons parl plus haut. S'il est construit pour un Intranet, il doit tre conforme aux fureteurs utiliss sur votre rseau. S'il est destin tre consult sur le WEB par n'importe qui, il est fortement recommander de le vrifier avec plusieurs navigateurs et plusieurs versions de ces derniers.

       !  


Au mme titre que les navigateurs, si l'on ne connat pas les plates-formes utilises par les lecteurs, il convient, dans la mesure du possible, de faire des tests avec des plates-formes et des systmes d'exploitation diffrents. Nous avons dj cit le cas des problmes pouvant tre rencontrs avec les polices de caractres. Sous certains environnements graphiques, l'affichage des images peut se faire de faon diffrente.

http://www.w3c.org

Par exemple, la qualit des images au format GIF sous OpenWindows (version solaris 2.5) n'est pas aussi bonne que sur un PC sous MS Windows 95.

"    


 Nombre de couleurs et rsolution de l'cran  Temps de chargement des documents et des images sur le rseau  Vrification de la lgalit de ce qui est diffus (droits d'auteurs, copyright). Mme si ce n'est pas directement li au design des pages WEB, cela reste important surtout que beaucoup d'images et illustrations circulent sur le rseau.  Attention l'orthographe, la grammaire et la syntaxe du site. S'il est professionnel, la rigueur doit tre de mise!  Si votre site est dans une langue particulire (arabe, mandarin, japonais, etc) et qu'il doit s'adresser un trs large public dans le monde, prvoyez au moins une version en anglais.  L'abus de publicit est dangereux (fait fuir les internautes), consommer avec modration!  Ne pas oublier de laisser de quoi tre contact : adresse lectronique ou postale, numro ICQ, etc

You might also like