Realisation d'un site Internet, page 2

Mesures Physiques et Informatique, MPI, page 3

Page modifiée le 13 / 9 / 2004

Réalisation d'un site Internet, suite de la page 2

Note importante : Cette partie va très au-delà du programme de MPI. Mais elle peut intéresser des élèves déjà très expérimentés, ou leur professeur. Elle me sert aussi d'aide mémoire pour mon travail personnel. La partie caractères spéciaux devrait intéresser les scientifiques.

Contenu : Structure du code HTML, mots clés, publication, référencement, compteur de visites, AtomZ, Unicode, caractères spéciaux pour textes scientifiques

1. Quelques balises HTML

Il est hors de question de donner une liste exhaustive des balises ; cela n'intéresse que les professionnels et il existe de gros ouvrages dédiés à cela.
Examinons une toute petite page qui ne fait qu'afficher un titre :

<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>PhyJi jussiaux software</title>

</head>

<center><b><font size=+2>Site PhyJi, jussiaux.software</font></b></center>

</body>
</html>

Vous remarquez :

1 l'encadrement du document par <html> qui renseigne le navigateur,

2 l'en-tête du document entre <head> et </head>, qui contient le titre (title), une procédure JavaScript, et où devraient se placer les mots clés,

3 le corps du document entre <body> et </body>,

4 dans le corps, un texte centré (<center>), en caractères gras (<b>, bold) et dans une fonte plus grosse ( + 2 ) que celle choisie par défaut, par le lecteur de ce document. Il est préférable de procéder ainsi, plutôt que d'imposer une taille de fonte absolue, sans respecter les choix de l'utilisateur (qui a peut être des problèmes de vue, ou un écran de 21 pouces, ou ... et qui peut donc avoir modifié son affichage en conséquence).

Vous pouvez consulter le code d'une page qui vous semble intéressante, dans Netscape Communicator, par Afficher | Source de la page, ou en l'enregistrant puis en la lisant avec WordPad ou NotePad. C'est parfois nécessaire pour y inclure le code qui vous est proposé par votre hébergeur (compteur de visites), ou par AtomZ qui vous fournit un moteur de recherche.

2. Mots clés

Voici l'en-tête d'une page plus complexe :

<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">

<TITLE>PhyJi, jussiaux software : logiciels et conseils, pour l'enseignement de la physique chimie</TITLE>

</HEAD>
Vous y trouvez :

1 Une indication sur la version de langage HTML employé, ici la 4, transition vers le DHTML,

2 le type de caractères employés (Content-Type), ici occidental,

3 les mots clés (keywords),

4 le nom de l'auteur (Author),

5 la description

6 la durée entre deux visites pour certains moteurs de recherche (revisit-after),

Remarquez que les lettres accentuées sont représentées par un code spécial.

Haut de cette page.

3. Publication de votre site

Le logiciel Cute FTP est destiné à cela, mais il en existe d'autres. En gros, cela revient par un protocole FTP (respecté par Cute, sans que vous vous en préoccupiez) à transférer des fichiers d'un répertoire local, à un répertoire distant. Il vous faut naturellement un mot de passe.

Après ce transfert, n'oubliez pas de tester votre site distant.

4. Référencement de votre site

Pour faire connaître votre site à un large public, il faut qu'il soit connu des principaux moteurs de recherche. Nous n'entrerons pas dans le détail de cette tache délicate.

Sur Internet, cherchez des sites par le mot clé "référencement". Vous trouverez des propositions gratuites, en échange d'un bandeau publicitaire souvent. Mes essais personnels n'ont rien donné. Le mieux est d'obtenir que quelques sites connus acceptent d'établir un lien vers le vôtre.

Conseil : évitez de répondre par Mail à des questionnaires, sauf si vous connaissez l'entreprise que vous visitez ; vous risquez de voir communiquer votre adresse personnelle à des publicitaires qui envahiront votre boîte aux lettres. Dans ce dernier cas, et si l'envahisseur n'a pas la courtoisie de prévoir dans sa lettre un bouton permettant de lui signaler que vous souhaitez ne plus faire partie de sa liste de diffusion, renvoyez lui son courrier, au besoin en lui rallongeant le texte par Copier | Coller. Cela lui bloquera sa boîte aux lettres (le chargement du courrier est plus lent que le chargement de fichiers) et le calmera.

5. Texte scientifique, mode d'emploi

Lorsque vous rédigez un texte scientifique pour Internet, vous avez quatre possibilités :

