Comment rédiger des documents prêts-pour-le-web ?

Introduction

Lors de la rédaction d'un document, plusieurs auteurs désirent présenter leur document sous plusieurs médias et formats. AbiWord rend disponible aux utilisateurs des formats de fichiers variés.

Souvent, un format de fichier particulier est associé naturellement à un type particulier de média. Par exemple, HTML est naturellement associé avec la présentation sur le World Wide Web. Si vous êtes intéressé à présenter votre document dans une variété de médias, des items de présentation sont à considérer. Ce tutoriel discute comment créer un document AbiWord prêt-pour-le-web. Un document prêt-pour-le-web est un document qui se présentera précisément en HTML et qu'il vous sera facile de modifier pour intégration dans votre site web.

Traitement de texte versus rédaction de contenu

A la création de n'importe quel document, il existe deux approches différentes que l'auteur peut employer. La première implique de se concentrer sur la présentation : l'auteur édite manuellement les détails visuels de son document jusqu'au moment où il ou elle est satisfait de son apparence. La seconde implique de se concentrer sur la structure : l'auteur cible le contenu du document et applique alors la mise en forme basée sur le type de structure que le contenu possède.

Pour créer un document AbiWord prêt-pour-le-web, vous devez vous attaquer au traitement du texte tout en portant attention à la structure du document que vous créez. Un document typique est composé de structures variées tel que titres, puces et numéros, paragraphes et plus encore.

Pour démontrer ce dont je vous parle, considérons un exemple de création d'un titre dans un document. En utilisant la première approche, c'est-à-dire se concentrer sur la présentation, nous insérions le curseur là où nous voulons le titre, puis nous sélectionnerions la police de caractère Times New Roman, 20 pour la taille des caractères et gras pour marquer une importance particulière. En employant la deuxième approche, c'est-à-dire se concentrer sur la structure, nous sélectionnerions le style qui représente le mieux la structure dans le menu déroulant à la gauche de la barre d'outils de Mise en forme. Dans ce cas, nous sélectionnerions Heading 1 et alors cette section du document correspondrait au style Heading 1.

Les styles

Ce que nous remarquons premièrement, en suivant les instructions plus haut, est qu'en appliquant le style Heading 1 à notre titre, nous n'obtenons pas la mise en forme que nous avions lorsque nous avons mis en forme manuellement notre titre par la première méthode. Par défaut, la mise forme interne du style Header 1 utilise une police Arial, gras et 17 points. Ce sont simplement les valeurs par défaut. Cependant, les styles fournissent à l'auteur beaucoup plus de contrôle sur l'apparence du document.

Un style est simplement une description d'un élément structurel dans votre document, tel qu'un titre. Chaque style possède un ensemble d'instructions de mise en forme associées qui s'appliquent à chaque élément avec ce style. L'auteur peut alors manipuler ces instructions de mise en forme pour contrôler la présentation visuelle de tous les éléments qui utilisent un style donné.

Pourquoi est-ce important?

Deux raisons principales justifient l'importance des styles pour la rédaction de vos documents. L'utilisation des styles vous permet d'effectuer des modifications à la présentation de votre document très facilement. Par exemple, si vous devez grossir la taille de caractères de tous les titres d'un certain type, vous avez simplement qu'à changer les instructions de mise en forme du style pour ce type de titre. La modification s'applique alors au travers de l'ensemble du document. Pour réaliser cette modification, accédez à Format > Style... pour activer la fenêtre de dialogue Style. Sélectionnez le style que vous désirez modifier à partir de la liste des Styles disponibles et appuyez sur le bouton Modifier... pour faire apparaître la fenêtre de dialogue Modifier les styles. A partir de cette fenêtre vous pouvez accéder à l'information de présentation associée au style que vous avez choisi. Comme vous voyez, cette technique est utile pour tous les types de rédaction de documents. Ce concept de style est aussi utilisé lors de l'exportation en HTML de telle manière que si vous voulez éditer séparément le HTML, vous pouvez modifier la présentation d'un style aisément en éditant les instructions de mise en forme, mieux connues sous le nom de feuilles de style en cascade.

En plus, l'utilisation des styles et des instructions de mise en forme rassemble toute l'information de présentation à un endroit centralisé, ce qui simplifie grandement le contenu de votre document. C'est particulièrement important lorsque vous travaillez en HTML, puisque vous pouvez avoir à travailler directement avec les balises HTML pour intégrer votre document dans votre site web.

Instructions de mise en forme HTML - feuilles de style en cascade (CSS)

Par défaut, lorsque vous enregistrez votre document dans un fichier HTML, AbiWord place toutes les instructions de mise en forme dans un seul bloc au début. Ces instructions de mise en forme utilisent le langage des feuilles de style en cascade et sont localisées à l'intérieur de la balise <style> elle-même dans la balise <head> de votre document. D'ici, il est facile de déplacer les styles en entier (par copier et coller) dans un nouveau document qui peut alors être lié ou intégrer à la feuille de style de votre site web.

Les paragraphes et l'indentation

Chaque fois que vous appuyez sur la touche Entrée ou Retour lorsque vous éditez un document AbiWord, vous créez un nouveau bloc de contenu dans votre document. Pour créer des documents AbiWord prêts-pour-le-web, vous devriez regrouper dans un seul bloc le contenu d'une section de contenu de votre document. Des exemples de sections de contenu incluent les paragraphes, titres, et les items des listes à puces et numéros.

Par exemples plusieurs auteurs, lorsqu'ils utilisent un traitement de texte, inséreront manuellement des lignes blanches entre les paragraphes en appuyant sur la touche Entrée à plusieurs reprises. La quantité de blanc entre les paragraphes est cependant un détail de présentation visuel qui devrait relever des instructions de mise en forme du paragraphe, tel que discuté dans la section à propos des styles, plus haut.

Vous pouvez aussi contrôler l'indentation dans les paragraphes avec des instructions de mise en forme. Il est souvent tentant de contrôler l'indentation de sections spécifiques de texte par de multiples espaces ou tabulations. Cependant, de manière à créer des documents prêts-pour-le-web, vous devriez régler les marges désirées ou l'indentation en utilisant les instructions de mise en forme ou les indicateurs de marges de la règle :

L'utilisation de cette méthode permet au HTML d'employer les instructions de mise en forme appropriées pour indenter correctement le texte et vous évite, à vous l'auteur, d'indenter manuellement de manière répétitive.

Les images

En tant qu'auteur utilisant AbiWord et intéressé à présenter votre document comme page web, il existe une particularité dont vous devez être informé en ce qui a trait aux images dans votre document. Premièrement, contrairement aux fichiers d'AbiWord, les fichiers HTML ne peuvent stocker les informations des images à l'intérieur d'eux. Plutôt, ils doivent référer à des fichiers d'images séparés. Lorsque vous enregistrez un fichier AbiWord en tant que fichier HTML, alors, toutes les images sont enregistrées dans un répertoire et sont référencées à partir de cette localisation. Si le nom d'un fichier HTML vers lequel vous enregistrez est fichier.html, alors le répertoire sera nommé fichier.html_d. Vous trouverez toutes les images de votre document dans ce répertoire.

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