# Amaya - Guide utilisateur

Irène Vatton
Dernière mise à jour : 16-05-2005 - 09:16

Ce document a pour but d'aider les nouveaux utilisateurs d'Amaya. Pour plus de détail sur l'interface, il faut se reporter au manuel de référence.

### Plan

1. Introduction
   - Pourquoi un éditeur structuré pour HTML ?
   - Pourquoi des familles HTML ?
   - Les familles HTML
   - Quelques règles d'accessibilité à suivre
2. Présentation générale d'Amaya
3. Paramétrage de l'application
4. Création/Edition d'une page Web
5. Création du contenu (paragraphes, en-têtes de sections, divisions)
6. Le listes
7. Les liens
8. Mises en évidence du texte
9. Les tables
10. Recherche/Remplacement - Correction orthographique
11. Attributs
12. Création de feuilles de style CSS
13. Détection des erreurs

## 1. Introduction

L'objectif du Web est de permettre l'échange d'informations quelque soit le support. HTML en définit un modèle de document Web standard et partagé par un large éventail d'outils.

Avec les CSS (Cascading Style Sheets) il y a même séparation entre la structure + contenu et la présentation. L'auteur d'un document Web doit donc distinguer ce qui est du ressort de la structure (titres, paragraphes, listes, etc.) de ce qui n'est que de la présentation (taille de caractères, couleurs, etc.). Un bon exercice est d'essayer de comprendre un document en ne lisant que les balises HTML et le texte.

### Pourquoi un éditeur structuré pour HTML ?

HTML définit une structure (organisation) de document.

- Elements : Découpage sémantique du document même si ce découpage a un effet sur la présentation.

  Par exemple un H2 a un effet de présentation mais donne aussi une information sémantique. C'est un en-tête moins important qu'un H1 et plus important qu'un H3.

  De même un lien (ancre + href) définit plus qu'un simple texte coloré/souligné.

- Attributs : Caractérisation sémantique

  L'attribut class="section" sur une division, la cible d'un lien href="http://www.w3.org/"

### Pourquoi des familles HTML ?

Avant que le langage CSS ne soit finalisé, HTML avait introduit des éléments et des attributs qui n'avaient pas de valeur sémantique, mais servaient à modifier la présentation des documents. Par exemple <font>...</font> pour choisir une police de caractères particulière. Avec le langage CSS, ces éléments et attributs n'ont plus de raison d'être. La sous-famille de HTML 4.0 Strict élimine les éléments et attributs HTML qui doivent être remplacé par des propriétés CSS (center, font, color, background).

La sous-famille de HTML 4.0 Frameset isole les éléments et attributs qui décrivent le découpage en fenêtres (frames). Le W3C décommande l'utilisation des "frames" pour faire que les sites Web soient accessibles aux handicapés (problèmes de navigation et de contexte).

D'autres familles XHTML ont été introduites par :

- Besoin de modularisation pour s'adapter à de nouveaux supports (PDA, téléphones, télévision)
- Nécessité d'avoir des structures propres pour filtrer et transformer de façon automatique les documents

  Exemple : extraire les titres et ne présenter le texte qui suit qu'à la demande

- Autoriser la composition avec d'autres langages XML (RDF, MathML, SVG, SMIL, autres).

### Les différences entre HTML et XHTML

Dans l'exemple suivant est affiché en rouge le balisage spécifique à XHTML et en pourpre le doctype de HTML.

    <?xml version="1.0" encoding="iso-8859-1"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
          "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
          "http://www.w3.org/TR/html4/loose.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
    <title>Amaya - Guide utilisateur</title>
    </head>
    <body xml:lang="fr">
    <h1 id="Amaya">Amaya - Guide utilisateur</h1>
    <h2>Plan</h2>
    <ol>
    <li>Introduction</li>
    <li>HTML</li>
    <li>Quelques règles</li></ol>
    </body>
    </html>

### Les familles HTML

Famille | Eléments + attributs | Strucutre
--- | --- | ---
HTML 4.0 Transitional | Tout sauf les frames | Structure implicite
HTML 4.0 Strict | Sans éléments de présentation | Structure implicite
HTML 4.0 Frameset | Les frames | Structure implicite
XHTML 1.0 Transitional | Tout sauf les frames | Structure bien formée
XHTML 1.0 Strict | Sans éléments de présentation | Structure bien formée
XHTML 1.0 Basic | Adapté aux téléphones | Structure bien formée
XHTML 1.1 | XHTML 1.0 Strict + annotations Ruby | Structure bien formée

### Quelques règles d'accessibilité à suivre

Enoncé de quelques règles

- Produire des documents valides
- Séparer structure et présentation
  Ne pas considérer que tout le monde dispose du même écran que vous
- Ne pas utiliser du JavaScript pour naviguer
- Ne pas utiliser les frames
- Fournir des textes alternés pour les images, les vidéos, etc.

## 2. Présentation générale d'Amaya

Amaya est à la fois navigateur et un éditeur :

Amaya est un éditeur doté de capacités de navigation. C'est à dire que pendant que l'utilisateur travaille sur les documents de son site Web, il peut accéder n'importe quel autre document Web de sites extérieurs.

