Ci-dessous, les textes en bleu indiquent des commandes.
Si le répertoire wwwdoc n'existe pas, il faut s'adresser au service informatique (ce n'est pas un répertoire classique).
Exemple : je suis au labo, sous linux, et je veux mettre le fichier appelé
"S1SM2003-04.tar.gz" sur le web. Je me mets dans le répertoire contenant
ce fichier et je tape
cp S1SM2003-04.tar.gz ~/ruette/wwwdoc/
Si je veux faire la même chose depuis chez moi, je tape
sftp ruette@sas1.math.u-psud.fr
(je rentre mon mot de passe)
cd wwwdoc
put S1SM2003-04.tar.gz
exit
Ce fichier est maintenant disponible à l'adresse http://www.math.u-psud.fr/~ruette/S1SM2003-04.tar.gz
Remarquez qu'on peut mettre des fichiers qui ne sont pas en html. C'est pratique pour mettre des fichiers à la disposition de tous, sans même avoir de vraie page web.
Si vous mettez un fichier appelé "index.html" ou "index.php"
dans un répertoire, ce sera
le fichier lu par défaut.
Exemple : les adresses http://www.math.u-psud.fr/~ruette/
et http://www.math.u-psud.fr/~ruette/index.html sont équivalentes.
Si vous avez plusieurs fichiers qui vont ensemble, le plus simple est
de les archiver pour n'en faire qu'un. Voici comment faire sous unix/linux
(la même chose est possible sous windows ou mac, mais je ne connais pas
la procédure) :
- mettre tous les fichiers (et uniquement eux) dans un répertoire, que
j'appellerai "rep",
- se mettre dans le répertoire en amont et taper
tar cf rep.tar rep, ce qui a pour effet d'archiver
le contenu du répertoire "rep" dans le fichier "rep.tar".
- variante : archiver et compresser avec gzip en tapant
tar -zcf rep.tgz rep, ce qui donne un fichier "rep.tgz".
Procédure pour désarchiver :
- se mettre dans le répertoire contenant "rep.tar" ou "rep.tgz",
- taper tar xf rep.tar ou tar xf rep.tgz, ce qui crée un
répertoire "rep" avec les fichiers dedans.
- variante : si le fichier s'appelle "rep.tar.gz", d'abord le décompresser
en tapant gunzip rep.tar.gz, ce qui donne un
fichier "rep.tar", puis taper tar xf rep.tar comme
précédemment.
Le html est un langage avec des balises de début et de fin, qui ressemblent aux environnements latex. Les balises sont entre < >. Une balise de début <balise> est généralement suivie par une balise de fin </balise> (attention, c'est un /, et pas un \ comme en latex !)
Le fichier de la page web aura la structure suivante, où "white" (6ème ligne bleue ci-dessous) est la couleur de fond de la page. La 3ème ligne bleue ci-dessous (<meta...>) n'est pas strictement indispensable mais elle permet de dire dans quel jeu de caractères est la page (ici, "charset=ISO-8859-1", pour utiliser des caractères latins, y compris avec accents). Si vous la mettez, vous pourrez taper des lettres accentuées et la page web sera correctement affichée quel que soit la langue par défaut de l'utilisateur.
<html>
Texte de la page web
</body>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Titre apparaissant dans la barre de
la fenêtre</title>
</head>
<body BGCOLOR = white>
</html>
Voici quelques commandes permettant de structurer un texte html et d'obtenir une page web minimaliste.
<P> provoque un changement de paragraphe
(remarque : une ligne blanche ne
suffit pas pour changer de paragraphe, contrairement à latex).
<br> provoque un retour à la ligne (équivalent de \\ en latex)
<h1> Titre de niveau 1 </h1>
<h2> Titre de niveau 2 </h2>
<h3> Titre de niveau 3 </h3>
<h1 align=center> Titre de niveau 1 centré </h1> (variantes : "align=left" et "align=right")
<strong>texte en gras</strong>
<i>texte en italique</i>
<center>texte centré</center>
<font color=red>texte en rouge</font>
<! commentaire n'apparaissant pas>
Pour faire une liste (équivalent de l'environnement itemize en latex) :
<ul>
<li> 1er élément de la liste </li>
<li> 2ème élément de la liste </li>
</ul>
Pour mettre un lien vers un fichier (html ou non) ou une page web :
<a href="gt-dynamique.html">cliquer ici</a> (fichier "gt-dynamique.html" dans le
même répertoire que la page courante)
<a href="abstracts/abstract-rotation.html">cliquer ici</a>
(fichier "abstract-rotation.html" dans le sous-répertoire "abstracts" par rapport au répertoire courant - ici, le fichier est dans wwwdoc/abstracts/)
<a href="http://www.math.u-psud.fr/~ruette/abstracts/abstract-rotation.html">cliquer ici</a> (adresse web entière d'une page ou d'un fichier - cet exemple donne la même chose que le lien précédent)
Pour mettre une image (formats jpg, gif, png) :
<img src="image.jpg" ALT="texte alternatif">
<img src="image.jpg" ALT="texte alternatif" align=right> (image positionnée à droite; variantes : "align=left" et "align=center")
La partie ALT="texte alternatif", non obligatoire mais recommandée, donne le texte qui apparaît à la place de l'image si les images ne s'affichent pas (en particulier, mauvais débit internet ou page consultée par un aveugle). Si l'image en question sert de lien, c'est important de le mettre, sinon le lien sera incompréhensible pour certaines personnes.
Pour apprendre d'autres commandes html : allez voir d'autres pages web, de préférence avec une structure simple, et regardez la page source (menu "Tools/Web developer/Page source" dans mozilla).