Explorer les exemples

Rendre une page tout de suite!

Pour vous donner une idée de ce qu'est un site Web dans Frontier et ce que veut dire rendre une page Web, Frontier est fourni avec des exemples vous permettant d'expérimenter immédiatement.

Sauter, en utilisant le menu Jump, à websites.samples (ou allez-y comme bon vous semblera ; une autre solution est de choisir Websites dans le menu Open). Sélectionnez l'entrée "randomStuff", et ouvrez-là en tapant Commande-Entrée, ou en double-cliquant sur son triangle.

Note importante : La touche ctrl (Control) sur Windows et la touche Commande (Pomme) sur Macintosh sont équivalentes. Cette introduction emploie en général la touche ctrl ou Control. Si vous utilisez un Mac, pensez à la touche Commande à moins d'un avis contraire.

Ce qui s'ouvre, comme l'indique la colonne Kind, c'est un texte wp. Un texte wp peut être édité comme tout texte dans un texteur ("word processor") : vous pouvez changer la police de caractère et le style du texte sélectionné, ajuster la largeur des paragraphes et davantage (mais police et style ne sont pas pertinents pour le processus qui s'occupe de rendre une page Web, ce dernier considère le texte comme une chaîne de caractères sans formatage).

Au lieu de vous intéresser maintenant au contenu du document, faites ceci : quittez Frontier un instant et lancez votre fureteur (cela peut être Netscape Navigator ou Microsoft Internet Explorer).

À présent, revenez à Frontier, et assurez-vous que websites.samples.randomStuff est la fenêtre active. Depuis le menu Web, choisissez View in Browser. Frontier vous demandera peut être de localiser sur votre disque dur le fureteur dont vous vous servez habituellement. Après un moment, votre fureteur passe au premier-plan montrant une page Web. Cette page Web a été générée en "rendant" le texte contenu dans websites.samples.randomStuff.

Maintenant, allez et venez entre votre fureteur et Frontier et examinez les différences entre websites.samples.randomStuff et ce qu'affiche votre fureteur. Le document websites.samples.randomStuff est conçu pour vous montrer les caractéristiques principales du procédé de rendu, de telle sorte que vous puissiez voir ce que Frontier sait faire.

Nous allons passer rapidement sur ces caractéristiques sans chercher à vraiment les expliquer en profondeur, puisque que le reste de cette introduction s'en chargera.

En passant, il y a en fait non pas deux mais trois représentations de cette page Web à remarquer : (1) la page non rendue dans Frontier, websites.samples.randomStuff ; (2) le texte rendu contenant les balises HTML et d'autres choses que Frontier ajoute durant le processus de rendu, et qui existe quelque part sur votre disque dur ; et (3) la représentation formatée des instructions données par la balise HTML et qui est ce que votre fureteur montre maintenant. Nous allons ignorer pour l'instant le point (2) et nous concentrer sur (1) et (3).

Note destinée aux utilisateurs Macintosh de MSIE : Vous serez tentés en poursuivant ce texte, de faire des changements à websites.samples.randomStuff et de voir ceux-ci en choisissant View in Browser. Mais Internet Explorer n'actualise pas automatiquement l'ancienne version lorsque vous choisissez View in Browser. Internet Explorer passe au premier-plan mais il vous faut choisir le menu Actualiser ("Refresh") pour voir les nouveaux changements (les utilisateurs de Navigator n'ont pas cet inconvénient).

Un petit tour rapide

Chaque paragraphe du document montre une fonction différente de Frontier. Attention, n'essayez pas de comprendre chacune d'entre elles maintenant ! Profitez simplement de cette visite guidée. Rappelez-vous que nous avons tout le reste de cette introduction pour étudier ces fonctions plus en détail.

Dans le fureteur, regardez la barre de titre de la fenêtre. La page Web a été nommée d'après votre nom ! (Si votre nom est "Beta User", vous pouvez sauter à user.prefs et y changer votre nom, vos initiales, votre adresse de courrier électronique, et le nom de votre institution/entreprise). Cela s'est produit parce que dans le premier paragraphe, il y a "#title" qui fait appel à user.name, lequel correspond à l'entrée de la base de données où Frontier a stocké le nom que vous lui avez donné la première fois que vous l'avez lancé.

(Vous pouvez allez à user.name si vous le désirez pour vérifier que cela est vrai. Si vous changez la valeur de cette entrée et revenez à websites.samples.randomStuff et choisissez encore View in Browser, la page rendue aura un titre différent.)

Faites défiler la fenêtre de votre fureteur jusqu'en bas : la dernière ligne montre votre nom, votre adresse de courrier électronique et la date. Ces éléments, en plus de la séparation horizontale (

---

) qui les précède, et du titre en gros caractères où apparaît votre nom, ne proviennent pas de websites.samples.randomStuff mais d'une entrée différente de la table websites, appelée #template.