Lorsqu'il est utilisé comme navigateur, Amaya se comporte comme beaucoup d'autres navigateurs Web, excepté pour ce qui est d'activer les liens. Par défaut le simple clic est utilisé pour poser la sélection (définir le point d'insertion de texte) et il faut effectuer un double-clic sur un lien pour l'activer.

La barre de menu :

- Fichier : création de documents, navigation, impression, fermeture.
- Edition : édition de base, recherche/remplacement, correction orthographique, paramétrage.
- XHTML : création/remplacement d'éléments (X)HTML.
- XML : création d'éléments XML.
- Liens : création et destruction des liens.
- Vues : gestion des différentes vues du document.
- Style : gestion du style CSS.
- Annotations : création, destruction d'annotations.
- Aide : donne accès au manuel en ligne.

La barre de boutons

Contient quelques boutons d'accès aux fonctions les plus utilisées

- Stop : arrête le transfert d'information depuis un serveur Web
- Document précédent : retour au document précédent (s'il y en a un)
- Document suivant : retour au document suivant (s'il y en a un)
- Recharger : recharge le document (accès serveur)
- Page personnelle : affiche la page de démarrage
- Sauver : sauver les modifications
- Imprimer : imprime le document
- Rechercher/Remplacer : affiche un formulaire de recherche/remplacement de texte

Les outils

Amaya persente sur la gauche une liste d'outils dont une liste de raccourcis pour créer des éléments HTML.

- Mise en évidence : permet de créer/supprimer un élément "mise en évidence" (<em>...</em>)
- Important : permet de créer un élément "important" (<strong>...</strong>)
- Fonte fixe : permet de créer un élément "fonte fixe" (<code>...</code>)
- Ajout d'une image : permet de créer un élément "image" (<img/>)
- Titre niveau 1 : permet de créer un élément "titre niveau 1" (<h1>...</h1>)
- Titre niveau 2 : permet de créer un élément "titre niveau 2" (<h2>...</h2>)
- Titre niveau 3 : permet de créer un élément "titre niveau 3" (<h3>...</h3>)
- Liste : permet de créer un élément "liste à puces" (<ul>...</ul>)
- Liste numérotée : permet de créer un élément "liste numérotée" (<ol>...</ol>)
- Liste de définitions : permet de créer un élément "liste de définition" (<dl>...</dl>)
- Lien : permet de créer un élément "titre niveau 1" (<a href="...">...</a>)
- Table : permet de créer un élément "titre niveau 1" (<table>...</table>)

et une zone d'affichage de l'adresse du document.

## 3. Paramétrage de l'application

Avant d'éditer des documents Web avec Amaya, il est important de fixer un certain nombre de paramètres. Pour cela il faut ouvrir au moins deux des dix menus de préférences disponibles dans Éditer/Préférences. Chaque menu présente trois boutons d'action :

Appliquer | Ce bouton valide et stocke les options affichées dans le menu.
Défauts | Ce bouton rétablit, mais ne sauve pas, les valeurs par défaut. Il faut utiliser le bouton Appliquer pour valider les options.
Terminer | Ce bouton ferme le menu.

Voici les paramètres importants à régler :

#### Dans les préférences générales

- Page de démarrage : Spécifie l'URI qu'Amaya chargera au démarrage ou quand l'utilisateur pressera le bouton (par exemple l'URI `http://www.w3.org`).
- Activer le coller ligne à ligne : Cette option concerne le coller depuis une autre application. Quand cette option est activée, les lignes de l'application source sont conservées. Sinon les caractères « fin de ligne » sont remplacés par des espaces.
- Produire des fichiers de sauvegarde : Si cette option est active Amaya va produire périodiquement un fichier de sauvegarde pour chaque document édité.
- Montrer les cibles : Contrôle si les cibles de liens sont visualisées ou non. Montrer les cibles peut aider quand on veut créer de nouveaux liens. Cette option agit immédiatement sur tous les documents édités.
- Zoom caractères : Cette option vous permet de réduire ou d'augmenter les tailles des polices de caractères utilisées. Cette option a un effet immédiat sur tous les documents édités.
- Langue du dialogue : Spécifie la langue utilisée dans les menus et les messages. La langue par défaut est l'anglais américain (valeur en). D'autres langues sont possibles comme le français (fr), l'italien (it), l'espagnol (es), et l'allemand (de).

#### Dans les préférences de navigation

- Charger les images : Contrôle si les images doivent être chargées et affichées. Sinon, l'attribut ALT est visualisé à la place de l'image. Cette option prend effet dès que le formulaire est validé.
- Charger les objets : Contrôle si les objets doivent être chargés et affichés. Sinon, le contenu de l'objet est visualisé à la place de l'objet. Cette option prend effet dès que le formulaire est validé.
- Montrer les images de fond : Contrôle si les images en arrière plan doivent être montrées ou non. Cette option prend effet dès que le formulaire est validé.
- Le double clic active les liens : Depuis la première version d'Amaya, les utilisateurs ont besoin de double cliquer sur un lien pour l'activer. Cela permet de différencier l'édition d'un lien de son activation. Vous pouvez changer ce comportement en désactivant cette option.

A voir pour plus de détail

## 4. Création/Edition d'une page Web

L'entrée Fichier/Nouveau permet de créer un nouveau document d'un type donné. Amaya demande de spécifier l'URI ou le nom local du document à créer (un nom par défaut est généré). Après confirmation, Amaya ouvre un nouveau document vide.

L'entrée Fichier/Ouvrir remplace le document affiché. Amaya utilise la même entrée de menu par le nouveau document sélectionné. Amaya utilise la même entrée de menu pour ouvrir un document local ou un document d'un serveur Web.

Les entrées du menu XHTML présentent les éléments que l'on peut insérer dans le document affiché, en fonction de la famille XHTML choisie. La manière la plus simple de créer de nouveaux éléments dans un document est de placer le point d'insertion dans la position voulue et d'utiliser le menu XHTML, ou la barre d'outil pour les éléments les plus communs (images, en-têtes, listes...).

Ces boutons ou entrées de menu créent l'élément correspondant à la position courante. Si l'élément désiré ne peut pas être créé exactement à la position choisie. Amaya tente alors de créer l'élément à l'endroit le plus proche possible.

### Définir le titre du document

Par défaut Amaya donne le titre "No title" au document nouvellement créé parce que cet élément est obligatoire. Il ne faut pas oublier de mettre à jour ce titre en activant l'entrée XHTML/Changer le titre.

### Définir la langue utilisée

Il est important de définir la langue dans laquelle est écrit le document. Sans indication explicite, le document est supposé écrit en anglais. La langue est utilisée par le correcteur orthographique.

Pour définir qu'un document est écrit français, il faut sélectionner l'élément <body> et lui appliquer l'attribut lang=fr (voir les attributs dans les outils).

#### Première méthode

On pose la sélection n'importe où dans le document et on utilise la touche `F2` pour remonter la sélection sur l'élément <body>. La barre de statut affiche l'élément sélectionné. A ce moment là on sélectionne l'entrée langue de l'outil Attributs pour afficher le formulaire de choix de la langue.

#### Deuxième méthode

On ouvre la vue Structure (entrée Vue/Montrer la structure), on sélectionne l'élément <body>.A ce moment là on sélectionne l'entrée langue de l'outil Attributs pour afficher le formulaire de choix de la langue.

### Sauver des documents en HTML

Amaya ne fournit aucune vue d'ensemble des pages installées sur le serveur. Cependant il est possible de sauver ou copier des fichiers sur un serveur ou sur sur son disque local grâce aux commandes Sauver et Sauver comme. Pendant ces opérations, Amaya tient compte des images.

#### La commande Sauver

La commande sauver peut être invoquée soit en choisissant Sauver depuis le menu Fichier (`Ctrl s` pour Windows, `Ctrl x Ctrl s` pour Unix) ou bien en cliquant sur le bouton .

#### La commande Sauver comme

Le fait de sélectionner l'entrée Sauver comme dans le menu Fichier ouvre une boîte de dialogue qui permet de sauver le document courant à une adresse différente (sur un serveur Web ou sur le disque local) ou de changer certains paramètres, comme le format du document et l'encodage.

## 5. Création du contenu (paragraphes, en-têtes de sections, divisions)

Par défaut, Amaya crée un nouveau paragraphe chaque fois que l'on active la touche `Enter`. Une fois le paragraphe et son contenu créé, on peut insérer un en-tête de section, avant, après, ou au milieu du paragraphe,

- en activant un des boutons Hn,
- ou en tapant `Ctrl n` (n allant de 1 à 6),
- ou en sélectionnant, l'entrée correspondante du menu XHTML.

Quand l'insertion se fait au milieu du paragraphe, Amaya coupe le paragraphe existant en deux et insère l'en-tête au milieu.

### Transformations

Si une partie du paragraphe est sélectionnée au moment où on insère l'en-tête, ce texte sera supprimé dans le paragraphe et inséré dans l'en-tête créé.

On peut aussi sélectionner le paragraphe (touche `F2`) et transformer ainsi le paragraphe en en-tête. Un ou plusieurs paragraphes peuvent en fait se transformer en liste, table, préformaté en fonction de l'élément cible choisi. L'entrée de menu Edition/Transformer propose les cibles possibles pour la sélection courante.

### Préformaté

L'élément préformaté est un paragraphe particulier qui permet de préserver tous les caractères : espace, fin de ligne.

Pour transformer un paragraphe en préformaté, on sélectionne le paragraphe en entier et on active l'entrée de menu XHTML/Préformaté (ou `Ctrl h Ctrl p`).

Pour transformer un préformaté en paragraphe, on sélectionne le préformaté en entier et on active l'entrée de menu XHTML/Paragraphe.

Quand la sélection se trouve à la fin d'un <pre>, la touche `Enter` crée une nouvelle ligne du <pre>. Pour créer un paragraphe après le <pre>, il faut sélectionner le <pre> en utilisant la touche `F2` puis `Enter`.

### Division

Il est possible de grouper une série de paragraphes, en-têtes, etc. dans une division. Pour cela, on sélectionne les éléments à grouper ainsi que l'entrée Division dans le menu XHTML.

### La touche Enter

La touche `Enter` (ou Return) joue un rôle particulier. En général elle clôt l'élément courant et crée un paragraphe juste après. Si un élément complet est sélectionné, la touche `Enter` crée une autre instance de cet élément. Par exemple si on sélectionne un en-tête, la touche `Enter` va créer un en-tête vide après.

### Les touches Back Space et Delete

Des éléments consécutifs peuvent être fusionnés, même s'ils ne sont pas au même niveau dans la structure du document. La fusion s'effectue à l'aide des touches `Back Space` et `Delete`. Quand le point d'insertion est à la fin d'un élément, utilisez la touche `Delete`. Quand il est au début, utilisez la touche `Back Space`. Dans les deux cas, ces touches n'effacent aucun caractère. Elles fusionnent des éléments séparés par une limite de structure.

Quand le point d'insertion est à l'intérieur d'un élément, ces deux touches effacent comme d'habitude le caractère suivant ou le caractère précédent.

### Caractères spéciaux

Pour les caractères ISO-latin qui ne sont pas directement disponibles depuis le clavier, Amaya utilise le support standard fournit par le système.

Amaya fournit aussi des raccourcis pour certains caractères non disponibles au clavier comme :

- Pour obtenir un espace non sécable, vous devez taper `Ctrl espace`. Ce caractère sera sauvé comme une entité (`&nbsp;`).
- Pour obtenir un € (euro), vous devez taper `Alt e`.
- Pour obtenir un «, vous devez taper `Ctrl <` (ou `Shift` `Ctrl <` selon le clavier).
- Pour obtenir un », vous devez taper `Shift Ctrl >`.

### Insérer une image

Pour insérer une image, on choisit l'entrée Image dans le menu XHTML (raccourci `Ctrl h Ctrl i`) ou on clique sur le bouton . Une boîte de dialogue s'affiche qui permet de rentrer le nom du fichier et le texte de remplacement ('ALT' texte) de l'image. L'insertion n'est prise en compte que lorsque le texte de remplacement est fourni.

L'image est affichée avec ses dimensions par défaut. On peut redimensionnerer l'image insérée en éditant les attributs width et/ou height de l'image. Quand l'image est sélectionnée, on sélectionne l'entrée width ou height de l'outil Attributs.

Par défaut l'image est cadrée à gauche. On peut modifier le cadrage de l'image sélectionnée en modifiant l'alignement dans l'outil Format (il faut valider le changement de format avec le bouton ).

### Remplacer une image

Pour remplacer une image il faut sélectionner cette image en draguant sur l'image avec la souris. Procédez alors comme pour l'ajout d'une image (voir ci-dessus). Lorsqu'une image (et seulement une image) est entièrement sélectionnée, la boîte de dialogue des images effectue le remplacement de l'image sélectionnée au lieu d'insérer une nouvelle image.

### Copier/Coller, Défaire/Refaire

Amaya permet copier/coller non seulement du texte et des images, mais aussi une structure complexe comme une division ou une suite de paragraphes et d'en-têtes.

Il est toujours possible de défaire et de refaire les dernières modifications opérées dans le document.

A voir pour plus de détail

## 6. Les listes

### Editer les listes à puces ou les listes numérotées

#### Première méthode

En cliquant sur (ou `Ctrl h Ctrl l`) on crée une liste à puces et un premier item de liste à l'intérieur.

- Il ne reste plus qu'à taper le texte de l'item.

  La touche `Enter` en fin d'item va créer un paragraphe vide dans l'item et on peut immédiatement saisir le contenu de ce nouveau paragraphe.

- Si on ne veut pas insérer de paragraphe mais passer à l'item suivant, on double la touche `Enter`.

  Attention en cliquant sur (ou `Ctrl h Ctrl l`) on crée une nouvelle liste à puces à l'intérieur de l'item courant.

- Si on veut terminer la liste, on triple la touche `Enter`.

En cliquant sur (ou `Ctrl h Ctrl n`) on crée une liste numérotée et un item de liste à l'intérieur.

#### Deuxième méthode

On peut saisir du texte sans définir au préalable de type d'élément. Par défaut, Amaya crée un nouveau paragraphe chaque fois que l'on active la touche `Enter`. On peut ensuite sélectionner plusieurs paragraphes et cliquer sur (ou `Ctrl h Ctrl l`) pour créer une liste à puces.

Pour sélectionner tout le contenu d'une suite de paragraphes, on utilise la touche `F2`.

#### Transformation d'une liste à puces et en liste numérotée

On pose la sélection dans un item de liste, puis en doublant la touche `F2` on sélectionne la liste complète. En cliquant sur (ou `Ctrl h Ctrl n`) on crée une liste numérotée à la place. On peut bien sûr passer de la même façon d'une liste numérotée à une liste à puces.

### Editer les listes de définitions (dl/dt/dd)

En cliquant sur (ou `Ctrl h Ctrl d`) on crée une liste de définitions.

La touche `Enter` est également utile pour éditer des listes de définitions. Considérez l'exemple suivant :

> Terme 1
> Terme 2
>   Définition des deux termes.

C'est une liste de définitions (`dl`) contenant deux termes (`dt`) suivis par une définition (`dd`). Pour ajouter un nouveau paragraphe à l'intérieur de la définition (`dd`), placez le point d'insertion à la fin (après le mot "termes") et appuyez sur la touche `Enter`. Si vous pressez `Enter` deux fois, vous sortez de la définition en cours (`dd`) et vous créez un nouveau terme (`dt`). A la fin de ce nouveau terme, presser une fois la touche `Enter` vous permet de créer encore un nouveau terme (`dt`). La presser deux fois crée une nouvelle définition (`dd`).

Si vous voulez créer un nouveau terme avec sa définition avant le Terme 1, mettez le point d'insertion au début du terme 1 et appuyez sur `Enter`. Tapez le nouveau terme (`dt`), puis pressez `Enter` deux fois : une nouvelle définition (`dd`) est créée directement après le nouveau terme.

De façon générale on utilise la touche `Enter` pour insérer des éléments de structure avant ou après des listes ou des items de liste, et les touches `Back Space` et `Delete` pour fusionner des listes ou des items de listes.

## 7. Les liens

Les liens hypertexte permettent de relier des parties de document entre-elles ou des documents entre-eux.

### Création de cibles

La cible d'un lien hypertexte peut être

- un document entier,
- ou un passage du document englobé par une ancre cible,
- ou un élément HTML qui possède un identificateur (attribut ID)

Pour créer une cible dans un document, il suffit de sélectionner le passage désiré et d'activer l'entrée de menu Créer cible (`Ctrl l Ctrl t`) dans le menu Liens. Si la sélection porte sur un élément HTML entier, Amaya va lui associer un identificateur unique. Sinon, Amaya va englober le contenu de la sélection dans une ancre cible.

### Création de liens

L'origine d'un lien est une ancre qui possède un attribut `href`. On procède de la même façon pour un lien vers un document entier ou une cible.

#### Lien vers un autre document édité par Amaya

1. On sélectionne le passage choisi.
2. On clique sur le bouton
3. On clique sur le document cible affiché.

Autre méthode :

1. On sélectionne le passage choisi.
2. On choisit Créer/changer lien du menu Liens (raccourci `Ctrl l Ctrl l`) pour afficher le formulaire de création de lien.
3. Soit on saisit l'URI du document cible et on confirme. Soit on décide de désigner la cible avec la souris (bouton Clic puis clic sur le document cible affiché).

Dans tous les cas, une fois la cible choisie, Amaya va calculer l'URL relative qui permet d'aller du document source au document cible.

#### Lien vers une ancre cible d'un document édité par Amaya

Pour créer un lien vers une ancre cible particulière ou vers un élément cible particulier d'un document édité par Amaya, il faut d'abord demander la visualisation des cibles dans le document concerné en activant l'entrée Montrer les cibles du menu Vues ou ouvrant la vue des liens (entrée Montrer les liens du menu Vues). Ensuite :

1. On sélectionne le passage choisi.
2. On clique sur le bouton
3. On clique sur la cible choisie.

#### Lien vers un autre document non affiché

Pour créer un lien vers un autre document local ou distant :

1. On sélectionne le passage choisi.
2. On clique sur le bouton
3. On clique sur une zone du document qui ne peut pas être une cible pour afficher le formulaire de saisie de l'URL. Si le document est local, on peut utiliser le browser de fichier pour sélectionner le fichier.

Autre méthode :

1. On sélectionne le passage choisi.
2. On choisit Créer/changer lien du menu Liens (raccourci `Ctrl l Ctrl l`)
3. On saisit l'URL du document cible et on confirme.

#### Mettre à jour un lien

Pour garder une ancre mais changer la cible du lien correspondant, on place la sélection dans l'ancre et on procède comme pour la création de lien (bouton ou l'entrée Créer/changer Lien du menu Liens). On peut alors désigner la nouvelle cible ou éditer l'URI.

