Tutoriel Inkscape & Boxy - sommaire

Inkscape : outil 'créer et éditer des objets texte'

Imaginons que nous voulons créer une bannière de site web. Il faut insérer et manipuler du texte. Nous devons donc utiliser la barre d'outils "créer et éditer des objets textes".

La bannière (ou bandeau)

Ci-dessous une bannière destinée à être incorporée dans chaque page d'un site web.

Il s'agit d'un document Inkscape qui fait 900 par 200 et qui ne pèse que 6 KO ...

Réalisation de ce bandeau

Il faut créer un rectangle de 900 par 200 rempli d'abord de vert puis il faut le dégrader (vert vers blanc).

Il faut réaliser un arbre (un cercle "lime" et un tronc "maroon") puis dupliquer ce groupe.

Grâce à l'outil "Créer et éditer des objets texte" il faut insérer le texte "jardiworld.fr".

Il faut ensuite encadre ce texte avec la commande Texte/Encadrer le texte.

Il faut ensuite sélectionner ce cadre pour qu'il fasse 500 de large et soit bien positionné afin que ce cadre soit parfaitement centré verticalement et horizontalement dans le bandeau.

Il faut ensuite utiliser la boîte de dialogue "remplissage et bordure" pour que les lettres aient simplement un contour noir de 2px et pas de remplissage.

Le texte le long d'un chemin - texte dans une forme

Dans la capture d'écran ci-dessous je vous montre deux outils disponibles sous Inkscape concernant le texte :

• positionner du texte le long d'un chemin
• placer du texte dans une forme

Texte le long d'un chemin

La procédure :

• tapez le texte et mettez le en forme (police, taille, couleur, etc.)
• dessiner une courbe de bézier par exemple
• Sélectionnez le texte et le chemin (avec shift) puis produisez la commande Texte/mettre suivant un chemin ; le texte suit le chemin

Placer du texte dans une forme

La procédure :

• Créez une zone de texte dans le document inkscape
• saisir le texte ou copier/coller le texte à partir d'un autre fichier
• formater le texte
• Dessiner une forme (ici un cercle)
• Sélectionner la forme et la zone de texte et produisez la commande Texte/encadrer ; le texte est envoyé dans la forme.

Le rendu

Le rendu est correct !
Le problème est que le code généré est un peu verbeux ...

Préférez l'encodage manuel ?

Le code SVG optimisé correspondant à du texte dans une zone de texte ou le long d'une chemin ou encore dans une forme n'est pas très compliqué à saisir.
Aussi je vous invite à visiter le chapitre en lien dans mon tuto sur le langage SVG : Le texte avec SVG