Chaque page Web est automatiquement incluse dans un #template ("modèle") au moment où elle est rendue, qui ce permet d'uniformiser les éléments qui vont au début et à la fin de chaque page.

Cela permet également un formatage uniforme : par exemple chaque paragraphe de texte (tout ce qui est après le gros titre) est en blockquote ("bloc en retrait"), et cela vient aussi de #template.

Ce qu'il faut bien comprendre, c'est que toute page contenue dans user.websites aura automatiquement ce type de formatage et ce type d'éléments en début et fin de page. Voilà la puissance des modèles.

À présent, notez que les paragraphes venant de websites.samples.randomStuff apparaissent séparé dans le fureteur. Comme vous le savez, cela requiert les balises <p> , puisqu'un retour-chariot seul ne peut être interprété par le fureteur comme une nouvelle ligne. Mais il n'y a pas de <p> dans websites.samples.randomStuff.

Frontier a inséré les <p>. En particulier, il a mis un <p> à chaque fois qu'il a trouvé deux retours-chariot consécutifs dans websites.samples.randomStuff.

Et maintenant ? Le premier paragraphe dans le fureteur a une singularité stylistique, une première lettre plus grande. Cela a été provoqué par un filtre ("filter"), plus précisément par user.websites.#filters.pagefilter.

Un filtre est un endroit où vous pouvez mettre des commandes qui seront exécutées lorsque la page sera rendue et qui permettront de modifier celle-ci. Chaque page Web passe à travers des filtres, ce qui vous permettra d'uniformiser automatiquement toutes les pages qui sont dans websites. Celles-ci auront toutes cette lettre plus grande quand la page sera rendue.

Voyez-vous le texte en vert ? C'est la balise <font> dans websites.samples.randomStuff qui en est responsable. Le but, ici, est de vous montrer que les balises HTML que vous intégrez à vos page dans Frontier demeurent une fois la page rendue.

C'est un contraste significatif avec les logiciels de prévisualisation HTML ("WYSIWYG HTML") qui, lorsque vous tapez <blink>, font apparaître dans votre fureteur la phrase littérale <font> , et non pas la balise HTML correspondante, parce que le crochet d'ouverture < sera remplacé par "&lt;". Un outil de prévisualisation automatique de HTML considère qu'il doit être le seul en charge du HTML. En revanche, Frontier vous aide à générer du HTML si vous avez besoin de son aide, mais son orientation fondamentale est que vous devez contrôler manuellement votre propre HTML.

Le troisième paragraphe contient des liens hypertextes, bien que nous n'en voyions pas la cause dans websites.samples.randomStuff, et le quatrième paragraphe nous dit pourquoi.

L'explication est le "glossary" ("glossaire") : les mots et les phrases entre guillemets, comme "Netscape", sont remplacés par les valeurs correspondant aux entrées définies dans user.html.glossary (allez-y donc voir). Certaines de ces valeurs, comme dans ce cas, sont des balises de liens ("anchor tags") entourant du texte.

Manifestement, si nous savons que nous allons faire référence à "Netscape" avec un lien hypertexte à plusieurs endroits dans un ou des documents, cela nous épargnera l'effort fastidieux de taper ces liens (et également de les taper sans erreurs à chaque fois).

Le sixième et le septième paragraphe montrent comment les URL et les adresses électroniques deviennent des liens hypertextes pendant le processus de rendu. Dans websites.samples.randomStuff vous voyez simplement l'URL d'une page web et celui d'une adresse électronique; Frontier a généré les liens à partir de ces URLs.

Dans le paragraphe suivant, le nombre qui suit l'expression "curly braces" est généré chaque fois que la page est rendue, en utilisant les commandes UserTalk insérées entre accolades (true) dans websites.samples.randomStuff.

Si vous retournez à websites.samples.randomStuff et choisissez View in Browser encore une fois, vous verrez sûrement un nombre différent dans le fureteur quand la page aura de nouveau été rendue, parce que ces commandes indiquent à Frontier de générer un nombre au hasard, et parce que Frontier exécute ces commandes à chaque fois qu'il rend une page.

Tout ce qui peut se faire avec UserTalk peut être fait au sein d'une page Web. C'est ce qu'on appelle une "macro".

En faisant défiler jusqu'en bas la fenêtre du fureteur, on voit que la dernière séparation horizontale et la ligne qui la suit font encore partie de #template.

Vous pouvez examiner user.websites.#template maintenant si vous le désirez ; il se peut que cela ne vous dise pas grand-chose en ce moment, mais une comparaison de celui-ci avec ce qui se trouve dans la fenêtre de votre fureteur risque de vous donner des indices de ce qui s'y passe.

Bon, c'était votre introduction éclair. À présent, vous allez vous y mettre en le faisant vous même.