Faire son propre site Web

... quand ont est très peu motivé par l'outil informatique

Publié le 27 février 2005

Vous utilisez le courrier électronique et
cherchez des informations sur le Web, mais ne gérez pas le site
de votre établissement et ne lisez pas de revue spécialisée,
l’informatique ne vous intéresse que parce qu’elle rend
service ; cet article est pour vous. Construire son propre
site est simple comme utiliser les fonctions de base d’un
traitement de texte, si on accepte la sobriété.

Sur cette page

Un site, pour flatter
votre ego ?

Pas sûr que le monde entier s’intéresse
à vos portraits de famille ou à vos billets d’humeur et ... ce
"créneau" est encombré ! Mais vous avez
peut-être envie de publier le produit d’une passion ou de mettre
à la disposition de collègues vos travaux et documents
d’enseignant. Ils pourraient se servir sur votre site comme sur
un disque dur et peut-être auriez vous des retours
intéressants, documents améliorés, idées nouvelles !

Qu’est-ce qui
caractérise un site Web ?

Un site c’est d’abord des pages reliées
entre elles. On navigue de page en page en cliquant sur un mot
"surligné", un symbole, etc. Certains liens
peuvent conduire à un autre site. Le navigateur est le
logiciel de base pour lire ces pages et surfer de lien en lien.
Tout est écrit avec un codage simple mais qu’il n’est pas
nécessaire de maîtriser, le "html".

Un lien peut aussi pointer vers un fichier
non affichable (un logiciel, un tableau Excel, ...). Cliquer
conduit alors à télécharger ce fichier. Le site alors
devient un magasin où l’on puise dans des ressources qui ne sont
nullement en html.

Comment faire ?

Il y a peu à avoir et à savoir pour
réaliser un site efficace. Le navigateur est nécessaire
pour vérifier le travail mais ... si vous êtes connecté vous
l’avez !

1. Se faire héberger

Votre fournisseur d’accès offre un
espace dans ses forfaits. Vous seul pourrez "écrire"
des fichiers sur cet espace, accessible à tous en lecture. On
peut aussi s’inscrire gratuitement chez un hébergeur qui
fournit des outils de création :
<a
href="http://www.multimania.lycos.fr/" target="_blank"><font
face="Arial">www.multimania.lycos.fr ou <a
href="http://www.voila.fr/" target="_blank">www.voila.fr<font
face="Arial"> <font
face="Arial"> etc. Les modèles de pages sont alors plus ou moins
limités et contraints.

2. Pour créer ses
pages, utiliser un logiciel spécifique

On peut se passer d’éditeur de pages
Web soit en connaissant l’écriture html soit en utilisant
les convertisseurs associés à certains traitements de texte au
risque de perdre beaucoup de temps pour un résultat aléatoire

(parfois même le résultat dépendra ... de la machine du
visiteur !). Demandez plutôt à vos logiciels habituels de
convertir en fichiers htm(l) vos documents déjà saisis ;
puis à un éditeur de pages Web d’ouvrir et adapter ces
fichiers, de construire vos nouvelles pages.

Texte. Soyez sobre, polices
courantes, présentation structurée, haut de page indiquant
d’emblée le contenu. On va vous lire sur écran : repérez
sur les sites des autres ce qui vous séduit, ce qui vous agace.

Images. Enregistrez les sous .jpg
(photos) ou .gif (graphismes). Ne dépassez pas quelques
dizaines de kilo-octets, vous agaceriez des visiteurs en
ralentissant l’affichage. Pour des images de grande qualité,
faites un lien derrière une copie compressée, précisez le
volume en kO, ainsi l’utilisateur a le choix.

Liens et signets. Un signet
est un repère pour la navigation (une cible pour des liens),
invisible pour le visiteur. Un lien, placé sur tout objet
(mot, symbole, image), désigne un endroit à rejoindre :
signet dans la page, page du site, page d’un autre site. Tout
éditeur vous guidera pour placer balises et liens mais il faut
savoir faire quelques choix :

  1. Demandez au logiciel d’écrire en adresse
    relative
    tout lien interne à votre site.
    C’est simple si 1°- page de départ et cible sont toutes
    deux ouvertes dans votre logiciel, 2°- votre ordinateur
    a un double exact du site (mêmes répertoires, mêmes
    noms de fichiers), 3°- vous enregistrez avec nom et
    titre toute nouvelle page dès que vous la commencez.
  1. Affectez une adresse absolue
    pour tout lien externe  : ce qu’il faudrait
    taper dans le bandeau d’un navigateur pour rejoindre le
    site. Ajoutez _blank comme cadre de destination :
    le site visé ne paraîtra pas partie du vôtre.
  1. Pour offrir de télécharger un
    fichier quelconque faites simplement un lien vers
    celui-ci. Nul besoin de convertir en html mais beaucoup
    de documents élaborés devraient être enregistrés sous
    .rtf s’ils ne sont pas trop volumineux (sécurité
    antivirus).
  1. Pour inviter à vous écrire
    d’un clic, tapez votre adresse suivie d’un espace ou
    faites un lien avec [mail to :] puis votre adresse
    en vous laissant guider par la commande d’édition de
    liens.

