Présentation de l'éditeur de pages web

En mode création d'une nouvelle page ou en modification d'une page existante, l'utilisation de l'éditeur de page est exactement identique.

L'éditeur comporte plusieurs zones :

Une barre d'outils qui regroupe l'ensemble des fonctions d'édition : gestion des attributs texte, fonctions de mise en page, insertions (images, liens, tableaux, animations flash, caractères spécifiques ... ), couleurs des textes ou de fond, copier-coller ...
La zone d'édition proprement dite : c'est là que ce fera la saisie des textes et les insertions d'images, l'ajout ou la suppression d'attributs.

Remarque : lorsque vous positionnez la souris sur un bouton de la barre d'outils, une bulle d'aide indique la fonction correspondante.

La zone d'édition se comporte comme un traitement de texte, mais adaptée aux contraintes de la norme HTML. Vous tapez du texte, vous le sélectionnez, vous lui donnez un attribut (par exemple gras) en cliquant sur le bouton correspondant). Les boutons sont classés par groupe :

Groupe 1 : source HTML (affiche les codes HTML), enregistrer la page, nouvelle page, aperçu, imprimer.
Groupe 2 : fonctions de couper-copier-coller.
Groupe 3 : chercher-trouver dans la page, remplacer, tout sélectionner, correcteur orthographique.
Groupe 4 : objets formulaires.
Groupe 5 : attributs textes.
Groupe 6 : puces, retraits, citation, insérer un DIV (style prédéfini), alignements et justifications.
Groupe 7 : gestion des liens hypertexte et ancre (étiquettes HTML).
Groupe 8 : fonctions d'insertions (images, tableaux, flash ... ).
Groupe 9 : styles, format, polices, tailles de caractères, couleurs ; ainsi que les modes d'affichages de la zone d'édition.

Fonctionnement de l'éditeur de pages

L'éditeur de pages fonctionne comme tous les éditeurs web qui s'inspirent des traitements de texte. Dans la zone d'édition, vous tapez vos textes et vous insérez les éléments que vous souhaitez utiliser ou bien valider. Par exemple, vous souhaitez mettre un attribut gras dans le texte d'une page : sélectionnez avec la souris le ou les mot(s) concerné(s) par cet attribut, puis cliquez sur le bouton "gras". L'ensemble des fonctions de l'éditeur vont fonctionner selon ce principe.

Exemple :

Pour certaines fonctions, le fait de cliquer sur un bouton de la barre d'outils ouvrira un assistant (sous forme de fenêtre) dans lequel vous pourrez éventuellement compléter des paramètres et/ou informations. Par exemple, vous souhaitez insérer un tableau : vous cliquez sur le bouton "insérer un tableau" et dans la fenêtre qui s'ouvre vous aurez la possibilité de définir le nombre de lignes ou de colonnes que comportera le tableau, les alignements, espacements entre cellules et à l'intérieur des cellules ... et bien d'autres choses. Lorsque vous cliquez sur le bouton "OK", vous validez les choix que vous venez de saisir et vous effectuez l'insertion du tableau dans la page.

Vous pouvez également basculer en mode Sources HTML en cliquant sur le bouton "Source". Dans ce cas, l'éditeur travaille directement en codes HTML vous permettant d'apporter des modifications plus affinées. Ci-dessous, le tableau que nous venons d'insérer s'affiche de cette façon lorsque l'on clique sur le bouton "Source".