Créer ce texte avec un traitement de textes, le compresser au format .Zip ou Zip auto extractible .Exe, et placer sur votre page un lien vers ce fichier,
créer ce texte à l'aide de Netscape Composer, éventuellement avec des copier coller depuis votre traitement de textes, et ajouter les formules et les symboles mathématiques, sous forme d'image au format .Gif, créées par exemple avec l'éditeur d'équations de Word ou ClarisWorks, puis copiées et collées dans un logiciel de dessin (Picture Publisher est fourni par la revue Presqu'Offert !), et enfin enregistrées au format .Gif ; les lettres grecques sont obtenues à l'aide de la fonte Symbol,
créer votre document à l'aide d'un logiciel mathématique, par exemple Mathematica et transformer ce document, découpé en petites pages, en documents html. Mathematica crée automatiquement les images .Gif, à partir des formules (cellules de type Input ou Output) ; par contre les caractères spéciaux placés dans le texte (cellules de type Text) sont convertis en entités nommées que ni Netscape, ni I.E. ne savent lire ;
créer votre document html à l'aide d'une version récente de Word, de ClarisWorks ou de FrontPage. Les formules sont automatiquement converties en images ; les lettres grecques... à voir,
pour des symboles et des formules simples, employer des caractères spéciaux, codés sous forme d'entité numérotées, en respectant le format Unicode, ou bien employez la fonte Symbol.

6. Caractères spéciaux

Quelques uns de ces caractères sont automatiquement traités par Netscape Composer ; par exemple, la lettre é que vous entrez au clavier dans Composer est écrite par celui-ci, dans le code html, é. C'est ce qu'on appelle une entité nommée.

La fonte Symbol permet d'écrire les lettres grecques et quelques symboles mathématiques.

Une autre méthode consiste à employer des entités numérotées. Par exemple α est la lettre alpha minuscule (α), dans le standard Unicode.

Pour que l'affichage soit correct, vous devez :

Créer votre document de la manière habituelle à l'aide de Netscape Composer, en vérifiant bien que vous avez fait : Afficher | Encodage | Occidental,
entrer les caractères spéciaux sous la forme &#x; où x est un nombre indiqué plus loin dans cette page,
le sauvegarder, puis
dans le code html créé par Netscape Composer modifier l'en tête, à l'aide par exemple de WordPad, traitement de texte basique : Dans l'en-tête

effacer tous les amp; que Netscape a employé pour écrire les &,
ensuite sauvegarder, en faisant : Enregistrer | Doc Texte Uniquement et en n'oubliant pas d'écrire l'extension du fichier .htm.

Si une erreur est commise, les caractères spéciaux attendus seront remplacés par des points d'interrogation. Vous pourriez consulter le code html de cette page avec WordPad, pour mieux comprendre ceci.

Haut de cette page.

Caractères Unicode

Contenu : Caractères spéciaux, caractères Unicode, mode d'emploi

La publication sur Internet d'un texte scientifique, même modeste, pose un problème, la retranscription des caractères spéciaux, lettres grecques... et des formules.
Plusieurs logiciels font cela de manière automatique, FrontPage, ClarisWorks, Mathematica...
Ils convertissent les formules en images au format .gif. Mathematica convertit les lettres grecques en images, quand elles figurent dans une cellule de type Input ou Output ; si elles sont dans une cellule de type Text, elles sont converties dans un code que les navigateurs Internet ne comprennent pas. Cela présente l'inconvénient d'être lourd ; chaque lettre grecque devient une image, des lettres répétées donnent des images différentes. La transmission ralentit, l'impression n'est pas belle. FrontPage est plus astucieux.

En résumé, 3 méthodes s'offrent à vous :

Entrer votre texte de manière classique dans un traitement de texte, Word, ClarisWorks... et le transférer par Copier | Coller dans FrontPage.
Entrer votre texte directement dans Netscape Composer, écrire les formules dans l'éditeur d'équations, puis les transformer en images d'extension .Gif.
Dans ce cas, pour les lettres grecques, vous disposez de 2 méthodes : La plus simple,
changer de fonte, en faisant Format | Police | Symbol, la plus compliquée, mais aussi plus puissante,
utiliser des caractères Unicode.

L'utilisation de la police Symbol, dans FrontPage et dans Netscape Composer conduit au code html suivant pour la lettre grecque alpha : <Font Face = "Symbol"> a </Font>. L'usage de l'Unicode est plus complexe, mais plus général.

Faire cela à la main peut être formateur, car cela apprend ce qui se passe réellement, cela nécessite une bonne maîtrise de la gestion des fichiers, du Copier | Coller d'un logiciel à un autre.

Voici le numéro du code Unicode et le caractère correspondant, tel qu'il est affiché par votre navigateur.

Haut de cette page.

7. Standard Unicode

7. 1. Caractères ISO latin-1, codes de 129 à 255

131 → ƒ 137 → ‰ 140 → Œ 150 → – 151 → — 153 → ™ 156 → œ 169 → © 174 → ® 175 → ¯ 177 → ± 178 → ² 179 → ³ 181 → µ 182 → ¶ 185 → ¹ 188 → ¼ 189 → ½ 190 → ¾ 199 → Ç 215 → × 216 → Ø 247 → ÷ 913 → Α 914 → Β 915 → Γ

7. 2. Caractères grecs, codes de 913 à 1009

913 → Α 914 → Β 915 → Γ 916 → Δ 917 → Ε 918 → Ζ 919 → Η 920 → Θ 921 → Ι 922 → Κ 923 → Λ 924 → Μ 925 → Ν 926 → Ξ 927 → Ο 928 → Π 929 → Ρ 930 → ΢ 931 → Σ 932 → Τ 933 → Υ 934 → Φ 935 → Χ 936 → Ψ 937 → Ω 945 → α 946 → β 947 → γ 948 → δ 949 → ε 950 → ζ 951 → η 952 → θ 953 → ι 954 → κ 955 → λ 956 → μ 957 → ν 958 → ξ 959 → ο 960 → π 961 → ρ 962 → ς 963 → σ 964 → τ 965 → υ 966 → φ 967 → χ 968 → ψ 969 → ω

7. 3. Notation mathématique, codes de 8592 à 8677

8453 → ℅ 8467 → ℓ 8470 → № 8482 → ™ 8486 → Ω 8494 → ℮

7. 4. Flèches, codes de 8592 à 8677

8592 → ← 8593 → ↑ 8594 → → 8595 → ↓ 8596 → ↔ 8597 → ↕ 8616 → ↨

7. 5. Symboles mathématiques et opérateurs, , codes de 8704 à 8945

8706 → ∂ 8710 → ∆ 8719 → ∏ 8721 → ∑ 8730 → √ 8734 → ∞ 8745 → ∩ 8747 → ∫ 8776 → ≈ 8800 → ≠ 8801 → ≡ 8804 → ≤ 8805 → ≥

Haut de cette page.