Pour changer la cible d'un lien, on peut également éditer l'attribut `href` dans la vue structure.

#### Supprimer un lien ou une ancre cible

Le menu Liens contient une entrée Détruire ancre qui permet de détruire l'ancre cible ou le lien sélectionné. Il suffit que la sélection soit à l'intérieur de l'ancre à détruire. L'ancre est détruite, mais son contenu reste.

## 8. Mises en évidence du texte

Il est possible de marquer des parties de texte mises en ligne soit en utilisant les CSS (voir plus loin), soit en utilisant les éléments mise en évidence, important, code, citation, abréviation, etc. de HTML.

Les entrées de menu et les boutons correspondants fonctionnent comme des bascules (activée/désactivées).

Souvent l'introduction de mises en évidence engendrent des problèmes de perte des blancs.

### Traitement des blancs

Le traitement des blancs est appliqué par Amaya lors du chargement d'un document et lors de l'édition de celui-ci. Par exemple, le code source suivant:

        <p>Amaya supprime les<strong> blancs non significatifs </strong>au chargement</p>

donnera :

        Amaya supprime lesblancs non significatifsau chargement

car les blancs de début et de fin de l'élément `strong` sont considérés comme non significatifs et sont donc supprimés.

La forme correcte aurait été :

        <p>Amaya supprime les <strong>blancs non significatifs</strong> au chargement</p>

