L'équipe     Info-conseils     Forums de discussion

 

par Chrystian Guy


La fin du HTML
Ou la faim d'en savoir plus

Chers élèves, nous voici arrivés au bout de ce cours de HTML. Nous avons fait beaucoup de chemin depuis notre première leçon, non? Est-ce la fin? Bien sûr que non! C'est même le début de votre expérience personnelle avec la conception de pages web. Il y a plein d'autres choses à découvrir dans le HTML; des choses qui ne s'enseignent pas vraiment et qui se laissent découvrir par l'expérience.

Mais je me sens comme si vous alliez partir, je me mets du shampooing Baby's Own dans les yeux pour ne pas pleurer… Revenez la semaine prochaine! Il y aura une autre chronique!

Bon, bon, bon. Laissons là les émotions et terminons avec des petits trucs pour bien concevoir un site web, niveau structure et organisation.

L'arbre est dans ses feuilles…

La clef d'un bon site web est dans son arborescence, ou si vous préférez, dans son organisation des répertoires de fichiers. Il importe de bien classer vos affaires avant même de commencer à programmer, car ainsi, vous pourrez faire pointer vos liens au bon endroit. Voici un exemple de structure :

Exemple d'arborescence

Dans cet exemple, nous avons un répertoire racine qui se nomme WEB, avec quelques sous-répertoires et une page INDEX.HTML qui se trouve être notre première page, ou si vous voulez, la page d'accueil du site. Ainsi, toutes les autres page se retrouvent dans leur répertoire : la page de mon CV se trouve dans /CURRICULUM. Nous mettrons toutes les images dans le répertoire /IMAGES. Dans le cas de sites très complexes, il peut être préférable de créer un sous-répertoire /IMAGES pour chacune des sections, comme par exemple:  WEB/PORTFOLIO/IMAGES, WEB/CURRICULUM/IMAGES… etc.

Maintenant, dans votre code HTML, il va falloir pointer au bon endroit, surtout pour vos images. Je reprends mon exemple (voir graphique plus haut). Posons que notre logo se nomme logo.gif et que celui-ci est donc dans WEB/IMAGES; si nous voulons l'insérer dans notre page d'accueil qui est WEB/index.html, la ligne de code sera :

<IMG SRC="images/logo.gif" width=350 height=75>

Enfin, si nous avons un seul répertoire pour toutes les images et que nous voulons insérer le même logo.gif dans la page portfolio…

<IMG SRC="/images/logo.gif" width=350 height=75>

La différence? Remarquez la barre oblique devant images dans le deuxième cas… ça veut dire que le répertoire IMAGES se trouve dans la hiérarchie supérieure à ce répertoire.

Soyez à l'index!

Être à l'index est une bonne chose dans le web. Sur tous les serveurs web de ce monde, il existe une page que l'on appelle : " page par défaut " qui est celle que l'on a pas besoin de nommer pour l'appeler, comme par exemple :

www.megagiciel.com/index.html = www.megagiciel.com

Sur notre serveur UNIX, la page par défaut est index.html, sur un serveur IIS de Microsoft, ce sera probablement default.htm, ainsi de suite… Il est possible de configurer un serveur web pour accepter une ou l'autre des appellations par défaut. L'important pour vous, si vous allez mettre votre page sur le serveur de votre fournisseur d'accès, c'est de connaître son " par défaut " à lui. Comment le savoir? Appelez-le!

C'est bien beau tout ça, mais dans le concret, ça fait quoi? Nommez chacune de vos pages racine de chaque répertoire index.html; comme par exemple :

WEB/index.html

WEB/PORTFOLIO/index.hmtl

WEB/CURRICULUM/index.html

Pourquoi? Parce qu'il se peut que votre portfolio ait plus d'une page par exemple; et surtout, parce que cela fait des adresses plus simples à écrire… souvenez vous :

www.blabla.com/~mapage/portfolio/ = www.blabla.com/~mapage/portfolio/index.html

Et puis, je la mets où cette page?

Ha! La grande question de la semaine! Que dis-je, la question du cours! Ça me tente d'arrêter ici… mais non, je vais vous le dire!

Pour que votre page web soit accessible par tous les 20 millions d'internautes de la planète, plus les 10 000 habitants de la station lunaire de Véga (vous savez, les golgoths, les navettes vertes…), il faut qu'elle soit hébergée sur un serveur public, comme celui de votre fournisseur d'accès Internet. 99,63% des forfaits offerts par les FAI (je ne peux m'empêcher de penser à Louise Beaudoin quand j'écris FAI…) de ce monde comprennent un espace disque alloué à la publication de pages web personnelles, souvent entre 1 Mo et 5 Mo. Si votre fournisseur ne vous offre pas cela, changez! Je le dis sans scrupule, run away!

Ensuite, il faut transférer vos pages et vos images par FTP. Mais ce n'est pas tout, il faudra que votre répertoire personnel soit créé sur le serveur de votre FAI. La meilleure façon de procéder, c'est de communiquer avec votre FAI pour lui demander les instructions relatives à la publication de pages web sur son serveur. Demandez-lui notamment:

  1. adresse FTP du serveur
  2. création de votre répertoire personnel et commande pour le rendre public
  3. création d'un répertoire cgi-bin pour mettre des programmes (perl, java, etc.), si c'est permis chez lui…
  4. l'adresse finale de votre page, par exemple : www.blabla.com/~cguy
  5. la page par défaut sur son serveur (index.html, defaut.htm, etc…)

N'oubliez pas de respecter la même arborescence que sur votre disque dur! Aussi, souvenez-vous de nos leçons précédentes : mettez des liens relatifs et non directs vers les fichiers… Si vous avez un <IMG SRC= "c:/mes documents/logo.gif">, ça ne marchera pas fort sur un serveur de FAI.

Allez vous faire voir!

Et maintenant, vous voulez que votre maman trouve votre page dans AltaVista? Il reste deux petites étapes (3, si vous comptez le coup de téléphone à votre mère) :

  1. enregistrer votre adresse dans les moteurs de recherche, comme AltaVista
  2. mettre des ancres META pour décrire votre page

Les ancres META

Voici le secret des pros! Beaucoup de moteurs de recherche utilisent les ancres META pour récupérer la description de la page ou encore les mots-clefs qui la définissent. Voici deux ancres META essentielles :

<META HTTP-EQUIV="Description" CONTENT="La page personnelle d'un techno-nerd à lunettes, mais sans trop de bouton.">

<META HTTP-EQUIV="Keywords" CONTENT="Physique, Quantique, Baudelaire, Chatons, Jupiter, Internet">

Il faut mettre les ancres META dans la portion HEAD de votre page, pour chacune des pages.

Famous last words

Et puis envoyez-moi donc vos adresses que je regarde ce que vous faites un peu. N'oubliez pas, si vous résidez au Québec, d'inscrire votre adresse dans Qui Est L@?, le répertoire de pages personnelles de La Toile du Québec : http://www.toile.qc.ca/quiestla/

Comme disait Jules Laforgue : " Ah! tout est bien qui n'a pas de fin! "



 


Infos | Ajouter un site | Pour nous écrire



Copyright © 1997-2000 NETgraphe inc. - Tous droits réservés.