Quelques précautions
pour ne pas décourager vos visiteurs.

Préférez des pages ni longues ni
chargées en images, animations, etc. pour rendre la navigation
plus fluide.

Quelques icônes constantes en entrée et
fin de page faciliteront l’identification de votre site (en
surfant on se perd vite) et la navigation (retour en haut de
page, retour à l’accueil sur un logo personnel, etc.)

Accueil et organisation

Votre page d’accueil indiquera clairement
à qui s’adresse le site, qui le produit, ce qu’il contient. On y
revient pour se réorienter. Classez vos pages dans un
répertoire principal et des sous-répertoires : faites
simple avec des noms courts sans accent, ni espace, ni signe de
ponctuation. Tout fichier aura un nom bref et la page d’accueil
un nom standard comme index.htm .

Pour plus tard ! Sachez que,
sur Internet, vous pouvez presque tout copier, que certains sites
offrent icônes ou applications libres de droit. Vous trouverez
pour quelques € des guides accessibles comme Internet
facile
, publié par Cyber Press Publishing.

 

3. Transférer les
pages sur le Web avec un logiciel ftp

Un logiciel client ftp. se configure
avec les indications de connexion du fournisseur d’accès
(adresse et code personnel notamment) et fonctionne comme un
gestionnaire de fichiers (facile !).

Précautions : gardez copie intégrale
sur votre ordinateur et mettez à jour votre antivirus surtout si
vous mettez en ligne logiciels et documents non html ou donnez
votre adresse électronique (ce qui paraît nécessaire). Testez
votre site une fois mis en ligne
car c’est le moyen simple de
repérer les maladresses (l’image en adresse absolue sur
C :\mesdocuments\xxx !!)

  • Se procurer les
    logiciels nécessaires

Téléchargeables pour essai et peu
onéreux voire gratuits sur des sites de téléchargement que
vous rejoindrez soit en passant par l’écran d’accueil de votre
fournisseur d’accès soit à
<a
href="http://www.telecharger.com/" target="_blank"><font
face="Arial">www.telecharger.com ou
<font
face="Arial">www.download.com
,
etc. Microsoft offre un éditeur gratuit, Frontpage
express
, fourni avec le navigateur Internet Explorer,
présent sur les CD d’installation de Windows ou sur
<a
href="http://www.microsoft.fr/" target="_blank"><font
face="Arial">http://www.microsoft.fr
. Pour la mise en ligne vous chercherez un logiciel client
ftp
(tapez ftp dans un moteur de recherche) comme FlashFXP
sur
<font
face="Arial">www.tucows.com
, ftp_expert ou Cuteftp, très diffusés.

Comment atteindre le
public visé ?

Affectez aux propriétés de votre page un
titre clair, des mots clés, si possible un résumé, un nom
d’auteur. N’oubliez pas qu’un site figé risque d’être vite
"oublié" et signalez vous par courrier électronique
sur les sites offrant des liens dans le domaine concerné, sur
voila.fr, etc.

Exemple d’en-tête en
affichage "html"

< face="Arial">html>

< face="Arial">head>

< face="Arial">meta http-equiv="<font
color="#0000FF" face="Arial">Content-Type<font
color="#FF0000" face="Arial">"content="<font
color="#0000FF" face="Arial">text/html ; charset=iso-8859-1<font
color="#FF0000" face="Arial">">

< face="Arial">meta name="<font
color="#0000FF" face="Arial">description<font
color="#FF0000" face="Arial">" content="<font
color="#0000FF" face="Arial">ici résumé de la page<font
color="#FF0000" face="Arial">">

< face="Arial">meta name="<font
color="#0000FF" face="Arial">keywords face="Arial">" content=" face="Arial">ici liste de mots clés séparés par des virgules<font
color="#FF0000" face="Arial">">

< face="Arial">meta name="<font
color="#0000FF" face="Arial">author face="Arial">" content=" face="Arial">ici nom de l’auteur face="Arial">">

< face="Arial">title> <font
color="#0000FF" face="Arial">ici titre de page choisi par
l’auteur, n’apparaissant pas à l’écran
<
/title<font
face="Arial">>

< face="Arial">/head>

Le droit

Citez vos sources, prenez contact avec les
auteurs dont vous voudriez utiliser le travail, et
éventuellement protégez vos oeuvres contre une récupération
abusive (voir licence GPL dans notre dernier magazine), etc.

Dans la même rubrique

Apprivoiser l’outil informatique

Voir les autres articles de cette rubrique