## 9. Les tables

### Créer une nouvelle table

Quand on active le bouton table ou quand on sélectionne l'entrée Table depuis le menu XHTML, Amaya visualise une boîte de dialogue qui permet de spécifier le nombre initial de lignes, de colonnes, ainsi que la bordure en pixels.

En confirmant on crée une table comme suit.

I

L'espace au dessus de la table est réservé à la légende. Le point d'insertion est automatiquement placé dans cette légende pour en saisir le contenu. La touche `Delete` supprime la légende.

La nouvelle table contient des cellules vides. On peut cliquer sur l'une d'entre elles au hasard et y insérer du texte, des images et autre. On peut également déplacer le point d'insertion de cellule en cellule par l'intermédiaire des flèches du clavier.

### Insérer/Ajouter une colonne

Il n'existe deux commandes spécifiques pour créer une nouvelle colonne :

- Insérer une colonne dans le sous-menu Table (`Ctrl t Ctrl b`) ajoute une nouvelle colonne avant la colonne sélectionnée.
- Ajouter une colonne dans le sous-menu Table (`Ctrl t Ctrl a`) ajoute une nouvelle colonne après la colonne sélectionnée.

Si on a sélectionné une cellule complète par `F2` la touche `Enter` crée une nouvelle cellule après et la colonne correspondante.

