Ajout du contenu à un formulaire |
L'ajout de contenu à un formulaire se fait via un éditeur de type texte qui génère automatiquement le code html.
Un utilisateur peut donc, sans connaissance préalable du langage html, créer des pages web de type formulaire.
Utilisation de l'éditeur html
la palette d'outils
des outils d'édition
|
couper |
|
copier |
|
coller |
|
coller comme texte. Ouvre une fenêtre de collage spécial dans laquelle l'utilisateur colle son texte (formats rtf, OpenOffice...)
|
|
Coller à partir de Word. Ouvre une fenêtre de collage spécial dans laquelle l'utilisateur colle son texte (format .doc)
|
|
Annuler dernière action |
|
Refaire dernière action |
|
rechercher des caractères
entrer les caractères recherchés et cliquer su le bouton marqué "c" |
|
Rechercher et remplacer
|
|
Tout sélectionner |
|
gomme: "supprimer format" (supprime les styles appliqués au contenu). Pour changer le style d'un contenu (texte, image, liens...) il est souhaitable de supprimer le style existant grâce à ce bouton avant de définir un nouveau style. Pour supprimer le style d'un contenu, sélectionner le contenu et cliquer sur le bouton la gomme. |
des outils de mise en forme et de mise en page
|
caractères gras |
|
caractères en italique |
|
caractères soulignés |
|
caractères barrés |
|
caractères en indice |
|
caractères en exposant |
|
numérotation automatique |
|
insertion automatique de puces |
|
diminuer le retrait |
|
augmenter le retrait |
|
aligner à gauche |
|
centré |
|
aligner à droite |
|
justifié |
|
appliquer un style prédéfini. (menu déroulant) |
|
appliquer une police prédéfinie (menu déroulant) |
|
taille des caractères (choisir dans la liste déroulante) |
|
couleur des caractères (choisir dans la liste déroulante) |
|
couleur d'arrière plan (choisir dans la liste déroulante) |
des outils de création de sauvegarde d'impression et d'affichage de documents
|
sauvegarder |
|
créer une nouvelle page (elle efface la page en cours) |
|
Créer une nouvelle page à partir d'un modèle (choisir parmi les modèles proposés dans la fenêtre popup) |
|
Imprimer la page |
|
aperçu avant impression |
|
afficher/masquer la palette d'outils |
des outils d'insertion (tableaux images, de liens etc...)
|
Insérer/modifier un lien Pour insérer/modifier un lien, sélectionner les caractères (mots, phrase) et cliquer sur le bouton "insérer/modifier lien", pour modifier un lien existant, reprendre la procédure décrite ci-dessus ou alors, sélectionner le lien et faire un clic droit en choisissant l'option "modifier lien" Les liens sont gérés à travers une fenêtre popup qui présente quatre onglets:
cet onglet permet de choisir un type de lien dans la liste déroulante (url, ancre, e- mail...):
S'il s'agit d'une URL, choisir le protocole dans la liste déroulante (http, https, ftp...) et entrer l'adresse de l'url dans la zone de texte marquée "url". Si le lien pointe sur un document, cliquer sur le bouton "parcourir le serveur" pour charger le document. S'il s'agit d'une ancre de page, l'utiilisateur est invité à sélectionner l'ancre
S'il s'agit d'un e-mail, la fenêtre de configuration permet à l'utilisateur de préciser entre autre l'adresse e-mail de destination.
Pour des liens de type url, l'onglet destination permet de spécifier la fenêtre de destination du lien (ouverture du lien dans la même fenêtre, dans la fenêtre mère, dans une nouvelle fenêtre...)
Pour des liens de type url pointant sur un document (texte, image...) l'onglet upload permet de joindre le document.
L'onglet "avancé" permet d'appliquer un style particulier au lien (nom, texte en info bulle, type de mise en forme...)
|
|
Supprimer lien |
|
ajouter/modifier une ancre. Une fenêtre popup permet d'entrer le nom de l'ancre.
|
|
Ajouter/modifier une image Les images sont gérées à travers une fenêtre popup qui présente quatre onglets
URL: pour saisir l'url de l'image (ou la rentrer automatiquement en cliquant sur "parcourir le serveur" et en chargeant l'image) texte de remplacement au cas où l'image ne s'affiche pas dans le navigateur, saisir dans cette case le texte qui apparaîtra. largeur/hauteur de l'image en pixel
L'utilisateur peut conserver les proportions de l'image
(en cliquant sur Bordure pour associer une bordure à l'image. HSpace/Vspace espacement vertical et horizontal (en pixel) entre l'image et le texte. Alignement liste déroulante proposant un type d'alignement de l'image dans la page (centré, à gauche, à droite etc...) Une fenêtre de prévisualisation permet de générer l'aperçu.
|
|
Insérer/modifier tableau: Cet onglet permet d'insérer des tableaux à la mise en forme.
Lignes/colonnes pour préciser le nombre de lignes et de colonnes du tableau largeur/hauteur pour préciser les largeur et hauteur du tableau (en pixel par défaut ou choisir l'unité à partir de la liste déroulante) bordure du tableau alignement (gauche, droite, centré) espacement entre les doubles-lignes qui constituent les bordures du tableau. contour: espacement autour du contenu de la cellule. Titre/résumé: descriptif du tableau |
|
insérer un séparateur |
|
Insérer un caractère spécial: une fenêtre popup permet de sélectionner le caractère à insérer par simple clic.
|
des outils d'insertion de contenu interactif (case à cocher, bouton radio, champ texte, liste déroulante...)
Ces outils mettent en relation le sondeur et l'enquêté, à travers des champs de remplissage qui seront récupérés sous forme de table xml et exportable au format xls.
|
case à cocher (pour des choix multiples)
Les cases à cocher sont utilisées pour des questions à choix multiples avec possibilité de choisir plus d'une réponse. nom: fait référence au libellé du champ dans le fichier xml valeur: fait référence à la réponse choisie par l'enquêté. la case à cocher "sélectionné" permet de proposer à l'enquêté une valeur par défaut. exemple
|
|
bouton radio (pour des choix exclusifs)
Les boutons radio sont utilisés pour des questions à choix multiple, mais avec des réponses exclusives. nom: fait référence au libellé du champ dans le fichier xml valeur: fait référence à la réponse choisie par l'enquêté. la case à cocher "sélectionné" permet de proposer à l'enquêté une valeur par défaut. L'enquêté ne peut choisir qu'une seule des réponses parmi celles qui lui sont proposées; de ce fait il est impératif que le nom du bouton soit le même, pour toutes les valeurs proposées. exemple
|
|
champ texte cet outil permet de créer un champ texte pouvant contenir du texte ou un mot de passe. Ces données sont au format texte, nombre ou date.
nom: fait référence au libellé du champ dans le fichier xml valeur: fait référence à la réponse choisie par l'enquêté. largeur en caractère de la ligne de remplissage nombre maximum de caractères admissibles type: texte ou mot de passe type de données: texte, nombre ou date la case à cocher obligatoire rend le remplissage du champ obligatoire avant toute validation du formulaire. |
|
zone de texte l'outil zone de texte permet de créer du contenu texte sur plusieurs lignes.
nom: fait référence au libellé du champ dans le fichier xml colonne/ligne: nombre de ligne/colonnes de la zone en pixel. type de données: texte, nombre ou date la case à cocher obligatoire rend le remplissage du champ obligatoire avant toute validation du formulaire. |
|
liste/menu cet outil permet de créer des listes ou des menus déroulants.
nom: fait référence au libellé du champ dans le fichier xml taille: nombre de lignes visibles dans la fenêtre qui sera générée. la case à cocher sélection multiple permettra à l'enquêté de sélectionner plusieurs choix. texte: Il s'agit du texte que voit l'enquêté valeur: c'est la valeur qui sera associée au champ "nom" dans la table du fichier xml. saisir le texte et la valeur et:
Pour modifier un texte/une valeur déja saisi, cliquer
sur ce texte/valeur, il s'affiche dans la fenêtre
texte/valeur. Saisir le nouveau texte/valeur et cliquer
sur exemple
|
|
champ caché cet outil génère un champ texte invisible pour l'enquêté. ce champ texte n'apparaît que dans le fichier xml.
nom: fait référence au libellé du champ dans le fichier xml valeur: c'est la valeur qui sera associée au champ "nom" dans la table du fichier xml. |
la possibilité d'accéder au code source.
|
Ce bouton ouvre une page contenant le code html de la page en active.
Des modifications peuvent être apportées à la page directement à partir de cette fenêtre. Cliquer sur "OK" pour prendre en compte les modifications ou sur "Annuler" sinon. |
Pour prendre en compte les modifications
apportées à la page html
pour fermer la page sans prendre en compte les
modifications.