### Détruire une colonne

Pour détruire une colonne de table, il faut sélectionner la colonne et utiliser la commande `Delete`. Il y a deux méthodes pour sélectionner une colonne :

1. Soit l'entrée Sélectionner la colonne dans le sous-menu Table (`Ctrl t Ctrl c`).
2. Soit étendre la sélection sur au moins deux cellules dans la même colonne (Cell 1.1 à Cell 2.1 dans l'exemple ci-dessous) puis deux fois `F2` pour sélectionner la colonne.

Légende
Cell 1.1 | I | Cell 1.2 | Cell 1.3
Cell 2.1 |  |  |

### Copier/Coller ou Déplacer une colonne

Pour déplacer ou copier/coller une colonne de table :

1. Il faut sélectionner la colonne comme dans le cas de Détruire une colonne et copier (`Ctrl c`) ou couper (`Ctrl x` pour Windows, `Ctrl w` pour Unix) son contenu.
2. Pour coller la colonne avant une autre colonne
   - soit on sélectionne le début d'une cellule de colonne et on active la commande coller (`Ctrl v` pour Windows, `Ctrl y` pour Unix),
   - soit on utilise l'entrée de menu Coller avant dans le sous-menu Table (`Ctrl t Ctrl p`).
3. Pour coller la colonne après une autre colonne
   - soit on sélectionne la fin d'une cellule de colonne et on active la commande coller (`Ctrl v` pour Windows, `Ctrl y` pour Unix),
   - soit on utilise l'entrée de menu Coller après dans le sous-menu Table (`Ctrl t Ctrl v`).

### Insérer/Ajouter une ligne

Il n'existe deux commandes spécifiques pour créer une nouvelle ligne :

- Insérer une ligne dans le sous-menu Table (`Ctrl t Ctrl i`) ajoute une nouvelle ligne avant la ligne sélectionnée.
- Ajouter une ligne dans le sous-menu Table (`Ctrl t Ctrl n`)ajoute une nouvelle ligne après la ligne sélectionnée.

Si on a sélectionné une ligne complète par `F2` la touche Enter crée une nouvelle ligne après.

### Détruire une ligne

Pour détruire une ligne de table, il faut sélectionner la ligne et utiliser la commande `Delete`. Il y a deux méthodes pour sélectionner une ligne :

1. Soit l'entrée Sélectionner la ligne dans le sous-menu Table (`Ctrl t Ctrl r`).
2. Soit poser la sélection sur une cellule de la ligne (Cell 1.1 dans l'exemple ci-dessous) puis deux fois `F2` pour sélectionner la ligne.

### Copier/Coller ou Déplacer une ligne

Pour déplacer ou copier/coller une ligne de table :

1. Il faut sélectionner la ligne comme dans le cas de Détruire une ligne et copier (`Ctrl c`) ou couper (`Ctrl x` pour Windows, `Ctrl w` pour Unix) son contenu.
2. Pour coller la ligne avant une autre ligne
   - soit on sélectionne le début d'une ligne et on active la commande coller (`Ctrl v` pour Windows, `Ctrl y` pour Unix),
   - soit on utilise l'entrée de menu Coller avant dans le sous-menu Table (`Ctrl t Ctrl p`).
3. Pour coller la colonne après une autre colonne
   - soit on sélectionne la fin d'une ligne et on active la commande coller (`Ctrl v` pour Windows, `Ctrl y` pour Unix),
   - soit on utilise l'entrée de menu Coller après dans le sous-menu Table (`Ctrl t Ctrl v`).

### Cellules étendues

Il n'existe quatre commandes spécifiques pour étendre ou réduire l'extension de cellules :

- Joindre avec la cellule à droite dans le sous-menu Table (`Ctrl t Ctrl e`) étend la cellule d'une position à droite et colle le contenu des deux cellules.
- Joindre avec la cellule au-dessous dans le sous-menu Table (`Ctrl t Ctrl j`)étend la cellule d'une position vers le bas et colle le contenu des deux cellules.
- Réduire extension horizontale (`Ctrl t Ctrl s`) réduit l'extension horizontale de la cellule d'une position et engendre une cellule vide.
- Réduire extension verticale (`Ctrl t Ctrl m`) réduit l'extension verticale de la cellule d'une position et engendre une cellule vide.

On peut aussi éditer directement les attributs colspan et rowspan de la cellule.

### Ajouter un nouveau corps de table (tbody)

1. Pour créer un nouveau corps de table en dessous d'un corps de table existant, il faut placer le curseur à la fin de la dernière cellule de la dernière ligne du corps de table et sélectionner l'entrée Corps (tbody) dans le sous-menu Table.
2. Pour créer un nouveau corps de table au-dessus d'une ligne existante, il faut placer le curseur au début de la première cellule de la ligne et sélectionner l'entrée Ligne dans le sous-menu Table.

De nouveaux corps de table peuvent être créés efficacement avec la touche Enter. Quand le corps de table entier est sélectionné (il faut utiliser la touche `F2`), en tapant la touche `Enter` vous créez une nouveau corps de table après le corps de table sélectionné.

### Ajouter quelque chose après une table

De nombreux types d'éléments peuvent être inclus à l'intérieur des cellules de la table. Pour cette raison, Amaya pourrait mal comprendre vos intentions quand vous sélectionnez un type d'élément (par exemple cliquant H1, H2, etc. ou sélectionnant une entrée dans le menu XHTML) pendant qu'un composant de la table est sélectionné.

### Création d'un paragraphe après une table

Quand la sélection se trouve dans une table, la touche `Enter` crée un nouveau paragraphe dans la table. Pour créer un paragraphe après la table, il faut sélectionner la table entière en utilisant la touche `F2` puis `Enter`. Ce nouveau paragraphe peut être modifié si besoin est.

## 10. Recherche/Remplacement - Correction orthographique

### Recherche et remplacement de texte

La recherche/remplacement se lance, soit en cliquant sur le bouton , soit par l'entrée de menu Edition/Rechercher. Un boite de dialogue apparaît. vous avez deux zones de saisie la première sera pour le texte à rechercher la deuxième zone de saisie sera pour le texte à remplacer.

Pour chacune des actions vous avez des choix d'options.

- les options de recherche :
  - la casse : pour la recherche permet de spécifier s'il y a lieu de différencier ou non les majuscules des minuscules.
  - case à cocher pour sélectionner la zone sur laquelle réaliser la recherche avant la sélection, après la sélection, dans la sélection ou sur la totalité du document.
- Les options de remplacement :
  - le type de remplacement : pas de remplacement (juste une recherche), remplacement avec un fenêtre de confirmation, remplacement automatique.

### Correction orthographique

La correction orthographique se réalise à l'aide d'une boite de dialogue activée par l'action Edition/Vérifier orthographe.

les options de la boite de dialogue :

- Le dictionnaire utilisé se fait en fonction de la langue définie au niveau de l'élément ou du document.
- On peut spécifier le nombre de propositions (par défaut 3).
- On peut exclure des éléments lors de recherche de correspondance de mots avec le dictionnaire (par défaut toutes les options sont activé)
- Options de zone de recherche vous avez la possibilité de spécifier la zone sur laquelle cette correction orthographique se fera avant la sélection, après la sélection, dans la sélection ou sur la totalité du document.
- les boutons d'activation de recherche.
  - recherche du suivant (sans action) : considère que le mot est correcte et passe à l'erreur suivante.
  - rajoute au dictionnaire personnel : rajoute le mot au dictionnaire personnel.
  - remplace le mots et passe à l'occurrence suivante.
  - remplace le mots et le rajoute dans le dictionnaire personnel.
  - confirmer permet de fermer la boite de dialogue.

## 11. Attributs

Il y a deux manières d'éditer des attributs :

- L'outil Attributs
- La Vue structure

### Editer des attributs par le biais de l'outil Attributs

L'outil Attributs donne une liste de tous les attributs qui peuvent être associés à l'élément sélectionné. Il peut être utilisé pour créer un attribut, pour changer la valeur d'un attribut existant ou pour effacer un attribut.

Pour éditer un attribut, sélectionnez d'abord l'élément approprié. Vous devez sélectionner l'élément entier et pas seulement un caractère à l'intérieur de l'élément. Pour cela, il faut utiliser la touche `F2`. Quand l'élément est sélectionné, l'outil Attributs affiche la liste des attributs applicables. On peut voir rapidement si l'attribut a déjà une valeur ou non.

### Editer des attributs dans la Vue structure

Tous les attributs sont affichés dans la Vue structure. Les attributs dont la valeur peut être choisie librement sont affichés en rose et vous pouvez éditer leur valeur comme n'importe quelle autre chaîne de caractères. Quand la valeur de l'attribut est affichée en bleu, vous pouvez seulement la changer à l'aide de l'outil Attributs. Ceci assure que seules des valeurs correctes soient choisies.

Quand la sélection se trouve dans une valeur d'attribut, la touche `F2` sélectionne la valeur complète. La touche `Delete` détruit alors la valeur, et un deuxième `Delete` supprimera l'attribut.

A voir pour plus de détail

## 12. Création de feuilles de style CSS

### Les feuilles de style CSS externes et les feuilles de style CSS utilisateur

Un document peut associer plusieurs feuilles de style externes qui sont chargées avec le document et lui sont appliquées. Une feuille de style externe peut s'appliquer à plusieurs documents.

L'utilisateur peut définir une feuille de style spécifique qui s'applique à tous les documents chargés. Cette feuille de style est appelée Feuille de Style Utilisateur. C'est le fichier local amaya.css conservé dans l'environnement de l'utilisateur (le répertoire d'AmayaHome). Par exemple si vous préférez afficher les document en Helvetica et imprimer avec une police de caractères de petite taille, vous pouvez créer votre feuille de style utilisateur avec les règles CSS suivantes :

    @media print {
     BODY {font-size: 10pt}
    }
    @media screen {
     BODY {font-family: Helvetica}
    }

### Gérer des feuilles de style CSS externes

L'entrée de feuilles de style donne accès à une série de commandes qui permettent de contrôler les feuilles de style CSS externes et celles qui donnent les préférences de l'utilisateur :

- La commande Ajouter permet de lier une nouvelle feuille de style CSS à un document courant. On peut cliquer directement sur la cible de la feuille de style si elle est déjà visualisée dans la fenêtre Amaya. Si ce n'est pas le cas, l'utilisateur devra cliquer dans le document courant pour avoir accès à une boîte de dialogue et taper l'URL de la cible de la feuille de style. Cette commande ajoute un élément lien avec ses attributs à la tête du document.
- La commande Ouvrir permet d'ouvrir une des feuilles de style CSS appliquées au document courant.
- La commande Désactiver permet de supprimer les effets d'une des feuilles de style actives du document courant. Cette commande n'affecte en rien le lien CSS dans le document.
- La commande Réactiver permet de rétablir les effets d'une des feuilles de style CSS désactivées du document courant. Cette commande n'affecte en rien le lien CSS dans le document.
- La commande Retirer permet de retirer une des feuilles de style CSS externes. Cette commande agit comme la commande Désactiver. En plus de cela, l'élément lien qui attache les feuilles de style CSS est supprimé.

Les commandes Ouvrir, Désactiver et Réactiver peuvent être appliquées aux feuilles de style qui donnent les préférences de l'utilisateur, mais les commandes Ajouter et Retirer concernent uniquement les feuilles de style reliées. La figure suivante montre la liste des feuilles de style CSS proposées pour la commande Ouvrir. Si aucune feuille de style CSS n'est actuellement appliquée à un document, une boîte de dialogue expliquera "qu'aucun fichier CSS n'est disponible".

### Visualiser le style appliqué

S'il y a beaucoup de feuilles de style attachées à un document, il est difficile de comprendre pourquoi un élément est visualisé avec cette couleur ou ces marges, etc. Pour aider l'utilisateur, Amaya fournit une commande Montrer le style appliqué qui visualise dans une fenêtre externe les propriétés CSS appliquées au premier élément de la sélection courante.

L'utilisateur peut afficher le source CSS qui engendre chaque propriété en double (ou simple) cliquant sur la propriété. Aussi longtemps que la fenêtre est ouverte, Amaya met à jour le contenu de la fenêtre quand la sélection change.

En appuyant sur la touche `F2` sur les, l'utilisateur peut voir les propriétés CSS appliquées aux éléments englobants.

### Créer des propriétés CSS

Amaya ne fournit pas pour le moment une liste complète des propriétés CSS 2 sauf pour les propriétés les plus courantes. En général l'utilisateur doit donc se reporter à la spécification CSS 2 pour connaître le nom des propriétés et leurs valeurs.

Pour associer une classe à un élément, vous pouvez également utiliser l'outil Attributs. Il faut utiliser cet outil pour retirer la classe d'un élément ou changer sa classe : l'attribut de class se manipule comme un autre attribut.

## 13. Détection des erreurs

Au chargement d'un document, Amaya peut détecter des erreurs de HTML. Le parseur est très tolérant pour les documents HTML mais plus strict pour les documents XHTML. Si une erreur est détectée, une pastille rouge s'allume dans la barre de statut en bas à droite.

#### On peut corriger les erreurs

On affiche le détail des erreurs détectées en sélectionnant l'entrée Montrer les erreurs du menu Fichier ou en cliquant sur la pastille rouge en bas à droite. Pour corriger ces erreurs, on active le lien vers la vue source du document pour visualiser la position de l'erreur dans le source.

Une fois les erreurs corrigées on synchronise pour voir si tout est correct, on peut alors sauver le document corrigé.

#### On peut aussi modifier le type du document

L'entrée Modifier le doctype du menu Fichier permet de modifier le type du document.

Si le document n'est pas un fichier XHTML bien formé, Amaya propose de le Recharger et donc de lire le document comme un document HTML.