MAGIX Xtreme Web Designer 5 Manuel utilisateur

Achat et activation de Xtreme
Web Designer 5
Lors de l'installation de la version d'essai de Xtreme Web Designer 5, vous aurez le choix entre trois
options. Cochez l'option de votre choix. Des consignes supplémentaires s'affichent.
J'ai un numéro de série et je souhaite activer le logiciel :
Sélectionnez cette option si vous possédez déjà une version de Web Designer. Entrez le numéro de série
qui se trouve dans l'e-mail de confirmation d'achat. Saisissez votre adresse e-mail afin d'enregistrer votre
version (si cette étape a déjà été effectuée, elle sera ignorée). Puis cliquez sur Enregistrer en ligne et
activer. Vous serez relié à la page d'activation et d'enregistrement, si vous ne souhaitez pas vous
enregistrer, fermez la page (le message suivant s'affiche « Activation réussie, Enregistrement échoué »). Si
vous souhaitez vous enregistrer, cliquez sur Continuer
. Attention : si vous choisissez de pas vous enregistrer mais que vous souhaitez le faire plus tard, par
exemple, si vous voulez rejoindre notre programme d'affiliation ou recevoir des mises à jour
automatiques, vous trouverez une option « Enregistrement en ligne » dans le menu d'aide.
Une fois votre version activée, vous pouvez télécharger l'ensemble des modèles de conception en
sélectionnant l'option Télécharger les modèles de conception
dans le menu d'aide de Web Designer.
Je n'ai pas de numéro de série et j'aimerais acheter le logiciel.
Sélectionnez cette option si vous souhaitez acheter une version de Web Designer. Vous recevez un
numéro de série lors de votre achat. Cochez cette option puis cliquez sur Acheter le logiciel en ligne
.
Je souhaite continuer à utiliser la version d'essai.
Sélectionnez cette option si vous souhaitez continuer à utiliser la version d'essai gratuite. Le nombre de
jours d'essai restants s'affiche immédiatement. Sélectionnez cette option puis cliquez sur Continuer
l'essai
.
Remarque importante : Conservez l'adresse e-mail et le mot de passe utilisés lors de l'achat de Xtreme
Web Designer 5. Vous pourrez en avoir besoin plus tard pour retrouver votre numéro de série ou
effectuer une mise à niveau.
Autres possibilités d'achat
Si vous ne bénéficiez pas de la période d'essai, vous pouvez passer une commande directement sur
notre site Internet www.xara.com/ordering
. Vous recevrez le numéro de série qui vous permettra de débloquer la version d'essai.
Les produits Xara ont des prix avantageux, mais nous offrons des rabais supplémentaires sur nos
produits graphiques aux organisations et établissements universitaires. Vous trouverez plus d'informations
sur notre site Internet www.xara.com/ordering
.
Programme d'affiliation
Les modèles de pages de Xtreme Web Designer 5 incluent un lien « Réalisé avec Xtreme Web Designer
5 » en bas de page. Si vous ne voulez pas le voir apparaître, vous pouvez facilement le supprimer.
Cependant, si vous affichez ce lien sur votre site Internet, vous pourrez recevoir une commission sur les
ventes réalisées par le biais de ce lien. Vous pouvez également donner cette commission à une oeuvre de
charité. Sélectionnez Aide >Programme d'affiliation
pour en savoir plus ou, si vous êtes déjà affilié, pour modifier les paramètres de vos commissions.
Page 1
Assistance technique
Si vous avez des problèmes avec votre logiciel, veuillez prendre contact avec votre équipe d'assistance
technique.
Site Internet d'assistance : http://support.magix.net/contact/fr
Ce site vous dirigera vers la page de services des utilisateurs qui contient, entre autres, les aides gratuites
suivantes :
FAQ (Foire Aux Questions)
et trucs et astuces d'ordre général. Dans la plupart des cas, c'est ici que vous trouverez une solution à
votre problème. Sinon, il conviendra d'utiliser le formulaire d'assistance par messagerie électronique
(E-mail) :
Formulaire d'assistance par e-mail
: à l'aide de ce formulaire spécifique, vous indiquez votre système à notre équipe de support. Cette
information servira à résoudre vos problèmes rapidement et avec efficacité. Remplissez-le puis
renvoyez-le par simple clic de souris !
Forum
: vous n'êtes pas seul. Il se peut que d'autres utilisateurs aient connu un problème identique au vôtre et
puissent vous aider à le résoudre. Notre personnel de support intervient également régulièrement sur ce
forum.
Section Téléchargement
: via Download, vous pouvez accéder gratuitement aux mises à jour, aux améliorations et aux correctifs
(Patchs). Nous avons les solutions à la plupart des problèmes que vous pouvez rencontrer et ils peuvent
être résolus en téléchargeant le tout dernier correctif. Outre ces correctifs, les assistants vous permettront
de vérifier et d'optimiser votre système.
Liens
: dans la liste des liens, vous trouverez les adresses de contact des principaux fabricants de matériel
informatique.
Notre hotline francophone vous accueille du lundi au vendredi de 10 à 13h et de 14 à 17 heures (CET)
(sauf jours fériés) aux numéros suivants :
 Depuis la France : 01.82.88.03.19
 Depuis le Canada (Montréal) : 1-514-907-3163 (en HNE, les horaires sont approximativement
de 04 à 07h et de 08 à 11 heures)
 Depuis la Belgique (Bruxelles) : 02/8080520
 Depuis la Suisse (Genève) : 0315500965
Cliquez sur le lien ci-dessous pour obtenir un code d'accès à l'assistance technique par téléphone :
http://support.magix.net/phone
Courrier
: MAGIX Development Support, Postfach 20 09 14, 01194 Dresden, Allemagne
Veuillez préparer les renseignements suivants :
 Version du programme
 Détails de configuration (système d'exploitation, processeur, mémoire, disque dur...)
 Configuration de la carte son (type, logiciel)
 Informations concernant d'autres logiciels installés
Page 2
Introduction
La majorité des sites Internet sont graphiques. La présentation de votre site est très importante. Vous
voulez que votre site renvoie une image professionnelle et compétente. Selon nous, vous n'avez pas à
utiliser plusieurs outils différents (logiciels graphiques et HTML) pour créer votre site Internet. Nous
pensons que vous devez avoir la liberté totale d'ajouter n'importe quel texte, graphismes ou photos
partout sur la page.
Dans un site Internet, la présentation graphique importe autant que le contenu.
Créer des sites Internet devrait être comme créer des fichiers PDF, vous ne devriez pas avoir besoin de
savoir quoi que ce soit de ce qui se passe « sous le capot ». Vous ne vous attendriez pas à éditer
directement le fichier PDF. De la même façon, vous ne devriez pas avoir besoin de savoir ou même de
voir le code HTML qui vous permet de créer votre site.
Démarrer avec Xtreme Web Designer 5
En cliquant sur l'onglet Contenu de ce guide d'aide, vous trouverez une description détaillée de tous les
Outils, Galeries, Menus et Barre de contrôle. Vous pouvez aussi cliquer sur l'index pour faire une
recherche par mot-clé.
Démarrer avec Xtreme Web Designer 5
.
Regarder les vidéos de démonstration
Plus d'aide
logiciel créé et développé par Xara Group Ltd. Pour de plus amples informations sur Xara et ses
produits, veuillez cliquer ici
ou visitez notre site Internet :
http://www.xara.com/
©1995-2009 Xara Group Ltd.
La police Geotype est utilisée avec la permission de Gary Bouton et demeure la possession de © Gary
Bouton, voir www.theboutons.com
Les autres polices sont fournies par des tiers qui en conservent les droits. Les droits d'auteur sont dans
tous les cas réservés par Xara ou les propriétaires respectifs et tombent sous la protection de la
réglementation internationale sur les droits d'auteur.
Page 3
Les contenus de cette documentation et le logiciel Xtreme Web Designer 5 associé sont la propriété du
Xara Group Ltd et sont protégés par des droits d'auteurs. Toute reproduction totale ou partielle est
strictement interdite. Pour des copies du logiciel, contactez Xara Group Ltd
. Conditions d'utilisation de Xtreme Web Designer 5.
Xara est une marque déposée de Xara Group Ltd.
Voir tous les remerciements
Dernière mise à jour : 28.09.2009
Page 4
Démarrer avec Xtreme Web Designer 5
En cliquant sur l'onglet Contenu de ce guide d'aide, vous trouverez une description détaillée de tous les
Outils, Galeries, Menus et Barre de contrôle. Vous pouvez aussi cliquer sur l'index pour faire une
recherche par mot-clé.
Démarrer avec Xtreme Web Designer 5
.
Regarder les vidéos de démonstration
Plus d'aide
logiciel créé et développé par Xara Group Ltd. Pour de plus amples informations sur Xara et ses
produits, veuillez cliquer ici
ou visitez notre site Internet :
http://www.xara.com/
©1995-2009 Xara Group Ltd.
La police Geotype est utilisée avec la permission de Gary Bouton et demeure la possession de © Gary
Bouton, voir www.theboutons.com
Les autres polices sont fournies par des tiers qui en conservent les droits. Les droits d'auteur sont dans
tous les cas réservés par Xara ou les propriétaires respectifs et tombent sous la protection de la
réglementation internationale sur les droits d'auteur.
Les contenus de cette documentation et le logiciel Xtreme Web Designer 5 associé sont la propriété du
Xara Group Ltd et sont protégés par des droits d'auteurs. Toute reproduction totale ou partielle est
strictement interdite. Pour des copies du logiciel, contactez Xara Group Ltd
. Conditions d'utilisation de Xtreme Web Designer 5.
Xara est une marque déposée de Xara Group Ltd.
Voir tous les remerciements
Dernière mise à jour : 28.09.2009
Page 5
Pourquoi le logiciel Web Designer est
différent
Les outils de création Internet classiques sont simplement des éditeurs HTML, conçus pour créer une
mise en page. Ils offrent peu de possibilités graphiques. Vous devez donc utiliser d'autres outils
graphiques pour créer la disposition graphique et des photos. Pourtant, la majorité des sites sont
essentiellement graphiques et que le texte ne joue qu'un rôle mineur dans la mise en page globale. En
d'autres termes, près de 90 % des efforts nécessaires à la conception d'un site Internet attrayant
concernent l'aspect graphique.
Les outils de création Internet classiques sont parfois difficiles à utiliser et s'adressent souvent aux
programmeurs. Ils proposent des fonctionnalités telles que l'édition HTML et de script.
Xtreme Web Designer 5 est différent. C'est d'abord un outil graphique qui offre une nouvelle approche
de la conception de sites. Il permet à l'utilisateur de placer librement ce qu'il souhaite où il veut sur la
page, qu'il s'agisse de textes, de photos ou de graphismes. Vous pouvez donc créer votre page comme
vous la voyez (mise en page WYSIWYG, What You See (dans Web Designer) is What You Get (sur la
page finale)). Toutes les fonctionnalités graphiques que vous souhaitez sont à votre disposition. Aucun
autre logiciel n'est nécessaire.
De plus, vous pourrez facilement créer des effets interactifs courants sur Internet, comme des photos et
des graphismes pop-ups ou des effets lors du passage de la souris. Vous pouvez également créer et
inclure des Flash animés. Vous pouvez utiliser l'option de renvoi de texte pour renvoyer le texte autour
d'objets sur votre site ou ne pas avoir de bords droits dans votre texte, des manipulations habituellement
très difficiles, même pour des webmasters/développeurs HTML expérimentés.
Et tout cela sans écrire une seule ligne de code HTML ou de script. En effet, Web Designer n'est pas un
outil de création HTML, il ne propose pas de visualisation du code HTML ni de programmation en
Javascript. Il propose en revanche de créer facilement et rapidement de beaux sites sans les problèmes et
les limites liés à la programmation HTML.
Cela inclut une large gamme de modèles de conception disponibles pour que vous puissiez commencer
(pages entières ainsi qu'un ensemble d'objets individuels, boutons, panneaux de textes, etc.).
Web Designer : un outil de maquettes rapide pour les
professionnels
Web Designer est un outil de maquettes rapide qui vous offre une flexibilité inédite . Pour la première
fois, vous pouvez vous concentrer sur la conception de votre site Internet, sans limitation en terme de
mise en page. Web Designer vous propose tous les outils graphiques nécessaires à la création de
graphismes optimisés, de photos et plus encore. Il vous permet également de créer du code HTML
compatible avec tous les navigateurs, toutes les plateformes et toutes les normes.
Oubliez la création de maquettes sur Photoshop. Avec Web Designer, vous pouvez créer des sites
Internet avancés et complexes, qui fonctionnent vraiment avec du code HTML, à partir de zéro. En un
clic, recolorez l'intégralité du site, créez des effets de souris très simples et des pop-ups. C'est un
véritable environnement de composition orienté objet et vectoriel. Il produit des designs en CSS
multi-navigateurs et compatibles en XHTML (Les calques de Web Designer sont directement reliés aux
calques CSS).
Page 6
Web Designer : un outil de maquettes rapide pour les
professionnels
Web Designer est un outil de maquettes rapide qui vous offre une flexibilité inédite . Pour la première
fois, vous pouvez vous concentrer sur la conception de votre site Internet, sans limitation en terme de
mise en page. Web Designer vous propose tous les outils graphiques nécessaires à la création de
graphismes optimisés, de photos et plus encore. Il vous permet également de créer du code HTML
compatible avec tous les navigateurs, toutes les plateformes et toutes les normes.
Oubliez la création de maquettes sur Photoshop. Avec Web Designer, vous pouvez créer des sites
Internet avancés et complexes, qui fonctionnent vraiment avec du code HTML, à partir de zéro. En un
clic, recolorez l'intégralité du site, créez des effets de souris très simples et des pop-ups. C'est un
véritable environnement de composition orienté objet et vectoriel. Il produit des designs en CSS
multi-navigateurs et compatibles en XHTML (Les calques de Web Designer sont directement reliés aux
calques CSS).
Page 7
Un site Internet en six étapes
Pour ceux dont la capacité de concentration est limitée (la plupart d'entre nous), il est possible de
découvrir les principaux avantages de Web Designer rien qu'en suivant les instructions lors de l'ouverture
du premier document au démarrage de Web Designer. Vous pouvez ainsi découvrir le logiciel et créer en
même temps votre site Internet. Vous trouverez également ce modèle dans la Galerie des modèles.
Cliquez sur le bouton, ouvrez la rubrique Introduction
et double-cliquez sur le premier document.
Vous apprendrez comment modifier les couleurs de votre site Internet, éditer le texte, glisser-déposer
des photos, déplacer des objets sur la page et plus encore.
Annuler
Rappelez-vous que vous pouvez annuler tout changement en cliquant sur
le bouton Annuler ou en faisant Ctrl+Z. En maintenant la touche
enfoncée, vous pouvez revenir sur toutes les actions effectuées depuis le
début.
Page 8
Ouvrir l'aide
Si vous avez besoin d'aide pour l'utilisation de ce programme, vous trouverez ici des sources qui
pourront vous être utiles...
 Pogramme d'aide. Choisissez un thème d'aide du menu Aide pour ouvrir l'aide de MAGIX
Xtreme Graphic Designer (comprend des centaines de pages d'informations).
 Barre d'état. Lisez le texte de la barre d'état situé en haut de la fenêtre principale de MAGIX
Xtreme Graphic Designer. Il indique quelles actions sont possibles et leur effet, et ce même
pendant les déplacements d'objets, ce qui est idéal pour apprendre à maîtriser les outils MAGIX
Xtreme Graphic Designer. Il fournit aussi des détails sur le rôle des boutons lorsque vous placez
le curseur sur ces derniers. Voir Barre d'État pour plus d'informations.
 Infobulles. Si vous placez le curseur sur un bouton ou une commande, un petit message va
apparaître pendant quelques instants et vous indiquer le rôle de ce bouton ou de cette
commande.
 Menus. Si vous voulez connaître le rôle d'un élément du menu, sélectionnez-le et appuyer sur
F1.
 Boîtes de dialogue. Si vous voulez connaître le rôle d'une boîte de dialogue ou savoir comment
l'utiliser, cliquez sur le bouton Aide.
 Vidéos. Vous disposez de plus de 80 vidéos de démonstration afin de profiter au mieux de
Xtreme Web Designer 5. Sélectionnez Vidéos dans le menu Aide pour voir la liste des vidéos
disponibles.
 Forums TalkGraphics. Vous pouvez à cet endroit échanger des conseils et des idées, poser
des questions ou proposer des solutions à d'autres utilisateurs de Xara Xtrem :
http://www.talkgraphics.com (vous y trouverez également d'autres forums sur les graphiques)
 Xara Xone. Visitez Xara Xone (http://www.xaraxone.com/) pour accéder à un grand nombre
d'excellentes ressources support MAGIX Xtreme Graphic Designer, comprenant plus de dix ans
de tutoriels MAGIX Xtreme Graphic Designer, des conseils et astuces, et un shareware Xara.
 Newsletter The Outsider. Inscrivez-vous et recevez tous les mois notre newsletter The
Outsider (tutoriels mensuels, conseils, offres spéciales, inspirations et plus encore).
Dans ce chapitre
Infos du document
À propos de Xtreme
Infos du document
Fichier -> Infos du document
Vous permet de consulter diverses informations sur le document sélectionné, comme sa taille et les
polices utilisées. Il s'agit d'une fonction utile pour vérifier si vous disposez de toutes les polices requises
pour un affichage correct du document.
Tous les commentaires sont sauvegardés avec le fichier. Ces commentaires seront alors affichés chaque
fois que vous affichez la boîte de dialogue Infos du document.
À propos de Xtreme
Allez sous Aide > À propos de Xtreme Web Designer 5
. Des informations générales concernant le programme sont affichées. Ces informations pourront
éventuellement vous être demandées lorsque vous contactez notre équipe d'assistance.
Page 9
Infos du document
Fichier -> Infos du document
Vous permet de consulter diverses informations sur le document sélectionné, comme sa taille et les
polices utilisées. Il s'agit d'une fonction utile pour vérifier si vous disposez de toutes les polices requises
pour un affichage correct du document.
Tous les commentaires sont sauvegardés avec le fichier. Ces commentaires seront alors affichés chaque
fois que vous affichez la boîte de dialogue Infos du document.
À propos de Xtreme
Allez sous Aide > À propos de Xtreme Web Designer 5
. Des informations générales concernant le programme sont affichées. Ces informations pourront
éventuellement vous être demandées lorsque vous contactez notre équipe d'assistance.
Page 10
À propos de Xtreme
Allez sous Aide > À propos de Xtreme Web Designer 5
. Des informations générales concernant le programme sont affichées. Ces informations pourront
éventuellement vous être demandées lorsque vous contactez notre équipe d'assistance.
Page 11
Démarrage
Cette section vous donne un aperçu des principales fonctionnalités de Web Designer. Les sections
suivantes détaillent plus précisément chaque outil.
Dans ce chapitre
Mise en page du logiciel
Objets de la page
Conception de sites web orientés objet
L'outil Sélection
Prévisualisation de votre site Internet
Utiliser des modèles de conception et des Cliparts
Couleurs du site Internet
Photos
Texte
Taille de la page
Enregistrer votre travail. Créer un site Internet
Objets extensibles
Groupes
Liens, boutons et barre de boutons
Outils de dessin
Calques, survol de souris & fenêtres pop-up
Créer des boutons, des bannières et d'autres graphismes Web
Publier votre site Internet
Intégration de YouTube, Flash et autres accessoires
Page 12
Mise en page du logiciel
Les points de contrôle les plus importants sont mis en avant
La barre du haut contient sept boutons liés aux fonctionnalités du site Internet.
Il y a deux manières de créer un nouveau site Internet. Vous pouvez commencer avec un modèle de
conception prédéfini puis le modifier avec votre propre texte, vos photos et votre gamme de couleur.
Vous pouvez également créer votre site Internet en partant de zéro et en disposant tous les éléments
requis, le texte, les graphismes et les photos où vous voulez sur la page.
Zoomer / Faire défiler / Déplacer votre page
Ces opérations courantes peuvent être réalisées très facilement :
 Pour zoomer en avant ou en arrière, maintenez la touche Ctrl enfoncée tout en déplaçant la
molette de la souris
 Pour déplacer la page, pressez la molette de la souris et appuyez (c'est également un bouton)
 Pour faire défiler, utilisez la molette de la souris (ou la barre de défilement)
Page 13
Toutes les pages de votre site Internet sont
présentées les unes en dessous des autres,
comme dans un logiciel de traitement de texte.
Vous pouvez ainsi visualiser l'intégralité de
votre site Internet, notamment en zoom
arrière. De cette façon, vous pouvez
glisser-déposer des éléments entre les pages.
Lorsque vous modifiez les couleurs de
l'intégralité du modèle du site, vous pouvez
voir comment ces modifications affectent
toutes les pages.
La page actuelle est marquée par quatre
crochets.
Dans cet exemple, vous pouvez voir que
certains objets ont été placés dans le
pasteboard situé sous les pages. Ils ne sont
pas exportés dans votre site Internet.
Le pasteboard est utile pour stocker
temporairement ou travailler sur des
graphismes, des photos ou d'autres objets.
Page 14
Zoomer / Faire défiler / Déplacer votre page
Ces opérations courantes peuvent être réalisées très facilement :
 Pour zoomer en avant ou en arrière, maintenez la touche Ctrl enfoncée tout en déplaçant la
molette de la souris
 Pour déplacer la page, pressez la molette de la souris et appuyez (c'est également un bouton)
 Pour faire défiler, utilisez la molette de la souris (ou la barre de défilement)
Toutes les pages de votre site Internet sont
présentées les unes en dessous des autres,
comme dans un logiciel de traitement de texte.
Vous pouvez ainsi visualiser l'intégralité de
votre site Internet, notamment en zoom
arrière. De cette façon, vous pouvez
glisser-déposer des éléments entre les pages.
Lorsque vous modifiez les couleurs de
l'intégralité du modèle du site, vous pouvez
voir comment ces modifications affectent
toutes les pages.
La page actuelle est marquée par quatre
crochets.
Dans cet exemple, vous pouvez voir que
certains objets ont été placés dans le
pasteboard situé sous les pages. Ils ne sont
pas exportés dans votre site Internet.
Le pasteboard est utile pour stocker
temporairement ou travailler sur des
graphismes, des photos ou d'autres objets.
Page 15
Objets de la page
Lorsque vous personnalisez un modèle de conception ou créez vos propres graphismes, vous pouvez
les faire pivoter, les redimensionner et les positionner là où vous le souhaitez. Vous pouvez facilement
redimensionner les pages à la taille souhaitée et en ajouter de nouvelles. Certaines fonctionnalités, comme
la modification des schémas de couleur, s'appliquent simultanément à toutes les pages.
Il existe trois types d'éléments de page de base :
 Texte : grâce à l'outil Texte, vous pouvez tout créer, du titre contenant un seul mot à des
colonnes de texte ou même des blocs de textes successifs. L'outil de texte Barre d'infos vous
permet de contrôler la police, la taille, l'interligne et d'autres éléments. Vous pouvez
redimensionner le texte en utilisant l'outil Sélection ou en sélectionnant le texte comme vous le
faites habituellement et en choisissant une autre taille de points ou de pixels. Vous pouvez même
faire pivoter le texte dans tous les sens. En utilisant la fonction Renvoi de texte, vous pourrez
automatiquement disposer le texte autour d'objets, comme des photos.
 Graphismes : Tous les logos, titres et la plupart des boutons qui apparaissent sur votre site
Internet sont des graphismes. Web Designer est un logiciel de graphisme vectoriel, ce qui veut
dire que vous pouvez modifier la forme, faire pivoter et redimensionner vos objets graphiques
sans perdre de leur qualité, contrairement aux outils d'édition photo en pixels comme
Photoshop). Bien qu'il n'y ait pas de normes pour les graphismes vectoriels pour les pages
Internet (pour les sites Internet, tous les graphismes doivent être aux formats JPG, GIF ou PNG),
Web Designer choisit automatiquement le bon format et la bonne résolution. Par exemple, si vous
souhaitez créer un panneau coloré à placer derrière votre texte, vous y parviendrez en dessinant
un objet rectangulaire ou arrondi sur la page et en le plaçant derrière votre texte. Lorsque vous
enregistrez votre site Internet, il est automatiquement converti en image PNG à la bonne
résolution.
 Photos : Il y a peu de sites Internet qui ne contiennent pas de photos. Xtreme Web Designer 5
propose une large gamme d'outils d'édition de photos. Vous pouvez glisser-déposer des photos
directement de votre appareil ou de votre explorateur Window sur la page, les faire pivoter, les
mettre en avant, les recadrer et Web Designer génère automatiquement une image en JPG avec
la bonne résolution. Remplacer les photos existantes dans les modèles de conception est aussi
facile que glisser-déplacer et vous pouvez très facilement modifier la taille et l'angle des photos
« à l'intérieur » de leur cadre. À partir des photos, vous pouvez aussi créer des onglets cliquables
qui s'afficheront en version agrandie.
Il existe un quatrième type d'objet, un type spécifique de graphisme, l'emplacement d'objet :
 Emplacement d'objet : Il s'agit des objets graphiques de la page qui seront remplacés dans la
version finale du site par d'autres éléments comme des animations Flash, des vidéos Youtube,
des snippets HTML et d'autres objets externes.
Page 16
Conception de sites web orientés objet
Tous les types d'éléments décrits précédemment sont désignés comme objets.
L'un des avantages spécifiques de Web Designer est que vous avez l'entière liberté de disposer n'importe
quel objet sur la page. Il réapparaîtra de la même façon sur votre site Internet.
L'outil de Sélection
peut servir à sélectionner n'importe quel objet sur la page. Il permet
également de déplacer (en les faisant glisser), de redimensionner et de
faire pivoter les objets.
Vous pouvez modifier l'ordre d'apparition (à savoir le fait qu'un objet apparaisse devant ou derrière
d'autres objets de la page) en utilisant les options du menu Arranger. Grâce à l'outil de Sélection, vous
pouvez redimensionner des objets en tirant sur les poignées situées dans les angles. Vous pouvez faire
pivoter un objet simplement en tirant les poignées situées dans les angles internes. Comme les sites
Internet ne supportent pas le texte pivoté, Web Designer créé automatiquement l'image appropriée pour
que le résultat final soit conforme à votre disposition.
Pour ajouter du texte à votre site Internet, sélectionnez l' outil Texte
puis cliquez sur la page et saisissez votre texte.
Vous pouvez également créer des colonnes ou des zones de texte en cliquant et en faisant glisser le texte
horizontalement dans l'outil Texte. Voir la rubrique Texte ci-dessous pour plus de détails et le chapitre
Utilisation du texte
pour une description complète des fonctions Texte de Xtreme Web Designer 5
Vous pouvez utiliser les outils de dessin pour créer des
rectangles, des rectangles aux bords arrondis, des cercles et
des ellipses ainsi que d'autres formes de votre choix en utilisant
l'outil de Changement de formes. Voir la rubrique outils de
Dessin
pour plus de détails.
Ordre d'apparition
Tous les objets de la page sont placés les uns au-dessus des autres. L'objet dessiné ou créé le plus
récent est toujours au-dessus, c'est-à-dire devant les autres. Vous pouvez modifier l'ordre d'apparition
en utilisant les options du menu Arranger
.
Ainsi, lorsque vous dessinez un nouveau rectangle, il recouvre toujours tous les objets derrière lui. Vous
pouvez le placer derrière un autre objet en pressant les touches Ctrl+B (ou dans le menu Arranger
->Déplacer vers l'arrière
). De la même façon, la combinaison Ctrl+F place l'objet sélectionné au-dessus des autres.
Un autre point problématique : les Calques. Tous les objets sont rassemblés dans des Calques nommés
et l'arborescence de chacun d'entre eux peut être dépliée ou repliée afin d'afficher ou de masquer son
contenu. Voir la rubrique Calques
ci-dessous pour plus d'informations.
Page 17
Ordre d'apparition
Tous les objets de la page sont placés les uns au-dessus des autres. L'objet dessiné ou créé le plus
récent est toujours au-dessus, c'est-à-dire devant les autres. Vous pouvez modifier l'ordre d'apparition
en utilisant les options du menu Arranger
.
Ainsi, lorsque vous dessinez un nouveau rectangle, il recouvre toujours tous les objets derrière lui. Vous
pouvez le placer derrière un autre objet en pressant les touches Ctrl+B (ou dans le menu Arranger
->Déplacer vers l'arrière
). De la même façon, la combinaison Ctrl+F place l'objet sélectionné au-dessus des autres.
Un autre point problématique : les Calques. Tous les objets sont rassemblés dans des Calques nommés
et l'arborescence de chacun d'entre eux peut être dépliée ou repliée afin d'afficher ou de masquer son
contenu. Voir la rubrique Calques
ci-dessous pour plus d'informations.
Page 18
L'outil Sélection
Il s'agit d'un outil classique qui vous permet de sélectionner, déplacer,
redimensionner et faire pivoter tous les objets de votre page Internet.
Toutes ces manipulations peuvent être effectuées simplement en faisant glisser les objets sur la page ou en
tirant les poignées de sélection autour de l'objet. Vous pouvez également entrer des valeurs numériques
précises. L'objet sélectionné s'affiche avec 4 ou 8 poignées situées à l'extérieur de sa bordure. La ligne
de statut située en bas de l'écran vous informe également sur l'objet sélectionné.
Pour redimensionner un objet, tirez sur les poignées situées dans les angles de l'objet. Tirez les poignées
internes (voir ci-contre) pour le faire pivoter. Les rectangles et les rectangles à bords arrondis ont huit
poignées qui vous permettent de les étirer ou de les redimensionner. Les autres objets, comme les
groupes, les blocs de texte et les photos n'ont que quatre poignées et ne peuvent pas être étirés (ils
risquent de se tordre).
Avancer les objets
La touche fléchée peut être utilisée pour avancer l'objet sélectionné pixel par pixel. Si vous maintenez la
touche Majuscule enfoncée, les objets avancent par groupes de 10 pixels à la fois.
Faire pivoter les objets
Il existe deux façons de faire pivoter un objet. La première consiste à cliquer sur l' objet deux fois pour
que les poignées de sélection deviennent des poignées de rotation que vous pourrez utiliser pour faire
pivoter l'objet. La deuxième façon consiste à placer le curseur de la souris dans les poignées situées dans
les angles (poignées de sélection) jusqu'à ce que le curseur se transforme en indicateur de rotation :
vous pouvez alors faire pivoter l'objet sélectionné.
Exceptionnel : vous pouvez faire pivoter tout ce que vous voulez dans Web Designer, y compris des
photos, des titres et même des blocs de texte. Puisque les navigateurs Internet ne peuvent afficher de
texte à un angle, Web Designer convertira automatiquement tout texte qu'on aura fait pivoter en des
graphiques lors de l'exportation vers un site Internet
Barre d'infos
Lorsqu'un objet est sélectionné, la Barre d'infos située juste au-dessus de votre document vous montre
toutes les fonctionnalités utiles pour cet outil. Cette barre change en fonction de l'outil que vous avez
choisi. Voici la Barre d'infos de l'outil de Sélection :
La Barre d'infos située juste au-dessus de votre document vous permet de voir les fonctionnalités de
l'outil sélectionné.
Il est possible de saisir des valeurs numériques dans tous les champs. Par exemple, pour réduire la taille
d'un objet de 20 %, vous pouvez entrer 80 % dans le champ approprié (qui est une taille en
pourcentage). Le petit cadenas définit si la largeur et la longueur changent simultanément.
Page 19
Copier des objets
Vous pouvez utiliser la combinaison classique Copier (Ctrl+C) -Coller (Ctrl+V). Une autre manière très
rapide de copier un objet est de cliquer dessus avec le bouton droit de la souris.
Page 20
Avancer les objets
La touche fléchée peut être utilisée pour avancer l'objet sélectionné pixel par pixel. Si vous maintenez la
touche Majuscule enfoncée, les objets avancent par groupes de 10 pixels à la fois.
Faire pivoter les objets
Il existe deux façons de faire pivoter un objet. La première consiste à cliquer sur l' objet deux fois pour
que les poignées de sélection deviennent des poignées de rotation que vous pourrez utiliser pour faire
pivoter l'objet. La deuxième façon consiste à placer le curseur de la souris dans les poignées situées dans
les angles (poignées de sélection) jusqu'à ce que le curseur se transforme en indicateur de rotation :
vous pouvez alors faire pivoter l'objet sélectionné.
Exceptionnel : vous pouvez faire pivoter tout ce que vous voulez dans Web Designer, y compris des
photos, des titres et même des blocs de texte. Puisque les navigateurs Internet ne peuvent afficher de
texte à un angle, Web Designer convertira automatiquement tout texte qu'on aura fait pivoter en des
graphiques lors de l'exportation vers un site Internet
Barre d'infos
Lorsqu'un objet est sélectionné, la Barre d'infos située juste au-dessus de votre document vous montre
toutes les fonctionnalités utiles pour cet outil. Cette barre change en fonction de l'outil que vous avez
choisi. Voici la Barre d'infos de l'outil de Sélection :
La Barre d'infos située juste au-dessus de votre document vous permet de voir les fonctionnalités de
l'outil sélectionné.
Il est possible de saisir des valeurs numériques dans tous les champs. Par exemple, pour réduire la taille
d'un objet de 20 %, vous pouvez entrer 80 % dans le champ approprié (qui est une taille en
pourcentage). Le petit cadenas définit si la largeur et la longueur changent simultanément.
Copier des objets
Vous pouvez utiliser la combinaison classique Copier (Ctrl+C) -Coller (Ctrl+V). Une autre manière très
rapide de copier un objet est de cliquer dessus avec le bouton droit de la souris.
Page 21
Faire pivoter les objets
Il existe deux façons de faire pivoter un objet. La première consiste à cliquer sur l' objet deux fois pour
que les poignées de sélection deviennent des poignées de rotation que vous pourrez utiliser pour faire
pivoter l'objet. La deuxième façon consiste à placer le curseur de la souris dans les poignées situées dans
les angles (poignées de sélection) jusqu'à ce que le curseur se transforme en indicateur de rotation :
vous pouvez alors faire pivoter l'objet sélectionné.
Exceptionnel : vous pouvez faire pivoter tout ce que vous voulez dans Web Designer, y compris des
photos, des titres et même des blocs de texte. Puisque les navigateurs Internet ne peuvent afficher de
texte à un angle, Web Designer convertira automatiquement tout texte qu'on aura fait pivoter en des
graphiques lors de l'exportation vers un site Internet
Barre d'infos
Lorsqu'un objet est sélectionné, la Barre d'infos située juste au-dessus de votre document vous montre
toutes les fonctionnalités utiles pour cet outil. Cette barre change en fonction de l'outil que vous avez
choisi. Voici la Barre d'infos de l'outil de Sélection :
La Barre d'infos située juste au-dessus de votre document vous permet de voir les fonctionnalités de
l'outil sélectionné.
Il est possible de saisir des valeurs numériques dans tous les champs. Par exemple, pour réduire la taille
d'un objet de 20 %, vous pouvez entrer 80 % dans le champ approprié (qui est une taille en
pourcentage). Le petit cadenas définit si la largeur et la longueur changent simultanément.
Copier des objets
Vous pouvez utiliser la combinaison classique Copier (Ctrl+C) -Coller (Ctrl+V). Une autre manière très
rapide de copier un objet est de cliquer dessus avec le bouton droit de la souris.
Page 22
Barre d'infos
Lorsqu'un objet est sélectionné, la Barre d'infos située juste au-dessus de votre document vous montre
toutes les fonctionnalités utiles pour cet outil. Cette barre change en fonction de l'outil que vous avez
choisi. Voici la Barre d'infos de l'outil de Sélection :
La Barre d'infos située juste au-dessus de votre document vous permet de voir les fonctionnalités de
l'outil sélectionné.
Il est possible de saisir des valeurs numériques dans tous les champs. Par exemple, pour réduire la taille
d'un objet de 20 %, vous pouvez entrer 80 % dans le champ approprié (qui est une taille en
pourcentage). Le petit cadenas définit si la largeur et la longueur changent simultanément.
Copier des objets
Vous pouvez utiliser la combinaison classique Copier (Ctrl+C) -Coller (Ctrl+V). Une autre manière très
rapide de copier un objet est de cliquer dessus avec le bouton droit de la souris.
Page 23
Copier des objets
Vous pouvez utiliser la combinaison classique Copier (Ctrl+C) -Coller (Ctrl+V). Une autre manière très
rapide de copier un objet est de cliquer dessus avec le bouton droit de la souris.
Page 24
Prévisualisation de votre site Internet
Cliquez sur le bouton Exporter & Prévisualiser
dans la barre du haut. Une fenêtre de votre navigateur s'ouvre alors pour
vous montrer l'aspect de votre site Internet final.
Lorsque vous créez votre site Internet dans Web Designer, votre document de travail affiche une
prévisualisation statique précise. Cependant, pour vérifier le comportement des pop-ups, des effets de
souris et des animations en Flash, il est nécessaire d'effectuer une prévisualisation en passant par votre
navigateur.
Remarque
: Cette prévisualisation interne utilise une version simplifiée de Internet Explorer.
Pour prévisualiser votre site Internet dans différents navigateurs, exportez
(Bouton Exporter
de la barre du haut) puis ouvrez le fichier .htm dans le navigateur de
votre choix.
Vous pouvez également faire un clic droit sur le fichier et sélectionner « Ouvrir avec...» ou simplement
glisser-déposer le fichier dans la fenêtre ouverte de votre navigateur. Une fois que vous avez exporté le
fichier, l'exportation se met à jour automatiquement dès que vous cliquez sur Prévisualiser. Il suffit donc
simplement de cliquer sur le bouton Recharger de votre navigateur (ou d'appuyer sur F5).
Page 25
Utiliser des modèles de conception et des
Cliparts
Ouvrez la Galerie des modèles en cliquant sur le bouton Galerie des
modèles dans la barre du haut.
Des dossiers contenant une sélection de modèles de site Internet et des fichiers graphiques associés,
classés par thèmes, s'affichent. Parcourez les dossiers puis double-cliquez pour ouvrir l'un des fichiers en
tant que nouveau document. Chaque type de modèle s'accompagne de mises en page alternatives et
d'objets utiles comme des boutons ou des zones de texte.
Ajouter de nouvelles pages à votre site Internet
Vous pouvez utiliser n'importe quel modèle de la Galerie de modèles
sur votre page. S'il s'agit d'un modèle de page, cela ajoutera une nouvelle page à votre site Internet
après vous avoir demandé si vous souhaitez appliquer les changements de couleurs. Si vous glissez un
objet Clipart, comme un bouton, un titre ou une photo, il se placera sur la page à l'emplacement souhaité
puis vous devrez confirmer si les changements de couleurs doivent être appliqués.
En plus des rubriques de pages Internet thématiques, la Galerie de modèles contient également des
répertoires de boutons, bannières, titres, photos et plus encore. Il vous suffit de faire glisser l'objet
souhaité de la Galerie sur la page. Le logiciel vous demande alors si vous souhaitez que l'image suive ou
non les couleurs de votre site Internet. Si vous ne le souhaitez pas, il est toujours possible de modifier
plus tard les couleurs du graphisme importé, voir ci-dessous.
Le graphisme importé est simplement un objet supplémentaire sur la page et peut être repositionné,
redimensionné et pivoté grâce à l'outil Sélection.
Pour ajouter une nouvelle page du même modèle, le plus simple est
d'utiliser le bouton « Copier la page » de la barre du haut.
La page actuelle est dupliquée en-dessous. Vous pouvez ensuite supprimer ou modifier des éléments
selon le besoin. Ainsi, vous pouvez garder la même structure de navigation.
Vous pouvez ajouter une nouvelle page vide en sélectionnant le menu Édition -> Pages -> Nouvelle
page
.
Vous pouvez supprimer des pages en utilisant le même menu Pages.
Clipart Flash
Xtreme Web Designer 5 inclut la possibilité de créer entièrement des Animations Flash (voir la rubrique
Animations Flash
) mais propose également un éventail d'animations personnalisables. Les modèles Flash ne peuvent pas
être déposés directement sur la page mais doivent être ouvert dans un document Animations distinct où
vous pourrez les modifier selon vos besoins puis les enregistrer en tant que document Flash (.swf) sur
votre disque dur. Utilisez ensuite la , qui créé un emplacement graphique et l'associe à votre fichier Flash
(.swf).
Page 26
Ajouter de nouvelles pages à votre site Internet
Vous pouvez utiliser n'importe quel modèle de la Galerie de modèles
sur votre page. S'il s'agit d'un modèle de page, cela ajoutera une nouvelle page à votre site Internet
après vous avoir demandé si vous souhaitez appliquer les changements de couleurs. Si vous glissez un
objet Clipart, comme un bouton, un titre ou une photo, il se placera sur la page à l'emplacement souhaité
puis vous devrez confirmer si les changements de couleurs doivent être appliqués.
En plus des rubriques de pages Internet thématiques, la Galerie de modèles contient également des
répertoires de boutons, bannières, titres, photos et plus encore. Il vous suffit de faire glisser l'objet
souhaité de la Galerie sur la page. Le logiciel vous demande alors si vous souhaitez que l'image suive ou
non les couleurs de votre site Internet. Si vous ne le souhaitez pas, il est toujours possible de modifier
plus tard les couleurs du graphisme importé, voir ci-dessous.
Le graphisme importé est simplement un objet supplémentaire sur la page et peut être repositionné,
redimensionné et pivoté grâce à l'outil Sélection.
Pour ajouter une nouvelle page du même modèle, le plus simple est
d'utiliser le bouton « Copier la page » de la barre du haut.
La page actuelle est dupliquée en-dessous. Vous pouvez ensuite supprimer ou modifier des éléments
selon le besoin. Ainsi, vous pouvez garder la même structure de navigation.
Vous pouvez ajouter une nouvelle page vide en sélectionnant le menu Édition -> Pages -> Nouvelle
page
.
Vous pouvez supprimer des pages en utilisant le même menu Pages.
Clipart Flash
Xtreme Web Designer 5 inclut la possibilité de créer entièrement des Animations Flash (voir la rubrique
Animations Flash
) mais propose également un éventail d'animations personnalisables. Les modèles Flash ne peuvent pas
être déposés directement sur la page mais doivent être ouvert dans un document Animations distinct où
vous pourrez les modifier selon vos besoins puis les enregistrer en tant que document Flash (.swf) sur
votre disque dur. Utilisez ensuite la , qui créé un emplacement graphique et l'associe à votre fichier Flash
(.swf).
Page 27
Clipart Flash
Xtreme Web Designer 5 inclut la possibilité de créer entièrement des Animations Flash (voir la rubrique
Animations Flash
) mais propose également un éventail d'animations personnalisables. Les modèles Flash ne peuvent pas
être déposés directement sur la page mais doivent être ouvert dans un document Animations distinct où
vous pourrez les modifier selon vos besoins puis les enregistrer en tant que document Flash (.swf) sur
votre disque dur. Utilisez ensuite la , qui créé un emplacement graphique et l'associe à votre fichier Flash
(.swf).
Page 28
Couleurs du site Internet
Tous les modèles de conception utilisent une gamme de couleurs ainsi que de nombreuses nuances de
ces couleurs. Il est possible de les modifier très rapidement et de recolorer l'intégralité de votre site
Internet. Ces couleurs sont appelées « Couleurs nommées » et se situent sur la gauche de la Palette de
couleurs, en bas de la fenêtre.
Il suffit simplement de cliquer sur l'une des Couleurs nommées et de sélectionner l'option Éditer (si vous
passez le pointeur de la souris au-dessus de la couleur, vous verrez apparaître l'infobulle affichant le nom
de la couleur).
Pour modifier une
couleur, vous pouvez
tirer sur l'icône pipette
pour prélever une
couleur de l'écran, y
compris si elle se
trouve dans une autre
fenêtre
Sélectionner la couleur
à modifier : Couleur de
remplissage/Palette de
couleurs de l'objet
sélectionné ou de l'une
des couleurs de la
Cliquez sur l'icône pour
gamme
créer une Couleur
nommée
Cliquez pour afficher les
commandes relatives aux
couleurs
Couleur précédente
Couleur réelle
Tirez ici pour sélectionner
une nuance de la teinte
souhaitée
Tirez ici pour sélectionner
une teinte
L'Éditeur de couleurs vous permet de choisir facilement une couleur. Cliquez sur les Commandes
étendues pour saisir des valeurs RGB.
Remarque : lorsque vous modifiez une gamme de couleur de cette façon, toutes les nuances utilisées dans
le document sont également modifiées.
Colorer les formes
Vous pouvez remplir toutes les formes dessinées avec une couleur, soit en tirant la couleur de la
Palette de couleurs et en la déposant sur la forme, soit en sélectionnant l'objet puis en cliquant sur la
Palette de couleurs et en sélectionnant « Définir la couleur de remplissage
».
Page 29
Vous pouvez également cliquer sur l'icône Éditeur de couleurs (ou
appuyer sur Ctrl+E) pour afficher l'Éditeur de couleurs, où vous
trouverez toutes les couleurs de votre choix.
Vous pouvez remplir les objets dessinés avec un dégradé de couleurs en utilisant l' Outil de remplissage
.
Colorer des Cliparts importés
Lorsque vous importez un graphisme Clipart à partir de la Galerie de modèles, en utilisant l'option
Importer ou en déposant un fichier .web ou .xar sur votre page, le logiciel vous demandera si vous
souhaitez harmoniser les couleurs. Si vous ne le souhaitez pas, les Couleurs nommées du graphisme
seront ajoutées à la Palette de couleurs. Vous pourrez modifier les couleurs en cliquant sur l'une des
couleurs de la Palette.
Coloration de photos
SI vous essayez de colorer une photo, deux tons sont utilisés. Ainsi, pour colorer une photo en noir et
blanc, sélectionnez-la normalement puis cliquez sur la couleur blanche située au bout de la Palette. Vous
pouvez utiliser n'importe quelle couleur claire et foncée de la Palette, pas seulement le noir et le blanc.
Remarque : SI la photo appartient à un groupe, comme bon nombre des photos des modèles de
conception ou des Cliparts, il faudra d'abord sélectionner la photo à l'intérieur du groupe. Vous pouvez le
faire en maintenant la touche Ctrl enfoncée tout en cliquant sur l'objet dans l'outil Sélection. Une autre
manière de sélectionner les photos est de cliquer dessus dans l'outil Photo
.
Couleur d'arrière-plan de page
La plupart des modèles de page de la Galerie des modèles ont deux types d'arrière-plan. Un
arrière-plan de page qui s'étend sur l'ensemble de la fenêtre du navigateur. De plus, il comporte des
éléments de page dessinés, composés généralement de différentes gammes de couleurs.
La Palette de couleur comporte habituellement une couleur nommée « Couleur d'arrière-plan », une autre
appelée « Couleur du panneau ». En les modifiant, vous pouvez contrôler les différentes couleurs
d'arrière-plan. Les autres couleurs sont les couleurs 1,2, etc. du thème.
Définir la couleur d'arrière-plan de la page
Quand vous ouvrez une nouvelle page blanche (Fichier -> Nouveau), la page par défaut qui s'affiche est
blanche. C'est sur cet arrière-plan que vous placerez tous les éléments de votre site Internet.
Pour définir une couleur d'arrière-plan, faites glisser une couleur depuis la Palette de couleurs, maintenez
Ctrl enfoncé et déposez-la sur l'arrière-plan. Dans le navigateur Internet, cette couleur d'arrière-plan
s'affiche sur toute la surface d'arrière-plan de la fenêtre.
Page 30
Pour définir une couleur de fond, ouvrez l'Éditeur de couleurs (Ctrl+E) et glissez la deuxième couleur
située à droite de la boîte de dialogue. Maintenez la touche Ctrl enfoncée et placez la couleur dans
l'arrière-plan de la page. Lorsque vous modifierez la couleur dans l'Éditeur de couleur, l'arrière-plan sera
modifié simultanément.
Pour mettre en place une texture de fond récurrente, glissez la photo ou
le Bitmap sur le document. Ouvrez la Galerie Bitmap, recherchez la
photo que vous venez de télécharger, cliquez dessus pour la sélectionner
puis cliquez sur le bouton Arrière-plan
de la Galerie.
Créer un arrière-plan dégradé
Pour créer facilement un arrière-plan dégradé, dessinez un rectangle sur la page entière, placez-le en
fond et remplissez-le avec une couleur dégradée grâce à l'outil Remplissage, en disposant la couleur
dans l'ensemble du rectangle. (Voir ici
pour plus d'informations sur l'outil Remplissage).
Arrières-plan avancés
Les navigateurs Web n'affichent pas les arrières-plan dégradés sur l'ensemble visible de la fenêtre
(c'est-à-dire comme un véritable arrière-plan HTML) mais ils acceptent les arrières-plan constitués de
fichiers Bitmap répétés et en mosaïque. De cette façon, il est possible de créer un arrière-plan
entièrement dégradé en créant un fichier Bitmap qui sera répété (en mosaïque) sur la page.
En créant une longue bande fine sur la gauche définie en tant qu'arrière-plan, vous obtiendrez un
arrière-plan dégradé sur l'ensemble de la page.
Voici les étapes permettant d'obtenir cet effet ;
1. Dessinez un long rectangle fin. Il doit être aussi long que la fenêtre de n'importe quel navigateur
pour éviter qu'il ne se répète verticalement. Nous vous recommandons d'opter pour une valeur
Page 31
2.
3.
4.
5.
6.
de 1 000 pixels, une valeur supérieure à celle de votre page. Il sera peut-être nécessaire de faire
un zoom arrière pour dessiner un rectangle de taille suffisante. Il doit être très fin.
Assurez-vous que votre rectangle n'a pas de bordure : cliquez sur l'outil Sélection et réglez ce
paramètre. Cliquez sur « Aucune couleur » dans la Palette de couleurs (ou sélectionnez
« Aucune » dans le menu de sélection de la largeur de ligne, dans la barre du haut).
Assurez-vous que la largeur du rectangle ne dépasse pas quelques pixels et qu'ils se situent bien
dans les coordonnées X et Y : dans l'outil Sélection, sélectionnez le rectangle, éditez la largeur
(L), appuyez sur Entrer puis éditer les positions X et Y pour que ce soit des nombres entiers.
En utilisant l' outil Remplissage, vous pouvez lui donner la couleur dégradée souhaitée : faites-la
simplement glisser dans le rectangle. Assurez-vous que le dégradé soit bien réparti de haut en bas
en ajustant si nécessaire la flèche de remplissage.
Exportez le rectangle au format PNG. Cliquez sur l'icône « Exporter en PNG ».
Une fois
exportée, faites glisser l'image sur la page de votre Explorateur de fichiers.
Ouvrez la galerie des Bitmaps,
faites défiler jusqu'à ce que vous voyez les images que vous
venez de télécharger (il s'agit d'un index très fin, presque invisible, dans la galerie), puis
sélectionnez-le en cliquant dessus dans la Galerie. Ensuite, cliquez sur le bouton Arrière-plan
dans la Galerie Bitmap. Vous pouvez ensuite supprimer le rectangle original de la page.
Créer vos propres Couleurs nommées
Si vous souhaitez utiliser une couleur plusieurs fois dans un document, vous pouvez créer votre propre
Couleur nommée en cliquant sur l'étiquette Nom en haut de l'Éditeur de couleur. Cette couleur apparaît
désormais dans la Palette de couleurs.
L'avantage d'une Couleur nommée est que si on l'édite plus tard (cliquez sur la couleur puis sélectionnez
Éditer), tous les objets utilisant cette couleur seront également modifiés.
Nuances liées
Vous pouvez créer des nuances plus claires ou plus foncées d'une couleur. Ainsi, lorsque la couleur de
départ est modifiée, toutes les nuances claires et foncées s'adaptent à la nouvelle couleur utilisée. Par
exemple, la nuance dégradée d'un bouton, comme celle-ci :
Il s'agit d'un simple rectangle aux bords arrondis avec
un remplissage dégradé créé avec l'outil de
remplissage. Dans l'outil Remplissage, vous pouvez
cliquer sur l'un des côtés de la flèche pour déterminer
la couleur.
Si vous désignez la principale couleur verte comme Couleur nommée et que vous en créez ensuite une
nuance plus claire ou plus foncée en tant que Nuance liée, lorsque vous éditerez la Couleur nommée, les
nuances changeront également. Ainsi, recolorer des objets aux nuances complexes devient facile.
Pour créer une nuance liée, ouvrez les options supplémentaires de l'Éditeur de couleur puis sélectionnez
le menu déroulant « Couleurs normales » et « Nuance d'une autre couleur
».
Page 32
Cliquez sur ce bouton
pour afficher les couleurs
supplémentaires
Vous pouvez désormais
sélectionner une nuance
plus claire ou plus foncée
d'une couleur mère. La
couleur mère est la
couleur cochée.
Sélectionnez une Nuance
de ce menu déroulant puis
la couleur mère
Vous pouvez également créer une Nuance liée qui apparaît dans la Palette de couleurs (vous pourrez
facilement l'appliquer à d'autres objets). Lorsque vous sélectionnez un nouvel Objet nommé, vous pouvez
choisir d'en faire un lien « Nuance d'une autre couleur ».
Page 33
Colorer les formes
Vous pouvez remplir toutes les formes dessinées avec une couleur, soit en tirant la couleur de la
Palette de couleurs et en la déposant sur la forme, soit en sélectionnant l'objet puis en cliquant sur la
Palette de couleurs et en sélectionnant « Définir la couleur de remplissage
».
Vous pouvez également cliquer sur l'icône Éditeur de couleurs (ou
appuyer sur Ctrl+E) pour afficher l'Éditeur de couleurs, où vous
trouverez toutes les couleurs de votre choix.
Vous pouvez remplir les objets dessinés avec un dégradé de couleurs en utilisant l' Outil de remplissage
.
Colorer des Cliparts importés
Lorsque vous importez un graphisme Clipart à partir de la Galerie de modèles, en utilisant l'option
Importer ou en déposant un fichier .web ou .xar sur votre page, le logiciel vous demandera si vous
souhaitez harmoniser les couleurs. Si vous ne le souhaitez pas, les Couleurs nommées du graphisme
seront ajoutées à la Palette de couleurs. Vous pourrez modifier les couleurs en cliquant sur l'une des
couleurs de la Palette.
Coloration de photos
SI vous essayez de colorer une photo, deux tons sont utilisés. Ainsi, pour colorer une photo en noir et
blanc, sélectionnez-la normalement puis cliquez sur la couleur blanche située au bout de la Palette. Vous
pouvez utiliser n'importe quelle couleur claire et foncée de la Palette, pas seulement le noir et le blanc.
Remarque : SI la photo appartient à un groupe, comme bon nombre des photos des modèles de
conception ou des Cliparts, il faudra d'abord sélectionner la photo à l'intérieur du groupe. Vous pouvez le
faire en maintenant la touche Ctrl enfoncée tout en cliquant sur l'objet dans l'outil Sélection. Une autre
manière de sélectionner les photos est de cliquer dessus dans l'outil Photo
.
Couleur d'arrière-plan de page
La plupart des modèles de page de la Galerie des modèles ont deux types d'arrière-plan. Un
arrière-plan de page qui s'étend sur l'ensemble de la fenêtre du navigateur. De plus, il comporte des
éléments de page dessinés, composés généralement de différentes gammes de couleurs.
La Palette de couleur comporte habituellement une couleur nommée « Couleur d'arrière-plan », une autre
appelée « Couleur du panneau ». En les modifiant, vous pouvez contrôler les différentes couleurs
d'arrière-plan. Les autres couleurs sont les couleurs 1,2, etc. du thème.
Page 34
Définir la couleur d'arrière-plan de la page
Quand vous ouvrez une nouvelle page blanche (Fichier -> Nouveau), la page par défaut qui s'affiche est
blanche. C'est sur cet arrière-plan que vous placerez tous les éléments de votre site Internet.
Pour définir une couleur d'arrière-plan, faites glisser une couleur depuis la Palette de couleurs, maintenez
Ctrl enfoncé et déposez-la sur l'arrière-plan. Dans le navigateur Internet, cette couleur d'arrière-plan
s'affiche sur toute la surface d'arrière-plan de la fenêtre.
Pour définir une couleur de fond, ouvrez l'Éditeur de couleurs (Ctrl+E) et glissez la deuxième couleur
située à droite de la boîte de dialogue. Maintenez la touche Ctrl enfoncée et placez la couleur dans
l'arrière-plan de la page. Lorsque vous modifierez la couleur dans l'Éditeur de couleur, l'arrière-plan sera
modifié simultanément.
Pour mettre en place une texture de fond récurrente, glissez la photo ou
le Bitmap sur le document. Ouvrez la Galerie Bitmap, recherchez la
photo que vous venez de télécharger, cliquez dessus pour la sélectionner
puis cliquez sur le bouton Arrière-plan
de la Galerie.
Créer un arrière-plan dégradé
Pour créer facilement un arrière-plan dégradé, dessinez un rectangle sur la page entière, placez-le en
fond et remplissez-le avec une couleur dégradée grâce à l'outil Remplissage, en disposant la couleur
dans l'ensemble du rectangle. (Voir ici
pour plus d'informations sur l'outil Remplissage).
Arrières-plan avancés
Les navigateurs Web n'affichent pas les arrières-plan dégradés sur l'ensemble visible de la fenêtre
(c'est-à-dire comme un véritable arrière-plan HTML) mais ils acceptent les arrières-plan constitués de
fichiers Bitmap répétés et en mosaïque. De cette façon, il est possible de créer un arrière-plan
entièrement dégradé en créant un fichier Bitmap qui sera répété (en mosaïque) sur la page.
Page 35
En créant une longue bande fine sur la gauche définie en tant qu'arrière-plan, vous obtiendrez un
arrière-plan dégradé sur l'ensemble de la page.
Voici les étapes permettant d'obtenir cet effet ;
1. Dessinez un long rectangle fin. Il doit être aussi long que la fenêtre de n'importe quel navigateur
pour éviter qu'il ne se répète verticalement. Nous vous recommandons d'opter pour une valeur
de 1 000 pixels, une valeur supérieure à celle de votre page. Il sera peut-être nécessaire de faire
un zoom arrière pour dessiner un rectangle de taille suffisante. Il doit être très fin.
2. Assurez-vous que votre rectangle n'a pas de bordure : cliquez sur l'outil Sélection et réglez ce
paramètre. Cliquez sur « Aucune couleur » dans la Palette de couleurs (ou sélectionnez
« Aucune » dans le menu de sélection de la largeur de ligne, dans la barre du haut).
3. Assurez-vous que la largeur du rectangle ne dépasse pas quelques pixels et qu'ils se situent bien
dans les coordonnées X et Y : dans l'outil Sélection, sélectionnez le rectangle, éditez la largeur
(L), appuyez sur Entrer puis éditer les positions X et Y pour que ce soit des nombres entiers.
4. En utilisant l' outil Remplissage, vous pouvez lui donner la couleur dégradée souhaitée : faites-la
simplement glisser dans le rectangle. Assurez-vous que le dégradé soit bien réparti de haut en bas
en ajustant si nécessaire la flèche de remplissage.
Une fois
5. Exportez le rectangle au format PNG. Cliquez sur l'icône « Exporter en PNG ».
exportée, faites glisser l'image sur la page de votre Explorateur de fichiers.
faites défiler jusqu'à ce que vous voyez les images que vous
6. Ouvrez la galerie des Bitmaps,
venez de télécharger (il s'agit d'un index très fin, presque invisible, dans la galerie), puis
sélectionnez-le en cliquant dessus dans la Galerie. Ensuite, cliquez sur le bouton Arrière-plan
dans la Galerie Bitmap. Vous pouvez ensuite supprimer le rectangle original de la page.
Créer vos propres Couleurs nommées
Si vous souhaitez utiliser une couleur plusieurs fois dans un document, vous pouvez créer votre propre
Couleur nommée en cliquant sur l'étiquette Nom en haut de l'Éditeur de couleur. Cette couleur apparaît
désormais dans la Palette de couleurs.
L'avantage d'une Couleur nommée est que si on l'édite plus tard (cliquez sur la couleur puis sélectionnez
Éditer), tous les objets utilisant cette couleur seront également modifiés.
Page 36
Nuances liées
Vous pouvez créer des nuances plus claires ou plus foncées d'une couleur. Ainsi, lorsque la couleur de
départ est modifiée, toutes les nuances claires et foncées s'adaptent à la nouvelle couleur utilisée. Par
exemple, la nuance dégradée d'un bouton, comme celle-ci :
Il s'agit d'un simple rectangle aux bords arrondis avec
un remplissage dégradé créé avec l'outil de
remplissage. Dans l'outil Remplissage, vous pouvez
cliquer sur l'un des côtés de la flèche pour déterminer
la couleur.
Si vous désignez la principale couleur verte comme Couleur nommée et que vous en créez ensuite une
nuance plus claire ou plus foncée en tant que Nuance liée, lorsque vous éditerez la Couleur nommée, les
nuances changeront également. Ainsi, recolorer des objets aux nuances complexes devient facile.
Pour créer une nuance liée, ouvrez les options supplémentaires de l'Éditeur de couleur puis sélectionnez
le menu déroulant « Couleurs normales » et « Nuance d'une autre couleur
».
Cliquez sur ce bouton
pour afficher les couleurs
supplémentaires
Vous pouvez désormais
sélectionner une nuance
plus claire ou plus foncée
d'une couleur mère. La
couleur mère est la
couleur cochée.
Sélectionnez une Nuance
de ce menu déroulant puis
la couleur mère
Vous pouvez également créer une Nuance liée qui apparaît dans la Palette de couleurs (vous pourrez
facilement l'appliquer à d'autres objets). Lorsque vous sélectionnez un nouvel Objet nommé, vous pouvez
choisir d'en faire un lien « Nuance d'une autre couleur ».
Page 37
Colorer des Cliparts importés
Lorsque vous importez un graphisme Clipart à partir de la Galerie de modèles, en utilisant l'option
Importer ou en déposant un fichier .web ou .xar sur votre page, le logiciel vous demandera si vous
souhaitez harmoniser les couleurs. Si vous ne le souhaitez pas, les Couleurs nommées du graphisme
seront ajoutées à la Palette de couleurs. Vous pourrez modifier les couleurs en cliquant sur l'une des
couleurs de la Palette.
Coloration de photos
SI vous essayez de colorer une photo, deux tons sont utilisés. Ainsi, pour colorer une photo en noir et
blanc, sélectionnez-la normalement puis cliquez sur la couleur blanche située au bout de la Palette. Vous
pouvez utiliser n'importe quelle couleur claire et foncée de la Palette, pas seulement le noir et le blanc.
Remarque : SI la photo appartient à un groupe, comme bon nombre des photos des modèles de
conception ou des Cliparts, il faudra d'abord sélectionner la photo à l'intérieur du groupe. Vous pouvez le
faire en maintenant la touche Ctrl enfoncée tout en cliquant sur l'objet dans l'outil Sélection. Une autre
manière de sélectionner les photos est de cliquer dessus dans l'outil Photo
.
Couleur d'arrière-plan de page
La plupart des modèles de page de la Galerie des modèles ont deux types d'arrière-plan. Un
arrière-plan de page qui s'étend sur l'ensemble de la fenêtre du navigateur. De plus, il comporte des
éléments de page dessinés, composés généralement de différentes gammes de couleurs.
La Palette de couleur comporte habituellement une couleur nommée « Couleur d'arrière-plan », une autre
appelée « Couleur du panneau ». En les modifiant, vous pouvez contrôler les différentes couleurs
d'arrière-plan. Les autres couleurs sont les couleurs 1,2, etc. du thème.
Définir la couleur d'arrière-plan de la page
Quand vous ouvrez une nouvelle page blanche (Fichier -> Nouveau), la page par défaut qui s'affiche est
blanche. C'est sur cet arrière-plan que vous placerez tous les éléments de votre site Internet.
Pour définir une couleur d'arrière-plan, faites glisser une couleur depuis la Palette de couleurs, maintenez
Ctrl enfoncé et déposez-la sur l'arrière-plan. Dans le navigateur Internet, cette couleur d'arrière-plan
s'affiche sur toute la surface d'arrière-plan de la fenêtre.
Page 38
Pour définir une couleur de fond, ouvrez l'Éditeur de couleurs (Ctrl+E) et glissez la deuxième couleur
située à droite de la boîte de dialogue. Maintenez la touche Ctrl enfoncée et placez la couleur dans
l'arrière-plan de la page. Lorsque vous modifierez la couleur dans l'Éditeur de couleur, l'arrière-plan sera
modifié simultanément.
Pour mettre en place une texture de fond récurrente, glissez la photo ou
le Bitmap sur le document. Ouvrez la Galerie Bitmap, recherchez la
photo que vous venez de télécharger, cliquez dessus pour la sélectionner
puis cliquez sur le bouton Arrière-plan
de la Galerie.
Créer un arrière-plan dégradé
Pour créer facilement un arrière-plan dégradé, dessinez un rectangle sur la page entière, placez-le en
fond et remplissez-le avec une couleur dégradée grâce à l'outil Remplissage, en disposant la couleur
dans l'ensemble du rectangle. (Voir ici
pour plus d'informations sur l'outil Remplissage).
Arrières-plan avancés
Les navigateurs Web n'affichent pas les arrières-plan dégradés sur l'ensemble visible de la fenêtre
(c'est-à-dire comme un véritable arrière-plan HTML) mais ils acceptent les arrières-plan constitués de
fichiers Bitmap répétés et en mosaïque. De cette façon, il est possible de créer un arrière-plan
entièrement dégradé en créant un fichier Bitmap qui sera répété (en mosaïque) sur la page.
En créant une longue bande fine sur la gauche définie en tant qu'arrière-plan, vous obtiendrez un
arrière-plan dégradé sur l'ensemble de la page.
Voici les étapes permettant d'obtenir cet effet ;
1. Dessinez un long rectangle fin. Il doit être aussi long que la fenêtre de n'importe quel navigateur
pour éviter qu'il ne se répète verticalement. Nous vous recommandons d'opter pour une valeur
Page 39
2.
3.
4.
5.
6.
de 1 000 pixels, une valeur supérieure à celle de votre page. Il sera peut-être nécessaire de faire
un zoom arrière pour dessiner un rectangle de taille suffisante. Il doit être très fin.
Assurez-vous que votre rectangle n'a pas de bordure : cliquez sur l'outil Sélection et réglez ce
paramètre. Cliquez sur « Aucune couleur » dans la Palette de couleurs (ou sélectionnez
« Aucune » dans le menu de sélection de la largeur de ligne, dans la barre du haut).
Assurez-vous que la largeur du rectangle ne dépasse pas quelques pixels et qu'ils se situent bien
dans les coordonnées X et Y : dans l'outil Sélection, sélectionnez le rectangle, éditez la largeur
(L), appuyez sur Entrer puis éditer les positions X et Y pour que ce soit des nombres entiers.
En utilisant l' outil Remplissage, vous pouvez lui donner la couleur dégradée souhaitée : faites-la
simplement glisser dans le rectangle. Assurez-vous que le dégradé soit bien réparti de haut en bas
en ajustant si nécessaire la flèche de remplissage.
Exportez le rectangle au format PNG. Cliquez sur l'icône « Exporter en PNG ».
Une fois
exportée, faites glisser l'image sur la page de votre Explorateur de fichiers.
Ouvrez la galerie des Bitmaps,
faites défiler jusqu'à ce que vous voyez les images que vous
venez de télécharger (il s'agit d'un index très fin, presque invisible, dans la galerie), puis
sélectionnez-le en cliquant dessus dans la Galerie. Ensuite, cliquez sur le bouton Arrière-plan
dans la Galerie Bitmap. Vous pouvez ensuite supprimer le rectangle original de la page.
Créer vos propres Couleurs nommées
Si vous souhaitez utiliser une couleur plusieurs fois dans un document, vous pouvez créer votre propre
Couleur nommée en cliquant sur l'étiquette Nom en haut de l'Éditeur de couleur. Cette couleur apparaît
désormais dans la Palette de couleurs.
L'avantage d'une Couleur nommée est que si on l'édite plus tard (cliquez sur la couleur puis sélectionnez
Éditer), tous les objets utilisant cette couleur seront également modifiés.
Nuances liées
Vous pouvez créer des nuances plus claires ou plus foncées d'une couleur. Ainsi, lorsque la couleur de
départ est modifiée, toutes les nuances claires et foncées s'adaptent à la nouvelle couleur utilisée. Par
exemple, la nuance dégradée d'un bouton, comme celle-ci :
Il s'agit d'un simple rectangle aux bords arrondis avec
un remplissage dégradé créé avec l'outil de
remplissage. Dans l'outil Remplissage, vous pouvez
cliquer sur l'un des côtés de la flèche pour déterminer
la couleur.
Si vous désignez la principale couleur verte comme Couleur nommée et que vous en créez ensuite une
nuance plus claire ou plus foncée en tant que Nuance liée, lorsque vous éditerez la Couleur nommée, les
nuances changeront également. Ainsi, recolorer des objets aux nuances complexes devient facile.
Pour créer une nuance liée, ouvrez les options supplémentaires de l'Éditeur de couleur puis sélectionnez
le menu déroulant « Couleurs normales » et « Nuance d'une autre couleur
».
Page 40
Cliquez sur ce bouton
pour afficher les couleurs
supplémentaires
Vous pouvez désormais
sélectionner une nuance
plus claire ou plus foncée
d'une couleur mère. La
couleur mère est la
couleur cochée.
Sélectionnez une Nuance
de ce menu déroulant puis
la couleur mère
Vous pouvez également créer une Nuance liée qui apparaît dans la Palette de couleurs (vous pourrez
facilement l'appliquer à d'autres objets). Lorsque vous sélectionnez un nouvel Objet nommé, vous pouvez
choisir d'en faire un lien « Nuance d'une autre couleur ».
Page 41
Coloration de photos
SI vous essayez de colorer une photo, deux tons sont utilisés. Ainsi, pour colorer une photo en noir et
blanc, sélectionnez-la normalement puis cliquez sur la couleur blanche située au bout de la Palette. Vous
pouvez utiliser n'importe quelle couleur claire et foncée de la Palette, pas seulement le noir et le blanc.
Remarque : SI la photo appartient à un groupe, comme bon nombre des photos des modèles de
conception ou des Cliparts, il faudra d'abord sélectionner la photo à l'intérieur du groupe. Vous pouvez le
faire en maintenant la touche Ctrl enfoncée tout en cliquant sur l'objet dans l'outil Sélection. Une autre
manière de sélectionner les photos est de cliquer dessus dans l'outil Photo
.
Couleur d'arrière-plan de page
La plupart des modèles de page de la Galerie des modèles ont deux types d'arrière-plan. Un
arrière-plan de page qui s'étend sur l'ensemble de la fenêtre du navigateur. De plus, il comporte des
éléments de page dessinés, composés généralement de différentes gammes de couleurs.
La Palette de couleur comporte habituellement une couleur nommée « Couleur d'arrière-plan », une autre
appelée « Couleur du panneau ». En les modifiant, vous pouvez contrôler les différentes couleurs
d'arrière-plan. Les autres couleurs sont les couleurs 1,2, etc. du thème.
Définir la couleur d'arrière-plan de la page
Quand vous ouvrez une nouvelle page blanche (Fichier -> Nouveau), la page par défaut qui s'affiche est
blanche. C'est sur cet arrière-plan que vous placerez tous les éléments de votre site Internet.
Pour définir une couleur d'arrière-plan, faites glisser une couleur depuis la Palette de couleurs, maintenez
Ctrl enfoncé et déposez-la sur l'arrière-plan. Dans le navigateur Internet, cette couleur d'arrière-plan
s'affiche sur toute la surface d'arrière-plan de la fenêtre.
Pour définir une couleur de fond, ouvrez l'Éditeur de couleurs (Ctrl+E) et glissez la deuxième couleur
située à droite de la boîte de dialogue. Maintenez la touche Ctrl enfoncée et placez la couleur dans
l'arrière-plan de la page. Lorsque vous modifierez la couleur dans l'Éditeur de couleur, l'arrière-plan sera
Page 42
modifié simultanément.
Pour mettre en place une texture de fond récurrente, glissez la photo ou
le Bitmap sur le document. Ouvrez la Galerie Bitmap, recherchez la
photo que vous venez de télécharger, cliquez dessus pour la sélectionner
puis cliquez sur le bouton Arrière-plan
de la Galerie.
Créer un arrière-plan dégradé
Pour créer facilement un arrière-plan dégradé, dessinez un rectangle sur la page entière, placez-le en
fond et remplissez-le avec une couleur dégradée grâce à l'outil Remplissage, en disposant la couleur
dans l'ensemble du rectangle. (Voir ici
pour plus d'informations sur l'outil Remplissage).
Arrières-plan avancés
Les navigateurs Web n'affichent pas les arrières-plan dégradés sur l'ensemble visible de la fenêtre
(c'est-à-dire comme un véritable arrière-plan HTML) mais ils acceptent les arrières-plan constitués de
fichiers Bitmap répétés et en mosaïque. De cette façon, il est possible de créer un arrière-plan
entièrement dégradé en créant un fichier Bitmap qui sera répété (en mosaïque) sur la page.
En créant une longue bande fine sur la gauche définie en tant qu'arrière-plan, vous obtiendrez un
arrière-plan dégradé sur l'ensemble de la page.
Voici les étapes permettant d'obtenir cet effet ;
1. Dessinez un long rectangle fin. Il doit être aussi long que la fenêtre de n'importe quel navigateur
pour éviter qu'il ne se répète verticalement. Nous vous recommandons d'opter pour une valeur
de 1 000 pixels, une valeur supérieure à celle de votre page. Il sera peut-être nécessaire de faire
un zoom arrière pour dessiner un rectangle de taille suffisante. Il doit être très fin.
2. Assurez-vous que votre rectangle n'a pas de bordure : cliquez sur l'outil Sélection et réglez ce
paramètre. Cliquez sur « Aucune couleur » dans la Palette de couleurs (ou sélectionnez
« Aucune » dans le menu de sélection de la largeur de ligne, dans la barre du haut).
3. Assurez-vous que la largeur du rectangle ne dépasse pas quelques pixels et qu'ils se situent bien
dans les coordonnées X et Y : dans l'outil Sélection, sélectionnez le rectangle, éditez la largeur
(L), appuyez sur Entrer puis éditer les positions X et Y pour que ce soit des nombres entiers.
4. En utilisant l' outil Remplissage, vous pouvez lui donner la couleur dégradée souhaitée : faites-la
simplement glisser dans le rectangle. Assurez-vous que le dégradé soit bien réparti de haut en bas
en ajustant si nécessaire la flèche de remplissage.
Une fois
5. Exportez le rectangle au format PNG. Cliquez sur l'icône « Exporter en PNG ».
exportée, faites glisser l'image sur la page de votre Explorateur de fichiers.
Page 43
faites défiler jusqu'à ce que vous voyez les images que vous
6. Ouvrez la galerie des Bitmaps,
venez de télécharger (il s'agit d'un index très fin, presque invisible, dans la galerie), puis
sélectionnez-le en cliquant dessus dans la Galerie. Ensuite, cliquez sur le bouton Arrière-plan
dans la Galerie Bitmap. Vous pouvez ensuite supprimer le rectangle original de la page.
Créer vos propres Couleurs nommées
Si vous souhaitez utiliser une couleur plusieurs fois dans un document, vous pouvez créer votre propre
Couleur nommée en cliquant sur l'étiquette Nom en haut de l'Éditeur de couleur. Cette couleur apparaît
désormais dans la Palette de couleurs.
L'avantage d'une Couleur nommée est que si on l'édite plus tard (cliquez sur la couleur puis sélectionnez
Éditer), tous les objets utilisant cette couleur seront également modifiés.
Nuances liées
Vous pouvez créer des nuances plus claires ou plus foncées d'une couleur. Ainsi, lorsque la couleur de
départ est modifiée, toutes les nuances claires et foncées s'adaptent à la nouvelle couleur utilisée. Par
exemple, la nuance dégradée d'un bouton, comme celle-ci :
Il s'agit d'un simple rectangle aux bords arrondis avec
un remplissage dégradé créé avec l'outil de
remplissage. Dans l'outil Remplissage, vous pouvez
cliquer sur l'un des côtés de la flèche pour déterminer
la couleur.
Si vous désignez la principale couleur verte comme Couleur nommée et que vous en créez ensuite une
nuance plus claire ou plus foncée en tant que Nuance liée, lorsque vous éditerez la Couleur nommée, les
nuances changeront également. Ainsi, recolorer des objets aux nuances complexes devient facile.
Pour créer une nuance liée, ouvrez les options supplémentaires de l'Éditeur de couleur puis sélectionnez
le menu déroulant « Couleurs normales » et « Nuance d'une autre couleur
».
Page 44
Cliquez sur ce bouton
pour afficher les couleurs
supplémentaires
Vous pouvez désormais
sélectionner une nuance
plus claire ou plus foncée
d'une couleur mère. La
couleur mère est la
couleur cochée.
Sélectionnez une Nuance
de ce menu déroulant puis
la couleur mère
Vous pouvez également créer une Nuance liée qui apparaît dans la Palette de couleurs (vous pourrez
facilement l'appliquer à d'autres objets). Lorsque vous sélectionnez un nouvel Objet nommé, vous pouvez
choisir d'en faire un lien « Nuance d'une autre couleur ».
Page 45
Couleur d'arrière-plan de page
La plupart des modèles de page de la Galerie des modèles ont deux types d'arrière-plan. Un
arrière-plan de page qui s'étend sur l'ensemble de la fenêtre du navigateur. De plus, il comporte des
éléments de page dessinés, composés généralement de différentes gammes de couleurs.
La Palette de couleur comporte habituellement une couleur nommée « Couleur d'arrière-plan », une autre
appelée « Couleur du panneau ». En les modifiant, vous pouvez contrôler les différentes couleurs
d'arrière-plan. Les autres couleurs sont les couleurs 1,2, etc. du thème.
Définir la couleur d'arrière-plan de la page
Quand vous ouvrez une nouvelle page blanche (Fichier -> Nouveau), la page par défaut qui s'affiche est
blanche. C'est sur cet arrière-plan que vous placerez tous les éléments de votre site Internet.
Pour définir une couleur d'arrière-plan, faites glisser une couleur depuis la Palette de couleurs, maintenez
Ctrl enfoncé et déposez-la sur l'arrière-plan. Dans le navigateur Internet, cette couleur d'arrière-plan
s'affiche sur toute la surface d'arrière-plan de la fenêtre.
Pour définir une couleur de fond, ouvrez l'Éditeur de couleurs (Ctrl+E) et glissez la deuxième couleur
située à droite de la boîte de dialogue. Maintenez la touche Ctrl enfoncée et placez la couleur dans
l'arrière-plan de la page. Lorsque vous modifierez la couleur dans l'Éditeur de couleur, l'arrière-plan sera
modifié simultanément.
Pour mettre en place une texture de fond récurrente, glissez la photo ou
le Bitmap sur le document. Ouvrez la Galerie Bitmap, recherchez la
photo que vous venez de télécharger, cliquez dessus pour la sélectionner
puis cliquez sur le bouton Arrière-plan
de la Galerie.
Créer un arrière-plan dégradé
Pour créer facilement un arrière-plan dégradé, dessinez un rectangle sur la page entière, placez-le en
Page 46
fond et remplissez-le avec une couleur dégradée grâce à l'outil Remplissage, en disposant la couleur
dans l'ensemble du rectangle. (Voir ici
pour plus d'informations sur l'outil Remplissage).
Arrières-plan avancés
Les navigateurs Web n'affichent pas les arrières-plan dégradés sur l'ensemble visible de la fenêtre
(c'est-à-dire comme un véritable arrière-plan HTML) mais ils acceptent les arrières-plan constitués de
fichiers Bitmap répétés et en mosaïque. De cette façon, il est possible de créer un arrière-plan
entièrement dégradé en créant un fichier Bitmap qui sera répété (en mosaïque) sur la page.
En créant une longue bande fine sur la gauche définie en tant qu'arrière-plan, vous obtiendrez un
arrière-plan dégradé sur l'ensemble de la page.
Voici les étapes permettant d'obtenir cet effet ;
1. Dessinez un long rectangle fin. Il doit être aussi long que la fenêtre de n'importe quel navigateur
pour éviter qu'il ne se répète verticalement. Nous vous recommandons d'opter pour une valeur
de 1 000 pixels, une valeur supérieure à celle de votre page. Il sera peut-être nécessaire de faire
un zoom arrière pour dessiner un rectangle de taille suffisante. Il doit être très fin.
2. Assurez-vous que votre rectangle n'a pas de bordure : cliquez sur l'outil Sélection et réglez ce
paramètre. Cliquez sur « Aucune couleur » dans la Palette de couleurs (ou sélectionnez
« Aucune » dans le menu de sélection de la largeur de ligne, dans la barre du haut).
3. Assurez-vous que la largeur du rectangle ne dépasse pas quelques pixels et qu'ils se situent bien
dans les coordonnées X et Y : dans l'outil Sélection, sélectionnez le rectangle, éditez la largeur
(L), appuyez sur Entrer puis éditer les positions X et Y pour que ce soit des nombres entiers.
4. En utilisant l' outil Remplissage, vous pouvez lui donner la couleur dégradée souhaitée : faites-la
simplement glisser dans le rectangle. Assurez-vous que le dégradé soit bien réparti de haut en bas
en ajustant si nécessaire la flèche de remplissage.
Une fois
5. Exportez le rectangle au format PNG. Cliquez sur l'icône « Exporter en PNG ».
exportée, faites glisser l'image sur la page de votre Explorateur de fichiers.
faites défiler jusqu'à ce que vous voyez les images que vous
6. Ouvrez la galerie des Bitmaps,
venez de télécharger (il s'agit d'un index très fin, presque invisible, dans la galerie), puis
sélectionnez-le en cliquant dessus dans la Galerie. Ensuite, cliquez sur le bouton Arrière-plan
dans la Galerie Bitmap. Vous pouvez ensuite supprimer le rectangle original de la page.
Créer vos propres Couleurs nommées
Si vous souhaitez utiliser une couleur plusieurs fois dans un document, vous pouvez créer votre propre
Couleur nommée en cliquant sur l'étiquette Nom en haut de l'Éditeur de couleur. Cette couleur apparaît
désormais dans la Palette de couleurs.
Page 47
L'avantage d'une Couleur nommée est que si on l'édite plus tard (cliquez sur la couleur puis sélectionnez
Éditer), tous les objets utilisant cette couleur seront également modifiés.
Nuances liées
Vous pouvez créer des nuances plus claires ou plus foncées d'une couleur. Ainsi, lorsque la couleur de
départ est modifiée, toutes les nuances claires et foncées s'adaptent à la nouvelle couleur utilisée. Par
exemple, la nuance dégradée d'un bouton, comme celle-ci :
Il s'agit d'un simple rectangle aux bords arrondis avec
un remplissage dégradé créé avec l'outil de
remplissage. Dans l'outil Remplissage, vous pouvez
cliquer sur l'un des côtés de la flèche pour déterminer
la couleur.
Si vous désignez la principale couleur verte comme Couleur nommée et que vous en créez ensuite une
nuance plus claire ou plus foncée en tant que Nuance liée, lorsque vous éditerez la Couleur nommée, les
nuances changeront également. Ainsi, recolorer des objets aux nuances complexes devient facile.
Pour créer une nuance liée, ouvrez les options supplémentaires de l'Éditeur de couleur puis sélectionnez
le menu déroulant « Couleurs normales » et « Nuance d'une autre couleur
».
Cliquez sur ce bouton
pour afficher les couleurs
supplémentaires
Vous pouvez désormais
sélectionner une nuance
plus claire ou plus foncée
d'une couleur mère. La
couleur mère est la
couleur cochée.
Sélectionnez une Nuance
de ce menu déroulant puis
la couleur mère
Vous pouvez également créer une Nuance liée qui apparaît dans la Palette de couleurs (vous pourrez
facilement l'appliquer à d'autres objets). Lorsque vous sélectionnez un nouvel Objet nommé, vous pouvez
choisir d'en faire un lien « Nuance d'une autre couleur ».
Page 48
Créer un arrière-plan dégradé
Pour créer facilement un arrière-plan dégradé, dessinez un rectangle sur la page entière, placez-le en
fond et remplissez-le avec une couleur dégradée grâce à l'outil Remplissage, en disposant la couleur
dans l'ensemble du rectangle. (Voir ici
pour plus d'informations sur l'outil Remplissage).
Arrières-plan avancés
Les navigateurs Web n'affichent pas les arrières-plan dégradés sur l'ensemble visible de la fenêtre
(c'est-à-dire comme un véritable arrière-plan HTML) mais ils acceptent les arrières-plan constitués de
fichiers Bitmap répétés et en mosaïque. De cette façon, il est possible de créer un arrière-plan
entièrement dégradé en créant un fichier Bitmap qui sera répété (en mosaïque) sur la page.
En créant une longue bande fine sur la gauche définie en tant qu'arrière-plan, vous obtiendrez un
arrière-plan dégradé sur l'ensemble de la page.
Voici les étapes permettant d'obtenir cet effet ;
1. Dessinez un long rectangle fin. Il doit être aussi long que la fenêtre de n'importe quel navigateur
pour éviter qu'il ne se répète verticalement. Nous vous recommandons d'opter pour une valeur
de 1 000 pixels, une valeur supérieure à celle de votre page. Il sera peut-être nécessaire de faire
un zoom arrière pour dessiner un rectangle de taille suffisante. Il doit être très fin.
2. Assurez-vous que votre rectangle n'a pas de bordure : cliquez sur l'outil Sélection et réglez ce
paramètre. Cliquez sur « Aucune couleur » dans la Palette de couleurs (ou sélectionnez
« Aucune » dans le menu de sélection de la largeur de ligne, dans la barre du haut).
3. Assurez-vous que la largeur du rectangle ne dépasse pas quelques pixels et qu'ils se situent bien
dans les coordonnées X et Y : dans l'outil Sélection, sélectionnez le rectangle, éditez la largeur
(L), appuyez sur Entrer puis éditer les positions X et Y pour que ce soit des nombres entiers.
4. En utilisant l' outil Remplissage, vous pouvez lui donner la couleur dégradée souhaitée : faites-la
simplement glisser dans le rectangle. Assurez-vous que le dégradé soit bien réparti de haut en bas
en ajustant si nécessaire la flèche de remplissage.
Une fois
5. Exportez le rectangle au format PNG. Cliquez sur l'icône « Exporter en PNG ».
exportée, faites glisser l'image sur la page de votre Explorateur de fichiers.
faites défiler jusqu'à ce que vous voyez les images que vous
6. Ouvrez la galerie des Bitmaps,
venez de télécharger (il s'agit d'un index très fin, presque invisible, dans la galerie), puis
sélectionnez-le en cliquant dessus dans la Galerie. Ensuite, cliquez sur le bouton Arrière-plan
dans la Galerie Bitmap. Vous pouvez ensuite supprimer le rectangle original de la page.
Créer vos propres Couleurs nommées
Page 49
Si vous souhaitez utiliser une couleur plusieurs fois dans un document, vous pouvez créer votre propre
Couleur nommée en cliquant sur l'étiquette Nom en haut de l'Éditeur de couleur. Cette couleur apparaît
désormais dans la Palette de couleurs.
L'avantage d'une Couleur nommée est que si on l'édite plus tard (cliquez sur la couleur puis sélectionnez
Éditer), tous les objets utilisant cette couleur seront également modifiés.
Nuances liées
Vous pouvez créer des nuances plus claires ou plus foncées d'une couleur. Ainsi, lorsque la couleur de
départ est modifiée, toutes les nuances claires et foncées s'adaptent à la nouvelle couleur utilisée. Par
exemple, la nuance dégradée d'un bouton, comme celle-ci :
Il s'agit d'un simple rectangle aux bords arrondis avec
un remplissage dégradé créé avec l'outil de
remplissage. Dans l'outil Remplissage, vous pouvez
cliquer sur l'un des côtés de la flèche pour déterminer
la couleur.
Si vous désignez la principale couleur verte comme Couleur nommée et que vous en créez ensuite une
nuance plus claire ou plus foncée en tant que Nuance liée, lorsque vous éditerez la Couleur nommée, les
nuances changeront également. Ainsi, recolorer des objets aux nuances complexes devient facile.
Pour créer une nuance liée, ouvrez les options supplémentaires de l'Éditeur de couleur puis sélectionnez
le menu déroulant « Couleurs normales » et « Nuance d'une autre couleur
».
Cliquez sur ce bouton
pour afficher les couleurs
supplémentaires
Vous pouvez désormais
sélectionner une nuance
plus claire ou plus foncée
d'une couleur mère. La
couleur mère est la
couleur cochée.
Sélectionnez une Nuance
de ce menu déroulant puis
la couleur mère
Vous pouvez également créer une Nuance liée qui apparaît dans la Palette de couleurs (vous pourrez
facilement l'appliquer à d'autres objets). Lorsque vous sélectionnez un nouvel Objet nommé, vous pouvez
choisir d'en faire un lien « Nuance d'une autre couleur ».
Page 50
Créer vos propres Couleurs nommées
Si vous souhaitez utiliser une couleur plusieurs fois dans un document, vous pouvez créer votre propre
Couleur nommée en cliquant sur l'étiquette Nom en haut de l'Éditeur de couleur. Cette couleur apparaît
désormais dans la Palette de couleurs.
L'avantage d'une Couleur nommée est que si on l'édite plus tard (cliquez sur la couleur puis sélectionnez
Éditer), tous les objets utilisant cette couleur seront également modifiés.
Nuances liées
Vous pouvez créer des nuances plus claires ou plus foncées d'une couleur. Ainsi, lorsque la couleur de
départ est modifiée, toutes les nuances claires et foncées s'adaptent à la nouvelle couleur utilisée. Par
exemple, la nuance dégradée d'un bouton, comme celle-ci :
Il s'agit d'un simple rectangle aux bords arrondis avec
un remplissage dégradé créé avec l'outil de
remplissage. Dans l'outil Remplissage, vous pouvez
cliquer sur l'un des côtés de la flèche pour déterminer
la couleur.
Si vous désignez la principale couleur verte comme Couleur nommée et que vous en créez ensuite une
nuance plus claire ou plus foncée en tant que Nuance liée, lorsque vous éditerez la Couleur nommée, les
nuances changeront également. Ainsi, recolorer des objets aux nuances complexes devient facile.
Pour créer une nuance liée, ouvrez les options supplémentaires de l'Éditeur de couleur puis sélectionnez
le menu déroulant « Couleurs normales » et « Nuance d'une autre couleur
».
Cliquez sur ce bouton
pour afficher les couleurs
supplémentaires
Vous pouvez désormais
sélectionner une nuance
plus claire ou plus foncée
d'une couleur mère. La
couleur mère est la
couleur cochée.
Sélectionnez une Nuance
de ce menu déroulant puis
la couleur mère
Vous pouvez également créer une Nuance liée qui apparaît dans la Palette de couleurs (vous pourrez
facilement l'appliquer à d'autres objets). Lorsque vous sélectionnez un nouvel Objet nommé, vous pouvez
Page 51
choisir d'en faire un lien « Nuance d'une autre couleur ».
Page 52
Nuances liées
Vous pouvez créer des nuances plus claires ou plus foncées d'une couleur. Ainsi, lorsque la couleur de
départ est modifiée, toutes les nuances claires et foncées s'adaptent à la nouvelle couleur utilisée. Par
exemple, la nuance dégradée d'un bouton, comme celle-ci :
Il s'agit d'un simple rectangle aux bords arrondis avec
un remplissage dégradé créé avec l'outil de
remplissage. Dans l'outil Remplissage, vous pouvez
cliquer sur l'un des côtés de la flèche pour déterminer
la couleur.
Si vous désignez la principale couleur verte comme Couleur nommée et que vous en créez ensuite une
nuance plus claire ou plus foncée en tant que Nuance liée, lorsque vous éditerez la Couleur nommée, les
nuances changeront également. Ainsi, recolorer des objets aux nuances complexes devient facile.
Pour créer une nuance liée, ouvrez les options supplémentaires de l'Éditeur de couleur puis sélectionnez
le menu déroulant « Couleurs normales » et « Nuance d'une autre couleur
».
Cliquez sur ce bouton
pour afficher les couleurs
supplémentaires
Vous pouvez désormais
sélectionner une nuance
plus claire ou plus foncée
d'une couleur mère. La
couleur mère est la
couleur cochée.
Sélectionnez une Nuance
de ce menu déroulant puis
la couleur mère
Vous pouvez également créer une Nuance liée qui apparaît dans la Palette de couleurs (vous pourrez
facilement l'appliquer à d'autres objets). Lorsque vous sélectionnez un nouvel Objet nommé, vous pouvez
choisir d'en faire un lien « Nuance d'une autre couleur ».
Page 53
Photos
Vous pouvez remplacer n'importe quelle photo en la faisant glisser de votre Explorateur sur une photo
de Web Designer. Si vous la placez en arrière-plan, elle sera importée et disposée sur la page à l'endroit
où vous l'avez placée. Toutes les photos importées sont affichées en 500 pixels, mais vous pouvez tout à
fait modifier leur taille en utilisant l'outil Sélection.
Faites glisser-déposer votre photo sur une image existante pour la remplacer. Faites-la glisser en
arrière-plan pour l'importer en tant que nouvelle photo
Lorsque vous remplacez une photo existante, l'outil Remplissage est
sélectionné et deux Flèches de remplissage s'affichent aux angles droits
de la photo.
La photo résulte également du remplissage d'une forme. Vous pouvez tirer sur l'image pour la
repositionner ou tirer sur les extrémités des Flèches de remplissage pour redimensionner et faire pivoter
l'image à l'intérieur de sa bordure.
Tirez sur la photo pour la repositionner à l'intérieur de son cadre. Tirez sur les extrémités des flèches pour
la redimensionner et la faire pivoter.
L'outil Photo
L'outil Photo
permet d'améliorer et de découper une photo. Il vous permet de
cliquer sur une photo et d'ajuster les commandes de la Barre d'Infos.
Page 54
Barre d'infos de l'outil Photo avec réglette de luminosité
Pour découper une photo, ouvrez l'outil Photo et tirez sur le cadre de la photo. Vous pouvez ajuster les
angles découpés en tirant sur les poignées de découpage situées à l'extérieur de la photo. Voir la
rubrique Traitement des photos pour plus d'informations sur le traitement avancé des photos dans
Xtreme Web Designer 5 ainsi que la rubrique outil Photo
pour découvrir comment utiliser l'outil Photo.
Photos miniatures avec pop-ups
Vous pouvez très facilement créer des photos miniatures (il suffit de les redimensionner pour qu'elles
soient de taille réduite). De cette façon, cliquer sur l'image vous permettra de voir sa version agrandie. Il
suffit simplement de redimensionner vos photos pour qu'elles soient plus petites.
Sélectionnez la photo miniature puis l'option « Photo pop-up » dans
l'onglet Gauche de la boîte de dialogue Propriétés Web (cliquez sur le
Bouton gauche dans la Barre d'outil Web
).
Vous avez la possibilité d'afficher un sous-titre sous chaque photo pop-up. Il vous suffit de définir la
Description de l'image (texte alternatif) pour la miniature dans l'onglet Image
de la boîte de dialogue des Propriétés Web.
Sous Internet Explorer, la Description de l'image affiche également une infobulle lorsque l'on passe la
souris sur l'image. Pour afficher un texte différent, par exemple « Cliquez pour agrandir » lorsque vous
passez sur la miniature, allez sur l'onglet Survol de souris puis remplacez « Afficher le texte pop-up
» par « Cliquez pour agrandir ».
Résolution des photos : tout est automatique !
Web Designer conserve toujours la résolution complète de l'image. Ainsi, vous pouvez redimensionner
ou découper votre image comme vous le souhaitez sans perdre en qualité. Web Designer convertit
automatiquement toutes les photos en image JPEG avec la bonne résolution lorsque vous sauvegardez
votre site Internet. Ne vous souciez pas des ppp, de la taille de l'image, des pixels ou de quoi que ce soit
d'autre. Ce que vous voyez dans Web Designer (avec un zoom à 100 %) correspond exactement à ce
Page 55
que vous verrez sur votre site.
Si vous souhaitez redimensionner une photo ou un objet à une taille spécifique, il vous suffit de saisir les
mesures dans les champs longueur et largeur de la Barre d'Infos de l'outil Sélection.
Lorsque vous glissez une photo sur la page (en supposant que vous ne remplacez pas une photo
existante), elle est redimensionnée à une largeur de 500 pixels. Si vous souhaitez une largeur de
200 pixels, il vous suffit de saisir 200 pix dans le champ W de l'outil Sélection. Vous pouvez saisir cette
valeur dans différentes unités. Ainsi, 2 in correspond à une largeur de 2 inches (pouces).
Page 56
L'outil Photo
L'outil Photo
permet d'améliorer et de découper une photo. Il vous permet de
cliquer sur une photo et d'ajuster les commandes de la Barre d'Infos.
Barre d'infos de l'outil Photo avec réglette de luminosité
Pour découper une photo, ouvrez l'outil Photo et tirez sur le cadre de la photo. Vous pouvez ajuster les
angles découpés en tirant sur les poignées de découpage situées à l'extérieur de la photo. Voir la
rubrique Traitement des photos pour plus d'informations sur le traitement avancé des photos dans
Xtreme Web Designer 5 ainsi que la rubrique outil Photo
pour découvrir comment utiliser l'outil Photo.
Photos miniatures avec pop-ups
Vous pouvez très facilement créer des photos miniatures (il suffit de les redimensionner pour qu'elles
soient de taille réduite). De cette façon, cliquer sur l'image vous permettra de voir sa version agrandie. Il
suffit simplement de redimensionner vos photos pour qu'elles soient plus petites.
Sélectionnez la photo miniature puis l'option « Photo pop-up » dans
l'onglet Gauche de la boîte de dialogue Propriétés Web (cliquez sur le
Bouton gauche dans la Barre d'outil Web
).
Vous avez la possibilité d'afficher un sous-titre sous chaque photo pop-up. Il vous suffit de définir la
Description de l'image (texte alternatif) pour la miniature dans l'onglet Image
de la boîte de dialogue des Propriétés Web.
Sous Internet Explorer, la Description de l'image affiche également une infobulle lorsque l'on passe la
souris sur l'image. Pour afficher un texte différent, par exemple « Cliquez pour agrandir » lorsque vous
passez sur la miniature, allez sur l'onglet Survol de souris puis remplacez « Afficher le texte pop-up
» par « Cliquez pour agrandir ».
Résolution des photos : tout est automatique !
Page 57
Web Designer conserve toujours la résolution complète de l'image. Ainsi, vous pouvez redimensionner
ou découper votre image comme vous le souhaitez sans perdre en qualité. Web Designer convertit
automatiquement toutes les photos en image JPEG avec la bonne résolution lorsque vous sauvegardez
votre site Internet. Ne vous souciez pas des ppp, de la taille de l'image, des pixels ou de quoi que ce soit
d'autre. Ce que vous voyez dans Web Designer (avec un zoom à 100 %) correspond exactement à ce
que vous verrez sur votre site.
Si vous souhaitez redimensionner une photo ou un objet à une taille spécifique, il vous suffit de saisir les
mesures dans les champs longueur et largeur de la Barre d'Infos de l'outil Sélection.
Lorsque vous glissez une photo sur la page (en supposant que vous ne remplacez pas une photo
existante), elle est redimensionnée à une largeur de 500 pixels. Si vous souhaitez une largeur de
200 pixels, il vous suffit de saisir 200 pix dans le champ W de l'outil Sélection. Vous pouvez saisir cette
valeur dans différentes unités. Ainsi, 2 in correspond à une largeur de 2 inches (pouces).
Page 58
Photos miniatures avec pop-ups
Vous pouvez très facilement créer des photos miniatures (il suffit de les redimensionner pour qu'elles
soient de taille réduite). De cette façon, cliquer sur l'image vous permettra de voir sa version agrandie. Il
suffit simplement de redimensionner vos photos pour qu'elles soient plus petites.
Sélectionnez la photo miniature puis l'option « Photo pop-up » dans
l'onglet Gauche de la boîte de dialogue Propriétés Web (cliquez sur le
Bouton gauche dans la Barre d'outil Web
).
Vous avez la possibilité d'afficher un sous-titre sous chaque photo pop-up. Il vous suffit de définir la
Description de l'image (texte alternatif) pour la miniature dans l'onglet Image
de la boîte de dialogue des Propriétés Web.
Sous Internet Explorer, la Description de l'image affiche également une infobulle lorsque l'on passe la
souris sur l'image. Pour afficher un texte différent, par exemple « Cliquez pour agrandir » lorsque vous
passez sur la miniature, allez sur l'onglet Survol de souris puis remplacez « Afficher le texte pop-up
» par « Cliquez pour agrandir ».
Résolution des photos : tout est automatique !
Web Designer conserve toujours la résolution complète de l'image. Ainsi, vous pouvez redimensionner
ou découper votre image comme vous le souhaitez sans perdre en qualité. Web Designer convertit
automatiquement toutes les photos en image JPEG avec la bonne résolution lorsque vous sauvegardez
votre site Internet. Ne vous souciez pas des ppp, de la taille de l'image, des pixels ou de quoi que ce soit
d'autre. Ce que vous voyez dans Web Designer (avec un zoom à 100 %) correspond exactement à ce
que vous verrez sur votre site.
Si vous souhaitez redimensionner une photo ou un objet à une taille spécifique, il vous suffit de saisir les
mesures dans les champs longueur et largeur de la Barre d'Infos de l'outil Sélection.
Lorsque vous glissez une photo sur la page (en supposant que vous ne remplacez pas une photo
existante), elle est redimensionnée à une largeur de 500 pixels. Si vous souhaitez une largeur de
200 pixels, il vous suffit de saisir 200 pix dans le champ W de l'outil Sélection. Vous pouvez saisir cette
valeur dans différentes unités. Ainsi, 2 in correspond à une largeur de 2 inches (pouces).
Page 59
Résolution des photos : tout est automatique !
Web Designer conserve toujours la résolution complète de l'image. Ainsi, vous pouvez redimensionner
ou découper votre image comme vous le souhaitez sans perdre en qualité. Web Designer convertit
automatiquement toutes les photos en image JPEG avec la bonne résolution lorsque vous sauvegardez
votre site Internet. Ne vous souciez pas des ppp, de la taille de l'image, des pixels ou de quoi que ce soit
d'autre. Ce que vous voyez dans Web Designer (avec un zoom à 100 %) correspond exactement à ce
que vous verrez sur votre site.
Si vous souhaitez redimensionner une photo ou un objet à une taille spécifique, il vous suffit de saisir les
mesures dans les champs longueur et largeur de la Barre d'Infos de l'outil Sélection.
Lorsque vous glissez une photo sur la page (en supposant que vous ne remplacez pas une photo
existante), elle est redimensionnée à une largeur de 500 pixels. Si vous souhaitez une largeur de
200 pixels, il vous suffit de saisir 200 pix dans le champ W de l'outil Sélection. Vous pouvez saisir cette
valeur dans différentes unités. Ainsi, 2 in correspond à une largeur de 2 inches (pouces).
Page 60
Texte
Vous pouvez éditer le texte en sélectionnant l'outil Texte puis en cliquant
sur le texte.
Vous disposez de tous les outils de traitement de texte et vous pouvez coller le texte à partir du
presse-papier du système. Double-cliquez sur un mot pour le sélectionner, faites un triple-clic pour
sélectionner une ligne entière, ce qui peut être utile pour sélectionner un texte entier avec un bouton.
Comme toujours, la Barre d'Infos offre de nombreuses fonctionnalités pour cet outil.
Le menu des polices comprend toutes les polices installées et les classe en trois sections. La section du
haut affiche les polices déjà utilisées dans le document, la seconde affiche les polices « Web safe » et la
section du bas affiche toutes les polices installées sur votre ordinateur.
Les trois sections du menu des polices. Dans cet exemple, Courier New est sélectionné et affiche les
variantes disponibles en gras et en italique, toutes les polices n'ont pas ces variantes.
Le menu des polices permet une visualisation des polices en temps réel. Lorsque vous parcourez le
menu, le texte sélectionné change de police, vous offrant ainsi la possibilité de voir immédiatement le
résultat dans le document.
Taille de la police
Le champ taille de la police affiche la taille de la police en pixels, car c'est la manière la plus fiable de
configurer la taille du texte dans un navigateur Web. Vous pouvez également saisir la taille en points (ou
toute autre unité) en saisissant cette valeur suivie de pt (pour point). Exemple : 72 pt ou 1 in, qui seront
ensuite convertis en pixels.
Polices Web safe
Seul un petit ensemble de polices peut être utilisé en toute sécurité pour le texte principal d'un site
Internet – il s'agit des seules polices dont vous pouvez être sûr qu'elles existent sur l'ordinateur du visiteur.
Bien qu'il n'existe pas de garantie, il existe un sous-ensemble de polices largement utilisées par environ
Page 61
98 % des ordinateurs, y compris des ordinateurs Apple Mac et certains ordinateurs Linux. Ces polices
sont appelées « Polices Web safe » et sont répertoriées dans une section séparée du menu des polices.
Si vous tentez de sauvegarder un site Web en utilisant d'autres polices que les polices Web safe, vous
serez averti.
Si vous transformez un texte en objet graphique, toutes les polices sont utilisables. Voir la rubrique
Groupes
ci-dessous pour plus de détails.
Créer de nouveaux objets textes
Il existe trois types d'objets texte :une seule ligne de texte, une colonne ou une zone de texte
rectangulaire. Pour créer une ligne de texte, sélectionnez l'outil Texte puis cliquez n'importe où sur
l'arrière-plan et commencez à écrire. Pour créer une colonne, cliquez et tirez horizontalement sur
l'arrière-plan puis commencez à écrire. Vous pouvez ajuster la largeur de la colonne à tout moment. Pour
créer une zone de texte, cliquez et tirez en diagonale. Vous pouvez ajuster la largeur et la hauteur d'une
zone de texte.
Texte pivoté
Comme cela est le cas pour les outils de création Internet, vous pouvez faire pivoter des objets texte, y
compris des colonnes en utilisant la fonctionnalité en question dans l'outil Sélection. Cependant, comme
les navigateurs ne supportent pas le texte pivoté, Web Designer le convertit en graphique lorsque la page
est exportée en tant que site Internet.
Ombres douces, texte en couleur, texte transparent
Vous pouvez utiliser tous ces effets avec les bons outils. Par exemple, si vous faites glisser le texte dans
l'outil Remplissage, vous obtiendrez une couleur dégradée. Si vous le glissez dans l'outil Ombre, le texte
aura une ombre douce.
Dans tous les cas, Web Designer convertira automatiquement le texte en image lors de l'exportation de
votre site Internet.
Renvoyer du texte autour des objets
Si vous cliquez sur un objet, comme une photo, puis que vous sélectionnez l'option du menu « Renvoyer
texte sous...
», vous pouvez insérer du texte autour de l'objet situé au-dessus.
La plupart des objets, comme les photos, les panneaux de côté, les boutons et les titres utilisés dans les
modèles de conception de la Galerie des modèles renvoient automatiquement le texte sur les côtés
lorsque vous les faites glisser. Ces objets ne renvoient que le texte situé derrière l'objet, il est donc
possible que vous deviez « ramener devant » l'objet pour que le renvoi fonctionne (Ctrl+F).
Toutes les manipulations effectuées dans l'outil Texte sont réalisées en temps réel, le texte prend un
nouveau format et une nouvelle disposition lorsque vous modifiez la largeur de la colonne ou lorsque vous
déplacez un objet.
Panneaux de texte
De la même façon que certains boutons de la Galerie de modèles s'étendent pour s'adapter au texte,
certains panneaux de texte peuvent s'adapter à la largeur ou à la longueur du texte saisi.
Page 62
L'arrière-plan du panneau s'adapte à des blocs de texte plus longs ou plus larges.
Vous pouvez ajuster la largeur d'une colonne de texte en allant dans l'outil Texte puis en tirant sur les
poignées de largeur de la colonne (sous la première ligne de texte). La plupart des modèles de
conception de la Galerie des modèles proposent des panneaux de texte en accord avec le modèle.
Certains panneaux de texte s'étirent seulement verticalement, d'autres verticalement et horizontalement.
Pour créer votre propre bouton ou panneau de texte extensible, utilisez l'un des modèles de la Galerie et
adaptez-le en recolorant l'arrière-plan ou en ajustant la couleur/la taille/la largeur du texte.
Remarque : Vous pouvez créer de nouveaux éléments extensibles en utilisant Xara Xtreme Pro.
Correcteur orthographique
Dans la Barre d'infos de l'outil Texte se trouve un bouton qui permet de
sélectionner les options du correcteur orthographique et la langue. Si
vous sélectionnez « Vérifier l'orthographe au cours de la frappe », tous
les termes inconnus seront soulignés par des pointillés rouges. Faites un
clic droit sur le mot souligné pour voir les suggestions.
Polices incrustées
Web Designer enregistre les formes des caractères de toutes les polices utilisées dans votre document.
Cela signifie que si vous donnez à quelqu'un d'autre votre fichier Web, ou si vous transférez le fichier sur
un autre ordinateur, le texte apparaîtra parfaitement, même si les polices correctes ne sont pas installées
sur cet ordinateur. Cette option n'incruste que les caractères d'une police qui sont utilisés dans le
document (la police n'est pas incluse en entier). Ainsi, sur les ordinateurs ne comportant pas les polices,
le texte ajouté dans la police manquante ne présentera éventuellement pas les formes de caractère
correctes.
Astuce : De nombreux raccourcis sont disponibles dans l'outil Texte. Reportez-vous à la rubrique
relative aux raccourcis clavier
pour les voir. Par exemple, pour visionner la mise en page des pages Web, vous pouvez utiliser le
raccourci Ctrl+Maj+L, qui vous permet d'insérer un bloc de texte factice ressemblant à du latin.
Page 63
Taille de la police
Le champ taille de la police affiche la taille de la police en pixels, car c'est la manière la plus fiable de
configurer la taille du texte dans un navigateur Web. Vous pouvez également saisir la taille en points (ou
toute autre unité) en saisissant cette valeur suivie de pt (pour point). Exemple : 72 pt ou 1 in, qui seront
ensuite convertis en pixels.
Polices Web safe
Seul un petit ensemble de polices peut être utilisé en toute sécurité pour le texte principal d'un site
Internet – il s'agit des seules polices dont vous pouvez être sûr qu'elles existent sur l'ordinateur du visiteur.
Bien qu'il n'existe pas de garantie, il existe un sous-ensemble de polices largement utilisées par environ
98 % des ordinateurs, y compris des ordinateurs Apple Mac et certains ordinateurs Linux. Ces polices
sont appelées « Polices Web safe » et sont répertoriées dans une section séparée du menu des polices.
Si vous tentez de sauvegarder un site Web en utilisant d'autres polices que les polices Web safe, vous
serez averti.
Si vous transformez un texte en objet graphique, toutes les polices sont utilisables. Voir la rubrique
Groupes
ci-dessous pour plus de détails.
Créer de nouveaux objets textes
Il existe trois types d'objets texte :une seule ligne de texte, une colonne ou une zone de texte
rectangulaire. Pour créer une ligne de texte, sélectionnez l'outil Texte puis cliquez n'importe où sur
l'arrière-plan et commencez à écrire. Pour créer une colonne, cliquez et tirez horizontalement sur
l'arrière-plan puis commencez à écrire. Vous pouvez ajuster la largeur de la colonne à tout moment. Pour
créer une zone de texte, cliquez et tirez en diagonale. Vous pouvez ajuster la largeur et la hauteur d'une
zone de texte.
Texte pivoté
Comme cela est le cas pour les outils de création Internet, vous pouvez faire pivoter des objets texte, y
compris des colonnes en utilisant la fonctionnalité en question dans l'outil Sélection. Cependant, comme
les navigateurs ne supportent pas le texte pivoté, Web Designer le convertit en graphique lorsque la page
est exportée en tant que site Internet.
Ombres douces, texte en couleur, texte transparent
Vous pouvez utiliser tous ces effets avec les bons outils. Par exemple, si vous faites glisser le texte dans
l'outil Remplissage, vous obtiendrez une couleur dégradée. Si vous le glissez dans l'outil Ombre, le texte
aura une ombre douce.
Dans tous les cas, Web Designer convertira automatiquement le texte en image lors de l'exportation de
votre site Internet.
Renvoyer du texte autour des objets
Si vous cliquez sur un objet, comme une photo, puis que vous sélectionnez l'option du menu « Renvoyer
texte sous...
», vous pouvez insérer du texte autour de l'objet situé au-dessus.
La plupart des objets, comme les photos, les panneaux de côté, les boutons et les titres utilisés dans les
modèles de conception de la Galerie des modèles renvoient automatiquement le texte sur les côtés
lorsque vous les faites glisser. Ces objets ne renvoient que le texte situé derrière l'objet, il est donc
possible que vous deviez « ramener devant » l'objet pour que le renvoi fonctionne (Ctrl+F).
Page 64
Toutes les manipulations effectuées dans l'outil Texte sont réalisées en temps réel, le texte prend un
nouveau format et une nouvelle disposition lorsque vous modifiez la largeur de la colonne ou lorsque vous
déplacez un objet.
Panneaux de texte
De la même façon que certains boutons de la Galerie de modèles s'étendent pour s'adapter au texte,
certains panneaux de texte peuvent s'adapter à la largeur ou à la longueur du texte saisi.
L'arrière-plan du panneau s'adapte à des blocs de texte plus longs ou plus larges.
Vous pouvez ajuster la largeur d'une colonne de texte en allant dans l'outil Texte puis en tirant sur les
poignées de largeur de la colonne (sous la première ligne de texte). La plupart des modèles de
conception de la Galerie des modèles proposent des panneaux de texte en accord avec le modèle.
Certains panneaux de texte s'étirent seulement verticalement, d'autres verticalement et horizontalement.
Pour créer votre propre bouton ou panneau de texte extensible, utilisez l'un des modèles de la Galerie et
adaptez-le en recolorant l'arrière-plan ou en ajustant la couleur/la taille/la largeur du texte.
Remarque : Vous pouvez créer de nouveaux éléments extensibles en utilisant Xara Xtreme Pro.
Correcteur orthographique
Dans la Barre d'infos de l'outil Texte se trouve un bouton qui permet de
sélectionner les options du correcteur orthographique et la langue. Si
vous sélectionnez « Vérifier l'orthographe au cours de la frappe », tous
les termes inconnus seront soulignés par des pointillés rouges. Faites un
clic droit sur le mot souligné pour voir les suggestions.
Polices incrustées
Web Designer enregistre les formes des caractères de toutes les polices utilisées dans votre document.
Cela signifie que si vous donnez à quelqu'un d'autre votre fichier Web, ou si vous transférez le fichier sur
un autre ordinateur, le texte apparaîtra parfaitement, même si les polices correctes ne sont pas installées
sur cet ordinateur. Cette option n'incruste que les caractères d'une police qui sont utilisés dans le
document (la police n'est pas incluse en entier). Ainsi, sur les ordinateurs ne comportant pas les polices,
le texte ajouté dans la police manquante ne présentera éventuellement pas les formes de caractère
correctes.
Astuce : De nombreux raccourcis sont disponibles dans l'outil Texte. Reportez-vous à la rubrique
relative aux raccourcis clavier
pour les voir. Par exemple, pour visionner la mise en page des pages Web, vous pouvez utiliser le
raccourci Ctrl+Maj+L, qui vous permet d'insérer un bloc de texte factice ressemblant à du latin.
Page 65
Polices Web safe
Seul un petit ensemble de polices peut être utilisé en toute sécurité pour le texte principal d'un site
Internet – il s'agit des seules polices dont vous pouvez être sûr qu'elles existent sur l'ordinateur du visiteur.
Bien qu'il n'existe pas de garantie, il existe un sous-ensemble de polices largement utilisées par environ
98 % des ordinateurs, y compris des ordinateurs Apple Mac et certains ordinateurs Linux. Ces polices
sont appelées « Polices Web safe » et sont répertoriées dans une section séparée du menu des polices.
Si vous tentez de sauvegarder un site Web en utilisant d'autres polices que les polices Web safe, vous
serez averti.
Si vous transformez un texte en objet graphique, toutes les polices sont utilisables. Voir la rubrique
Groupes
ci-dessous pour plus de détails.
Créer de nouveaux objets textes
Il existe trois types d'objets texte :une seule ligne de texte, une colonne ou une zone de texte
rectangulaire. Pour créer une ligne de texte, sélectionnez l'outil Texte puis cliquez n'importe où sur
l'arrière-plan et commencez à écrire. Pour créer une colonne, cliquez et tirez horizontalement sur
l'arrière-plan puis commencez à écrire. Vous pouvez ajuster la largeur de la colonne à tout moment. Pour
créer une zone de texte, cliquez et tirez en diagonale. Vous pouvez ajuster la largeur et la hauteur d'une
zone de texte.
Texte pivoté
Comme cela est le cas pour les outils de création Internet, vous pouvez faire pivoter des objets texte, y
compris des colonnes en utilisant la fonctionnalité en question dans l'outil Sélection. Cependant, comme
les navigateurs ne supportent pas le texte pivoté, Web Designer le convertit en graphique lorsque la page
est exportée en tant que site Internet.
Ombres douces, texte en couleur, texte transparent
Vous pouvez utiliser tous ces effets avec les bons outils. Par exemple, si vous faites glisser le texte dans
l'outil Remplissage, vous obtiendrez une couleur dégradée. Si vous le glissez dans l'outil Ombre, le texte
aura une ombre douce.
Dans tous les cas, Web Designer convertira automatiquement le texte en image lors de l'exportation de
votre site Internet.
Renvoyer du texte autour des objets
Si vous cliquez sur un objet, comme une photo, puis que vous sélectionnez l'option du menu « Renvoyer
texte sous...
», vous pouvez insérer du texte autour de l'objet situé au-dessus.
La plupart des objets, comme les photos, les panneaux de côté, les boutons et les titres utilisés dans les
modèles de conception de la Galerie des modèles renvoient automatiquement le texte sur les côtés
lorsque vous les faites glisser. Ces objets ne renvoient que le texte situé derrière l'objet, il est donc
possible que vous deviez « ramener devant » l'objet pour que le renvoi fonctionne (Ctrl+F).
Toutes les manipulations effectuées dans l'outil Texte sont réalisées en temps réel, le texte prend un
nouveau format et une nouvelle disposition lorsque vous modifiez la largeur de la colonne ou lorsque vous
déplacez un objet.
Panneaux de texte
De la même façon que certains boutons de la Galerie de modèles s'étendent pour s'adapter au texte,
Page 66
certains panneaux de texte peuvent s'adapter à la largeur ou à la longueur du texte saisi.
L'arrière-plan du panneau s'adapte à des blocs de texte plus longs ou plus larges.
Vous pouvez ajuster la largeur d'une colonne de texte en allant dans l'outil Texte puis en tirant sur les
poignées de largeur de la colonne (sous la première ligne de texte). La plupart des modèles de
conception de la Galerie des modèles proposent des panneaux de texte en accord avec le modèle.
Certains panneaux de texte s'étirent seulement verticalement, d'autres verticalement et horizontalement.
Pour créer votre propre bouton ou panneau de texte extensible, utilisez l'un des modèles de la Galerie et
adaptez-le en recolorant l'arrière-plan ou en ajustant la couleur/la taille/la largeur du texte.
Remarque : Vous pouvez créer de nouveaux éléments extensibles en utilisant Xara Xtreme Pro.
Correcteur orthographique
Dans la Barre d'infos de l'outil Texte se trouve un bouton qui permet de
sélectionner les options du correcteur orthographique et la langue. Si
vous sélectionnez « Vérifier l'orthographe au cours de la frappe », tous
les termes inconnus seront soulignés par des pointillés rouges. Faites un
clic droit sur le mot souligné pour voir les suggestions.
Polices incrustées
Web Designer enregistre les formes des caractères de toutes les polices utilisées dans votre document.
Cela signifie que si vous donnez à quelqu'un d'autre votre fichier Web, ou si vous transférez le fichier sur
un autre ordinateur, le texte apparaîtra parfaitement, même si les polices correctes ne sont pas installées
sur cet ordinateur. Cette option n'incruste que les caractères d'une police qui sont utilisés dans le
document (la police n'est pas incluse en entier). Ainsi, sur les ordinateurs ne comportant pas les polices,
le texte ajouté dans la police manquante ne présentera éventuellement pas les formes de caractère
correctes.
Astuce : De nombreux raccourcis sont disponibles dans l'outil Texte. Reportez-vous à la rubrique
relative aux raccourcis clavier
pour les voir. Par exemple, pour visionner la mise en page des pages Web, vous pouvez utiliser le
raccourci Ctrl+Maj+L, qui vous permet d'insérer un bloc de texte factice ressemblant à du latin.
Page 67
Créer de nouveaux objets textes
Il existe trois types d'objets texte :une seule ligne de texte, une colonne ou une zone de texte
rectangulaire. Pour créer une ligne de texte, sélectionnez l'outil Texte puis cliquez n'importe où sur
l'arrière-plan et commencez à écrire. Pour créer une colonne, cliquez et tirez horizontalement sur
l'arrière-plan puis commencez à écrire. Vous pouvez ajuster la largeur de la colonne à tout moment. Pour
créer une zone de texte, cliquez et tirez en diagonale. Vous pouvez ajuster la largeur et la hauteur d'une
zone de texte.
Texte pivoté
Comme cela est le cas pour les outils de création Internet, vous pouvez faire pivoter des objets texte, y
compris des colonnes en utilisant la fonctionnalité en question dans l'outil Sélection. Cependant, comme
les navigateurs ne supportent pas le texte pivoté, Web Designer le convertit en graphique lorsque la page
est exportée en tant que site Internet.
Ombres douces, texte en couleur, texte transparent
Vous pouvez utiliser tous ces effets avec les bons outils. Par exemple, si vous faites glisser le texte dans
l'outil Remplissage, vous obtiendrez une couleur dégradée. Si vous le glissez dans l'outil Ombre, le texte
aura une ombre douce.
Dans tous les cas, Web Designer convertira automatiquement le texte en image lors de l'exportation de
votre site Internet.
Renvoyer du texte autour des objets
Si vous cliquez sur un objet, comme une photo, puis que vous sélectionnez l'option du menu « Renvoyer
texte sous...
», vous pouvez insérer du texte autour de l'objet situé au-dessus.
La plupart des objets, comme les photos, les panneaux de côté, les boutons et les titres utilisés dans les
modèles de conception de la Galerie des modèles renvoient automatiquement le texte sur les côtés
lorsque vous les faites glisser. Ces objets ne renvoient que le texte situé derrière l'objet, il est donc
possible que vous deviez « ramener devant » l'objet pour que le renvoi fonctionne (Ctrl+F).
Toutes les manipulations effectuées dans l'outil Texte sont réalisées en temps réel, le texte prend un
nouveau format et une nouvelle disposition lorsque vous modifiez la largeur de la colonne ou lorsque vous
déplacez un objet.
Panneaux de texte
De la même façon que certains boutons de la Galerie de modèles s'étendent pour s'adapter au texte,
certains panneaux de texte peuvent s'adapter à la largeur ou à la longueur du texte saisi.
L'arrière-plan du panneau s'adapte à des blocs de texte plus longs ou plus larges.
Vous pouvez ajuster la largeur d'une colonne de texte en allant dans l'outil Texte puis en tirant sur les
poignées de largeur de la colonne (sous la première ligne de texte). La plupart des modèles de
Page 68
conception de la Galerie des modèles proposent des panneaux de texte en accord avec le modèle.
Certains panneaux de texte s'étirent seulement verticalement, d'autres verticalement et horizontalement.
Pour créer votre propre bouton ou panneau de texte extensible, utilisez l'un des modèles de la Galerie et
adaptez-le en recolorant l'arrière-plan ou en ajustant la couleur/la taille/la largeur du texte.
Remarque : Vous pouvez créer de nouveaux éléments extensibles en utilisant Xara Xtreme Pro.
Correcteur orthographique
Dans la Barre d'infos de l'outil Texte se trouve un bouton qui permet de
sélectionner les options du correcteur orthographique et la langue. Si
vous sélectionnez « Vérifier l'orthographe au cours de la frappe », tous
les termes inconnus seront soulignés par des pointillés rouges. Faites un
clic droit sur le mot souligné pour voir les suggestions.
Polices incrustées
Web Designer enregistre les formes des caractères de toutes les polices utilisées dans votre document.
Cela signifie que si vous donnez à quelqu'un d'autre votre fichier Web, ou si vous transférez le fichier sur
un autre ordinateur, le texte apparaîtra parfaitement, même si les polices correctes ne sont pas installées
sur cet ordinateur. Cette option n'incruste que les caractères d'une police qui sont utilisés dans le
document (la police n'est pas incluse en entier). Ainsi, sur les ordinateurs ne comportant pas les polices,
le texte ajouté dans la police manquante ne présentera éventuellement pas les formes de caractère
correctes.
Astuce : De nombreux raccourcis sont disponibles dans l'outil Texte. Reportez-vous à la rubrique
relative aux raccourcis clavier
pour les voir. Par exemple, pour visionner la mise en page des pages Web, vous pouvez utiliser le
raccourci Ctrl+Maj+L, qui vous permet d'insérer un bloc de texte factice ressemblant à du latin.
Page 69
Texte pivoté
Comme cela est le cas pour les outils de création Internet, vous pouvez faire pivoter des objets texte, y
compris des colonnes en utilisant la fonctionnalité en question dans l'outil Sélection. Cependant, comme
les navigateurs ne supportent pas le texte pivoté, Web Designer le convertit en graphique lorsque la page
est exportée en tant que site Internet.
Ombres douces, texte en couleur, texte transparent
Vous pouvez utiliser tous ces effets avec les bons outils. Par exemple, si vous faites glisser le texte dans
l'outil Remplissage, vous obtiendrez une couleur dégradée. Si vous le glissez dans l'outil Ombre, le texte
aura une ombre douce.
Dans tous les cas, Web Designer convertira automatiquement le texte en image lors de l'exportation de
votre site Internet.
Renvoyer du texte autour des objets
Si vous cliquez sur un objet, comme une photo, puis que vous sélectionnez l'option du menu « Renvoyer
texte sous...
», vous pouvez insérer du texte autour de l'objet situé au-dessus.
La plupart des objets, comme les photos, les panneaux de côté, les boutons et les titres utilisés dans les
modèles de conception de la Galerie des modèles renvoient automatiquement le texte sur les côtés
lorsque vous les faites glisser. Ces objets ne renvoient que le texte situé derrière l'objet, il est donc
possible que vous deviez « ramener devant » l'objet pour que le renvoi fonctionne (Ctrl+F).
Toutes les manipulations effectuées dans l'outil Texte sont réalisées en temps réel, le texte prend un
nouveau format et une nouvelle disposition lorsque vous modifiez la largeur de la colonne ou lorsque vous
déplacez un objet.
Panneaux de texte
De la même façon que certains boutons de la Galerie de modèles s'étendent pour s'adapter au texte,
certains panneaux de texte peuvent s'adapter à la largeur ou à la longueur du texte saisi.
L'arrière-plan du panneau s'adapte à des blocs de texte plus longs ou plus larges.
Vous pouvez ajuster la largeur d'une colonne de texte en allant dans l'outil Texte puis en tirant sur les
poignées de largeur de la colonne (sous la première ligne de texte). La plupart des modèles de
conception de la Galerie des modèles proposent des panneaux de texte en accord avec le modèle.
Certains panneaux de texte s'étirent seulement verticalement, d'autres verticalement et horizontalement.
Pour créer votre propre bouton ou panneau de texte extensible, utilisez l'un des modèles de la Galerie et
adaptez-le en recolorant l'arrière-plan ou en ajustant la couleur/la taille/la largeur du texte.
Remarque : Vous pouvez créer de nouveaux éléments extensibles en utilisant Xara Xtreme Pro.
Correcteur orthographique
Dans la Barre d'infos de l'outil Texte se trouve un bouton qui permet de
Page 70
sélectionner les options du correcteur orthographique et la langue. Si
vous sélectionnez « Vérifier l'orthographe au cours de la frappe », tous
les termes inconnus seront soulignés par des pointillés rouges. Faites un
clic droit sur le mot souligné pour voir les suggestions.
Polices incrustées
Web Designer enregistre les formes des caractères de toutes les polices utilisées dans votre document.
Cela signifie que si vous donnez à quelqu'un d'autre votre fichier Web, ou si vous transférez le fichier sur
un autre ordinateur, le texte apparaîtra parfaitement, même si les polices correctes ne sont pas installées
sur cet ordinateur. Cette option n'incruste que les caractères d'une police qui sont utilisés dans le
document (la police n'est pas incluse en entier). Ainsi, sur les ordinateurs ne comportant pas les polices,
le texte ajouté dans la police manquante ne présentera éventuellement pas les formes de caractère
correctes.
Astuce : De nombreux raccourcis sont disponibles dans l'outil Texte. Reportez-vous à la rubrique
relative aux raccourcis clavier
pour les voir. Par exemple, pour visionner la mise en page des pages Web, vous pouvez utiliser le
raccourci Ctrl+Maj+L, qui vous permet d'insérer un bloc de texte factice ressemblant à du latin.
Page 71
Ombres douces, texte en couleur, texte transparent
Vous pouvez utiliser tous ces effets avec les bons outils. Par exemple, si vous faites glisser le texte dans
l'outil Remplissage, vous obtiendrez une couleur dégradée. Si vous le glissez dans l'outil Ombre, le texte
aura une ombre douce.
Dans tous les cas, Web Designer convertira automatiquement le texte en image lors de l'exportation de
votre site Internet.
Renvoyer du texte autour des objets
Si vous cliquez sur un objet, comme une photo, puis que vous sélectionnez l'option du menu « Renvoyer
texte sous...
», vous pouvez insérer du texte autour de l'objet situé au-dessus.
La plupart des objets, comme les photos, les panneaux de côté, les boutons et les titres utilisés dans les
modèles de conception de la Galerie des modèles renvoient automatiquement le texte sur les côtés
lorsque vous les faites glisser. Ces objets ne renvoient que le texte situé derrière l'objet, il est donc
possible que vous deviez « ramener devant » l'objet pour que le renvoi fonctionne (Ctrl+F).
Toutes les manipulations effectuées dans l'outil Texte sont réalisées en temps réel, le texte prend un
nouveau format et une nouvelle disposition lorsque vous modifiez la largeur de la colonne ou lorsque vous
déplacez un objet.
Panneaux de texte
De la même façon que certains boutons de la Galerie de modèles s'étendent pour s'adapter au texte,
certains panneaux de texte peuvent s'adapter à la largeur ou à la longueur du texte saisi.
L'arrière-plan du panneau s'adapte à des blocs de texte plus longs ou plus larges.
Vous pouvez ajuster la largeur d'une colonne de texte en allant dans l'outil Texte puis en tirant sur les
poignées de largeur de la colonne (sous la première ligne de texte). La plupart des modèles de
conception de la Galerie des modèles proposent des panneaux de texte en accord avec le modèle.
Certains panneaux de texte s'étirent seulement verticalement, d'autres verticalement et horizontalement.
Pour créer votre propre bouton ou panneau de texte extensible, utilisez l'un des modèles de la Galerie et
adaptez-le en recolorant l'arrière-plan ou en ajustant la couleur/la taille/la largeur du texte.
Remarque : Vous pouvez créer de nouveaux éléments extensibles en utilisant Xara Xtreme Pro.
Correcteur orthographique
Dans la Barre d'infos de l'outil Texte se trouve un bouton qui permet de
sélectionner les options du correcteur orthographique et la langue. Si
vous sélectionnez « Vérifier l'orthographe au cours de la frappe », tous
les termes inconnus seront soulignés par des pointillés rouges. Faites un
clic droit sur le mot souligné pour voir les suggestions.
Polices incrustées
Page 72
Web Designer enregistre les formes des caractères de toutes les polices utilisées dans votre document.
Cela signifie que si vous donnez à quelqu'un d'autre votre fichier Web, ou si vous transférez le fichier sur
un autre ordinateur, le texte apparaîtra parfaitement, même si les polices correctes ne sont pas installées
sur cet ordinateur. Cette option n'incruste que les caractères d'une police qui sont utilisés dans le
document (la police n'est pas incluse en entier). Ainsi, sur les ordinateurs ne comportant pas les polices,
le texte ajouté dans la police manquante ne présentera éventuellement pas les formes de caractère
correctes.
Astuce : De nombreux raccourcis sont disponibles dans l'outil Texte. Reportez-vous à la rubrique
relative aux raccourcis clavier
pour les voir. Par exemple, pour visionner la mise en page des pages Web, vous pouvez utiliser le
raccourci Ctrl+Maj+L, qui vous permet d'insérer un bloc de texte factice ressemblant à du latin.
Page 73
Renvoyer du texte autour des objets
Si vous cliquez sur un objet, comme une photo, puis que vous sélectionnez l'option du menu « Renvoyer
texte sous...
», vous pouvez insérer du texte autour de l'objet situé au-dessus.
La plupart des objets, comme les photos, les panneaux de côté, les boutons et les titres utilisés dans les
modèles de conception de la Galerie des modèles renvoient automatiquement le texte sur les côtés
lorsque vous les faites glisser. Ces objets ne renvoient que le texte situé derrière l'objet, il est donc
possible que vous deviez « ramener devant » l'objet pour que le renvoi fonctionne (Ctrl+F).
Toutes les manipulations effectuées dans l'outil Texte sont réalisées en temps réel, le texte prend un
nouveau format et une nouvelle disposition lorsque vous modifiez la largeur de la colonne ou lorsque vous
déplacez un objet.
Panneaux de texte
De la même façon que certains boutons de la Galerie de modèles s'étendent pour s'adapter au texte,
certains panneaux de texte peuvent s'adapter à la largeur ou à la longueur du texte saisi.
L'arrière-plan du panneau s'adapte à des blocs de texte plus longs ou plus larges.
Vous pouvez ajuster la largeur d'une colonne de texte en allant dans l'outil Texte puis en tirant sur les
poignées de largeur de la colonne (sous la première ligne de texte). La plupart des modèles de
conception de la Galerie des modèles proposent des panneaux de texte en accord avec le modèle.
Certains panneaux de texte s'étirent seulement verticalement, d'autres verticalement et horizontalement.
Pour créer votre propre bouton ou panneau de texte extensible, utilisez l'un des modèles de la Galerie et
adaptez-le en recolorant l'arrière-plan ou en ajustant la couleur/la taille/la largeur du texte.
Remarque : Vous pouvez créer de nouveaux éléments extensibles en utilisant Xara Xtreme Pro.
Correcteur orthographique
Dans la Barre d'infos de l'outil Texte se trouve un bouton qui permet de
sélectionner les options du correcteur orthographique et la langue. Si
vous sélectionnez « Vérifier l'orthographe au cours de la frappe », tous
les termes inconnus seront soulignés par des pointillés rouges. Faites un
clic droit sur le mot souligné pour voir les suggestions.
Polices incrustées
Web Designer enregistre les formes des caractères de toutes les polices utilisées dans votre document.
Cela signifie que si vous donnez à quelqu'un d'autre votre fichier Web, ou si vous transférez le fichier sur
un autre ordinateur, le texte apparaîtra parfaitement, même si les polices correctes ne sont pas installées
sur cet ordinateur. Cette option n'incruste que les caractères d'une police qui sont utilisés dans le
document (la police n'est pas incluse en entier). Ainsi, sur les ordinateurs ne comportant pas les polices,
le texte ajouté dans la police manquante ne présentera éventuellement pas les formes de caractère
correctes.
Page 74
Astuce : De nombreux raccourcis sont disponibles dans l'outil Texte. Reportez-vous à la rubrique
relative aux raccourcis clavier
pour les voir. Par exemple, pour visionner la mise en page des pages Web, vous pouvez utiliser le
raccourci Ctrl+Maj+L, qui vous permet d'insérer un bloc de texte factice ressemblant à du latin.
Page 75
Panneaux de texte
De la même façon que certains boutons de la Galerie de modèles s'étendent pour s'adapter au texte,
certains panneaux de texte peuvent s'adapter à la largeur ou à la longueur du texte saisi.
L'arrière-plan du panneau s'adapte à des blocs de texte plus longs ou plus larges.
Vous pouvez ajuster la largeur d'une colonne de texte en allant dans l'outil Texte puis en tirant sur les
poignées de largeur de la colonne (sous la première ligne de texte). La plupart des modèles de
conception de la Galerie des modèles proposent des panneaux de texte en accord avec le modèle.
Certains panneaux de texte s'étirent seulement verticalement, d'autres verticalement et horizontalement.
Pour créer votre propre bouton ou panneau de texte extensible, utilisez l'un des modèles de la Galerie et
adaptez-le en recolorant l'arrière-plan ou en ajustant la couleur/la taille/la largeur du texte.
Remarque : Vous pouvez créer de nouveaux éléments extensibles en utilisant Xara Xtreme Pro.
Correcteur orthographique
Dans la Barre d'infos de l'outil Texte se trouve un bouton qui permet de
sélectionner les options du correcteur orthographique et la langue. Si
vous sélectionnez « Vérifier l'orthographe au cours de la frappe », tous
les termes inconnus seront soulignés par des pointillés rouges. Faites un
clic droit sur le mot souligné pour voir les suggestions.
Polices incrustées
Web Designer enregistre les formes des caractères de toutes les polices utilisées dans votre document.
Cela signifie que si vous donnez à quelqu'un d'autre votre fichier Web, ou si vous transférez le fichier sur
un autre ordinateur, le texte apparaîtra parfaitement, même si les polices correctes ne sont pas installées
sur cet ordinateur. Cette option n'incruste que les caractères d'une police qui sont utilisés dans le
document (la police n'est pas incluse en entier). Ainsi, sur les ordinateurs ne comportant pas les polices,
le texte ajouté dans la police manquante ne présentera éventuellement pas les formes de caractère
correctes.
Astuce : De nombreux raccourcis sont disponibles dans l'outil Texte. Reportez-vous à la rubrique
relative aux raccourcis clavier
pour les voir. Par exemple, pour visionner la mise en page des pages Web, vous pouvez utiliser le
raccourci Ctrl+Maj+L, qui vous permet d'insérer un bloc de texte factice ressemblant à du latin.
Page 76
Correcteur orthographique
Dans la Barre d'infos de l'outil Texte se trouve un bouton qui permet de
sélectionner les options du correcteur orthographique et la langue. Si
vous sélectionnez « Vérifier l'orthographe au cours de la frappe », tous
les termes inconnus seront soulignés par des pointillés rouges. Faites un
clic droit sur le mot souligné pour voir les suggestions.
Polices incrustées
Web Designer enregistre les formes des caractères de toutes les polices utilisées dans votre document.
Cela signifie que si vous donnez à quelqu'un d'autre votre fichier Web, ou si vous transférez le fichier sur
un autre ordinateur, le texte apparaîtra parfaitement, même si les polices correctes ne sont pas installées
sur cet ordinateur. Cette option n'incruste que les caractères d'une police qui sont utilisés dans le
document (la police n'est pas incluse en entier). Ainsi, sur les ordinateurs ne comportant pas les polices,
le texte ajouté dans la police manquante ne présentera éventuellement pas les formes de caractère
correctes.
Astuce : De nombreux raccourcis sont disponibles dans l'outil Texte. Reportez-vous à la rubrique
relative aux raccourcis clavier
pour les voir. Par exemple, pour visionner la mise en page des pages Web, vous pouvez utiliser le
raccourci Ctrl+Maj+L, qui vous permet d'insérer un bloc de texte factice ressemblant à du latin.
Page 77
Polices incrustées
Web Designer enregistre les formes des caractères de toutes les polices utilisées dans votre document.
Cela signifie que si vous donnez à quelqu'un d'autre votre fichier Web, ou si vous transférez le fichier sur
un autre ordinateur, le texte apparaîtra parfaitement, même si les polices correctes ne sont pas installées
sur cet ordinateur. Cette option n'incruste que les caractères d'une police qui sont utilisés dans le
document (la police n'est pas incluse en entier). Ainsi, sur les ordinateurs ne comportant pas les polices,
le texte ajouté dans la police manquante ne présentera éventuellement pas les formes de caractère
correctes.
Astuce : De nombreux raccourcis sont disponibles dans l'outil Texte. Reportez-vous à la rubrique
relative aux raccourcis clavier
pour les voir. Par exemple, pour visionner la mise en page des pages Web, vous pouvez utiliser le
raccourci Ctrl+Maj+L, qui vous permet d'insérer un bloc de texte factice ressemblant à du latin.
Page 78
Taille de la page
Les pages de la Galerie des modèles ont une largeur prévue pour s'adapter à la majorité des écrans
d'ordinateur. Créer de plus grandes pages n'est pas recommandé, même si votre écran est plus large, car
l'expérience montre que la plupart des visiteurs préfèrent une largeur de page fixe. Cependant, vous
pouvez ajuster la taille de la page à votre convenance.
Il est possible de déterminer la taille de page que vous souhaitez en sélectionnant l'onglet Page de la
boîte de dialogue d'Options
(Fichier->Options de page). Il est cependant déconseillé d'opter pour une largeur de page supérieure à
990 pixels, car il s'agit de la largeur maximum de bon nombre d'écrans d'ordinateurs (1024 moins la
barre de défilement). En général, la largeur de page la plus fréquente est de 800 pixels.
Sélectionnez l'option de Personnalisation de la page pour saisir la taille en pixels de votre choix
Vous pouvez modifier directement la taille de votre page en tirant sur la marge inférieure de la page. Allez
dans l'outil Sélection
et passez le pointeur de la souris sur les bords inférieurs de la page. Ce dernier change alors pour vous
indiquer que vous pouvez désormais tirer pour redimensionner la page comme vous le souhaitez.
Modifier la taille de la page des modèles de conception
Il est possible de modifier la longueur des modèles de conception de la même façon, en tirant
simplement sur les bords inférieurs de la page. Cependant, vous aurez besoin de déplacer et de
redimensionner différents objets sur la page. Par exemple, de nombreux modèles de conception ont un
pied de page. Vous pouvez tirer dessus pour le disposer différemment en utilisant l'outil Sélection.
Parfois, le texte principal sera placé dans un rectangle muni d'un arrière-plan coloré. Une fois de plus,
l'outil Sélection vous permet de tirer sur les poignées inférieures pour étirer le rectangle vers le bas. La
plupart des modèles de conception utilisent des colonnes de texte qui s'étirent verticalement lorsque vous
ajoutez du texte.
Remarque : si vous maintenez la touche Ctrl enfoncée tout en tirant, vous pouvez être sûr d'effectuer une
modification parfaitement verticale ou horizontale.
Page 79
Modifier la taille de la page des modèles de conception
Il est possible de modifier la longueur des modèles de conception de la même façon, en tirant
simplement sur les bords inférieurs de la page. Cependant, vous aurez besoin de déplacer et de
redimensionner différents objets sur la page. Par exemple, de nombreux modèles de conception ont un
pied de page. Vous pouvez tirer dessus pour le disposer différemment en utilisant l'outil Sélection.
Parfois, le texte principal sera placé dans un rectangle muni d'un arrière-plan coloré. Une fois de plus,
l'outil Sélection vous permet de tirer sur les poignées inférieures pour étirer le rectangle vers le bas. La
plupart des modèles de conception utilisent des colonnes de texte qui s'étirent verticalement lorsque vous
ajoutez du texte.
Remarque : si vous maintenez la touche Ctrl enfoncée tout en tirant, vous pouvez être sûr d'effectuer une
modification parfaitement verticale ou horizontale.
Page 80
Enregistrer votre travail. Créer un site
Internet
Utilisez les options Enregistrer ou Enregistrer-sous du menu pour sauvegarder votre travail en cours.
Vous enregistrez ainsi un fichier avec une extension .web, le format de fichier de Web Designer (ce n'est
pas un site Internet). Il est recommandé de sauvegarder régulièrement votre travail. Si vous souhaitez
éditer ou mettre à jour votre site Internet, vous devez
enregistrer un fichier Web et l'utiliser lors de vos mises-à-jour.
Pour enregistrer votre site Internet, c'est-à-dire le HTML et les fichiers
associés pour les publier sur Internet, utilisez l'option Exporter le site
Internet du menu ou cliquez sur ce bouton dans la barre du haut.
Vous sauvegardez un fichier .htm pour chaque page ainsi qu'un dossier qui contient tous les fichiers
graphiques de votre site Internet.
Lorsque vous exportez un site Internet, toutes les pages sont exportées simultanément et chaque page se
voit attribuer _1, _2 ... à la fin du nom donné lors de l'exportation. Le répertoire _files contient toutes les
images et les autres fichiers qui constituent votre site Internet. Vous pouvez nommer chaque page
individuellement en utilisant l'onglet Page de la boîte de dialogue Propriétés Web
.
Votre site Internet sera nommé par défaut index.htm, le nom habituellement donné à la première page
d'un site Internet.
Vous pouvez prévisualiser la sauvegarde de votre site Internet dans un navigateur en faisant glisser le
fichier index.htm (ou n'importe quel fichier .htm) de votre Explorateur Windows dans la fenêtre du
navigateur.
Page 81
Objets extensibles
Bon nombre d'objets graphiques, comme les boutons et les panneaux de texte peuvent être
automatiquement ajustés à la taille ou à la longueur du texte. Ainsi, certains boutons sont appelés
« boutons extensibles », ce qui signifie que la longueur du bouton s'adapte au texte qu'il contient. La
plupart des modèles de conception et tous les boutons du dossier Boutons de la Galerie de modèles
existent en version à largeur fixe ou extensible. Si vous installez un ensemble de boutons de navigation
(généralement une suite de liens ou de boutons horizontale ou verticale), il est recommandé d'utiliser des
boutons à largeur fixes pour qu'ils soient tous de la même taille.
De la même façon, de nombreux panneaux de côté ou de texte des modèles de conception, et parfois
également la zone de texte principale, peuvent être ajustés verticalement et quelque fois même
horizontalement. Pour les panneaux de texte, vous pouvez ajuster la largeur de la colonne dans l'outil
Texte en tirant à gauche ou à droite de l'indicateur de la colonne.
Page 82
Groupes
Vous pouvez regrouper une sélection d'objets sur la page. De nombreux objets des modèles de
conception de la Galerie de modèles, comme les boutons, les panneaux de texte et les photos sont des
objets groupés. Les groupes se comportent comme un seul objet, c'est-à-dire que vous pouvez les
glisser sur la page et les faire pivoter comme un seul objet.
Par exemple, vous pouvez dessiner un simple bouton en dessinant un rectangle avec l'outil Rectangle,
puis en plaçant une étiquette de texte par dessus avec l'outil Texte. Ce sont des objets séparés et vous
pouvez les déplacer indépendamment l'un de l'autre dans l'outil Sélection. Cependant, si vous
sélectionnez les deux dans l'outil Sélection (vous pouvez utiliser le lasso pour les entourer ou appuyer sur
Maj et cliquer sur les objets) et que vous appuyez sur Ctrl+G (ou dans le menu Arranger -> Groupe
), vous en ferez un objet groupé (Remarque : la ligne de statut située en bas vous signale toujours ce qui
est sélectionné). Ainsi, dés que vous tirez, redimensionnez ou faites pivoter cet objet, tous les éléments du
groupe sont déplacés et modifiés comme s'il s'agissait d'un seul objet.
Important :
Les objets groupés sont habituellement convertis en un seul objet graphique lorsque vous exportez votre
page Web.
En défaisant le groupe (Ctrl+U), vous pouvez accéder à tous les éléments de votre groupe et effectuer
des modifications. Parfois, vous avez également la possibilité de modifier des objets directement à
l'intérieur d'un groupe, par exemple en utilisant l'outil Texte pour éditer le texte ou l'outil Photo pour
modifier une photo. Vous accéderez en un clic à l'objet situé à l'intérieur du groupe.
Convertir du texte en graphique
Comme mentionné précédemment, un nombre très limité de polices est disponible dans les navigateurs
Web. Si vous souhaitez utiliser une police différente dans un bouton ou dans un titre, vous pouvez le
faire en vous assurant qu'il soit converti en graphique. Il vous suffit de grouper l'objet pour que la
conversion s'effectue. Il est toujours possible d'éditer le texte du groupe, mais les groupes sont
automatiquement convertis en graphique lors de l'exportation du site.
Pour inclure une police semblable, vous n'avez qu'à créer un groupe. Il n'est pas nécessaire que ce soit
regroupé avec d'autres éléments. En appuyant sur Ctrl+G, vous pouvez le regrouper avec lui-même.
Groupes souples
Il existe un autre type de groupe, les « Groupes souples », un ensemble d'objets reliés de manière plus
souple . La différence entre les Groupes et les Groupes souples est :
 Lorsque vous regroupez des objets, ils doivent tous se situer sur un seul calque, sinon ils sont
déplacés pour ne former qu'un seul calque que vous groupez les objets). Les groupes souples
conservent leurs calques, donc vous pouvez les relier à travers plusieurs calques.
 Les groupes sont habituellement convertis en un seul graphique dans la version exportée du site.
Les Groupes souples ne sont pas convertis et chaque objet est exporté comme un objet distinct.
Le texte situé à l'intérieur d'un Groupe souple est conservé en tant que texte dans le fichier
HTML tandis que le texte des Groupes est converti dans un graphique (avec certaines
exceptions).
 Il est possible de relier des groupes à l'intérieur d'autres groupes. Pour des dessins complexes
composés de plusieurs autres dessins, parfois des centaines de formes, créer une hiérarchie de
groupes imbriqués est une bonne technique d'organisation, de même qu'avoir un dossier imbriqué
dans d'autres dossiers. Les Groupes souples ne peuvent en revanche pas être imbriqués et sont
essentiellement conçus comme un moyen de relier de multiples objets sur différents calques.
Page 83
Comme les Groupes souples peuvent contenir des objets sur différents calques, sélectionner un élément
d'un Groupe souple sur un calque sélectionnera automatiquement les éléments des Groupes souples
d'autres calques, souvent celui qui n'est même pas visible. Voir la rubrique sur les calques ci-dessous
pour plus détails.
La plupart des boutons sont des Groupes souples, c'est-à-dire que lorsque vous sélectionnez, déplacez
ou redimensionnez un bouton, vous réalisez en réalité cette manipulation sur deux copies du bouton, l'un
appelé version « État normal » et l'autre, version « Survol de la souris ».
Certains des objets les plus complexes de la Galerie des modèles sont des Groupes souples. Ainsi, vous
pouvez vous déplacer autour d'eux comme pour un objet non-groupé mais les éléments qui le
composent, les photos ou les formes d'arrière-plan sont tous exportés en HTML en tant qu'éléments
séparés pour une efficacité maximum.
Texte synchronisé
Il existe une fonction supplémentaire fort utile : les groupes souples. Si un même texte se trouve dans un
ou plusieurs objets au sein d'un groupe souple, le texte sera synchronisé lorsque vous l'éditerez. Il s'agit
du mécanisme permettant de maintenir synchronisé le texte d'un bouton sur son niveau normal et son
niveau Survol de souris - voir ci-dessous.
Page 84
Convertir du texte en graphique
Comme mentionné précédemment, un nombre très limité de polices est disponible dans les navigateurs
Web. Si vous souhaitez utiliser une police différente dans un bouton ou dans un titre, vous pouvez le
faire en vous assurant qu'il soit converti en graphique. Il vous suffit de grouper l'objet pour que la
conversion s'effectue. Il est toujours possible d'éditer le texte du groupe, mais les groupes sont
automatiquement convertis en graphique lors de l'exportation du site.
Pour inclure une police semblable, vous n'avez qu'à créer un groupe. Il n'est pas nécessaire que ce soit
regroupé avec d'autres éléments. En appuyant sur Ctrl+G, vous pouvez le regrouper avec lui-même.
Groupes souples
Il existe un autre type de groupe, les « Groupes souples », un ensemble d'objets reliés de manière plus
souple . La différence entre les Groupes et les Groupes souples est :
 Lorsque vous regroupez des objets, ils doivent tous se situer sur un seul calque, sinon ils sont
déplacés pour ne former qu'un seul calque que vous groupez les objets). Les groupes souples
conservent leurs calques, donc vous pouvez les relier à travers plusieurs calques.
 Les groupes sont habituellement convertis en un seul graphique dans la version exportée du site.
Les Groupes souples ne sont pas convertis et chaque objet est exporté comme un objet distinct.
Le texte situé à l'intérieur d'un Groupe souple est conservé en tant que texte dans le fichier
HTML tandis que le texte des Groupes est converti dans un graphique (avec certaines
exceptions).
 Il est possible de relier des groupes à l'intérieur d'autres groupes. Pour des dessins complexes
composés de plusieurs autres dessins, parfois des centaines de formes, créer une hiérarchie de
groupes imbriqués est une bonne technique d'organisation, de même qu'avoir un dossier imbriqué
dans d'autres dossiers. Les Groupes souples ne peuvent en revanche pas être imbriqués et sont
essentiellement conçus comme un moyen de relier de multiples objets sur différents calques.
Comme les Groupes souples peuvent contenir des objets sur différents calques, sélectionner un élément
d'un Groupe souple sur un calque sélectionnera automatiquement les éléments des Groupes souples
d'autres calques, souvent celui qui n'est même pas visible. Voir la rubrique sur les calques ci-dessous
pour plus détails.
La plupart des boutons sont des Groupes souples, c'est-à-dire que lorsque vous sélectionnez, déplacez
ou redimensionnez un bouton, vous réalisez en réalité cette manipulation sur deux copies du bouton, l'un
appelé version « État normal » et l'autre, version « Survol de la souris ».
Certains des objets les plus complexes de la Galerie des modèles sont des Groupes souples. Ainsi, vous
pouvez vous déplacer autour d'eux comme pour un objet non-groupé mais les éléments qui le
composent, les photos ou les formes d'arrière-plan sont tous exportés en HTML en tant qu'éléments
séparés pour une efficacité maximum.
Texte synchronisé
Il existe une fonction supplémentaire fort utile : les groupes souples. Si un même texte se trouve dans un
ou plusieurs objets au sein d'un groupe souple, le texte sera synchronisé lorsque vous l'éditerez. Il s'agit
du mécanisme permettant de maintenir synchronisé le texte d'un bouton sur son niveau normal et son
niveau Survol de souris - voir ci-dessous.
Page 85
Groupes souples
Il existe un autre type de groupe, les « Groupes souples », un ensemble d'objets reliés de manière plus
souple . La différence entre les Groupes et les Groupes souples est :
 Lorsque vous regroupez des objets, ils doivent tous se situer sur un seul calque, sinon ils sont
déplacés pour ne former qu'un seul calque que vous groupez les objets). Les groupes souples
conservent leurs calques, donc vous pouvez les relier à travers plusieurs calques.
 Les groupes sont habituellement convertis en un seul graphique dans la version exportée du site.
Les Groupes souples ne sont pas convertis et chaque objet est exporté comme un objet distinct.
Le texte situé à l'intérieur d'un Groupe souple est conservé en tant que texte dans le fichier
HTML tandis que le texte des Groupes est converti dans un graphique (avec certaines
exceptions).
 Il est possible de relier des groupes à l'intérieur d'autres groupes. Pour des dessins complexes
composés de plusieurs autres dessins, parfois des centaines de formes, créer une hiérarchie de
groupes imbriqués est une bonne technique d'organisation, de même qu'avoir un dossier imbriqué
dans d'autres dossiers. Les Groupes souples ne peuvent en revanche pas être imbriqués et sont
essentiellement conçus comme un moyen de relier de multiples objets sur différents calques.
Comme les Groupes souples peuvent contenir des objets sur différents calques, sélectionner un élément
d'un Groupe souple sur un calque sélectionnera automatiquement les éléments des Groupes souples
d'autres calques, souvent celui qui n'est même pas visible. Voir la rubrique sur les calques ci-dessous
pour plus détails.
La plupart des boutons sont des Groupes souples, c'est-à-dire que lorsque vous sélectionnez, déplacez
ou redimensionnez un bouton, vous réalisez en réalité cette manipulation sur deux copies du bouton, l'un
appelé version « État normal » et l'autre, version « Survol de la souris ».
Certains des objets les plus complexes de la Galerie des modèles sont des Groupes souples. Ainsi, vous
pouvez vous déplacer autour d'eux comme pour un objet non-groupé mais les éléments qui le
composent, les photos ou les formes d'arrière-plan sont tous exportés en HTML en tant qu'éléments
séparés pour une efficacité maximum.
Texte synchronisé
Il existe une fonction supplémentaire fort utile : les groupes souples. Si un même texte se trouve dans un
ou plusieurs objets au sein d'un groupe souple, le texte sera synchronisé lorsque vous l'éditerez. Il s'agit
du mécanisme permettant de maintenir synchronisé le texte d'un bouton sur son niveau normal et son
niveau Survol de souris - voir ci-dessous.
Page 86
Texte synchronisé
Il existe une fonction supplémentaire fort utile : les groupes souples. Si un même texte se trouve dans un
ou plusieurs objets au sein d'un groupe souple, le texte sera synchronisé lorsque vous l'éditerez. Il s'agit
du mécanisme permettant de maintenir synchronisé le texte d'un bouton sur son niveau normal et son
niveau Survol de souris - voir ci-dessous.
Page 87
Liens, boutons et barre de boutons
Vous pouvez ajouter un lien Web à tous les objets, boutons, graphiques ou éléments de textes.
Sélectionnez l'objet et cliquez sur l'icône de lien située en haut pour saisir
l'adresse Web que vous voulez relier.
Entrez l'adresse Web que vous voulez relier dans le champ spécifique.
La boite de dialogue de lien vous permet de contrôler ce qui se passe lorsque vous cliquez sur le lien de
l'objet. Vous pouvez passer à une autre page Web (sélectionnez rapidement un lien vers une autre page
de votre site en utilisant le menu déroulant Lien vers la page). Vous pouvez vérifier si la page s'ouvre
dans une nouvelle fenêtre.
Pour placer un lien sur l'un des boutons, sélectionnez-le (cliquez dessus
dans l'outil Sélection), cliquez sur l'icône puis saisissez l'adresse Web ou
sélectionnez une de vos pages du menu déroulant et cliquez sur
Appliquer. Terminé !
Lien ancré
Il est possible de relier du texte ou un objet n'importe où dans votre site Internet en utilisant des
« ancres ». Commencez par appliquer un nom à l'objet que vous voulez relier : c'est l'ancre. Sélectionnez
ensuite l'objet (objet graphique ou texte) puis dans le menu, rendez-vous dans Services ->Noms... pour
afficher la boîte de dialogue. Saisissez un nom unique de votre choix puis cliquez sur Ajouter
.
Pour relier cette ancre de n'importe où sur votre site Internet (un bouton, un simple lien ou du texte),
ouvrez la boîte de dialogue de liens (voir ci-dessus) puis sélectionnez un nom dans le menu déroulant
« Lien ancré ».
Modifier le texte d'un bouton
C'est très simple : il suffit d'activer l'outil Texte
, de cliquer sur le texte du bouton pour le sélectionner et de l'éditer.
Remarque : un triple-clic sur le texte du bouton sélectionne la ligne de texte entière : cela permettra de
remplacer le texte facilement dès que vous tapez votre nouvelle phrase.
Page 88
Boutons de survol de souris
Vous avez remarqué que la plupart des boutons se mettent en surbrillance lorsque le pointeur de la
souris passe au-dessus d'eux dans votre navigateur. Cela s'appelle un effet de survol de souris. Cet effet
est automatique pour la plupart des boutons utilisés dans les modèles ou de la rubrique Boutons de la
Galerie des modèles.
Pour les utilisateurs avancés : cet effet de survol est créé grâce à l'utilisation de Calques nommés. Les
boutons sont des Groupes souples de deux sortes : « État normal » et « Survol de la souris » dans des
calques séparés. Le Groupe souple signifie que les deux calques changent simultanément lorsque vous
modifiez le bouton, par exemple lorsque vous modifiez le texte, que vous le déplacez ou le
redimensionnez. Voir la rubrique Calques
ci-dessous pour plus de détails.
Ajouter de nouveaux boutons
Dans la Galerie des modèles, chaque thème possède un ensemble de graphismes de boutons que vous
pouvez faire glisser sur la page. Il s'agit généralement de deux types de boutons. Les Boutons
Extensibles s'adaptent à la taille du texte.
On trouve également une catégorie Boutons, qui est un ensemble de modèles de boutons qui peuvent
être ajoutés à la page de la même façon.
Vous pouvez également copier un bouton existant (c'est probablement la meilleure façon d'ajouter des
boutons à une barre de navigation). Vous pouvez copier/coller, mais il est plus rapide de faire glisser le
bouton en maintenant le bouton droit de la souris enfoncé. (C'est un raccourci général pour copier des
objets). Il vous suffit ensuite d'éditer le texte.
Astuce : si vous maintenez la touche Ctrl enfoncée tout en faisant glisser l'objet, celui-ci se déplacera de
manière parfaitement horizontale ou verticale, vous permettant ainsi de créer facilement une rangée ou
une colonne de boutons.
Barre de boutons (Barre de navigation)
La plupart des sites Internet, et donc la plupart des modèles de conception proposés, ont une rangée ou
une colonne de boutons pour naviguer sur le site ou ailleurs. Dans Web Designer, il s'agit d'un ensemble
de boutons distincts et vous pouvez les modifier directement en cliquant dessus. Vous pouvez déplacer
chaque bouton ou les supprimer normalement. Si vous souhaitez déplacer l'ensemble de la rangée ou de
la colonne de boutons, il vous suffit de double-cliquer sur l'un des boutons dans l'outil Sélection
. Tous les boutons de la colonne ou de la rangée seront alors sélectionnés et pourront être déplacés en
même temps.
Pour supprimer un bouton, sélectionnez-le puis appuyez sur la touche Suppr
. Pour ajouter un nouveau bouton, copiez simplement un bouton existant. La manière la plus simple de le
faire est de faire glisser un bouton existant avec le bouton droit de la souris. Vous pouvez ensuite modifier
le lien. Si vous avez besoin d'ajuster légèrement la position d'un objet, sélectionnez-le et utilisez les
flèches du clavier.
Pour mettre à jour la barre de navigation sur toutes les pages, sélectionnez le menu Arranger ->Mettre
à jour les objets répétés
. La barre de boutons (et tous les autres objets répétés) de la page en cours seront copiés sur toutes les
autres pages contenant la même barre de bouton. Si vous souhaitez copier une barre entière de bouton
sur une autre page qui n'en possède pas, faites un double-clic pour sélectionner la barre entière puis
copiez/collez sur une autre page.
Conseil :Si vous utilisez « Copier à la même place
» (Maj+Ctrl+V), l'objet sera placé au même endroit sur la page de destination.
Page 89
Lien ancré
Il est possible de relier du texte ou un objet n'importe où dans votre site Internet en utilisant des
« ancres ». Commencez par appliquer un nom à l'objet que vous voulez relier : c'est l'ancre. Sélectionnez
ensuite l'objet (objet graphique ou texte) puis dans le menu, rendez-vous dans Services ->Noms... pour
afficher la boîte de dialogue. Saisissez un nom unique de votre choix puis cliquez sur Ajouter
.
Pour relier cette ancre de n'importe où sur votre site Internet (un bouton, un simple lien ou du texte),
ouvrez la boîte de dialogue de liens (voir ci-dessus) puis sélectionnez un nom dans le menu déroulant
« Lien ancré ».
Modifier le texte d'un bouton
C'est très simple : il suffit d'activer l'outil Texte
, de cliquer sur le texte du bouton pour le sélectionner et de l'éditer.
Remarque : un triple-clic sur le texte du bouton sélectionne la ligne de texte entière : cela permettra de
remplacer le texte facilement dès que vous tapez votre nouvelle phrase.
Boutons de survol de souris
Vous avez remarqué que la plupart des boutons se mettent en surbrillance lorsque le pointeur de la
souris passe au-dessus d'eux dans votre navigateur. Cela s'appelle un effet de survol de souris. Cet effet
est automatique pour la plupart des boutons utilisés dans les modèles ou de la rubrique Boutons de la
Galerie des modèles.
Pour les utilisateurs avancés : cet effet de survol est créé grâce à l'utilisation de Calques nommés. Les
boutons sont des Groupes souples de deux sortes : « État normal » et « Survol de la souris » dans des
calques séparés. Le Groupe souple signifie que les deux calques changent simultanément lorsque vous
modifiez le bouton, par exemple lorsque vous modifiez le texte, que vous le déplacez ou le
redimensionnez. Voir la rubrique Calques
ci-dessous pour plus de détails.
Ajouter de nouveaux boutons
Dans la Galerie des modèles, chaque thème possède un ensemble de graphismes de boutons que vous
pouvez faire glisser sur la page. Il s'agit généralement de deux types de boutons. Les Boutons
Extensibles s'adaptent à la taille du texte.
On trouve également une catégorie Boutons, qui est un ensemble de modèles de boutons qui peuvent
être ajoutés à la page de la même façon.
Vous pouvez également copier un bouton existant (c'est probablement la meilleure façon d'ajouter des
boutons à une barre de navigation). Vous pouvez copier/coller, mais il est plus rapide de faire glisser le
bouton en maintenant le bouton droit de la souris enfoncé. (C'est un raccourci général pour copier des
objets). Il vous suffit ensuite d'éditer le texte.
Astuce : si vous maintenez la touche Ctrl enfoncée tout en faisant glisser l'objet, celui-ci se déplacera de
manière parfaitement horizontale ou verticale, vous permettant ainsi de créer facilement une rangée ou
une colonne de boutons.
Barre de boutons (Barre de navigation)
La plupart des sites Internet, et donc la plupart des modèles de conception proposés, ont une rangée ou
une colonne de boutons pour naviguer sur le site ou ailleurs. Dans Web Designer, il s'agit d'un ensemble
de boutons distincts et vous pouvez les modifier directement en cliquant dessus. Vous pouvez déplacer
chaque bouton ou les supprimer normalement. Si vous souhaitez déplacer l'ensemble de la rangée ou de
Page 90
la colonne de boutons, il vous suffit de double-cliquer sur l'un des boutons dans l'outil Sélection
. Tous les boutons de la colonne ou de la rangée seront alors sélectionnés et pourront être déplacés en
même temps.
Pour supprimer un bouton, sélectionnez-le puis appuyez sur la touche Suppr
. Pour ajouter un nouveau bouton, copiez simplement un bouton existant. La manière la plus simple de le
faire est de faire glisser un bouton existant avec le bouton droit de la souris. Vous pouvez ensuite modifier
le lien. Si vous avez besoin d'ajuster légèrement la position d'un objet, sélectionnez-le et utilisez les
flèches du clavier.
Pour mettre à jour la barre de navigation sur toutes les pages, sélectionnez le menu Arranger ->Mettre
à jour les objets répétés
. La barre de boutons (et tous les autres objets répétés) de la page en cours seront copiés sur toutes les
autres pages contenant la même barre de bouton. Si vous souhaitez copier une barre entière de bouton
sur une autre page qui n'en possède pas, faites un double-clic pour sélectionner la barre entière puis
copiez/collez sur une autre page.
Conseil :Si vous utilisez « Copier à la même place
» (Maj+Ctrl+V), l'objet sera placé au même endroit sur la page de destination.
Page 91
Modifier le texte d'un bouton
C'est très simple : il suffit d'activer l'outil Texte
, de cliquer sur le texte du bouton pour le sélectionner et de l'éditer.
Remarque : un triple-clic sur le texte du bouton sélectionne la ligne de texte entière : cela permettra de
remplacer le texte facilement dès que vous tapez votre nouvelle phrase.
Boutons de survol de souris
Vous avez remarqué que la plupart des boutons se mettent en surbrillance lorsque le pointeur de la
souris passe au-dessus d'eux dans votre navigateur. Cela s'appelle un effet de survol de souris. Cet effet
est automatique pour la plupart des boutons utilisés dans les modèles ou de la rubrique Boutons de la
Galerie des modèles.
Pour les utilisateurs avancés : cet effet de survol est créé grâce à l'utilisation de Calques nommés. Les
boutons sont des Groupes souples de deux sortes : « État normal » et « Survol de la souris » dans des
calques séparés. Le Groupe souple signifie que les deux calques changent simultanément lorsque vous
modifiez le bouton, par exemple lorsque vous modifiez le texte, que vous le déplacez ou le
redimensionnez. Voir la rubrique Calques
ci-dessous pour plus de détails.
Ajouter de nouveaux boutons
Dans la Galerie des modèles, chaque thème possède un ensemble de graphismes de boutons que vous
pouvez faire glisser sur la page. Il s'agit généralement de deux types de boutons. Les Boutons
Extensibles s'adaptent à la taille du texte.
On trouve également une catégorie Boutons, qui est un ensemble de modèles de boutons qui peuvent
être ajoutés à la page de la même façon.
Vous pouvez également copier un bouton existant (c'est probablement la meilleure façon d'ajouter des
boutons à une barre de navigation). Vous pouvez copier/coller, mais il est plus rapide de faire glisser le
bouton en maintenant le bouton droit de la souris enfoncé. (C'est un raccourci général pour copier des
objets). Il vous suffit ensuite d'éditer le texte.
Astuce : si vous maintenez la touche Ctrl enfoncée tout en faisant glisser l'objet, celui-ci se déplacera de
manière parfaitement horizontale ou verticale, vous permettant ainsi de créer facilement une rangée ou
une colonne de boutons.
Barre de boutons (Barre de navigation)
La plupart des sites Internet, et donc la plupart des modèles de conception proposés, ont une rangée ou
une colonne de boutons pour naviguer sur le site ou ailleurs. Dans Web Designer, il s'agit d'un ensemble
de boutons distincts et vous pouvez les modifier directement en cliquant dessus. Vous pouvez déplacer
chaque bouton ou les supprimer normalement. Si vous souhaitez déplacer l'ensemble de la rangée ou de
la colonne de boutons, il vous suffit de double-cliquer sur l'un des boutons dans l'outil Sélection
. Tous les boutons de la colonne ou de la rangée seront alors sélectionnés et pourront être déplacés en
même temps.
Pour supprimer un bouton, sélectionnez-le puis appuyez sur la touche Suppr
. Pour ajouter un nouveau bouton, copiez simplement un bouton existant. La manière la plus simple de le
faire est de faire glisser un bouton existant avec le bouton droit de la souris. Vous pouvez ensuite modifier
le lien. Si vous avez besoin d'ajuster légèrement la position d'un objet, sélectionnez-le et utilisez les
flèches du clavier.
Pour mettre à jour la barre de navigation sur toutes les pages, sélectionnez le menu Arranger ->Mettre
à jour les objets répétés
Page 92
. La barre de boutons (et tous les autres objets répétés) de la page en cours seront copiés sur toutes les
autres pages contenant la même barre de bouton. Si vous souhaitez copier une barre entière de bouton
sur une autre page qui n'en possède pas, faites un double-clic pour sélectionner la barre entière puis
copiez/collez sur une autre page.
Conseil :Si vous utilisez « Copier à la même place
» (Maj+Ctrl+V), l'objet sera placé au même endroit sur la page de destination.
Page 93
Boutons de survol de souris
Vous avez remarqué que la plupart des boutons se mettent en surbrillance lorsque le pointeur de la
souris passe au-dessus d'eux dans votre navigateur. Cela s'appelle un effet de survol de souris. Cet effet
est automatique pour la plupart des boutons utilisés dans les modèles ou de la rubrique Boutons de la
Galerie des modèles.
Pour les utilisateurs avancés : cet effet de survol est créé grâce à l'utilisation de Calques nommés. Les
boutons sont des Groupes souples de deux sortes : « État normal » et « Survol de la souris » dans des
calques séparés. Le Groupe souple signifie que les deux calques changent simultanément lorsque vous
modifiez le bouton, par exemple lorsque vous modifiez le texte, que vous le déplacez ou le
redimensionnez. Voir la rubrique Calques
ci-dessous pour plus de détails.
Ajouter de nouveaux boutons
Dans la Galerie des modèles, chaque thème possède un ensemble de graphismes de boutons que vous
pouvez faire glisser sur la page. Il s'agit généralement de deux types de boutons. Les Boutons
Extensibles s'adaptent à la taille du texte.
On trouve également une catégorie Boutons, qui est un ensemble de modèles de boutons qui peuvent
être ajoutés à la page de la même façon.
Vous pouvez également copier un bouton existant (c'est probablement la meilleure façon d'ajouter des
boutons à une barre de navigation). Vous pouvez copier/coller, mais il est plus rapide de faire glisser le
bouton en maintenant le bouton droit de la souris enfoncé. (C'est un raccourci général pour copier des
objets). Il vous suffit ensuite d'éditer le texte.
Astuce : si vous maintenez la touche Ctrl enfoncée tout en faisant glisser l'objet, celui-ci se déplacera de
manière parfaitement horizontale ou verticale, vous permettant ainsi de créer facilement une rangée ou
une colonne de boutons.
Barre de boutons (Barre de navigation)
La plupart des sites Internet, et donc la plupart des modèles de conception proposés, ont une rangée ou
une colonne de boutons pour naviguer sur le site ou ailleurs. Dans Web Designer, il s'agit d'un ensemble
de boutons distincts et vous pouvez les modifier directement en cliquant dessus. Vous pouvez déplacer
chaque bouton ou les supprimer normalement. Si vous souhaitez déplacer l'ensemble de la rangée ou de
la colonne de boutons, il vous suffit de double-cliquer sur l'un des boutons dans l'outil Sélection
. Tous les boutons de la colonne ou de la rangée seront alors sélectionnés et pourront être déplacés en
même temps.
Pour supprimer un bouton, sélectionnez-le puis appuyez sur la touche Suppr
. Pour ajouter un nouveau bouton, copiez simplement un bouton existant. La manière la plus simple de le
faire est de faire glisser un bouton existant avec le bouton droit de la souris. Vous pouvez ensuite modifier
le lien. Si vous avez besoin d'ajuster légèrement la position d'un objet, sélectionnez-le et utilisez les
flèches du clavier.
Pour mettre à jour la barre de navigation sur toutes les pages, sélectionnez le menu Arranger ->Mettre
à jour les objets répétés
. La barre de boutons (et tous les autres objets répétés) de la page en cours seront copiés sur toutes les
autres pages contenant la même barre de bouton. Si vous souhaitez copier une barre entière de bouton
sur une autre page qui n'en possède pas, faites un double-clic pour sélectionner la barre entière puis
copiez/collez sur une autre page.
Conseil :Si vous utilisez « Copier à la même place
» (Maj+Ctrl+V), l'objet sera placé au même endroit sur la page de destination.
Page 94
Ajouter de nouveaux boutons
Dans la Galerie des modèles, chaque thème possède un ensemble de graphismes de boutons que vous
pouvez faire glisser sur la page. Il s'agit généralement de deux types de boutons. Les Boutons
Extensibles s'adaptent à la taille du texte.
On trouve également une catégorie Boutons, qui est un ensemble de modèles de boutons qui peuvent
être ajoutés à la page de la même façon.
Vous pouvez également copier un bouton existant (c'est probablement la meilleure façon d'ajouter des
boutons à une barre de navigation). Vous pouvez copier/coller, mais il est plus rapide de faire glisser le
bouton en maintenant le bouton droit de la souris enfoncé. (C'est un raccourci général pour copier des
objets). Il vous suffit ensuite d'éditer le texte.
Astuce : si vous maintenez la touche Ctrl enfoncée tout en faisant glisser l'objet, celui-ci se déplacera de
manière parfaitement horizontale ou verticale, vous permettant ainsi de créer facilement une rangée ou
une colonne de boutons.
Barre de boutons (Barre de navigation)
La plupart des sites Internet, et donc la plupart des modèles de conception proposés, ont une rangée ou
une colonne de boutons pour naviguer sur le site ou ailleurs. Dans Web Designer, il s'agit d'un ensemble
de boutons distincts et vous pouvez les modifier directement en cliquant dessus. Vous pouvez déplacer
chaque bouton ou les supprimer normalement. Si vous souhaitez déplacer l'ensemble de la rangée ou de
la colonne de boutons, il vous suffit de double-cliquer sur l'un des boutons dans l'outil Sélection
. Tous les boutons de la colonne ou de la rangée seront alors sélectionnés et pourront être déplacés en
même temps.
Pour supprimer un bouton, sélectionnez-le puis appuyez sur la touche Suppr
. Pour ajouter un nouveau bouton, copiez simplement un bouton existant. La manière la plus simple de le
faire est de faire glisser un bouton existant avec le bouton droit de la souris. Vous pouvez ensuite modifier
le lien. Si vous avez besoin d'ajuster légèrement la position d'un objet, sélectionnez-le et utilisez les
flèches du clavier.
Pour mettre à jour la barre de navigation sur toutes les pages, sélectionnez le menu Arranger ->Mettre
à jour les objets répétés
. La barre de boutons (et tous les autres objets répétés) de la page en cours seront copiés sur toutes les
autres pages contenant la même barre de bouton. Si vous souhaitez copier une barre entière de bouton
sur une autre page qui n'en possède pas, faites un double-clic pour sélectionner la barre entière puis
copiez/collez sur une autre page.
Conseil :Si vous utilisez « Copier à la même place
» (Maj+Ctrl+V), l'objet sera placé au même endroit sur la page de destination.
Page 95
Barre de boutons (Barre de navigation)
La plupart des sites Internet, et donc la plupart des modèles de conception proposés, ont une rangée ou
une colonne de boutons pour naviguer sur le site ou ailleurs. Dans Web Designer, il s'agit d'un ensemble
de boutons distincts et vous pouvez les modifier directement en cliquant dessus. Vous pouvez déplacer
chaque bouton ou les supprimer normalement. Si vous souhaitez déplacer l'ensemble de la rangée ou de
la colonne de boutons, il vous suffit de double-cliquer sur l'un des boutons dans l'outil Sélection
. Tous les boutons de la colonne ou de la rangée seront alors sélectionnés et pourront être déplacés en
même temps.
Pour supprimer un bouton, sélectionnez-le puis appuyez sur la touche Suppr
. Pour ajouter un nouveau bouton, copiez simplement un bouton existant. La manière la plus simple de le
faire est de faire glisser un bouton existant avec le bouton droit de la souris. Vous pouvez ensuite modifier
le lien. Si vous avez besoin d'ajuster légèrement la position d'un objet, sélectionnez-le et utilisez les
flèches du clavier.
Pour mettre à jour la barre de navigation sur toutes les pages, sélectionnez le menu Arranger ->Mettre
à jour les objets répétés
. La barre de boutons (et tous les autres objets répétés) de la page en cours seront copiés sur toutes les
autres pages contenant la même barre de bouton. Si vous souhaitez copier une barre entière de bouton
sur une autre page qui n'en possède pas, faites un double-clic pour sélectionner la barre entière puis
copiez/collez sur une autre page.
Conseil :Si vous utilisez « Copier à la même place
» (Maj+Ctrl+V), l'objet sera placé au même endroit sur la page de destination.
Page 96
Outils de dessin
Web Designer vous propose tous les outils graphiques dont vous avez
besoin pour créer des objets graphiques sur votre page et pour éditer
un ensemble d'éléments graphiques prédéfinis disponibles dans la
galerie des modèles. Trois outils de dessin basiques vous permettent de
créer des rectangles, des ellipses, des étoiles ou toute forme de votre
choix.
Web Designer met à votre disposition des outils de dessin vectoriels, ce qui signifie que vous pouvez
redimensionner, modifier et recolorer une forme et sans perte de qualité. Vous pouvez zoomer pour
visualiser les moindres détails, toutes les modifications peuvent être annulées.
Pour dessiner un rectangle, sélectionnez l'outil Rectangle
et faites-le glisser sur la page. Vous créez ainsi un rectangle noir.
Cliquez sur le bouton « Coins arrondis » de la barre d'infos pour arrondir
les angles du rectangle. Vous pouvez tirer sur les poignées arrondies des
angles pour ajuster la courbure.
Pour redimensionner un objet, vous pouvez tirer sur les poignées situées à chaque angle de l'objet.
Effectuez un Glisser-déposer avec une couleur de la Palette de couleurs sur votre forme pour la
recolorer. Voir Colorer des formes. A l'aide de l'outil de Sélection, vous pouvez faire glisser l'objet, le
redimensionner et le faire pivoter comme vous le souhaitez. Voir outil de Sélection. Vous pouvez placer
ce rectangle derrière tous les autres objets en tant qu'image d'arrière-plan en appuyant sur Ctrl+B (Put in
Back). S'il est placé devant tous les autres objets (Ctrl+F), effectuez un clic droit dessus et sélectionnez
« Renvoyer le texte en arrière
» pour que le texte de votre page soit repoussé autour de cette forme (une autre fonction de Web
Designer en tant qu'outil de création Internet).
L'outil Éditeur de forme
vous permet de créer des formes vectorielles détaillées et d'éditer les
contours des formes.
Pour prédéfinir des formes telles que des rectangles ou des ellipses ou si vous souhaitez modifier les
contours des caractères textuels, vous d'abord devez convertir l'objet en forme éditable. Vous pouvez le
faire via le raccourci clavier Ctrl+1. Utilisez l'outil Éditeur de formes pour effectuer différentes
modifications vectorielles avancées.
Consultez la section Référence
pour en savoir plus quant à l'utilisation de cet outil.
Outil de remplissage
Parmi les nombreuses possibilités offertes par cet outil, vous
pouvez facilement remplir une forme avec une couleur
dégradée par exemple. Sélectionnez l'outil et faites glisser le
Page 97
curseur de la souris sur votre objet.
La flèche de remplissage peut être ajustée en tirant ses extrémités afin de modifier la direction, l'angle et
le degré du dégradé.
Rectangle aux angles arrondis avec remplissage dégradé
Remarque : si vous faites glisser le curseur de la souris au-dessus d'un objet groupé tel qu'un panneau de
texte par exemple, tous les éléments du groupe adopteront le même type de remplissage. Afin d'éviter
cela, il suffit de sélectionner tout d'abord uniquement l'élément que vous souhaitez remplir. Pour cela,
vous avez plusieurs possibilités à disposition. Un clic unique sur l'élément souhaité avec l'outil de
remplissage sélectionne cet élément seulement, de la même manière qu'un clic avec l'outil de sélection en
maintenant la touche CTRL enfoncée (cette méthode est appelée « Sélection interne » car elle sélectionne
uniquement un objet à l'intérieur du groupe). Vous verrez alors qu'un glissement de souris remplira
uniquement l'objet sélectionné.
Pour éditer la couleur de début ou de fin, il suffit de réaliser un Glisser-Déposer avec une couleur depuis
la palette vers la forme ; vous pouvez également sélectionner une extrémité de la flèche de remplissage
dans l'outil de remplissage et utiliser l'éditeur de couleurs (CTRL+E).
Vous avez la possibilité de créer une couleur de remplissage avec plusieurs nuances de dégradé en vous
assurant que la flèche de remplissage est bien visible (sélectionnez-la avec l'outil de remplissage), en
faisant glisser une couleur depuis la palette et en la déposant précautionneusement sur
l'emplacement-cible où vous pourrez voir la nouvelle couleur. Vous pouvez alors déplacer ce point de
remplissage ou sélectionner CTRL+E pour ajuster la couleur à l'aide de l'éditeur de couleurs. Il existe
plusieurs types de remplissages : il s'agit ici d'un cercle doté d'un remplissage circulaire.
L'ombre est une autre ellipse dotée d'une couleur de remplissage dégradée et dont les contours ont été
affinés (voir ci-dessous).
Outil de transparence
Les navigateurs Internet récents, tout comme Web Designer, prennent en charge les effets avancés de
transparence. Vous pouvez modifier n'importe quel graphique ou photo de sorte à ce que ces derniers
deviennent transparents. Testez sur votre exemple de rectangle. Sélectionnez l'outil de transparence et
déplacez le curseur sur la barre d'infos.
Web Designer va plus loin et prend également en charge des dégradés de transparence. Cela fonctionne
de manière similaire au remplissage avec un dégradé de couleur. Il suffit de tirer sur les formes dans l'outil
de transparence pour créer une transition de transparence. Vous pouvez modifier le degré de
transparence à chaque extrémité de la flèche de remplissage en cliquant sur celle-ci et en déplaçant le
curseur de transparence.
Consultez l'aperçu et vous verrez que cela fonctionne également dans votre navigateur Internet.
Page 98
Plume
Il s'agit d'un terme graphique décrivant une procédure qui consiste à masquer les coins des objets. Web
Designer dispose d'une fonction « Plume » qui peut être utilisée avec tous les objets, graphiques, textes
ou photos : elle permet de rendre les coins flous de sorte à ce que ceux-ci se fondent dans l'arrière-plan.
L'outil Plume ne se situe pas sur la gauche mais en haut dans la barre supérieure. Expérimentez sur votre
rectangle. Sélectionnez la forme puis cliquez sur l'outil Plume dans la barre supérieure.
L'ombre située sous le dessin en forme de balle a des angles atténués. En combinant toutes ces
commandes, vous pouvez obtenir très rapidement des graphiques en calques étonnants pour vos
documents ou votre site Internet, directement dans Web Designer sans utiliser d'autre outil graphique.
Voici un exemple de rectangle aux angles
arrondis avec un dégradé de couleurs, de
transparence et des angles atténués avec du
texte placé au-dessus.
La couleur de remplissage est dégradée et
s'étend de la gauche vers la droite du vert
clair au vert foncé. Remarquez également un
dégradé de transparence du haut vers le bas.
L'outil Plume permet de créer les angles
arrondis. Quelques secondes sont
nécessaires pour créer une telle image, et elle
sera automatiquement convertie en graphique
correct lors de la sauvegarde de votre page
Web. Avec Web Designer, vous avez la
possibilité de créer n'importe quel type de
graphique, de photo, de texte avec
transparence. Le logiciel est également
capable d'importer des fichiers graphiques
de différents formats (fichiers EPS d'Adobe,
PSD de Photoshop, RAW d'appareils
photos et bien plus).
Remarque technique : Web Designer convertit automatiquement tous les graphiques vectoriels en images
au format PNG, un canal alpha PNG, s'ils contiennent un effet de transparence. Des calques CSS sont
utilisés pour imiter l'ordre d'apparition des objets dans Web Designer. Ceci est compatible avec tous les
navigateurs Internet actuels.
Outil ombres
L'un des effet graphique très apprécié consiste à créer une ombre douce sous un graphisme ou du texte.
Cet effet met l'objet en relief par rapport à l'arrière-plan.
L'outil Ombre
vous permet d'ajouter une ombre douce à un objet, du texte, des
graphismes ou une photo. Sélectionnez l'outil Ombre et glissez-le sur
l'objet. Vous pouvez modifier le flou de l'ombre et la transparence en
utilisant des fonctionnalités de la Barre d'infos.
Page 99
Texte avec une ombre douce.
Pour ajuster la position d'une ombre, allez dans l'outil Ombre puis glissez sur l'ombre
Note avancée
: Notez que l'ombre étant elle-même semi-transparente (une partie des objets ci-dessous sont visibles
sous l'ombre), les objets ombrés sont convertis en images PNG lors de la sauvegarde en page Web
(c'est le seul format qui supporte la transparence). Les images PNG peuvent être grandes, notamment
pour les photos. C'est le format idéal pour les images telles que le graphisme ombré ci-dessus.
Vous pensez peut-être que convertir le graphisme en image JPEG vous ferez gagner de l'espace. Selon
ce qui se trouve sous l'ombre, cela peut ou non fonctionner. Si c'est un arrière-plan sans texte uni ou
statique, vous pourrez probablement utiliser une image JPEG (fichier beaucoup plus léger, permet un
télécharger plus rapidement du site Internet). Pour convertir un objet en JPEG, utilisez l'onglet Image de
la boîte de dialogue Propriétés Web.
Les images JPEG ne peuvent pas contenir d'éléments semi-transparents. Ainsi, lors de la création d'une
image JPEG d'un objet semi-transparent, Web Designer intègre à l'image l'arrière-plan (ce qui se trouve
derrière la partie semi-transparente). Le positionnement exact des pixels rend la différence invisible.
Cette technique ne fonctionne pas si l'objet ombré ou semi-transparent est placé sur du texte, ce dernier
étant alors intégré dans le graphisme.
Exemple de graphiques
Vous pouvez voir ici un excellent exemple des possibilités de création offertes par Web Designer. Ce
bouton combine plusieurs fonctionnalités décrites ci-dessus : il a été créé à partir de la combinaison de
quelques formes dont les contours ont été affinés et qui utilisent un dégradé de transparence (effet de
réflexion blanche). Le texte a une légère ombre douce et le bouton a une ombre brillante. Les éléments
sont groupés. (Il n'est pas nécessaire de redessiner ce bouton car il est disponible dans la catégorie
« Boutons » de la galerie des modèles).
L'avantage majeur des graphiques vectoriels, en comparaison avec des graphiques Bitmap créés à l'aide
d'un logiciel d'édition de pixels (Photoshop par exemple), réside dans le fait que vous pouvez recolorer,
éditer, faire pivoter et redimensionner le bouton sans aucune perte de qualité. Agrandissez-le à l'extrême
par exemple et vous verrez que sa netteté sera conservée.
De plus, vous pouvez le recolorer à l'aide du système des « Couleurs nommées » et l'étirer à volonté :
toutes les étapes de travail de Web Designer sont non-destructives (ce qui signifie que vous pouvez
éditer autant de fois que vous voulez et la qualité ne subira aucune perte).
Les procédures nécessitant beaucoup de maîtrise et de patience dans d'autres logiciels de graphisme sont
extrêmement simples dans Web Designer.
Page 100
Outil de remplissage
Parmi les nombreuses possibilités offertes par cet outil, vous
pouvez facilement remplir une forme avec une couleur
dégradée par exemple. Sélectionnez l'outil et faites glisser le
curseur de la souris sur votre objet.
La flèche de remplissage peut être ajustée en tirant ses extrémités afin de modifier la direction, l'angle et
le degré du dégradé.
Rectangle aux angles arrondis avec remplissage dégradé
Remarque : si vous faites glisser le curseur de la souris au-dessus d'un objet groupé tel qu'un panneau de
texte par exemple, tous les éléments du groupe adopteront le même type de remplissage. Afin d'éviter
cela, il suffit de sélectionner tout d'abord uniquement l'élément que vous souhaitez remplir. Pour cela,
vous avez plusieurs possibilités à disposition. Un clic unique sur l'élément souhaité avec l'outil de
remplissage sélectionne cet élément seulement, de la même manière qu'un clic avec l'outil de sélection en
maintenant la touche CTRL enfoncée (cette méthode est appelée « Sélection interne » car elle sélectionne
uniquement un objet à l'intérieur du groupe). Vous verrez alors qu'un glissement de souris remplira
uniquement l'objet sélectionné.
Pour éditer la couleur de début ou de fin, il suffit de réaliser un Glisser-Déposer avec une couleur depuis
la palette vers la forme ; vous pouvez également sélectionner une extrémité de la flèche de remplissage
dans l'outil de remplissage et utiliser l'éditeur de couleurs (CTRL+E).
Vous avez la possibilité de créer une couleur de remplissage avec plusieurs nuances de dégradé en vous
assurant que la flèche de remplissage est bien visible (sélectionnez-la avec l'outil de remplissage), en
faisant glisser une couleur depuis la palette et en la déposant précautionneusement sur
l'emplacement-cible où vous pourrez voir la nouvelle couleur. Vous pouvez alors déplacer ce point de
remplissage ou sélectionner CTRL+E pour ajuster la couleur à l'aide de l'éditeur de couleurs. Il existe
plusieurs types de remplissages : il s'agit ici d'un cercle doté d'un remplissage circulaire.
L'ombre est une autre ellipse dotée d'une couleur de remplissage dégradée et dont les contours ont été
affinés (voir ci-dessous).
Outil de transparence
Les navigateurs Internet récents, tout comme Web Designer, prennent en charge les effets avancés de
transparence. Vous pouvez modifier n'importe quel graphique ou photo de sorte à ce que ces derniers
deviennent transparents. Testez sur votre exemple de rectangle. Sélectionnez l'outil de transparence et
déplacez le curseur sur la barre d'infos.
Web Designer va plus loin et prend également en charge des dégradés de transparence. Cela fonctionne
de manière similaire au remplissage avec un dégradé de couleur. Il suffit de tirer sur les formes dans l'outil
Page 101
de transparence pour créer une transition de transparence. Vous pouvez modifier le degré de
transparence à chaque extrémité de la flèche de remplissage en cliquant sur celle-ci et en déplaçant le
curseur de transparence.
Consultez l'aperçu et vous verrez que cela fonctionne également dans votre navigateur Internet.
Plume
Il s'agit d'un terme graphique décrivant une procédure qui consiste à masquer les coins des objets. Web
Designer dispose d'une fonction « Plume » qui peut être utilisée avec tous les objets, graphiques, textes
ou photos : elle permet de rendre les coins flous de sorte à ce que ceux-ci se fondent dans l'arrière-plan.
L'outil Plume ne se situe pas sur la gauche mais en haut dans la barre supérieure. Expérimentez sur votre
rectangle. Sélectionnez la forme puis cliquez sur l'outil Plume dans la barre supérieure.
L'ombre située sous le dessin en forme de balle a des angles atténués. En combinant toutes ces
commandes, vous pouvez obtenir très rapidement des graphiques en calques étonnants pour vos
documents ou votre site Internet, directement dans Web Designer sans utiliser d'autre outil graphique.
Voici un exemple de rectangle aux angles
arrondis avec un dégradé de couleurs, de
transparence et des angles atténués avec du
texte placé au-dessus.
La couleur de remplissage est dégradée et
s'étend de la gauche vers la droite du vert
clair au vert foncé. Remarquez également un
dégradé de transparence du haut vers le bas.
L'outil Plume permet de créer les angles
arrondis. Quelques secondes sont
nécessaires pour créer une telle image, et elle
sera automatiquement convertie en graphique
correct lors de la sauvegarde de votre page
Web. Avec Web Designer, vous avez la
possibilité de créer n'importe quel type de
graphique, de photo, de texte avec
transparence. Le logiciel est également
capable d'importer des fichiers graphiques
de différents formats (fichiers EPS d'Adobe,
PSD de Photoshop, RAW d'appareils
photos et bien plus).
Remarque technique : Web Designer convertit automatiquement tous les graphiques vectoriels en images
au format PNG, un canal alpha PNG, s'ils contiennent un effet de transparence. Des calques CSS sont
utilisés pour imiter l'ordre d'apparition des objets dans Web Designer. Ceci est compatible avec tous les
navigateurs Internet actuels.
Outil ombres
L'un des effet graphique très apprécié consiste à créer une ombre douce sous un graphisme ou du texte.
Cet effet met l'objet en relief par rapport à l'arrière-plan.
L'outil Ombre
vous permet d'ajouter une ombre douce à un objet, du texte, des
graphismes ou une photo. Sélectionnez l'outil Ombre et glissez-le sur
l'objet. Vous pouvez modifier le flou de l'ombre et la transparence en
Page 102
utilisant des fonctionnalités de la Barre d'infos.
Texte avec une ombre douce.
Pour ajuster la position d'une ombre, allez dans l'outil Ombre puis glissez sur l'ombre
Note avancée
: Notez que l'ombre étant elle-même semi-transparente (une partie des objets ci-dessous sont visibles
sous l'ombre), les objets ombrés sont convertis en images PNG lors de la sauvegarde en page Web
(c'est le seul format qui supporte la transparence). Les images PNG peuvent être grandes, notamment
pour les photos. C'est le format idéal pour les images telles que le graphisme ombré ci-dessus.
Vous pensez peut-être que convertir le graphisme en image JPEG vous ferez gagner de l'espace. Selon
ce qui se trouve sous l'ombre, cela peut ou non fonctionner. Si c'est un arrière-plan sans texte uni ou
statique, vous pourrez probablement utiliser une image JPEG (fichier beaucoup plus léger, permet un
télécharger plus rapidement du site Internet). Pour convertir un objet en JPEG, utilisez l'onglet Image de
la boîte de dialogue Propriétés Web.
Les images JPEG ne peuvent pas contenir d'éléments semi-transparents. Ainsi, lors de la création d'une
image JPEG d'un objet semi-transparent, Web Designer intègre à l'image l'arrière-plan (ce qui se trouve
derrière la partie semi-transparente). Le positionnement exact des pixels rend la différence invisible.
Cette technique ne fonctionne pas si l'objet ombré ou semi-transparent est placé sur du texte, ce dernier
étant alors intégré dans le graphisme.
Exemple de graphiques
Vous pouvez voir ici un excellent exemple des possibilités de création offertes par Web Designer. Ce
bouton combine plusieurs fonctionnalités décrites ci-dessus : il a été créé à partir de la combinaison de
quelques formes dont les contours ont été affinés et qui utilisent un dégradé de transparence (effet de
réflexion blanche). Le texte a une légère ombre douce et le bouton a une ombre brillante. Les éléments
sont groupés. (Il n'est pas nécessaire de redessiner ce bouton car il est disponible dans la catégorie
« Boutons » de la galerie des modèles).
L'avantage majeur des graphiques vectoriels, en comparaison avec des graphiques Bitmap créés à l'aide
d'un logiciel d'édition de pixels (Photoshop par exemple), réside dans le fait que vous pouvez recolorer,
éditer, faire pivoter et redimensionner le bouton sans aucune perte de qualité. Agrandissez-le à l'extrême
par exemple et vous verrez que sa netteté sera conservée.
De plus, vous pouvez le recolorer à l'aide du système des « Couleurs nommées » et l'étirer à volonté :
toutes les étapes de travail de Web Designer sont non-destructives (ce qui signifie que vous pouvez
éditer autant de fois que vous voulez et la qualité ne subira aucune perte).
Les procédures nécessitant beaucoup de maîtrise et de patience dans d'autres logiciels de graphisme sont
extrêmement simples dans Web Designer.
Page 103
Outil de transparence
Les navigateurs Internet récents, tout comme Web Designer, prennent en charge les effets avancés de
transparence. Vous pouvez modifier n'importe quel graphique ou photo de sorte à ce que ces derniers
deviennent transparents. Testez sur votre exemple de rectangle. Sélectionnez l'outil de transparence et
déplacez le curseur sur la barre d'infos.
Web Designer va plus loin et prend également en charge des dégradés de transparence. Cela fonctionne
de manière similaire au remplissage avec un dégradé de couleur. Il suffit de tirer sur les formes dans l'outil
de transparence pour créer une transition de transparence. Vous pouvez modifier le degré de
transparence à chaque extrémité de la flèche de remplissage en cliquant sur celle-ci et en déplaçant le
curseur de transparence.
Consultez l'aperçu et vous verrez que cela fonctionne également dans votre navigateur Internet.
Plume
Il s'agit d'un terme graphique décrivant une procédure qui consiste à masquer les coins des objets. Web
Designer dispose d'une fonction « Plume » qui peut être utilisée avec tous les objets, graphiques, textes
ou photos : elle permet de rendre les coins flous de sorte à ce que ceux-ci se fondent dans l'arrière-plan.
L'outil Plume ne se situe pas sur la gauche mais en haut dans la barre supérieure. Expérimentez sur votre
rectangle. Sélectionnez la forme puis cliquez sur l'outil Plume dans la barre supérieure.
L'ombre située sous le dessin en forme de balle a des angles atténués. En combinant toutes ces
commandes, vous pouvez obtenir très rapidement des graphiques en calques étonnants pour vos
documents ou votre site Internet, directement dans Web Designer sans utiliser d'autre outil graphique.
Voici un exemple de rectangle aux angles
arrondis avec un dégradé de couleurs, de
transparence et des angles atténués avec du
texte placé au-dessus.
La couleur de remplissage est dégradée et
s'étend de la gauche vers la droite du vert
clair au vert foncé. Remarquez également un
dégradé de transparence du haut vers le bas.
L'outil Plume permet de créer les angles
arrondis. Quelques secondes sont
nécessaires pour créer une telle image, et elle
sera automatiquement convertie en graphique
correct lors de la sauvegarde de votre page
Web. Avec Web Designer, vous avez la
possibilité de créer n'importe quel type de
graphique, de photo, de texte avec
transparence. Le logiciel est également
capable d'importer des fichiers graphiques
de différents formats (fichiers EPS d'Adobe,
PSD de Photoshop, RAW d'appareils
photos et bien plus).
Remarque technique : Web Designer convertit automatiquement tous les graphiques vectoriels en images
au format PNG, un canal alpha PNG, s'ils contiennent un effet de transparence. Des calques CSS sont
Page 104
utilisés pour imiter l'ordre d'apparition des objets dans Web Designer. Ceci est compatible avec tous les
navigateurs Internet actuels.
Outil ombres
L'un des effet graphique très apprécié consiste à créer une ombre douce sous un graphisme ou du texte.
Cet effet met l'objet en relief par rapport à l'arrière-plan.
L'outil Ombre
vous permet d'ajouter une ombre douce à un objet, du texte, des
graphismes ou une photo. Sélectionnez l'outil Ombre et glissez-le sur
l'objet. Vous pouvez modifier le flou de l'ombre et la transparence en
utilisant des fonctionnalités de la Barre d'infos.
Texte avec une ombre douce.
Pour ajuster la position d'une ombre, allez dans l'outil Ombre puis glissez sur l'ombre
Note avancée
: Notez que l'ombre étant elle-même semi-transparente (une partie des objets ci-dessous sont visibles
sous l'ombre), les objets ombrés sont convertis en images PNG lors de la sauvegarde en page Web
(c'est le seul format qui supporte la transparence). Les images PNG peuvent être grandes, notamment
pour les photos. C'est le format idéal pour les images telles que le graphisme ombré ci-dessus.
Vous pensez peut-être que convertir le graphisme en image JPEG vous ferez gagner de l'espace. Selon
ce qui se trouve sous l'ombre, cela peut ou non fonctionner. Si c'est un arrière-plan sans texte uni ou
statique, vous pourrez probablement utiliser une image JPEG (fichier beaucoup plus léger, permet un
télécharger plus rapidement du site Internet). Pour convertir un objet en JPEG, utilisez l'onglet Image de
la boîte de dialogue Propriétés Web.
Les images JPEG ne peuvent pas contenir d'éléments semi-transparents. Ainsi, lors de la création d'une
image JPEG d'un objet semi-transparent, Web Designer intègre à l'image l'arrière-plan (ce qui se trouve
derrière la partie semi-transparente). Le positionnement exact des pixels rend la différence invisible.
Cette technique ne fonctionne pas si l'objet ombré ou semi-transparent est placé sur du texte, ce dernier
étant alors intégré dans le graphisme.
Exemple de graphiques
Vous pouvez voir ici un excellent exemple des possibilités de création offertes par Web Designer. Ce
bouton combine plusieurs fonctionnalités décrites ci-dessus : il a été créé à partir de la combinaison de
quelques formes dont les contours ont été affinés et qui utilisent un dégradé de transparence (effet de
réflexion blanche). Le texte a une légère ombre douce et le bouton a une ombre brillante. Les éléments
sont groupés. (Il n'est pas nécessaire de redessiner ce bouton car il est disponible dans la catégorie
« Boutons » de la galerie des modèles).
L'avantage majeur des graphiques vectoriels, en comparaison avec des graphiques Bitmap créés à l'aide
d'un logiciel d'édition de pixels (Photoshop par exemple), réside dans le fait que vous pouvez recolorer,
éditer, faire pivoter et redimensionner le bouton sans aucune perte de qualité. Agrandissez-le à l'extrême
par exemple et vous verrez que sa netteté sera conservée.
Page 105
De plus, vous pouvez le recolorer à l'aide du système des « Couleurs nommées » et l'étirer à volonté :
toutes les étapes de travail de Web Designer sont non-destructives (ce qui signifie que vous pouvez
éditer autant de fois que vous voulez et la qualité ne subira aucune perte).
Les procédures nécessitant beaucoup de maîtrise et de patience dans d'autres logiciels de graphisme sont
extrêmement simples dans Web Designer.
Page 106
Plume
Il s'agit d'un terme graphique décrivant une procédure qui consiste à masquer les coins des objets. Web
Designer dispose d'une fonction « Plume » qui peut être utilisée avec tous les objets, graphiques, textes
ou photos : elle permet de rendre les coins flous de sorte à ce que ceux-ci se fondent dans l'arrière-plan.
L'outil Plume ne se situe pas sur la gauche mais en haut dans la barre supérieure. Expérimentez sur votre
rectangle. Sélectionnez la forme puis cliquez sur l'outil Plume dans la barre supérieure.
L'ombre située sous le dessin en forme de balle a des angles atténués. En combinant toutes ces
commandes, vous pouvez obtenir très rapidement des graphiques en calques étonnants pour vos
documents ou votre site Internet, directement dans Web Designer sans utiliser d'autre outil graphique.
Voici un exemple de rectangle aux angles
arrondis avec un dégradé de couleurs, de
transparence et des angles atténués avec du
texte placé au-dessus.
La couleur de remplissage est dégradée et
s'étend de la gauche vers la droite du vert
clair au vert foncé. Remarquez également un
dégradé de transparence du haut vers le bas.
L'outil Plume permet de créer les angles
arrondis. Quelques secondes sont
nécessaires pour créer une telle image, et elle
sera automatiquement convertie en graphique
correct lors de la sauvegarde de votre page
Web. Avec Web Designer, vous avez la
possibilité de créer n'importe quel type de
graphique, de photo, de texte avec
transparence. Le logiciel est également
capable d'importer des fichiers graphiques
de différents formats (fichiers EPS d'Adobe,
PSD de Photoshop, RAW d'appareils
photos et bien plus).
Remarque technique : Web Designer convertit automatiquement tous les graphiques vectoriels en images
au format PNG, un canal alpha PNG, s'ils contiennent un effet de transparence. Des calques CSS sont
utilisés pour imiter l'ordre d'apparition des objets dans Web Designer. Ceci est compatible avec tous les
navigateurs Internet actuels.
Outil ombres
L'un des effet graphique très apprécié consiste à créer une ombre douce sous un graphisme ou du texte.
Cet effet met l'objet en relief par rapport à l'arrière-plan.
L'outil Ombre
vous permet d'ajouter une ombre douce à un objet, du texte, des
graphismes ou une photo. Sélectionnez l'outil Ombre et glissez-le sur
l'objet. Vous pouvez modifier le flou de l'ombre et la transparence en
utilisant des fonctionnalités de la Barre d'infos.
Page 107
Texte avec une ombre douce.
Pour ajuster la position d'une ombre, allez dans l'outil Ombre puis glissez sur l'ombre
Note avancée
: Notez que l'ombre étant elle-même semi-transparente (une partie des objets ci-dessous sont visibles
sous l'ombre), les objets ombrés sont convertis en images PNG lors de la sauvegarde en page Web
(c'est le seul format qui supporte la transparence). Les images PNG peuvent être grandes, notamment
pour les photos. C'est le format idéal pour les images telles que le graphisme ombré ci-dessus.
Vous pensez peut-être que convertir le graphisme en image JPEG vous ferez gagner de l'espace. Selon
ce qui se trouve sous l'ombre, cela peut ou non fonctionner. Si c'est un arrière-plan sans texte uni ou
statique, vous pourrez probablement utiliser une image JPEG (fichier beaucoup plus léger, permet un
télécharger plus rapidement du site Internet). Pour convertir un objet en JPEG, utilisez l'onglet Image de
la boîte de dialogue Propriétés Web.
Les images JPEG ne peuvent pas contenir d'éléments semi-transparents. Ainsi, lors de la création d'une
image JPEG d'un objet semi-transparent, Web Designer intègre à l'image l'arrière-plan (ce qui se trouve
derrière la partie semi-transparente). Le positionnement exact des pixels rend la différence invisible.
Cette technique ne fonctionne pas si l'objet ombré ou semi-transparent est placé sur du texte, ce dernier
étant alors intégré dans le graphisme.
Exemple de graphiques
Vous pouvez voir ici un excellent exemple des possibilités de création offertes par Web Designer. Ce
bouton combine plusieurs fonctionnalités décrites ci-dessus : il a été créé à partir de la combinaison de
quelques formes dont les contours ont été affinés et qui utilisent un dégradé de transparence (effet de
réflexion blanche). Le texte a une légère ombre douce et le bouton a une ombre brillante. Les éléments
sont groupés. (Il n'est pas nécessaire de redessiner ce bouton car il est disponible dans la catégorie
« Boutons » de la galerie des modèles).
L'avantage majeur des graphiques vectoriels, en comparaison avec des graphiques Bitmap créés à l'aide
d'un logiciel d'édition de pixels (Photoshop par exemple), réside dans le fait que vous pouvez recolorer,
éditer, faire pivoter et redimensionner le bouton sans aucune perte de qualité. Agrandissez-le à l'extrême
par exemple et vous verrez que sa netteté sera conservée.
De plus, vous pouvez le recolorer à l'aide du système des « Couleurs nommées » et l'étirer à volonté :
toutes les étapes de travail de Web Designer sont non-destructives (ce qui signifie que vous pouvez
éditer autant de fois que vous voulez et la qualité ne subira aucune perte).
Les procédures nécessitant beaucoup de maîtrise et de patience dans d'autres logiciels de graphisme sont
extrêmement simples dans Web Designer.
Page 108
Outil ombres
L'un des effet graphique très apprécié consiste à créer une ombre douce sous un graphisme ou du texte.
Cet effet met l'objet en relief par rapport à l'arrière-plan.
L'outil Ombre
vous permet d'ajouter une ombre douce à un objet, du texte, des
graphismes ou une photo. Sélectionnez l'outil Ombre et glissez-le sur
l'objet. Vous pouvez modifier le flou de l'ombre et la transparence en
utilisant des fonctionnalités de la Barre d'infos.
Texte avec une ombre douce.
Pour ajuster la position d'une ombre, allez dans l'outil Ombre puis glissez sur l'ombre
Note avancée
: Notez que l'ombre étant elle-même semi-transparente (une partie des objets ci-dessous sont visibles
sous l'ombre), les objets ombrés sont convertis en images PNG lors de la sauvegarde en page Web
(c'est le seul format qui supporte la transparence). Les images PNG peuvent être grandes, notamment
pour les photos. C'est le format idéal pour les images telles que le graphisme ombré ci-dessus.
Vous pensez peut-être que convertir le graphisme en image JPEG vous ferez gagner de l'espace. Selon
ce qui se trouve sous l'ombre, cela peut ou non fonctionner. Si c'est un arrière-plan sans texte uni ou
statique, vous pourrez probablement utiliser une image JPEG (fichier beaucoup plus léger, permet un
télécharger plus rapidement du site Internet). Pour convertir un objet en JPEG, utilisez l'onglet Image de
la boîte de dialogue Propriétés Web.
Les images JPEG ne peuvent pas contenir d'éléments semi-transparents. Ainsi, lors de la création d'une
image JPEG d'un objet semi-transparent, Web Designer intègre à l'image l'arrière-plan (ce qui se trouve
derrière la partie semi-transparente). Le positionnement exact des pixels rend la différence invisible.
Cette technique ne fonctionne pas si l'objet ombré ou semi-transparent est placé sur du texte, ce dernier
étant alors intégré dans le graphisme.
Exemple de graphiques
Vous pouvez voir ici un excellent exemple des possibilités de création offertes par Web Designer. Ce
bouton combine plusieurs fonctionnalités décrites ci-dessus : il a été créé à partir de la combinaison de
quelques formes dont les contours ont été affinés et qui utilisent un dégradé de transparence (effet de
réflexion blanche). Le texte a une légère ombre douce et le bouton a une ombre brillante. Les éléments
sont groupés. (Il n'est pas nécessaire de redessiner ce bouton car il est disponible dans la catégorie
« Boutons » de la galerie des modèles).
L'avantage majeur des graphiques vectoriels, en comparaison avec des graphiques Bitmap créés à l'aide
d'un logiciel d'édition de pixels (Photoshop par exemple), réside dans le fait que vous pouvez recolorer,
éditer, faire pivoter et redimensionner le bouton sans aucune perte de qualité. Agrandissez-le à l'extrême
par exemple et vous verrez que sa netteté sera conservée.
Page 109
De plus, vous pouvez le recolorer à l'aide du système des « Couleurs nommées » et l'étirer à volonté :
toutes les étapes de travail de Web Designer sont non-destructives (ce qui signifie que vous pouvez
éditer autant de fois que vous voulez et la qualité ne subira aucune perte).
Les procédures nécessitant beaucoup de maîtrise et de patience dans d'autres logiciels de graphisme sont
extrêmement simples dans Web Designer.
Page 110
Exemple de graphiques
Vous pouvez voir ici un excellent exemple des possibilités de création offertes par Web Designer. Ce
bouton combine plusieurs fonctionnalités décrites ci-dessus : il a été créé à partir de la combinaison de
quelques formes dont les contours ont été affinés et qui utilisent un dégradé de transparence (effet de
réflexion blanche). Le texte a une légère ombre douce et le bouton a une ombre brillante. Les éléments
sont groupés. (Il n'est pas nécessaire de redessiner ce bouton car il est disponible dans la catégorie
« Boutons » de la galerie des modèles).
L'avantage majeur des graphiques vectoriels, en comparaison avec des graphiques Bitmap créés à l'aide
d'un logiciel d'édition de pixels (Photoshop par exemple), réside dans le fait que vous pouvez recolorer,
éditer, faire pivoter et redimensionner le bouton sans aucune perte de qualité. Agrandissez-le à l'extrême
par exemple et vous verrez que sa netteté sera conservée.
De plus, vous pouvez le recolorer à l'aide du système des « Couleurs nommées » et l'étirer à volonté :
toutes les étapes de travail de Web Designer sont non-destructives (ce qui signifie que vous pouvez
éditer autant de fois que vous voulez et la qualité ne subira aucune perte).
Les procédures nécessitant beaucoup de maîtrise et de patience dans d'autres logiciels de graphisme sont
extrêmement simples dans Web Designer.
Page 111
Calques, survol de souris & fenêtres pop-up
Comme mentionné précédemment, tous les objets ont un ordre d'apparition sur la page : de l'objet
d'arrière-plan vers celui en premier plan.
Ces objets sont placés les uns au dessus des autres.
De plus, tous les éléments peuvent être placés dans des calques nommés. Chaque calque peut accueillir
autant d'objets que vous voulez et être activé ou désactivé. Si le calque est désactivé, tous les objets qu'il
contient sont invisibles.
Les calques sont contrôlés via l'icone de la galerie des calques
dans la barre d'outils supérieure.
Les calques de Web Designer sont conçus pour que vous puissiez y utiliser des effets de survol de souris.
Cela inclut des boutons en surbrillance (ils s'illuminent lorsque vous les survolez avec le curseur de la
souris) ainsi que d'autres effets pop-up comme des panneaux de textes contenant une description
détaillée pour un produit par exemple.
Effets de survol de souris
Il y a deux types d'effets de survol de souris que vous pouvez paramétrer. Le premier est utilisé pour des
boutons contenant des objets dotés d'un lien Internet : le survol de ce bouton avec le curseur de la souris
affiche un objet graphique superposé au bouton, sur le calque nommé « Survol de souris »
. Voir ci-dessous pour plus de détails.
La seconde possibilité est plus performante : vous pouvez faire apparaître les contenus de chaque calque
en tant qu'effet de survol de souris ou bien en cliquant sur un objet de votre page. Vous pouvez placer et
combiner du texte, des graphiques, des photos ou les trois sur ce calque pop-up. Plus d'informations
ci-dessous.
Calques MouseOff et MouseOver (souris inférieure et
supérieure)
Tous les objets principaux de votre site Web sont placés sur le calque inférieur, appelé usuellement
MouseOff. Sur la page Web, les boutons en surbrillance lorsque vous les survolez avec le curseur de la
souris disposent d'un autre graphique situé sur le calque appelé MouseOver
.
Page 112
Si vous ouvrez la galerie des calques, vous pouvez masquer ou afficher chacun des calques en cochant
ou décochant la case de visibilité (colonne gauche sous le symbole en forme d'oeil). Ainsi, vous pouvez
voir à quoi ressembleront les éléments Mouseover sur votre page.
Le calque utilisé actuellement est toujours en surbrillance dans la galerie des calques - le calque
MouseOff dans l'illustration ci-dessus - et il s'agit de celui dans lequel tous les nouveaux objets seront
dessinés. Afin de placer des objets sur n'importe quels autres calques, il suffit de cliquer sur le calque
souhaité dans la galerie des calques, de vous assurer qu'il est activé et éditable (les cases doivent être
cochées).
Remarque : le calque défini en tant que MouseOver doit toujours se situer au dessus du calque
MouseOff, comme indiqué dans l'exemple ci-dessus.
Afin de pouvoir éditer les objets sur un calque, assurez-vous que les cases « Visible » et « Pointeur »
soient bien cochées.
Déplacer des objets d'un calque à l'autre
Vous pouvez couper un objet (Ctrl+X), sélectionnez un nouveau calque (cliquez sur son nom dans la
Galerie des calques) et Coller (Ctrl+V). Une autre possibilité est de « Copier à la même place »
(Ctrl+Maj+V), ce qui copiera l'objet dans la même position que celle où vous l'avez copié. Vérifiez que
les cases Visibilité et Éditer sont cochées pour pouvoir visualiser et éditer l'objet dans le nouveau calque.
Boutons de survol de souris
Dans Web Designer, presque tous les boutons prêts à l'emploi de la Galerie des modèles
ont un effet de survol de la souris. Chaque bouton possèdent deux version : la principale se situe dans le
calque « État normal » et la version en surbrillance dans le calque « Survol de la souris ».
En principe, il n'est pas nécessaire de s'en soucier car les deux boutons se comportent de la même
façon : si vous apportez des modifications sur l'un des deux, comme modifier le texte, les changements
seront répercutés sur l'autre version. Si vous déplacez, tirez sur ou redimensionnez un bouton dans le
calque « État normal », l'autre version (« Survol de la souris ») sera également modifiée, même si vous ne
pouvez pas le voir, grâce aux Groupes souples
.
Créer votre propre bouton de survol de souris
Il est possible de créer vos propres boutons de survol de la souris en dessinant les éléments nécessaires
à partir des rectangles, du texte, etc. Il vous suffit de dessiner les éléments principaux du bouton sur le
calque État normal (rappelez-vous de le regrouper
) et de placer la version « en surbrillance » correspondante sur le calque Survol de la souris. Tant que la
Page 113
version État normal est reliée à une adresse Web, la version Survol de la souris sera automatiquement
affichée lorsque vous passerez la souris sur la page Web (le calque Survol de la souris doit être
au-dessus du calque État normal).
En d'autres termes, vous donnez à l'objet principal une Adresse Web en
utilisant l'option de liens, puis vous sélectionnez le calque Survol de la
souris dans la Galerie des calques. Ensuite, placez les versions de boutons
avec survol de la souris sur ce calque pour qu'il soit superposé à l'objet
relié.
Remarque technique :
Tous les objets graphiques du calque Survol de la souris seront affichés si au moins 50 % de l'objet se
superpose sur le calque État normal. Ces deux versions des boutons de survol de la souris sont
synchronisés grâce aux fonctionnalités des Groupes souples. Lorsque vous sélectionnez le bouton sur un
calque, il sélectionne automatiquement la version Groupe souple de l'autre calque, même si ce dernier est
inactif. Lorsque vous éditez le texte d'un bouton sur un calque, le changement est automatiquement
synchronisé avec l'autre version du bouton.
Pour vous assurer que le texte des deux versions État normal et Survol de la souris change lorsque vous
modifiez l'une des deux versions, transformez les boutons des deux calques en Groupe souple. Pour ce
faire, vous aurez besoin d'activer les deux calques dans la Galerie des calques et de sélectionner à
l'aide du lasso les deux boutons. La ligne de statut vous dira si tout est bien sélectionné. Sélectionnez
Arranger ->Appliquer le Groupe souple
. Désormais, lorsque vous éditerez le texte du calque État normal, il changera également sur le calque
Survol de la souris, même s'il est caché. (Notez que cela fonctionne uniquement si les textes des versions
État normal et Survol de la souris sont identiques au départ et si les objets sont basés sur des Groupes
souples).
Calques pop-ups
Il existe une solution plus efficace pour vous permettre d'afficher le contenu d'un calque dès que vous
passez la souris dessus ou que vous cliquez sur un objet. Elle peut être utilisée pour une gamme de
différents effets pop-ups, comme des photos, des menus ou des descriptions détaillées d'objets.
Placez tous les objets que vous voulez voir s'afficher en pop-up dans un nouveau calque (dans la Galerie
des calques, cliquez sur Nouveau - n'utilisez pas le calque Survol de la souris). Définissez ensuite les
propriétés de Survol de la souris (boîte de dialogue Propriétés Web
) de l'objet original pour déclencher l'affichage de ce calque lorsque vous passez sur un objet avec la
souris. Par exemple, vous pouvez faire apparaître un pop-up comme celui-ci en passant au-dessus de
texte :
Voici les étapes pour créer un bloc de texte pop-up comme celui-ci :
1. Cliquez sur Nouveau dans la Galerie des calques pour créer un nouveau calque.
2. Dessinez un rectangle aux bords arrondis avec l'outil Rectangle, cliquez sur une pastille de
couleur (pâle) sur la Palette de couleurs pour le remplir avec une couleur. Pour une bonne
mesure, ajoutez une ombre douce (sélectionnez l'outil Ombre et faites-le glisser sur le rectangle).
3. Créez un bloc de texte en haut de votre rectangle. Sélectionnez l'outil Texte et tirez sur le
rectangle en diagonale. Saisissez votre texte. Vous souhaiterez probablement masquer le calque
pop-up. Pour cela, décochez la case « Voir » de votre nouveau calque.
Page 114
4. Dans le calque de base (État normal) : cliquez sur la Galerie des calques pour le régler en tant
que calque en cours puis sélectionnez le texte que vous voulez utiliser pour déclencher le pop-up
en utilisant la méthode habituelle (dans l'outil Texte). Ouvrez la boîte de dialogue des Propriétés
Web (Ctrl+Maj+W) et sur l'onglet Survol de la souris, sélectionnez le nouveau calque du menu
déroulant « Afficher le calque du pop-up ». Cliquez sur OK.
5. Prévisualiser et tester les effets de survol de la souris.
Si vous souhaitez que le pop-up apparaisse seulement lorsque l'on clique, sélectionnez la même option
que dans l'onglet Lien de la même boîte de dialogue Propriétés Web
.
Remarque :
Le calque Survol de la souris apparaît et disparaît lorsque vous déplacez le pointeur de la souris sur
l'objet pop-up. Si vous utilisez le clic pour afficher le calque (de la boîte de dialogue Lien), le calque est
révélé en cliquant sur l'objet et est masqué lorsque vous cliquez ailleurs sur la page.
Photos pop-ups
Il existe une autre manière plus simple d'afficher des photos élargies à partir de miniatures et qui ne
nécessite pas la création de nouveaux calques. Voir ici
. Cette méthode est plus appropriée lorsque les photos pop-ups sont grandes, car elles ne se chargent
pas tant que l'on a pas cliqué sur l'image miniature.
Page 115
Effets de survol de souris
Il y a deux types d'effets de survol de souris que vous pouvez paramétrer. Le premier est utilisé pour des
boutons contenant des objets dotés d'un lien Internet : le survol de ce bouton avec le curseur de la souris
affiche un objet graphique superposé au bouton, sur le calque nommé « Survol de souris »
. Voir ci-dessous pour plus de détails.
La seconde possibilité est plus performante : vous pouvez faire apparaître les contenus de chaque calque
en tant qu'effet de survol de souris ou bien en cliquant sur un objet de votre page. Vous pouvez placer et
combiner du texte, des graphiques, des photos ou les trois sur ce calque pop-up. Plus d'informations
ci-dessous.
Calques MouseOff et MouseOver (souris inférieure et
supérieure)
Tous les objets principaux de votre site Web sont placés sur le calque inférieur, appelé usuellement
MouseOff. Sur la page Web, les boutons en surbrillance lorsque vous les survolez avec le curseur de la
souris disposent d'un autre graphique situé sur le calque appelé MouseOver
.
Si vous ouvrez la galerie des calques, vous pouvez masquer ou afficher chacun des calques en cochant
ou décochant la case de visibilité (colonne gauche sous le symbole en forme d'oeil). Ainsi, vous pouvez
voir à quoi ressembleront les éléments Mouseover sur votre page.
Le calque utilisé actuellement est toujours en surbrillance dans la galerie des calques - le calque
MouseOff dans l'illustration ci-dessus - et il s'agit de celui dans lequel tous les nouveaux objets seront
dessinés. Afin de placer des objets sur n'importe quels autres calques, il suffit de cliquer sur le calque
souhaité dans la galerie des calques, de vous assurer qu'il est activé et éditable (les cases doivent être
cochées).
Remarque : le calque défini en tant que MouseOver doit toujours se situer au dessus du calque
MouseOff, comme indiqué dans l'exemple ci-dessus.
Afin de pouvoir éditer les objets sur un calque, assurez-vous que les cases « Visible » et « Pointeur »
soient bien cochées.
Déplacer des objets d'un calque à l'autre
Vous pouvez couper un objet (Ctrl+X), sélectionnez un nouveau calque (cliquez sur son nom dans la
Galerie des calques) et Coller (Ctrl+V). Une autre possibilité est de « Copier à la même place »
(Ctrl+Maj+V), ce qui copiera l'objet dans la même position que celle où vous l'avez copié. Vérifiez que
les cases Visibilité et Éditer sont cochées pour pouvoir visualiser et éditer l'objet dans le nouveau calque.
Page 116
Boutons de survol de souris
Dans Web Designer, presque tous les boutons prêts à l'emploi de la Galerie des modèles
ont un effet de survol de la souris. Chaque bouton possèdent deux version : la principale se situe dans le
calque « État normal » et la version en surbrillance dans le calque « Survol de la souris ».
En principe, il n'est pas nécessaire de s'en soucier car les deux boutons se comportent de la même
façon : si vous apportez des modifications sur l'un des deux, comme modifier le texte, les changements
seront répercutés sur l'autre version. Si vous déplacez, tirez sur ou redimensionnez un bouton dans le
calque « État normal », l'autre version (« Survol de la souris ») sera également modifiée, même si vous ne
pouvez pas le voir, grâce aux Groupes souples
.
Créer votre propre bouton de survol de souris
Il est possible de créer vos propres boutons de survol de la souris en dessinant les éléments nécessaires
à partir des rectangles, du texte, etc. Il vous suffit de dessiner les éléments principaux du bouton sur le
calque État normal (rappelez-vous de le regrouper
) et de placer la version « en surbrillance » correspondante sur le calque Survol de la souris. Tant que la
version État normal est reliée à une adresse Web, la version Survol de la souris sera automatiquement
affichée lorsque vous passerez la souris sur la page Web (le calque Survol de la souris doit être
au-dessus du calque État normal).
En d'autres termes, vous donnez à l'objet principal une Adresse Web en
utilisant l'option de liens, puis vous sélectionnez le calque Survol de la
souris dans la Galerie des calques. Ensuite, placez les versions de boutons
avec survol de la souris sur ce calque pour qu'il soit superposé à l'objet
relié.
Remarque technique :
Tous les objets graphiques du calque Survol de la souris seront affichés si au moins 50 % de l'objet se
superpose sur le calque État normal. Ces deux versions des boutons de survol de la souris sont
synchronisés grâce aux fonctionnalités des Groupes souples. Lorsque vous sélectionnez le bouton sur un
calque, il sélectionne automatiquement la version Groupe souple de l'autre calque, même si ce dernier est
inactif. Lorsque vous éditez le texte d'un bouton sur un calque, le changement est automatiquement
synchronisé avec l'autre version du bouton.
Pour vous assurer que le texte des deux versions État normal et Survol de la souris change lorsque vous
modifiez l'une des deux versions, transformez les boutons des deux calques en Groupe souple. Pour ce
faire, vous aurez besoin d'activer les deux calques dans la Galerie des calques et de sélectionner à
l'aide du lasso les deux boutons. La ligne de statut vous dira si tout est bien sélectionné. Sélectionnez
Arranger ->Appliquer le Groupe souple
. Désormais, lorsque vous éditerez le texte du calque État normal, il changera également sur le calque
Survol de la souris, même s'il est caché. (Notez que cela fonctionne uniquement si les textes des versions
État normal et Survol de la souris sont identiques au départ et si les objets sont basés sur des Groupes
souples).
Calques pop-ups
Il existe une solution plus efficace pour vous permettre d'afficher le contenu d'un calque dès que vous
passez la souris dessus ou que vous cliquez sur un objet. Elle peut être utilisée pour une gamme de
différents effets pop-ups, comme des photos, des menus ou des descriptions détaillées d'objets.
Placez tous les objets que vous voulez voir s'afficher en pop-up dans un nouveau calque (dans la Galerie
des calques, cliquez sur Nouveau - n'utilisez pas le calque Survol de la souris). Définissez ensuite les
propriétés de Survol de la souris (boîte de dialogue Propriétés Web
Page 117
) de l'objet original pour déclencher l'affichage de ce calque lorsque vous passez sur un objet avec la
souris. Par exemple, vous pouvez faire apparaître un pop-up comme celui-ci en passant au-dessus de
texte :
Voici les étapes pour créer un bloc de texte pop-up comme celui-ci :
1. Cliquez sur Nouveau dans la Galerie des calques pour créer un nouveau calque.
2. Dessinez un rectangle aux bords arrondis avec l'outil Rectangle, cliquez sur une pastille de
couleur (pâle) sur la Palette de couleurs pour le remplir avec une couleur. Pour une bonne
mesure, ajoutez une ombre douce (sélectionnez l'outil Ombre et faites-le glisser sur le rectangle).
3. Créez un bloc de texte en haut de votre rectangle. Sélectionnez l'outil Texte et tirez sur le
rectangle en diagonale. Saisissez votre texte. Vous souhaiterez probablement masquer le calque
pop-up. Pour cela, décochez la case « Voir » de votre nouveau calque.
4. Dans le calque de base (État normal) : cliquez sur la Galerie des calques pour le régler en tant
que calque en cours puis sélectionnez le texte que vous voulez utiliser pour déclencher le pop-up
en utilisant la méthode habituelle (dans l'outil Texte). Ouvrez la boîte de dialogue des Propriétés
Web (Ctrl+Maj+W) et sur l'onglet Survol de la souris, sélectionnez le nouveau calque du menu
déroulant « Afficher le calque du pop-up ». Cliquez sur OK.
5. Prévisualiser et tester les effets de survol de la souris.
Si vous souhaitez que le pop-up apparaisse seulement lorsque l'on clique, sélectionnez la même option
que dans l'onglet Lien de la même boîte de dialogue Propriétés Web
.
Remarque :
Le calque Survol de la souris apparaît et disparaît lorsque vous déplacez le pointeur de la souris sur
l'objet pop-up. Si vous utilisez le clic pour afficher le calque (de la boîte de dialogue Lien), le calque est
révélé en cliquant sur l'objet et est masqué lorsque vous cliquez ailleurs sur la page.
Photos pop-ups
Il existe une autre manière plus simple d'afficher des photos élargies à partir de miniatures et qui ne
nécessite pas la création de nouveaux calques. Voir ici
. Cette méthode est plus appropriée lorsque les photos pop-ups sont grandes, car elles ne se chargent
pas tant que l'on a pas cliqué sur l'image miniature.
Page 118
Calques MouseOff et MouseOver (souris inférieure et
supérieure)
Tous les objets principaux de votre site Web sont placés sur le calque inférieur, appelé usuellement
MouseOff. Sur la page Web, les boutons en surbrillance lorsque vous les survolez avec le curseur de la
souris disposent d'un autre graphique situé sur le calque appelé MouseOver
.
Si vous ouvrez la galerie des calques, vous pouvez masquer ou afficher chacun des calques en cochant
ou décochant la case de visibilité (colonne gauche sous le symbole en forme d'oeil). Ainsi, vous pouvez
voir à quoi ressembleront les éléments Mouseover sur votre page.
Le calque utilisé actuellement est toujours en surbrillance dans la galerie des calques - le calque
MouseOff dans l'illustration ci-dessus - et il s'agit de celui dans lequel tous les nouveaux objets seront
dessinés. Afin de placer des objets sur n'importe quels autres calques, il suffit de cliquer sur le calque
souhaité dans la galerie des calques, de vous assurer qu'il est activé et éditable (les cases doivent être
cochées).
Remarque : le calque défini en tant que MouseOver doit toujours se situer au dessus du calque
MouseOff, comme indiqué dans l'exemple ci-dessus.
Afin de pouvoir éditer les objets sur un calque, assurez-vous que les cases « Visible » et « Pointeur »
soient bien cochées.
Déplacer des objets d'un calque à l'autre
Vous pouvez couper un objet (Ctrl+X), sélectionnez un nouveau calque (cliquez sur son nom dans la
Galerie des calques) et Coller (Ctrl+V). Une autre possibilité est de « Copier à la même place »
(Ctrl+Maj+V), ce qui copiera l'objet dans la même position que celle où vous l'avez copié. Vérifiez que
les cases Visibilité et Éditer sont cochées pour pouvoir visualiser et éditer l'objet dans le nouveau calque.
Boutons de survol de souris
Dans Web Designer, presque tous les boutons prêts à l'emploi de la Galerie des modèles
ont un effet de survol de la souris. Chaque bouton possèdent deux version : la principale se situe dans le
calque « État normal » et la version en surbrillance dans le calque « Survol de la souris ».
En principe, il n'est pas nécessaire de s'en soucier car les deux boutons se comportent de la même
façon : si vous apportez des modifications sur l'un des deux, comme modifier le texte, les changements
seront répercutés sur l'autre version. Si vous déplacez, tirez sur ou redimensionnez un bouton dans le
calque « État normal », l'autre version (« Survol de la souris ») sera également modifiée, même si vous ne
pouvez pas le voir, grâce aux Groupes souples
Page 119
.
Créer votre propre bouton de survol de souris
Il est possible de créer vos propres boutons de survol de la souris en dessinant les éléments nécessaires
à partir des rectangles, du texte, etc. Il vous suffit de dessiner les éléments principaux du bouton sur le
calque État normal (rappelez-vous de le regrouper
) et de placer la version « en surbrillance » correspondante sur le calque Survol de la souris. Tant que la
version État normal est reliée à une adresse Web, la version Survol de la souris sera automatiquement
affichée lorsque vous passerez la souris sur la page Web (le calque Survol de la souris doit être
au-dessus du calque État normal).
En d'autres termes, vous donnez à l'objet principal une Adresse Web en
utilisant l'option de liens, puis vous sélectionnez le calque Survol de la
souris dans la Galerie des calques. Ensuite, placez les versions de boutons
avec survol de la souris sur ce calque pour qu'il soit superposé à l'objet
relié.
Remarque technique :
Tous les objets graphiques du calque Survol de la souris seront affichés si au moins 50 % de l'objet se
superpose sur le calque État normal. Ces deux versions des boutons de survol de la souris sont
synchronisés grâce aux fonctionnalités des Groupes souples. Lorsque vous sélectionnez le bouton sur un
calque, il sélectionne automatiquement la version Groupe souple de l'autre calque, même si ce dernier est
inactif. Lorsque vous éditez le texte d'un bouton sur un calque, le changement est automatiquement
synchronisé avec l'autre version du bouton.
Pour vous assurer que le texte des deux versions État normal et Survol de la souris change lorsque vous
modifiez l'une des deux versions, transformez les boutons des deux calques en Groupe souple. Pour ce
faire, vous aurez besoin d'activer les deux calques dans la Galerie des calques et de sélectionner à
l'aide du lasso les deux boutons. La ligne de statut vous dira si tout est bien sélectionné. Sélectionnez
Arranger ->Appliquer le Groupe souple
. Désormais, lorsque vous éditerez le texte du calque État normal, il changera également sur le calque
Survol de la souris, même s'il est caché. (Notez que cela fonctionne uniquement si les textes des versions
État normal et Survol de la souris sont identiques au départ et si les objets sont basés sur des Groupes
souples).
Calques pop-ups
Il existe une solution plus efficace pour vous permettre d'afficher le contenu d'un calque dès que vous
passez la souris dessus ou que vous cliquez sur un objet. Elle peut être utilisée pour une gamme de
différents effets pop-ups, comme des photos, des menus ou des descriptions détaillées d'objets.
Placez tous les objets que vous voulez voir s'afficher en pop-up dans un nouveau calque (dans la Galerie
des calques, cliquez sur Nouveau - n'utilisez pas le calque Survol de la souris). Définissez ensuite les
propriétés de Survol de la souris (boîte de dialogue Propriétés Web
) de l'objet original pour déclencher l'affichage de ce calque lorsque vous passez sur un objet avec la
souris. Par exemple, vous pouvez faire apparaître un pop-up comme celui-ci en passant au-dessus de
texte :
Voici les étapes pour créer un bloc de texte pop-up comme celui-ci :
Page 120
1. Cliquez sur Nouveau dans la Galerie des calques pour créer un nouveau calque.
2. Dessinez un rectangle aux bords arrondis avec l'outil Rectangle, cliquez sur une pastille de
couleur (pâle) sur la Palette de couleurs pour le remplir avec une couleur. Pour une bonne
mesure, ajoutez une ombre douce (sélectionnez l'outil Ombre et faites-le glisser sur le rectangle).
3. Créez un bloc de texte en haut de votre rectangle. Sélectionnez l'outil Texte et tirez sur le
rectangle en diagonale. Saisissez votre texte. Vous souhaiterez probablement masquer le calque
pop-up. Pour cela, décochez la case « Voir » de votre nouveau calque.
4. Dans le calque de base (État normal) : cliquez sur la Galerie des calques pour le régler en tant
que calque en cours puis sélectionnez le texte que vous voulez utiliser pour déclencher le pop-up
en utilisant la méthode habituelle (dans l'outil Texte). Ouvrez la boîte de dialogue des Propriétés
Web (Ctrl+Maj+W) et sur l'onglet Survol de la souris, sélectionnez le nouveau calque du menu
déroulant « Afficher le calque du pop-up ». Cliquez sur OK.
5. Prévisualiser et tester les effets de survol de la souris.
Si vous souhaitez que le pop-up apparaisse seulement lorsque l'on clique, sélectionnez la même option
que dans l'onglet Lien de la même boîte de dialogue Propriétés Web
.
Remarque :
Le calque Survol de la souris apparaît et disparaît lorsque vous déplacez le pointeur de la souris sur
l'objet pop-up. Si vous utilisez le clic pour afficher le calque (de la boîte de dialogue Lien), le calque est
révélé en cliquant sur l'objet et est masqué lorsque vous cliquez ailleurs sur la page.
Photos pop-ups
Il existe une autre manière plus simple d'afficher des photos élargies à partir de miniatures et qui ne
nécessite pas la création de nouveaux calques. Voir ici
. Cette méthode est plus appropriée lorsque les photos pop-ups sont grandes, car elles ne se chargent
pas tant que l'on a pas cliqué sur l'image miniature.
Page 121
Déplacer des objets d'un calque à l'autre
Vous pouvez couper un objet (Ctrl+X), sélectionnez un nouveau calque (cliquez sur son nom dans la
Galerie des calques) et Coller (Ctrl+V). Une autre possibilité est de « Copier à la même place »
(Ctrl+Maj+V), ce qui copiera l'objet dans la même position que celle où vous l'avez copié. Vérifiez que
les cases Visibilité et Éditer sont cochées pour pouvoir visualiser et éditer l'objet dans le nouveau calque.
Boutons de survol de souris
Dans Web Designer, presque tous les boutons prêts à l'emploi de la Galerie des modèles
ont un effet de survol de la souris. Chaque bouton possèdent deux version : la principale se situe dans le
calque « État normal » et la version en surbrillance dans le calque « Survol de la souris ».
En principe, il n'est pas nécessaire de s'en soucier car les deux boutons se comportent de la même
façon : si vous apportez des modifications sur l'un des deux, comme modifier le texte, les changements
seront répercutés sur l'autre version. Si vous déplacez, tirez sur ou redimensionnez un bouton dans le
calque « État normal », l'autre version (« Survol de la souris ») sera également modifiée, même si vous ne
pouvez pas le voir, grâce aux Groupes souples
.
Créer votre propre bouton de survol de souris
Il est possible de créer vos propres boutons de survol de la souris en dessinant les éléments nécessaires
à partir des rectangles, du texte, etc. Il vous suffit de dessiner les éléments principaux du bouton sur le
calque État normal (rappelez-vous de le regrouper
) et de placer la version « en surbrillance » correspondante sur le calque Survol de la souris. Tant que la
version État normal est reliée à une adresse Web, la version Survol de la souris sera automatiquement
affichée lorsque vous passerez la souris sur la page Web (le calque Survol de la souris doit être
au-dessus du calque État normal).
En d'autres termes, vous donnez à l'objet principal une Adresse Web en
utilisant l'option de liens, puis vous sélectionnez le calque Survol de la
souris dans la Galerie des calques. Ensuite, placez les versions de boutons
avec survol de la souris sur ce calque pour qu'il soit superposé à l'objet
relié.
Remarque technique :
Tous les objets graphiques du calque Survol de la souris seront affichés si au moins 50 % de l'objet se
superpose sur le calque État normal. Ces deux versions des boutons de survol de la souris sont
synchronisés grâce aux fonctionnalités des Groupes souples. Lorsque vous sélectionnez le bouton sur un
calque, il sélectionne automatiquement la version Groupe souple de l'autre calque, même si ce dernier est
inactif. Lorsque vous éditez le texte d'un bouton sur un calque, le changement est automatiquement
synchronisé avec l'autre version du bouton.
Pour vous assurer que le texte des deux versions État normal et Survol de la souris change lorsque vous
modifiez l'une des deux versions, transformez les boutons des deux calques en Groupe souple. Pour ce
faire, vous aurez besoin d'activer les deux calques dans la Galerie des calques et de sélectionner à
l'aide du lasso les deux boutons. La ligne de statut vous dira si tout est bien sélectionné. Sélectionnez
Arranger ->Appliquer le Groupe souple
. Désormais, lorsque vous éditerez le texte du calque État normal, il changera également sur le calque
Survol de la souris, même s'il est caché. (Notez que cela fonctionne uniquement si les textes des versions
État normal et Survol de la souris sont identiques au départ et si les objets sont basés sur des Groupes
souples).
Calques pop-ups
Page 122
Il existe une solution plus efficace pour vous permettre d'afficher le contenu d'un calque dès que vous
passez la souris dessus ou que vous cliquez sur un objet. Elle peut être utilisée pour une gamme de
différents effets pop-ups, comme des photos, des menus ou des descriptions détaillées d'objets.
Placez tous les objets que vous voulez voir s'afficher en pop-up dans un nouveau calque (dans la Galerie
des calques, cliquez sur Nouveau - n'utilisez pas le calque Survol de la souris). Définissez ensuite les
propriétés de Survol de la souris (boîte de dialogue Propriétés Web
) de l'objet original pour déclencher l'affichage de ce calque lorsque vous passez sur un objet avec la
souris. Par exemple, vous pouvez faire apparaître un pop-up comme celui-ci en passant au-dessus de
texte :
Voici les étapes pour créer un bloc de texte pop-up comme celui-ci :
1. Cliquez sur Nouveau dans la Galerie des calques pour créer un nouveau calque.
2. Dessinez un rectangle aux bords arrondis avec l'outil Rectangle, cliquez sur une pastille de
couleur (pâle) sur la Palette de couleurs pour le remplir avec une couleur. Pour une bonne
mesure, ajoutez une ombre douce (sélectionnez l'outil Ombre et faites-le glisser sur le rectangle).
3. Créez un bloc de texte en haut de votre rectangle. Sélectionnez l'outil Texte et tirez sur le
rectangle en diagonale. Saisissez votre texte. Vous souhaiterez probablement masquer le calque
pop-up. Pour cela, décochez la case « Voir » de votre nouveau calque.
4. Dans le calque de base (État normal) : cliquez sur la Galerie des calques pour le régler en tant
que calque en cours puis sélectionnez le texte que vous voulez utiliser pour déclencher le pop-up
en utilisant la méthode habituelle (dans l'outil Texte). Ouvrez la boîte de dialogue des Propriétés
Web (Ctrl+Maj+W) et sur l'onglet Survol de la souris, sélectionnez le nouveau calque du menu
déroulant « Afficher le calque du pop-up ». Cliquez sur OK.
5. Prévisualiser et tester les effets de survol de la souris.
Si vous souhaitez que le pop-up apparaisse seulement lorsque l'on clique, sélectionnez la même option
que dans l'onglet Lien de la même boîte de dialogue Propriétés Web
.
Remarque :
Le calque Survol de la souris apparaît et disparaît lorsque vous déplacez le pointeur de la souris sur
l'objet pop-up. Si vous utilisez le clic pour afficher le calque (de la boîte de dialogue Lien), le calque est
révélé en cliquant sur l'objet et est masqué lorsque vous cliquez ailleurs sur la page.
Photos pop-ups
Il existe une autre manière plus simple d'afficher des photos élargies à partir de miniatures et qui ne
nécessite pas la création de nouveaux calques. Voir ici
. Cette méthode est plus appropriée lorsque les photos pop-ups sont grandes, car elles ne se chargent
pas tant que l'on a pas cliqué sur l'image miniature.
Page 123
Boutons de survol de souris
Dans Web Designer, presque tous les boutons prêts à l'emploi de la Galerie des modèles
ont un effet de survol de la souris. Chaque bouton possèdent deux version : la principale se situe dans le
calque « État normal » et la version en surbrillance dans le calque « Survol de la souris ».
En principe, il n'est pas nécessaire de s'en soucier car les deux boutons se comportent de la même
façon : si vous apportez des modifications sur l'un des deux, comme modifier le texte, les changements
seront répercutés sur l'autre version. Si vous déplacez, tirez sur ou redimensionnez un bouton dans le
calque « État normal », l'autre version (« Survol de la souris ») sera également modifiée, même si vous ne
pouvez pas le voir, grâce aux Groupes souples
.
Créer votre propre bouton de survol de souris
Il est possible de créer vos propres boutons de survol de la souris en dessinant les éléments nécessaires
à partir des rectangles, du texte, etc. Il vous suffit de dessiner les éléments principaux du bouton sur le
calque État normal (rappelez-vous de le regrouper
) et de placer la version « en surbrillance » correspondante sur le calque Survol de la souris. Tant que la
version État normal est reliée à une adresse Web, la version Survol de la souris sera automatiquement
affichée lorsque vous passerez la souris sur la page Web (le calque Survol de la souris doit être
au-dessus du calque État normal).
En d'autres termes, vous donnez à l'objet principal une Adresse Web en
utilisant l'option de liens, puis vous sélectionnez le calque Survol de la
souris dans la Galerie des calques. Ensuite, placez les versions de boutons
avec survol de la souris sur ce calque pour qu'il soit superposé à l'objet
relié.
Remarque technique :
Tous les objets graphiques du calque Survol de la souris seront affichés si au moins 50 % de l'objet se
superpose sur le calque État normal. Ces deux versions des boutons de survol de la souris sont
synchronisés grâce aux fonctionnalités des Groupes souples. Lorsque vous sélectionnez le bouton sur un
calque, il sélectionne automatiquement la version Groupe souple de l'autre calque, même si ce dernier est
inactif. Lorsque vous éditez le texte d'un bouton sur un calque, le changement est automatiquement
synchronisé avec l'autre version du bouton.
Pour vous assurer que le texte des deux versions État normal et Survol de la souris change lorsque vous
modifiez l'une des deux versions, transformez les boutons des deux calques en Groupe souple. Pour ce
faire, vous aurez besoin d'activer les deux calques dans la Galerie des calques et de sélectionner à
l'aide du lasso les deux boutons. La ligne de statut vous dira si tout est bien sélectionné. Sélectionnez
Arranger ->Appliquer le Groupe souple
. Désormais, lorsque vous éditerez le texte du calque État normal, il changera également sur le calque
Survol de la souris, même s'il est caché. (Notez que cela fonctionne uniquement si les textes des versions
État normal et Survol de la souris sont identiques au départ et si les objets sont basés sur des Groupes
souples).
Calques pop-ups
Il existe une solution plus efficace pour vous permettre d'afficher le contenu d'un calque dès que vous
passez la souris dessus ou que vous cliquez sur un objet. Elle peut être utilisée pour une gamme de
différents effets pop-ups, comme des photos, des menus ou des descriptions détaillées d'objets.
Placez tous les objets que vous voulez voir s'afficher en pop-up dans un nouveau calque (dans la Galerie
des calques, cliquez sur Nouveau - n'utilisez pas le calque Survol de la souris). Définissez ensuite les
propriétés de Survol de la souris (boîte de dialogue Propriétés Web
Page 124
) de l'objet original pour déclencher l'affichage de ce calque lorsque vous passez sur un objet avec la
souris. Par exemple, vous pouvez faire apparaître un pop-up comme celui-ci en passant au-dessus de
texte :
Voici les étapes pour créer un bloc de texte pop-up comme celui-ci :
1. Cliquez sur Nouveau dans la Galerie des calques pour créer un nouveau calque.
2. Dessinez un rectangle aux bords arrondis avec l'outil Rectangle, cliquez sur une pastille de
couleur (pâle) sur la Palette de couleurs pour le remplir avec une couleur. Pour une bonne
mesure, ajoutez une ombre douce (sélectionnez l'outil Ombre et faites-le glisser sur le rectangle).
3. Créez un bloc de texte en haut de votre rectangle. Sélectionnez l'outil Texte et tirez sur le
rectangle en diagonale. Saisissez votre texte. Vous souhaiterez probablement masquer le calque
pop-up. Pour cela, décochez la case « Voir » de votre nouveau calque.
4. Dans le calque de base (État normal) : cliquez sur la Galerie des calques pour le régler en tant
que calque en cours puis sélectionnez le texte que vous voulez utiliser pour déclencher le pop-up
en utilisant la méthode habituelle (dans l'outil Texte). Ouvrez la boîte de dialogue des Propriétés
Web (Ctrl+Maj+W) et sur l'onglet Survol de la souris, sélectionnez le nouveau calque du menu
déroulant « Afficher le calque du pop-up ». Cliquez sur OK.
5. Prévisualiser et tester les effets de survol de la souris.
Si vous souhaitez que le pop-up apparaisse seulement lorsque l'on clique, sélectionnez la même option
que dans l'onglet Lien de la même boîte de dialogue Propriétés Web
.
Remarque :
Le calque Survol de la souris apparaît et disparaît lorsque vous déplacez le pointeur de la souris sur
l'objet pop-up. Si vous utilisez le clic pour afficher le calque (de la boîte de dialogue Lien), le calque est
révélé en cliquant sur l'objet et est masqué lorsque vous cliquez ailleurs sur la page.
Photos pop-ups
Il existe une autre manière plus simple d'afficher des photos élargies à partir de miniatures et qui ne
nécessite pas la création de nouveaux calques. Voir ici
. Cette méthode est plus appropriée lorsque les photos pop-ups sont grandes, car elles ne se chargent
pas tant que l'on a pas cliqué sur l'image miniature.
Page 125
Créer votre propre bouton de survol de souris
Il est possible de créer vos propres boutons de survol de la souris en dessinant les éléments nécessaires
à partir des rectangles, du texte, etc. Il vous suffit de dessiner les éléments principaux du bouton sur le
calque État normal (rappelez-vous de le regrouper
) et de placer la version « en surbrillance » correspondante sur le calque Survol de la souris. Tant que la
version État normal est reliée à une adresse Web, la version Survol de la souris sera automatiquement
affichée lorsque vous passerez la souris sur la page Web (le calque Survol de la souris doit être
au-dessus du calque État normal).
En d'autres termes, vous donnez à l'objet principal une Adresse Web en
utilisant l'option de liens, puis vous sélectionnez le calque Survol de la
souris dans la Galerie des calques. Ensuite, placez les versions de boutons
avec survol de la souris sur ce calque pour qu'il soit superposé à l'objet
relié.
Remarque technique :
Tous les objets graphiques du calque Survol de la souris seront affichés si au moins 50 % de l'objet se
superpose sur le calque État normal. Ces deux versions des boutons de survol de la souris sont
synchronisés grâce aux fonctionnalités des Groupes souples. Lorsque vous sélectionnez le bouton sur un
calque, il sélectionne automatiquement la version Groupe souple de l'autre calque, même si ce dernier est
inactif. Lorsque vous éditez le texte d'un bouton sur un calque, le changement est automatiquement
synchronisé avec l'autre version du bouton.
Pour vous assurer que le texte des deux versions État normal et Survol de la souris change lorsque vous
modifiez l'une des deux versions, transformez les boutons des deux calques en Groupe souple. Pour ce
faire, vous aurez besoin d'activer les deux calques dans la Galerie des calques et de sélectionner à
l'aide du lasso les deux boutons. La ligne de statut vous dira si tout est bien sélectionné. Sélectionnez
Arranger ->Appliquer le Groupe souple
. Désormais, lorsque vous éditerez le texte du calque État normal, il changera également sur le calque
Survol de la souris, même s'il est caché. (Notez que cela fonctionne uniquement si les textes des versions
État normal et Survol de la souris sont identiques au départ et si les objets sont basés sur des Groupes
souples).
Calques pop-ups
Il existe une solution plus efficace pour vous permettre d'afficher le contenu d'un calque dès que vous
passez la souris dessus ou que vous cliquez sur un objet. Elle peut être utilisée pour une gamme de
différents effets pop-ups, comme des photos, des menus ou des descriptions détaillées d'objets.
Placez tous les objets que vous voulez voir s'afficher en pop-up dans un nouveau calque (dans la Galerie
des calques, cliquez sur Nouveau - n'utilisez pas le calque Survol de la souris). Définissez ensuite les
propriétés de Survol de la souris (boîte de dialogue Propriétés Web
) de l'objet original pour déclencher l'affichage de ce calque lorsque vous passez sur un objet avec la
souris. Par exemple, vous pouvez faire apparaître un pop-up comme celui-ci en passant au-dessus de
texte :
Voici les étapes pour créer un bloc de texte pop-up comme celui-ci :
1. Cliquez sur Nouveau dans la Galerie des calques pour créer un nouveau calque.
Page 126
2. Dessinez un rectangle aux bords arrondis avec l'outil Rectangle, cliquez sur une pastille de
couleur (pâle) sur la Palette de couleurs pour le remplir avec une couleur. Pour une bonne
mesure, ajoutez une ombre douce (sélectionnez l'outil Ombre et faites-le glisser sur le rectangle).
3. Créez un bloc de texte en haut de votre rectangle. Sélectionnez l'outil Texte et tirez sur le
rectangle en diagonale. Saisissez votre texte. Vous souhaiterez probablement masquer le calque
pop-up. Pour cela, décochez la case « Voir » de votre nouveau calque.
4. Dans le calque de base (État normal) : cliquez sur la Galerie des calques pour le régler en tant
que calque en cours puis sélectionnez le texte que vous voulez utiliser pour déclencher le pop-up
en utilisant la méthode habituelle (dans l'outil Texte). Ouvrez la boîte de dialogue des Propriétés
Web (Ctrl+Maj+W) et sur l'onglet Survol de la souris, sélectionnez le nouveau calque du menu
déroulant « Afficher le calque du pop-up ». Cliquez sur OK.
5. Prévisualiser et tester les effets de survol de la souris.
Si vous souhaitez que le pop-up apparaisse seulement lorsque l'on clique, sélectionnez la même option
que dans l'onglet Lien de la même boîte de dialogue Propriétés Web
.
Remarque :
Le calque Survol de la souris apparaît et disparaît lorsque vous déplacez le pointeur de la souris sur
l'objet pop-up. Si vous utilisez le clic pour afficher le calque (de la boîte de dialogue Lien), le calque est
révélé en cliquant sur l'objet et est masqué lorsque vous cliquez ailleurs sur la page.
Photos pop-ups
Il existe une autre manière plus simple d'afficher des photos élargies à partir de miniatures et qui ne
nécessite pas la création de nouveaux calques. Voir ici
. Cette méthode est plus appropriée lorsque les photos pop-ups sont grandes, car elles ne se chargent
pas tant que l'on a pas cliqué sur l'image miniature.
Page 127
Calques pop-ups
Il existe une solution plus efficace pour vous permettre d'afficher le contenu d'un calque dès que vous
passez la souris dessus ou que vous cliquez sur un objet. Elle peut être utilisée pour une gamme de
différents effets pop-ups, comme des photos, des menus ou des descriptions détaillées d'objets.
Placez tous les objets que vous voulez voir s'afficher en pop-up dans un nouveau calque (dans la Galerie
des calques, cliquez sur Nouveau - n'utilisez pas le calque Survol de la souris). Définissez ensuite les
propriétés de Survol de la souris (boîte de dialogue Propriétés Web
) de l'objet original pour déclencher l'affichage de ce calque lorsque vous passez sur un objet avec la
souris. Par exemple, vous pouvez faire apparaître un pop-up comme celui-ci en passant au-dessus de
texte :
Voici les étapes pour créer un bloc de texte pop-up comme celui-ci :
1. Cliquez sur Nouveau dans la Galerie des calques pour créer un nouveau calque.
2. Dessinez un rectangle aux bords arrondis avec l'outil Rectangle, cliquez sur une pastille de
couleur (pâle) sur la Palette de couleurs pour le remplir avec une couleur. Pour une bonne
mesure, ajoutez une ombre douce (sélectionnez l'outil Ombre et faites-le glisser sur le rectangle).
3. Créez un bloc de texte en haut de votre rectangle. Sélectionnez l'outil Texte et tirez sur le
rectangle en diagonale. Saisissez votre texte. Vous souhaiterez probablement masquer le calque
pop-up. Pour cela, décochez la case « Voir » de votre nouveau calque.
4. Dans le calque de base (État normal) : cliquez sur la Galerie des calques pour le régler en tant
que calque en cours puis sélectionnez le texte que vous voulez utiliser pour déclencher le pop-up
en utilisant la méthode habituelle (dans l'outil Texte). Ouvrez la boîte de dialogue des Propriétés
Web (Ctrl+Maj+W) et sur l'onglet Survol de la souris, sélectionnez le nouveau calque du menu
déroulant « Afficher le calque du pop-up ». Cliquez sur OK.
5. Prévisualiser et tester les effets de survol de la souris.
Si vous souhaitez que le pop-up apparaisse seulement lorsque l'on clique, sélectionnez la même option
que dans l'onglet Lien de la même boîte de dialogue Propriétés Web
.
Remarque :
Le calque Survol de la souris apparaît et disparaît lorsque vous déplacez le pointeur de la souris sur
l'objet pop-up. Si vous utilisez le clic pour afficher le calque (de la boîte de dialogue Lien), le calque est
révélé en cliquant sur l'objet et est masqué lorsque vous cliquez ailleurs sur la page.
Photos pop-ups
Il existe une autre manière plus simple d'afficher des photos élargies à partir de miniatures et qui ne
nécessite pas la création de nouveaux calques. Voir ici
. Cette méthode est plus appropriée lorsque les photos pop-ups sont grandes, car elles ne se chargent
pas tant que l'on a pas cliqué sur l'image miniature.
Page 128
Photos pop-ups
Il existe une autre manière plus simple d'afficher des photos élargies à partir de miniatures et qui ne
nécessite pas la création de nouveaux calques. Voir ici
. Cette méthode est plus appropriée lorsque les photos pop-ups sont grandes, car elles ne se chargent
pas tant que l'on a pas cliqué sur l'image miniature.
Page 129
Créer des boutons, des bannières et d'autres
graphismes Web
Web Designer est un formidable outil pour la création de graphisme Web indépendants à utiliser avec
d'autres logiciels ou d'autres outils de création Web. Vous pouvez créer ces objets en entier grâce aux
outils de dessin ou utiliser des Cliparts Web déjà prêts de la Galerie des modèles. Dessinez, concevez ou
importez un objet de la Galerie des modèles sur une page blanche. Manipulez-le comme vous le
souhaitez, redimensionnez-le, colorez-le et changez le texte ou les polices puis exportez-le en PNG ou en
JPG.
Par exemple, voici comment créer un graphisme de bouton extrait d'un modèle de conception :
Ouvrez la Galerie des modèles puis la rubrique Boutons (ou Icônes ou
Bannières, ce que vous souhaitez).
Double-cliquez sur un modèle pour l'ouvrir dans un nouveau document. Modifiez-le comme vous le
souhaitez. Vous pouvez par exemple :
 Le redimensionner (ou le faire pivoter) en utilisant l'outil Sélection
 Changez la couleur en cliquant sur les couleurs de votre choix à gauche de la Palette de couleurs
et en sélectionnant « Éditer »
 Éditer le texte avec l'outil Texte
Lorsque vous êtes satisfait de votre travail, sélectionnez l'objet et
exportez-le aux formats PNG ou JPG en utilisant les boutons de la
barre du haut.
Pour la quasi-totalité des graphismes, comme les boutons, les titres, les icônes et les autres objets qui ne
sont pas des photos, il faut utiliser le format PNG. Pour les éléments qui contiennent des photos ou de
larges zones texturées réalisées à partir de photos, le format JPG est plus adapté. Si vous sauvegardez
une photo pivotée ou une photo avec une ombre douce ou des angles arrondis, préférez le format PNG.
Sachez néanmoins que le document sera alors beaucoup plus lourd qu'au format JPEG.
Si vous cliquez sur le bouton Paramètres de la boîte de dialogue Exporter le fichier
, vous accéderez à un panneau de commandes vous permettant d'optimiser l'image.
Comparez ces deux versions différentes de la même image placées côte-à-côte. Vous pouvez par
exemple comparer une image JPEG et une version PNG du même graphisme pour observer la qualité
Page 130
et/ou la taille du document. Vous pouvez également comparer deux images PNG optimisées
différemment. Reportez-vous au chapitre de référence sur la boîte de dialogue Exporter
. L'exemple de compression au format JPEG a été ajusté à la taille de document optimale.
Page 131
Publier votre site Internet
Vous avez besoin d'un hébergeur qui hébergera votre site Internet. Il en existe des milliers et bien
souvent votre fournisseur d'accès à Internet vous propose aussi un « espace Web » dans votre
abonnement classique. Recherchez dans Google « hébergement Web » pour trouver de nombreuses
sociétés proposant ce service. Pour les particuliers et les petites entreprises, le coût est généralement très
faible. La plupart des sociétés vous offrent également la possibilité d'acquérir votre propre nom de
domaine (par exemple : www.xara.com) et de le relier à votre site.
Trois informations sont nécessaires à la publication de votre site Internet ;
 L'adresse de l'hôte FTP. Si vous avez un nom de domaine, c'est souvent le même nom.
 Un nom d'utilisateur FTP
 Et un mot de passe associé
Saisissez simplement ces informations dans l'onglet Publier de la boîte de dialogue des Propriétés Web
.
Le sous-répertoire facultatif vous permet de publier votre site dans un sous-répertoire. Par exemple, si
vous publiez votre site sous le nom de domaine www.xara.com (ce qui est impossible) et que vous
souhaitez que votre adresse soit :
xara.com/products/web_designer
Il vous faudra alors créer un sous-répertoire « products » et une page appelée « web_designer ». En
procédant de cette manière, toutes les pages de votre site Internet seront publiées dans ce répertoire.
Une fois les informations de publication saisies, cliquez sur l'icône
Publier de la barre du haut ou utilisez le menu « Fichier » > « Publier
le site Internet
».
(Remarque : vous devez au préalable avoir exporté votre site Internet)
Votre site sera publié. Une barre de progression vous montrera la progression du chargement des pages
sur le serveur Web.
Remarque :
Xtreme Web Designer 5 mémorise vos informations de publications FTP pour que vous n'ayez pas à les
saisir à chaque fois que vous voulez mettre à jour votre site Internet. Cependant, si vous avez plusieurs
sites, il faudra vous rappeler de changer ces informations pour chacun de vos sites.
Remarque :
De nombreux serveurs Web utilisent des noms de fichiers sensibles à la casse. Donc, par exemple,
Page 132
l'adresse Web xara.com/products.htm est différente de xara.com/Products.htm. Pour réduire les risques
de confusion et d'erreurs, Web Designer impose à toutes les pages une casse en minuscules et ne
contenant que des caractères autorisés. Cela signifie que les espaces ne sont pas autorisées dans les
noms de page. Nous vous conseillons d'utiliser un tiret bas ou un autre caractère de séparation.
Important :
Si vous n'avez pas défini de nom de page spécifique, le nom que vous avez exporté en dernier sera
utilisé pour toutes les pages de votre site Internet. Par exemple, si vous ouvrez un site Internet modèle et
que vous l'exportez en tant que « test » dans les fichiers de votre ordinateur et que vous le publiez, vous
le verrez sous le nom test.htm sur votre serveur Web et toutes les pages supplémentaires seront appelées
test_2.htm, test_3.htm, etc.
Si vous n'avez pas déterminé de nom de dossier d'exportation, il vous en sera demandé un lors de la
première publication. On utilise généralement index.htm pour la première page d'un site Internet.
Page 133
Intégration de YouTube, Flash et autres
accessoires
Vous avez la possibilité d'intégrer de nombreux accessoires interactifs : des vidéos de YouTube™, des
diaporamas de photos de Picasa, des cartes Google, des fichiers Flash ou des paragraphes HTML
(« Snippet »). C'est possible grâce aux emplacements d'objets : il s'agit de formes (rectangles simples ou
photos) associées à un élément HTML ou à un fichier Flash ; ceux-ci remplacent l'emplacement d'objet
lors de la sauvegarde de votre document, un site Web par exemple.
Insertion d'une carte Google
Accédez à http://maps.google.fr/ et localisez la carte que vous souhaitez intégrer. Cliquez sur l'icone Lien
en haut à droite de la fenêtre : une petite fenêtre s'ouvre et affiche des codes HTML qui vous permettent
d'intégrer la carte dans un site Web. Copiez ces codes HTML.
Le lien en haut à droite permet d'accéder à une fenêtre qui contient le code HTML de la carte souhaitée.
Si vous cliquez sur l'option « Personnaliser », vous pouvez modifier la taille et définir d'autres options.
Vous verrez que le code HTML contient une valeur de largeur et de hauteur (dans les cases en haut de la
fenêtre : 425 et 350). Avec l'outil Rectangle, créez un emplacement d'objet de cette taille : 425x350
pixels. Il est possible de saisir la taille en pixels dans la barre d'infos de l'outil Rectangle.
Ouvrez maintenant la boîte de dialogue des propriétés Internet (CTRL+MAJ+W), rendez-vous dans
l'onglet Emplacement d'objet puis collez le code HTML dans le champ « Remplacer par le code
HTML »
. Cliquez sur OK et consultez l'aperçu de votre site Web. La carte Google devrait y apparaître.
Insertion d'un fichier Flash
Il est possible d'intégrer des fichiers Flash (avec une extension de fichier *.swf) de la même manière.
Commencez par créer un graphique dans une dimension souhaitée pour votre animation Flash. Accédez
à l'onglet Emplacement d'objet dans la boîte de dialogue des propriétés Internet et sélectionnez l'option «
Remplacer par fichier Flash
».
Il existe cependant une différence importante avec les emplacements d'objets Flash : vous pouvez les
redimensionner à volonté et l'animation Flash s'ajustera pour passer dans l'emplacement d'objet. En plus,
vous pouvez utiliser des animations Flash transparentes ou semi-transparentes sur votre site Web. La
plupart des autres accessoires ont une taille fixe et apparaîtront toujours sur votre site Web dans la taille
donnée, indépendamment des dimensions de l'emplacement.
Si vous sélectionnez un fichier Flash afin de l'associer de cette manière avec un emplacement d'objet, le
fichier Flash sera copié dans un dossier « _fichiers » sauvegardé parallèlement au document *.web. Si
vous déplacez ou copiez le fichier *.web, copiez également le dossier _fichiers pour être bien sûr que les
fichiers Flash sont également copiés.
Page 134
Insertion de code HTML
Créez un graphique d'emplacement d'objet, comme décrit ci-dessus, destiné à être remplacé par
n'importe quel objet, un simple rectangle par exemple. Accédez à l'onglet Emplacement d'objet de la
boîte de dialogue des propriétés Internet et choisissez « Remplacer par le code HTML » afin d'insérer
le code HTML. Lorsque la page est affichée dans un navigateur Internet, vous verrez que le graphique
créé au préalable est remplacé par le code HTML. Consultez la rubrique « Boîte de dialogue des
propriétés Internet
» pour davantage d'informations.
Astuce :
accessoires WYSIWYG (affichage en temps réel). Au lieu d'utiliser un simple rectangle noir en tant
qu'emplacement d'objet, vous pouvez aussi réaliser une copie d'écran de l'accessoire actuel tel qu'il est
affiché dans le navigateur Internet et l'utiliser dans votre projet de page, de sorte à ce que l'emplacement
d'objet ressemble à l'objet intégré une fois votre page Web terminée.
Insertion d'un diaporama de photos Picasa
Accédez à la page de l'album Internet Picasa que vous souhaitez intégrer. À droite, veuillez cliquer sur
« Créer un lien vers cet album » : des options supplémentaires vont s'afficher. N'utilisez pas le code
HTML affiché ici (seule une image fixe serait intégrée), mais cliquez sur le lien « Intégrer diaporama » :
une boîte de dialogue va s'ouvrir, dans laquelle vous pouvez personnaliser diverses dimensions et options
pour l'afffichage de votre diaporama. Copiez le code HTML et utilisez-le pour remplacer l'emplacement
d'objet (comme décrit ci-dessus).
Dans le code HTML, vous pouvez voir des valeurs de largeur et de hauteur. Il est conseillé d'utiliser ces
dernières en tant que dimensions pour votre emplacement d'objet rectangle.
Page 135
Insertion d'une carte Google
Accédez à http://maps.google.fr/ et localisez la carte que vous souhaitez intégrer. Cliquez sur l'icone Lien
en haut à droite de la fenêtre : une petite fenêtre s'ouvre et affiche des codes HTML qui vous permettent
d'intégrer la carte dans un site Web. Copiez ces codes HTML.
Le lien en haut à droite permet d'accéder à une fenêtre qui contient le code HTML de la carte souhaitée.
Si vous cliquez sur l'option « Personnaliser », vous pouvez modifier la taille et définir d'autres options.
Vous verrez que le code HTML contient une valeur de largeur et de hauteur (dans les cases en haut de la
fenêtre : 425 et 350). Avec l'outil Rectangle, créez un emplacement d'objet de cette taille : 425x350
pixels. Il est possible de saisir la taille en pixels dans la barre d'infos de l'outil Rectangle.
Ouvrez maintenant la boîte de dialogue des propriétés Internet (CTRL+MAJ+W), rendez-vous dans
l'onglet Emplacement d'objet puis collez le code HTML dans le champ « Remplacer par le code
HTML »
. Cliquez sur OK et consultez l'aperçu de votre site Web. La carte Google devrait y apparaître.
Insertion d'un fichier Flash
Il est possible d'intégrer des fichiers Flash (avec une extension de fichier *.swf) de la même manière.
Commencez par créer un graphique dans une dimension souhaitée pour votre animation Flash. Accédez
à l'onglet Emplacement d'objet dans la boîte de dialogue des propriétés Internet et sélectionnez l'option «
Remplacer par fichier Flash
».
Il existe cependant une différence importante avec les emplacements d'objets Flash : vous pouvez les
redimensionner à volonté et l'animation Flash s'ajustera pour passer dans l'emplacement d'objet. En plus,
vous pouvez utiliser des animations Flash transparentes ou semi-transparentes sur votre site Web. La
plupart des autres accessoires ont une taille fixe et apparaîtront toujours sur votre site Web dans la taille
donnée, indépendamment des dimensions de l'emplacement.
Si vous sélectionnez un fichier Flash afin de l'associer de cette manière avec un emplacement d'objet, le
fichier Flash sera copié dans un dossier « _fichiers » sauvegardé parallèlement au document *.web. Si
vous déplacez ou copiez le fichier *.web, copiez également le dossier _fichiers pour être bien sûr que les
fichiers Flash sont également copiés.
Insertion de code HTML
Créez un graphique d'emplacement d'objet, comme décrit ci-dessus, destiné à être remplacé par
n'importe quel objet, un simple rectangle par exemple. Accédez à l'onglet Emplacement d'objet de la
boîte de dialogue des propriétés Internet et choisissez « Remplacer par le code HTML » afin d'insérer
le code HTML. Lorsque la page est affichée dans un navigateur Internet, vous verrez que le graphique
créé au préalable est remplacé par le code HTML. Consultez la rubrique « Boîte de dialogue des
propriétés Internet
» pour davantage d'informations.
Astuce :
Page 136
accessoires WYSIWYG (affichage en temps réel). Au lieu d'utiliser un simple rectangle noir en tant
qu'emplacement d'objet, vous pouvez aussi réaliser une copie d'écran de l'accessoire actuel tel qu'il est
affiché dans le navigateur Internet et l'utiliser dans votre projet de page, de sorte à ce que l'emplacement
d'objet ressemble à l'objet intégré une fois votre page Web terminée.
Insertion d'un diaporama de photos Picasa
Accédez à la page de l'album Internet Picasa que vous souhaitez intégrer. À droite, veuillez cliquer sur
« Créer un lien vers cet album » : des options supplémentaires vont s'afficher. N'utilisez pas le code
HTML affiché ici (seule une image fixe serait intégrée), mais cliquez sur le lien « Intégrer diaporama » :
une boîte de dialogue va s'ouvrir, dans laquelle vous pouvez personnaliser diverses dimensions et options
pour l'afffichage de votre diaporama. Copiez le code HTML et utilisez-le pour remplacer l'emplacement
d'objet (comme décrit ci-dessus).
Dans le code HTML, vous pouvez voir des valeurs de largeur et de hauteur. Il est conseillé d'utiliser ces
dernières en tant que dimensions pour votre emplacement d'objet rectangle.
Page 137
Insertion d'un fichier Flash
Il est possible d'intégrer des fichiers Flash (avec une extension de fichier *.swf) de la même manière.
Commencez par créer un graphique dans une dimension souhaitée pour votre animation Flash. Accédez
à l'onglet Emplacement d'objet dans la boîte de dialogue des propriétés Internet et sélectionnez l'option «
Remplacer par fichier Flash
».
Il existe cependant une différence importante avec les emplacements d'objets Flash : vous pouvez les
redimensionner à volonté et l'animation Flash s'ajustera pour passer dans l'emplacement d'objet. En plus,
vous pouvez utiliser des animations Flash transparentes ou semi-transparentes sur votre site Web. La
plupart des autres accessoires ont une taille fixe et apparaîtront toujours sur votre site Web dans la taille
donnée, indépendamment des dimensions de l'emplacement.
Si vous sélectionnez un fichier Flash afin de l'associer de cette manière avec un emplacement d'objet, le
fichier Flash sera copié dans un dossier « _fichiers » sauvegardé parallèlement au document *.web. Si
vous déplacez ou copiez le fichier *.web, copiez également le dossier _fichiers pour être bien sûr que les
fichiers Flash sont également copiés.
Insertion de code HTML
Créez un graphique d'emplacement d'objet, comme décrit ci-dessus, destiné à être remplacé par
n'importe quel objet, un simple rectangle par exemple. Accédez à l'onglet Emplacement d'objet de la
boîte de dialogue des propriétés Internet et choisissez « Remplacer par le code HTML » afin d'insérer
le code HTML. Lorsque la page est affichée dans un navigateur Internet, vous verrez que le graphique
créé au préalable est remplacé par le code HTML. Consultez la rubrique « Boîte de dialogue des
propriétés Internet
» pour davantage d'informations.
Astuce :
accessoires WYSIWYG (affichage en temps réel). Au lieu d'utiliser un simple rectangle noir en tant
qu'emplacement d'objet, vous pouvez aussi réaliser une copie d'écran de l'accessoire actuel tel qu'il est
affiché dans le navigateur Internet et l'utiliser dans votre projet de page, de sorte à ce que l'emplacement
d'objet ressemble à l'objet intégré une fois votre page Web terminée.
Insertion d'un diaporama de photos Picasa
Accédez à la page de l'album Internet Picasa que vous souhaitez intégrer. À droite, veuillez cliquer sur
« Créer un lien vers cet album » : des options supplémentaires vont s'afficher. N'utilisez pas le code
HTML affiché ici (seule une image fixe serait intégrée), mais cliquez sur le lien « Intégrer diaporama » :
une boîte de dialogue va s'ouvrir, dans laquelle vous pouvez personnaliser diverses dimensions et options
pour l'afffichage de votre diaporama. Copiez le code HTML et utilisez-le pour remplacer l'emplacement
d'objet (comme décrit ci-dessus).
Dans le code HTML, vous pouvez voir des valeurs de largeur et de hauteur. Il est conseillé d'utiliser ces
dernières en tant que dimensions pour votre emplacement d'objet rectangle.
Page 138
Insertion de code HTML
Créez un graphique d'emplacement d'objet, comme décrit ci-dessus, destiné à être remplacé par
n'importe quel objet, un simple rectangle par exemple. Accédez à l'onglet Emplacement d'objet de la
boîte de dialogue des propriétés Internet et choisissez « Remplacer par le code HTML » afin d'insérer
le code HTML. Lorsque la page est affichée dans un navigateur Internet, vous verrez que le graphique
créé au préalable est remplacé par le code HTML. Consultez la rubrique « Boîte de dialogue des
propriétés Internet
» pour davantage d'informations.
Astuce :
accessoires WYSIWYG (affichage en temps réel). Au lieu d'utiliser un simple rectangle noir en tant
qu'emplacement d'objet, vous pouvez aussi réaliser une copie d'écran de l'accessoire actuel tel qu'il est
affiché dans le navigateur Internet et l'utiliser dans votre projet de page, de sorte à ce que l'emplacement
d'objet ressemble à l'objet intégré une fois votre page Web terminée.
Insertion d'un diaporama de photos Picasa
Accédez à la page de l'album Internet Picasa que vous souhaitez intégrer. À droite, veuillez cliquer sur
« Créer un lien vers cet album » : des options supplémentaires vont s'afficher. N'utilisez pas le code
HTML affiché ici (seule une image fixe serait intégrée), mais cliquez sur le lien « Intégrer diaporama » :
une boîte de dialogue va s'ouvrir, dans laquelle vous pouvez personnaliser diverses dimensions et options
pour l'afffichage de votre diaporama. Copiez le code HTML et utilisez-le pour remplacer l'emplacement
d'objet (comme décrit ci-dessus).
Dans le code HTML, vous pouvez voir des valeurs de largeur et de hauteur. Il est conseillé d'utiliser ces
dernières en tant que dimensions pour votre emplacement d'objet rectangle.
Page 139
Insertion d'un diaporama de photos Picasa
Accédez à la page de l'album Internet Picasa que vous souhaitez intégrer. À droite, veuillez cliquer sur
« Créer un lien vers cet album » : des options supplémentaires vont s'afficher. N'utilisez pas le code
HTML affiché ici (seule une image fixe serait intégrée), mais cliquez sur le lien « Intégrer diaporama » :
une boîte de dialogue va s'ouvrir, dans laquelle vous pouvez personnaliser diverses dimensions et options
pour l'afffichage de votre diaporama. Copiez le code HTML et utilisez-le pour remplacer l'emplacement
d'objet (comme décrit ci-dessus).
Dans le code HTML, vous pouvez voir des valeurs de largeur et de hauteur. Il est conseillé d'utiliser ces
dernières en tant que dimensions pour votre emplacement d'objet rectangle.
Page 140
Utilisation du document
Dans ce chapitre
Démarrage de Xtreme Web Designer 5
Créer un nouveau document
Ouvrir un document existant
La fenêtre Xtreme
Ouvrir une deuxième fenêtre
Modifier la valeur du zoom
Déplacer le document à l'intérieur de la fenêtre
Modifier la taille de la page
Pages multiples dans le document
Sauvegarde du document
Dossiers d'aide
Fermer le document
Grille
Règles
Afficher la réglette de qualité
Galeries
Annuler et Rétablir
Page 141
Démarrage de Xtreme Web Designer 5
Pour démarrer Web Designer, veuillez procéder comme
suit :
 Sélectionnez Démarrer > Tous les programmes
> Xara > Xtreme Web Designer 5
 ou double-cliquez sur l'icône de Web Designer
affiché sur votre bureau (voir illustration à gauche).
Ce procédé peut varier légèrement en fonction de la version de Windows que vous utilisez.
La boîte de dialogue de démarrage de Xtreme Web Designer 5 va s'ouvrir. Vous pourrez y choisir
différentes tâches typiques à Xtreme Web Designer 5. Pour plus d'informations, veuillez lire s'il vous plaît
le chapitre correspondant dans l'aide de Xtreme Web Designer 5.
Page 142
Créer un nouveau document
Il existe trois types de documents dans Xtreme Web Designer 5 : les pages Web, les photos et les
animations. Pour créer un nouveau document :
Cliquez sur Fichier -> Nouveau
Cette action permet d'ouvrir un sous-menu contenant divers modèles de conception dont vous pouvez
vous aider.
Le premier modèle de conception est un modèle par défaut utilisé pour créer un nouveau document après
le démarrage de Xtreme Web Designer 5. Le modèle Animation est le modèle par défaut pour les
documents animés.
Vous pouvez également utiliser ces deux modèles par défaut depuis la
barre de contrôle standard (Ctrl+N) via le bouton de dessin
Nouveau
ou le bouton Nouvelle animation
(Maj+Ctrl+N).
Vous pouvez sauvegarder vos propres modèles de conception à l'aide de la commande Fichier
->Sauvegarder le modèle. Voir : Modifier le document modèle
pour plus de détails.
Page 143
Ouvrir un document existant
Pour ouvrir un document existant :
 Effectuez un glisser-déposer d'un fichier. Sélectionnez le fichier dans l'explorateur Windows ou
sur votre bureau et faites-le glisser sur un autre document ouvert pour l'importer, ou n'importe où
dans la fenêtre de Web Designer pour ouvrir le document.
 Ou double-cliquez sur un fichier Web Designer.
 Ou pour ouvrir un fichier utilisé récemment, sélectionnez-le dans Fichier -> Ouvert récemment
 Ou sélectionnez Fichier > Ouvrir (raccourci Ctrl+O)
 Ou cliquez sur Ouvrir dans la barre de contrôle Standard.
La boîte de dialogue « Ouvrir » s'affiche. Elle vous permet de
sélectionner plusieurs fichiers à la fois. Utilisez la combinaison
de touches Ctrl+clic pour sélectionner plusieurs fichiers ou
Maj+clic pour sélectionner un ensemble de fichiers.
Page 144
La fenêtre Xtreme
1
Barre de titre
2
Nom du fichier
3
Barre bouton standard
4
Galeries
5
Barre d'infos
6
Barre d'outils
7
Réglettes
8
Palette de couleurs
9
Barre d'état
10
Déplacement en direct / alignement
La fenêtre de Web Designer est similaire à une feuille de papier normale placée sur une planche à dessin.
Le rectangle blanc représente la feuille de papier (page ou double-page). La bordure grise (marge)
correspond au pasteboard.
Vous pouvez modifier la taille du pasteboard dans la boîte de dialogue Options puis dans l'onglet Taille
Page 145
de la page
.
Document sélectionné et barre de titre
Il est possible d'ouvrir plus d'un document simultanément dans Web Designer, le document se trouvant
dans la fenêtre actuelle étant le document sélectionné. La barre de titre se trouvant dans la partie
supérieure de Web Designer affiche le nom du document sélectionné ainsi que les modifications
éventuelles depuis la dernière sauvegarde. L'étoile placée après le nom du fichier indique que certaines
modifications n'ont pas encore été enregistrées.
Barres de contrôle
Elles contiennent les boutons de commande de Web Designer, et se trouvent à l'emplacement des icônes
principaux. Vous pouvez personnaliser les barres de contrôle de diverses manières, par exemple en
modifiant l'ordre, en créant de nouvelles barres ou en masquant certaines.
La fenêtre par défaut affiche la barre de bouton standard
avec les boutons les plus utilisés :
Vous pouvez personnaliser la barre de contrôle standard
de la même manière que les autres barres.
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Barre d'infos
Il s'agit d'une barre de contrôle spéciale. Son contenu diffère selon l'outil sélectionné. Les barres d'infos
spécifiques à certains outils sont décrites dans le chapitre correspondant.
Il n'est pas possible de personnaliser la barre d'infos.
Barre d'infos de l'outil Sélection
Barre d'outils principale
Il s'agit de la barre d'outils comprenant à l'origine tous les outils
disponibles dans Web Designer (voir à gauche). Vous pouvez
personnaliser la barre d'outils ou déplacer les outils vers d'autres
barres de contrôle.
Cliquez sur un outil pour le sélectionner (certains outils disposent de
raccourcis clavier).
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres
de contrôle.
Règles
Vous pouvez masquer les règles, modifier la position
de leur origine (point zéro) et les utiliser pour créer des
lignes d'aide. Pour obtenir de plus amples informations,
consultez le paragraphe Règles
.
Page 146
La barre d'état
Elle est affichée dans la partie inférieure de la fenêtre. La barre d'état vous informe sur les points
suivants :
 les objets sélectionnés ;
 Les options disponibles ;
 les indicateurs de déplacement live/d'alignement ;
 la position X-Y du pointeur.
Les indicateurs
Ils sont affichés sur la droite de la barre d'état.
Indicateur de déplacement live
L'indicateur précise si la fonction de déplacement live est active
ou non (elle est active par défaut). Double-cliquez sur l'indicateur
pour activer/désactiver la fonction de déplacement live.
Lorsqu'elle est activée, si vous repositionnez, modifiez la taille ou
la rotation d'un objet, c'est l'objet entier qui sera déplacé, et pas
seulement ses contours, facilitant l'évaluation de l'effet en temps
réel. Si votre ordinateur n'est pas en mesure de traiter un
document particulièrement complexe, il va automatiquement
désactiver la fonction de déplacement afin d'assurer une édition
rapide.
Indicateur d'alignement
Vous pouvez activer cet indicateur en sélectionnant Fenêtre >
Aligner avec les objets. Il s'affiche lorsque vous déplacez un
point dans la surface d'ajustage de l'objet. (Pour de plus amples
informations sur l'alignement, consultez le paragraphe
Manipulation des objets
.)
Coordonnées X-Y
Web Designer indique les mesures par rapport au coin inférieur gauche de la page ou double-page.
Vous pouvez cependant modifier cette valeur. Pour de plus amples informations, consultez le paragraphe
sur la Manipulation des objets
.
Mode écran normal/plein écran
Dans le mode d'affichage normal, une partie de la fenêtre est occupée par la barre de titres, le menu et
les barres de défilement. Cela peut être gênant lorsque vous souhaitez avoir la plus grande surface
d'édition possible.
Web Designer dispose d'un second mode d'affichage, appelé plein écran, et qui présente un écran
nettoyé.
Vous pouvez configurer les deux modes d'affichages comme vous le souhaitez. Par exemple, chaque
mode peut avoir sa propre barre de contrôle. La configuration est sauvegardée et affiché dès que vous
changez de mode d'affichage.
Page 147
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Vous pouvez contrôler le mode d'affichage écran normal/plein écran sous Fenêtre > Plein écran (chiffre 8
sur le pavé numérique).
Déplacez le pointeur de la souris sur le bord supérieur de l'écran pour afficher la barre de menu dans le
mode plein écran.
Page 148
Document sélectionné et barre de titre
Il est possible d'ouvrir plus d'un document simultanément dans Web Designer, le document se trouvant
dans la fenêtre actuelle étant le document sélectionné. La barre de titre se trouvant dans la partie
supérieure de Web Designer affiche le nom du document sélectionné ainsi que les modifications
éventuelles depuis la dernière sauvegarde. L'étoile placée après le nom du fichier indique que certaines
modifications n'ont pas encore été enregistrées.
Barres de contrôle
Elles contiennent les boutons de commande de Web Designer, et se trouvent à l'emplacement des icônes
principaux. Vous pouvez personnaliser les barres de contrôle de diverses manières, par exemple en
modifiant l'ordre, en créant de nouvelles barres ou en masquant certaines.
La fenêtre par défaut affiche la barre de bouton standard
avec les boutons les plus utilisés :
Vous pouvez personnaliser la barre de contrôle standard
de la même manière que les autres barres.
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Barre d'infos
Il s'agit d'une barre de contrôle spéciale. Son contenu diffère selon l'outil sélectionné. Les barres d'infos
spécifiques à certains outils sont décrites dans le chapitre correspondant.
Il n'est pas possible de personnaliser la barre d'infos.
Barre d'infos de l'outil Sélection
Barre d'outils principale
Il s'agit de la barre d'outils comprenant à l'origine tous les outils
disponibles dans Web Designer (voir à gauche). Vous pouvez
personnaliser la barre d'outils ou déplacer les outils vers d'autres
barres de contrôle.
Cliquez sur un outil pour le sélectionner (certains outils disposent de
raccourcis clavier).
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres
de contrôle.
Règles
Vous pouvez masquer les règles, modifier la position
de leur origine (point zéro) et les utiliser pour créer des
lignes d'aide. Pour obtenir de plus amples informations,
consultez le paragraphe Règles
.
La barre d'état
Page 149
Elle est affichée dans la partie inférieure de la fenêtre. La barre d'état vous informe sur les points
suivants :
 les objets sélectionnés ;
 Les options disponibles ;
 les indicateurs de déplacement live/d'alignement ;
 la position X-Y du pointeur.
Les indicateurs
Ils sont affichés sur la droite de la barre d'état.
Indicateur de déplacement live
L'indicateur précise si la fonction de déplacement live est active
ou non (elle est active par défaut). Double-cliquez sur l'indicateur
pour activer/désactiver la fonction de déplacement live.
Lorsqu'elle est activée, si vous repositionnez, modifiez la taille ou
la rotation d'un objet, c'est l'objet entier qui sera déplacé, et pas
seulement ses contours, facilitant l'évaluation de l'effet en temps
réel. Si votre ordinateur n'est pas en mesure de traiter un
document particulièrement complexe, il va automatiquement
désactiver la fonction de déplacement afin d'assurer une édition
rapide.
Indicateur d'alignement
Vous pouvez activer cet indicateur en sélectionnant Fenêtre >
Aligner avec les objets. Il s'affiche lorsque vous déplacez un
point dans la surface d'ajustage de l'objet. (Pour de plus amples
informations sur l'alignement, consultez le paragraphe
Manipulation des objets
.)
Coordonnées X-Y
Web Designer indique les mesures par rapport au coin inférieur gauche de la page ou double-page.
Vous pouvez cependant modifier cette valeur. Pour de plus amples informations, consultez le paragraphe
sur la Manipulation des objets
.
Mode écran normal/plein écran
Dans le mode d'affichage normal, une partie de la fenêtre est occupée par la barre de titres, le menu et
les barres de défilement. Cela peut être gênant lorsque vous souhaitez avoir la plus grande surface
d'édition possible.
Web Designer dispose d'un second mode d'affichage, appelé plein écran, et qui présente un écran
nettoyé.
Vous pouvez configurer les deux modes d'affichages comme vous le souhaitez. Par exemple, chaque
mode peut avoir sa propre barre de contrôle. La configuration est sauvegardée et affiché dès que vous
changez de mode d'affichage.
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Page 150
Vous pouvez contrôler le mode d'affichage écran normal/plein écran sous Fenêtre > Plein écran (chiffre 8
sur le pavé numérique).
Déplacez le pointeur de la souris sur le bord supérieur de l'écran pour afficher la barre de menu dans le
mode plein écran.
Page 151
Barres de contrôle
Elles contiennent les boutons de commande de Web Designer, et se trouvent à l'emplacement des icônes
principaux. Vous pouvez personnaliser les barres de contrôle de diverses manières, par exemple en
modifiant l'ordre, en créant de nouvelles barres ou en masquant certaines.
La fenêtre par défaut affiche la barre de bouton standard
avec les boutons les plus utilisés :
Vous pouvez personnaliser la barre de contrôle standard
de la même manière que les autres barres.
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Barre d'infos
Il s'agit d'une barre de contrôle spéciale. Son contenu diffère selon l'outil sélectionné. Les barres d'infos
spécifiques à certains outils sont décrites dans le chapitre correspondant.
Il n'est pas possible de personnaliser la barre d'infos.
Barre d'infos de l'outil Sélection
Barre d'outils principale
Il s'agit de la barre d'outils comprenant à l'origine tous les outils
disponibles dans Web Designer (voir à gauche). Vous pouvez
personnaliser la barre d'outils ou déplacer les outils vers d'autres
barres de contrôle.
Cliquez sur un outil pour le sélectionner (certains outils disposent de
raccourcis clavier).
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres
de contrôle.
Règles
Vous pouvez masquer les règles, modifier la position
de leur origine (point zéro) et les utiliser pour créer des
lignes d'aide. Pour obtenir de plus amples informations,
consultez le paragraphe Règles
.
La barre d'état
Elle est affichée dans la partie inférieure de la fenêtre. La barre d'état vous informe sur les points
suivants :
 les objets sélectionnés ;
Page 152



Les options disponibles ;
les indicateurs de déplacement live/d'alignement ;
la position X-Y du pointeur.
Les indicateurs
Ils sont affichés sur la droite de la barre d'état.
Indicateur de déplacement live
L'indicateur précise si la fonction de déplacement live est active
ou non (elle est active par défaut). Double-cliquez sur l'indicateur
pour activer/désactiver la fonction de déplacement live.
Lorsqu'elle est activée, si vous repositionnez, modifiez la taille ou
la rotation d'un objet, c'est l'objet entier qui sera déplacé, et pas
seulement ses contours, facilitant l'évaluation de l'effet en temps
réel. Si votre ordinateur n'est pas en mesure de traiter un
document particulièrement complexe, il va automatiquement
désactiver la fonction de déplacement afin d'assurer une édition
rapide.
Indicateur d'alignement
Vous pouvez activer cet indicateur en sélectionnant Fenêtre >
Aligner avec les objets. Il s'affiche lorsque vous déplacez un
point dans la surface d'ajustage de l'objet. (Pour de plus amples
informations sur l'alignement, consultez le paragraphe
Manipulation des objets
.)
Coordonnées X-Y
Web Designer indique les mesures par rapport au coin inférieur gauche de la page ou double-page.
Vous pouvez cependant modifier cette valeur. Pour de plus amples informations, consultez le paragraphe
sur la Manipulation des objets
.
Mode écran normal/plein écran
Dans le mode d'affichage normal, une partie de la fenêtre est occupée par la barre de titres, le menu et
les barres de défilement. Cela peut être gênant lorsque vous souhaitez avoir la plus grande surface
d'édition possible.
Web Designer dispose d'un second mode d'affichage, appelé plein écran, et qui présente un écran
nettoyé.
Vous pouvez configurer les deux modes d'affichages comme vous le souhaitez. Par exemple, chaque
mode peut avoir sa propre barre de contrôle. La configuration est sauvegardée et affiché dès que vous
changez de mode d'affichage.
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Vous pouvez contrôler le mode d'affichage écran normal/plein écran sous Fenêtre > Plein écran (chiffre 8
sur le pavé numérique).
Déplacez le pointeur de la souris sur le bord supérieur de l'écran pour afficher la barre de menu dans le
mode plein écran.
Page 153
Barre d'infos
Il s'agit d'une barre de contrôle spéciale. Son contenu diffère selon l'outil sélectionné. Les barres d'infos
spécifiques à certains outils sont décrites dans le chapitre correspondant.
Il n'est pas possible de personnaliser la barre d'infos.
Barre d'infos de l'outil Sélection
Barre d'outils principale
Il s'agit de la barre d'outils comprenant à l'origine tous les outils
disponibles dans Web Designer (voir à gauche). Vous pouvez
personnaliser la barre d'outils ou déplacer les outils vers d'autres
barres de contrôle.
Cliquez sur un outil pour le sélectionner (certains outils disposent de
raccourcis clavier).
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres
de contrôle.
Règles
Vous pouvez masquer les règles, modifier la position
de leur origine (point zéro) et les utiliser pour créer des
lignes d'aide. Pour obtenir de plus amples informations,
consultez le paragraphe Règles
.
La barre d'état
Elle est affichée dans la partie inférieure de la fenêtre. La barre d'état vous informe sur les points
suivants :
 les objets sélectionnés ;
 Les options disponibles ;
 les indicateurs de déplacement live/d'alignement ;
 la position X-Y du pointeur.
Les indicateurs
Ils sont affichés sur la droite de la barre d'état.
Indicateur de déplacement live
L'indicateur précise si la fonction de déplacement live est active
ou non (elle est active par défaut). Double-cliquez sur l'indicateur
pour activer/désactiver la fonction de déplacement live.
Lorsqu'elle est activée, si vous repositionnez, modifiez la taille ou
la rotation d'un objet, c'est l'objet entier qui sera déplacé, et pas
Page 154
seulement ses contours, facilitant l'évaluation de l'effet en temps
réel. Si votre ordinateur n'est pas en mesure de traiter un
document particulièrement complexe, il va automatiquement
désactiver la fonction de déplacement afin d'assurer une édition
rapide.
Indicateur d'alignement
Vous pouvez activer cet indicateur en sélectionnant Fenêtre >
Aligner avec les objets. Il s'affiche lorsque vous déplacez un
point dans la surface d'ajustage de l'objet. (Pour de plus amples
informations sur l'alignement, consultez le paragraphe
Manipulation des objets
.)
Coordonnées X-Y
Web Designer indique les mesures par rapport au coin inférieur gauche de la page ou double-page.
Vous pouvez cependant modifier cette valeur. Pour de plus amples informations, consultez le paragraphe
sur la Manipulation des objets
.
Mode écran normal/plein écran
Dans le mode d'affichage normal, une partie de la fenêtre est occupée par la barre de titres, le menu et
les barres de défilement. Cela peut être gênant lorsque vous souhaitez avoir la plus grande surface
d'édition possible.
Web Designer dispose d'un second mode d'affichage, appelé plein écran, et qui présente un écran
nettoyé.
Vous pouvez configurer les deux modes d'affichages comme vous le souhaitez. Par exemple, chaque
mode peut avoir sa propre barre de contrôle. La configuration est sauvegardée et affiché dès que vous
changez de mode d'affichage.
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Vous pouvez contrôler le mode d'affichage écran normal/plein écran sous Fenêtre > Plein écran (chiffre 8
sur le pavé numérique).
Déplacez le pointeur de la souris sur le bord supérieur de l'écran pour afficher la barre de menu dans le
mode plein écran.
Page 155
Barre d'outils principale
Il s'agit de la barre d'outils comprenant à l'origine tous les outils
disponibles dans Web Designer (voir à gauche). Vous pouvez
personnaliser la barre d'outils ou déplacer les outils vers d'autres
barres de contrôle.
Cliquez sur un outil pour le sélectionner (certains outils disposent de
raccourcis clavier).
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres
de contrôle.
Règles
Vous pouvez masquer les règles, modifier la position
de leur origine (point zéro) et les utiliser pour créer des
lignes d'aide. Pour obtenir de plus amples informations,
consultez le paragraphe Règles
.
La barre d'état
Elle est affichée dans la partie inférieure de la fenêtre. La barre d'état vous informe sur les points
suivants :
 les objets sélectionnés ;
 Les options disponibles ;
 les indicateurs de déplacement live/d'alignement ;
 la position X-Y du pointeur.
Les indicateurs
Ils sont affichés sur la droite de la barre d'état.
Indicateur de déplacement live
L'indicateur précise si la fonction de déplacement live est active
ou non (elle est active par défaut). Double-cliquez sur l'indicateur
pour activer/désactiver la fonction de déplacement live.
Lorsqu'elle est activée, si vous repositionnez, modifiez la taille ou
la rotation d'un objet, c'est l'objet entier qui sera déplacé, et pas
seulement ses contours, facilitant l'évaluation de l'effet en temps
réel. Si votre ordinateur n'est pas en mesure de traiter un
document particulièrement complexe, il va automatiquement
désactiver la fonction de déplacement afin d'assurer une édition
rapide.
Indicateur d'alignement
Vous pouvez activer cet indicateur en sélectionnant Fenêtre >
Aligner avec les objets. Il s'affiche lorsque vous déplacez un
Page 156
point dans la surface d'ajustage de l'objet. (Pour de plus amples
informations sur l'alignement, consultez le paragraphe
Manipulation des objets
.)
Coordonnées X-Y
Web Designer indique les mesures par rapport au coin inférieur gauche de la page ou double-page.
Vous pouvez cependant modifier cette valeur. Pour de plus amples informations, consultez le paragraphe
sur la Manipulation des objets
.
Mode écran normal/plein écran
Dans le mode d'affichage normal, une partie de la fenêtre est occupée par la barre de titres, le menu et
les barres de défilement. Cela peut être gênant lorsque vous souhaitez avoir la plus grande surface
d'édition possible.
Web Designer dispose d'un second mode d'affichage, appelé plein écran, et qui présente un écran
nettoyé.
Vous pouvez configurer les deux modes d'affichages comme vous le souhaitez. Par exemple, chaque
mode peut avoir sa propre barre de contrôle. La configuration est sauvegardée et affiché dès que vous
changez de mode d'affichage.
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Vous pouvez contrôler le mode d'affichage écran normal/plein écran sous Fenêtre > Plein écran (chiffre 8
sur le pavé numérique).
Déplacez le pointeur de la souris sur le bord supérieur de l'écran pour afficher la barre de menu dans le
mode plein écran.
Page 157
Règles
Vous pouvez masquer les règles, modifier la position
de leur origine (point zéro) et les utiliser pour créer des
lignes d'aide. Pour obtenir de plus amples informations,
consultez le paragraphe Règles
.
La barre d'état
Elle est affichée dans la partie inférieure de la fenêtre. La barre d'état vous informe sur les points
suivants :
 les objets sélectionnés ;
 Les options disponibles ;
 les indicateurs de déplacement live/d'alignement ;
 la position X-Y du pointeur.
Les indicateurs
Ils sont affichés sur la droite de la barre d'état.
Indicateur de déplacement live
L'indicateur précise si la fonction de déplacement live est active
ou non (elle est active par défaut). Double-cliquez sur l'indicateur
pour activer/désactiver la fonction de déplacement live.
Lorsqu'elle est activée, si vous repositionnez, modifiez la taille ou
la rotation d'un objet, c'est l'objet entier qui sera déplacé, et pas
seulement ses contours, facilitant l'évaluation de l'effet en temps
réel. Si votre ordinateur n'est pas en mesure de traiter un
document particulièrement complexe, il va automatiquement
désactiver la fonction de déplacement afin d'assurer une édition
rapide.
Indicateur d'alignement
Vous pouvez activer cet indicateur en sélectionnant Fenêtre >
Aligner avec les objets. Il s'affiche lorsque vous déplacez un
point dans la surface d'ajustage de l'objet. (Pour de plus amples
informations sur l'alignement, consultez le paragraphe
Manipulation des objets
.)
Coordonnées X-Y
Web Designer indique les mesures par rapport au coin inférieur gauche de la page ou double-page.
Vous pouvez cependant modifier cette valeur. Pour de plus amples informations, consultez le paragraphe
sur la Manipulation des objets
.
Mode écran normal/plein écran
Dans le mode d'affichage normal, une partie de la fenêtre est occupée par la barre de titres, le menu et
Page 158
les barres de défilement. Cela peut être gênant lorsque vous souhaitez avoir la plus grande surface
d'édition possible.
Web Designer dispose d'un second mode d'affichage, appelé plein écran, et qui présente un écran
nettoyé.
Vous pouvez configurer les deux modes d'affichages comme vous le souhaitez. Par exemple, chaque
mode peut avoir sa propre barre de contrôle. La configuration est sauvegardée et affiché dès que vous
changez de mode d'affichage.
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Vous pouvez contrôler le mode d'affichage écran normal/plein écran sous Fenêtre > Plein écran (chiffre 8
sur le pavé numérique).
Déplacez le pointeur de la souris sur le bord supérieur de l'écran pour afficher la barre de menu dans le
mode plein écran.
Page 159
La barre d'état
Elle est affichée dans la partie inférieure de la fenêtre. La barre d'état vous informe sur les points
suivants :
 les objets sélectionnés ;
 Les options disponibles ;
 les indicateurs de déplacement live/d'alignement ;
 la position X-Y du pointeur.
Les indicateurs
Ils sont affichés sur la droite de la barre d'état.
Indicateur de déplacement live
L'indicateur précise si la fonction de déplacement live est active
ou non (elle est active par défaut). Double-cliquez sur l'indicateur
pour activer/désactiver la fonction de déplacement live.
Lorsqu'elle est activée, si vous repositionnez, modifiez la taille ou
la rotation d'un objet, c'est l'objet entier qui sera déplacé, et pas
seulement ses contours, facilitant l'évaluation de l'effet en temps
réel. Si votre ordinateur n'est pas en mesure de traiter un
document particulièrement complexe, il va automatiquement
désactiver la fonction de déplacement afin d'assurer une édition
rapide.
Indicateur d'alignement
Vous pouvez activer cet indicateur en sélectionnant Fenêtre >
Aligner avec les objets. Il s'affiche lorsque vous déplacez un
point dans la surface d'ajustage de l'objet. (Pour de plus amples
informations sur l'alignement, consultez le paragraphe
Manipulation des objets
.)
Coordonnées X-Y
Web Designer indique les mesures par rapport au coin inférieur gauche de la page ou double-page.
Vous pouvez cependant modifier cette valeur. Pour de plus amples informations, consultez le paragraphe
sur la Manipulation des objets
.
Mode écran normal/plein écran
Dans le mode d'affichage normal, une partie de la fenêtre est occupée par la barre de titres, le menu et
les barres de défilement. Cela peut être gênant lorsque vous souhaitez avoir la plus grande surface
d'édition possible.
Web Designer dispose d'un second mode d'affichage, appelé plein écran, et qui présente un écran
nettoyé.
Vous pouvez configurer les deux modes d'affichages comme vous le souhaitez. Par exemple, chaque
mode peut avoir sa propre barre de contrôle. La configuration est sauvegardée et affiché dès que vous
changez de mode d'affichage.
Page 160
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Vous pouvez contrôler le mode d'affichage écran normal/plein écran sous Fenêtre > Plein écran (chiffre 8
sur le pavé numérique).
Déplacez le pointeur de la souris sur le bord supérieur de l'écran pour afficher la barre de menu dans le
mode plein écran.
Page 161
Les indicateurs
Ils sont affichés sur la droite de la barre d'état.
Indicateur de déplacement live
L'indicateur précise si la fonction de déplacement live est active
ou non (elle est active par défaut). Double-cliquez sur l'indicateur
pour activer/désactiver la fonction de déplacement live.
Lorsqu'elle est activée, si vous repositionnez, modifiez la taille ou
la rotation d'un objet, c'est l'objet entier qui sera déplacé, et pas
seulement ses contours, facilitant l'évaluation de l'effet en temps
réel. Si votre ordinateur n'est pas en mesure de traiter un
document particulièrement complexe, il va automatiquement
désactiver la fonction de déplacement afin d'assurer une édition
rapide.
Indicateur d'alignement
Vous pouvez activer cet indicateur en sélectionnant Fenêtre >
Aligner avec les objets. Il s'affiche lorsque vous déplacez un
point dans la surface d'ajustage de l'objet. (Pour de plus amples
informations sur l'alignement, consultez le paragraphe
Manipulation des objets
.)
Coordonnées X-Y
Web Designer indique les mesures par rapport au coin inférieur gauche de la page ou double-page.
Vous pouvez cependant modifier cette valeur. Pour de plus amples informations, consultez le paragraphe
sur la Manipulation des objets
.
Mode écran normal/plein écran
Dans le mode d'affichage normal, une partie de la fenêtre est occupée par la barre de titres, le menu et
les barres de défilement. Cela peut être gênant lorsque vous souhaitez avoir la plus grande surface
d'édition possible.
Web Designer dispose d'un second mode d'affichage, appelé plein écran, et qui présente un écran
nettoyé.
Vous pouvez configurer les deux modes d'affichages comme vous le souhaitez. Par exemple, chaque
mode peut avoir sa propre barre de contrôle. La configuration est sauvegardée et affiché dès que vous
changez de mode d'affichage.
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Vous pouvez contrôler le mode d'affichage écran normal/plein écran sous Fenêtre > Plein écran (chiffre 8
sur le pavé numérique).
Déplacez le pointeur de la souris sur le bord supérieur de l'écran pour afficher la barre de menu dans le
mode plein écran.
Page 162
Coordonnées X-Y
Web Designer indique les mesures par rapport au coin inférieur gauche de la page ou double-page.
Vous pouvez cependant modifier cette valeur. Pour de plus amples informations, consultez le paragraphe
sur la Manipulation des objets
.
Mode écran normal/plein écran
Dans le mode d'affichage normal, une partie de la fenêtre est occupée par la barre de titres, le menu et
les barres de défilement. Cela peut être gênant lorsque vous souhaitez avoir la plus grande surface
d'édition possible.
Web Designer dispose d'un second mode d'affichage, appelé plein écran, et qui présente un écran
nettoyé.
Vous pouvez configurer les deux modes d'affichages comme vous le souhaitez. Par exemple, chaque
mode peut avoir sa propre barre de contrôle. La configuration est sauvegardée et affiché dès que vous
changez de mode d'affichage.
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Vous pouvez contrôler le mode d'affichage écran normal/plein écran sous Fenêtre > Plein écran (chiffre 8
sur le pavé numérique).
Déplacez le pointeur de la souris sur le bord supérieur de l'écran pour afficher la barre de menu dans le
mode plein écran.
Page 163
Mode écran normal/plein écran
Dans le mode d'affichage normal, une partie de la fenêtre est occupée par la barre de titres, le menu et
les barres de défilement. Cela peut être gênant lorsque vous souhaitez avoir la plus grande surface
d'édition possible.
Web Designer dispose d'un second mode d'affichage, appelé plein écran, et qui présente un écran
nettoyé.
Vous pouvez configurer les deux modes d'affichages comme vous le souhaitez. Par exemple, chaque
mode peut avoir sa propre barre de contrôle. La configuration est sauvegardée et affiché dès que vous
changez de mode d'affichage.
Référez-vous au chapitre Personnaliser Web Designer
pour de plus amples informations sur la personnalisation des barres de contrôle.
Vous pouvez contrôler le mode d'affichage écran normal/plein écran sous Fenêtre > Plein écran (chiffre 8
sur le pavé numérique).
Déplacez le pointeur de la souris sur le bord supérieur de l'écran pour afficher la barre de menu dans le
mode plein écran.
Page 164
Ouvrir une deuxième fenêtre
Vous pouvez ouvrir une deuxième fenêtre dans le même document afin :
 d'agrandir ou rétrécir l'affichage du document ;
 d'afficher une autre partie du document ;
 d'afficher deux vues de la même zone, avec une configuration différente.
Les paramètres de qualité sont décrits plus bas.
Pour ouvrir une nouvelle fenêtre, allez sur Fenêtre > Nouvelle fenêtre. Vous pouvez ouvrir plusieurs
fenêtres dans le même document.
Sélection de la fenêtre affichée
Une liste des fenêtres se trouve dans la partie inférieure du menu de la fenêtre. Sélectionnez l'une des
fenêtres pour l'afficher.
Classer plusieurs fenêtres
Fenêtre ->Organiser les fenêtres
vous permet d'organiser plusieurs fenêtres. Chaque fenêtre dispose de sa propre barre de titres mais pas
de barre de contrôle. Cliquez sur une fenêtre pour l'activer. Avec la combinaison de touches Ctrl + F6,
vous pouvez passer d'une fenêtre à l'autre.
Organiser les fenêtres
permet d'afficher les fenêtres ordonnées verticalement ou, s'il existe plus de trois fenêtres, ordonnées
sous forme de mosaïque.
Minimiser les fenêtres multiples
Lorsque vous minimisez une ou plusieurs fenêtres, une icône apparaît dans l'arrière-plan de la fenêtre
principale de Web Designer. Double-cliquez sur l'icône pour rouvrir la fenêtre.
Page 165
Sélection de la fenêtre affichée
Une liste des fenêtres se trouve dans la partie inférieure du menu de la fenêtre. Sélectionnez l'une des
fenêtres pour l'afficher.
Classer plusieurs fenêtres
Fenêtre ->Organiser les fenêtres
vous permet d'organiser plusieurs fenêtres. Chaque fenêtre dispose de sa propre barre de titres mais pas
de barre de contrôle. Cliquez sur une fenêtre pour l'activer. Avec la combinaison de touches Ctrl + F6,
vous pouvez passer d'une fenêtre à l'autre.
Organiser les fenêtres
permet d'afficher les fenêtres ordonnées verticalement ou, s'il existe plus de trois fenêtres, ordonnées
sous forme de mosaïque.
Minimiser les fenêtres multiples
Lorsque vous minimisez une ou plusieurs fenêtres, une icône apparaît dans l'arrière-plan de la fenêtre
principale de Web Designer. Double-cliquez sur l'icône pour rouvrir la fenêtre.
Page 166
Classer plusieurs fenêtres
Fenêtre ->Organiser les fenêtres
vous permet d'organiser plusieurs fenêtres. Chaque fenêtre dispose de sa propre barre de titres mais pas
de barre de contrôle. Cliquez sur une fenêtre pour l'activer. Avec la combinaison de touches Ctrl + F6,
vous pouvez passer d'une fenêtre à l'autre.
Organiser les fenêtres
permet d'afficher les fenêtres ordonnées verticalement ou, s'il existe plus de trois fenêtres, ordonnées
sous forme de mosaïque.
Minimiser les fenêtres multiples
Lorsque vous minimisez une ou plusieurs fenêtres, une icône apparaît dans l'arrière-plan de la fenêtre
principale de Web Designer. Double-cliquez sur l'icône pour rouvrir la fenêtre.
Page 167
Minimiser les fenêtres multiples
Lorsque vous minimisez une ou plusieurs fenêtres, une icône apparaît dans l'arrière-plan de la fenêtre
principale de Web Designer. Double-cliquez sur l'icône pour rouvrir la fenêtre.
Page 168
Modifier la valeur du zoom
Il peut s'avérer très utile d'agrandir votre affichage pour examiner des détails dans votre document ou le
réduire pour obtenir une vue générale. Un calibrage supérieur à 100% agrandit la vue (comparable à une
loupe) ; lorsqu'il est inférieur à 100%, la vue est réduite. Le seul changement s'effectue dans l'affichage :
la taille du document ainsi que les objets qu'il contient ne sont pas modifiés (le procédé de modification
de la taille du document est décrit plus bas). Pour modifier la valeur du zoom, vous pouvez utiliser l'outil
de zoom
, la souris ou encore la barre de contrôle.
Il existe des raccourcis pour paramétrer rapidement les valeurs du zoom : les chiffres 1, 2, 3, 4
permettent de zoomer entre 100% et 400%. Le nombre 5 place la valeur à 50%.
Utiliser l'outil de zoom
Pour zoomer :




Sélectionnez l'outil de Zoom dans la barre d'outils.
Ou cliquez sur Alt + Z pour alterner entre l'outil actuel et l'outil de Zoom.
Ou maintenez la combinaison Alt + Z appuyée pour passer temporairement en mode Zoom (en
lâchant les touches Alt + Z, vous retournez à l'outil précédent).
Ou cliquez sur Maj + F7 pour sélectionner l'outil de Zoom.
Modifier la valeur du zoom à l'aide de la souris
À l'aide de la molette de la souris :
 Déplacez la molette de la souris tout en maintenant la touche Ctrl enfoncée pour modifier le
facteur de zoom.
Vous pouvez également configurer un bouton de la souris comme touche de zoom. En outre, vous
pouvez alterner l'action de la molette entre défilement et zoom dans le menu Services > Options > Tab
souris
. Vous obtenez un résultat opposé en cliquant sur la touche Ctrl.
Un autre procédé consiste à sélectionner l'outil de zoom
puis :
 Cliquez pour agrandir la vue (zoomer).
 Cliquez Maj + Clic pour réduire la valeur du zoom (agrandir l'aperçu du document).
 Déplacez la souris en diagonale pour dessiner un rectangle. Lorsque vous relâchez la souris, la
zone à l'intérieur du rectangle sera ajustée à la taille de la fenêtre.
Modifier le zoom à l'aide de la barre de contrôle/barre
d'infos.
Pour modifier le zoom :
(Raccourci : Ctrl+R) Cliquez sur Zoom précédent
. Il s'agit de la valeur paramétrée du zoom avant la
configuration actuelle. Ce bouton vous permet également
de déplacer le zoom à l'intérieur et l'extérieur du
document. Cela est très utile pour examiner une zone en
détail et passer en mode vue d'ensemble. La valeur du
zoom précédent est conservée pour chaque fenêtre. Les
valeurs sont enregistrées même lorsque vous naviguez
Page 169
d'une fenêtre à l'autre.
(Raccourci : Ctrl+Maj+J) Cliquez sur Zoom vers dessin
. La fenêtre affiche tous les objets contenus dans le
document.
(Raccourci : Ctrl+Maj+P) Cliquez sur Zoom sur page
. La fenêtre affiche la page entière ou la double-page.
(Raccourci : Ctrl+Maj+Z) Cliquez sur Zoom vers
sélection
. Le ou les objets sélectionnés remplissent la fenêtre.
Entrez une valeur dans le champ de
texte. Cliquez sur Entrée pour
implémenter les modifications, ou
sélectionnez les valeurs de zoom
prédéfinies y compris celles ci-dessus
(Page, dessin, sélectionné, précédent)
dans le menu déroulant.
Page 170
Utiliser l'outil de zoom
Pour zoomer :




Sélectionnez l'outil de Zoom dans la barre d'outils.
Ou cliquez sur Alt + Z pour alterner entre l'outil actuel et l'outil de Zoom.
Ou maintenez la combinaison Alt + Z appuyée pour passer temporairement en mode Zoom (en
lâchant les touches Alt + Z, vous retournez à l'outil précédent).
Ou cliquez sur Maj + F7 pour sélectionner l'outil de Zoom.
Modifier la valeur du zoom à l'aide de la souris
À l'aide de la molette de la souris :
 Déplacez la molette de la souris tout en maintenant la touche Ctrl enfoncée pour modifier le
facteur de zoom.
Vous pouvez également configurer un bouton de la souris comme touche de zoom. En outre, vous
pouvez alterner l'action de la molette entre défilement et zoom dans le menu Services > Options > Tab
souris
. Vous obtenez un résultat opposé en cliquant sur la touche Ctrl.
Un autre procédé consiste à sélectionner l'outil de zoom
puis :
 Cliquez pour agrandir la vue (zoomer).
 Cliquez Maj + Clic pour réduire la valeur du zoom (agrandir l'aperçu du document).
 Déplacez la souris en diagonale pour dessiner un rectangle. Lorsque vous relâchez la souris, la
zone à l'intérieur du rectangle sera ajustée à la taille de la fenêtre.
Modifier le zoom à l'aide de la barre de contrôle/barre
d'infos.
Pour modifier le zoom :
(Raccourci : Ctrl+R) Cliquez sur Zoom précédent
. Il s'agit de la valeur paramétrée du zoom avant la
configuration actuelle. Ce bouton vous permet également
de déplacer le zoom à l'intérieur et l'extérieur du
document. Cela est très utile pour examiner une zone en
détail et passer en mode vue d'ensemble. La valeur du
zoom précédent est conservée pour chaque fenêtre. Les
valeurs sont enregistrées même lorsque vous naviguez
d'une fenêtre à l'autre.
(Raccourci : Ctrl+Maj+J) Cliquez sur Zoom vers dessin
. La fenêtre affiche tous les objets contenus dans le
document.
(Raccourci : Ctrl+Maj+P) Cliquez sur Zoom sur page
. La fenêtre affiche la page entière ou la double-page.
(Raccourci : Ctrl+Maj+Z) Cliquez sur Zoom vers
sélection
. Le ou les objets sélectionnés remplissent la fenêtre.
Entrez une valeur dans le champ de
texte. Cliquez sur Entrée pour
Page 171
implémenter les modifications, ou
sélectionnez les valeurs de zoom
prédéfinies y compris celles ci-dessus
(Page, dessin, sélectionné, précédent)
dans le menu déroulant.
Page 172
Modifier la valeur du zoom à l'aide de la souris
À l'aide de la molette de la souris :
 Déplacez la molette de la souris tout en maintenant la touche Ctrl enfoncée pour modifier le
facteur de zoom.
Vous pouvez également configurer un bouton de la souris comme touche de zoom. En outre, vous
pouvez alterner l'action de la molette entre défilement et zoom dans le menu Services > Options > Tab
souris
. Vous obtenez un résultat opposé en cliquant sur la touche Ctrl.
Un autre procédé consiste à sélectionner l'outil de zoom
puis :
 Cliquez pour agrandir la vue (zoomer).
 Cliquez Maj + Clic pour réduire la valeur du zoom (agrandir l'aperçu du document).
 Déplacez la souris en diagonale pour dessiner un rectangle. Lorsque vous relâchez la souris, la
zone à l'intérieur du rectangle sera ajustée à la taille de la fenêtre.
Modifier le zoom à l'aide de la barre de contrôle/barre
d'infos.
Pour modifier le zoom :
(Raccourci : Ctrl+R) Cliquez sur Zoom précédent
. Il s'agit de la valeur paramétrée du zoom avant la
configuration actuelle. Ce bouton vous permet également
de déplacer le zoom à l'intérieur et l'extérieur du
document. Cela est très utile pour examiner une zone en
détail et passer en mode vue d'ensemble. La valeur du
zoom précédent est conservée pour chaque fenêtre. Les
valeurs sont enregistrées même lorsque vous naviguez
d'une fenêtre à l'autre.
(Raccourci : Ctrl+Maj+J) Cliquez sur Zoom vers dessin
. La fenêtre affiche tous les objets contenus dans le
document.
(Raccourci : Ctrl+Maj+P) Cliquez sur Zoom sur page
. La fenêtre affiche la page entière ou la double-page.
(Raccourci : Ctrl+Maj+Z) Cliquez sur Zoom vers
sélection
. Le ou les objets sélectionnés remplissent la fenêtre.
Entrez une valeur dans le champ de
texte. Cliquez sur Entrée pour
implémenter les modifications, ou
sélectionnez les valeurs de zoom
prédéfinies y compris celles ci-dessus
(Page, dessin, sélectionné, précédent)
dans le menu déroulant.
Page 173
Modifier le zoom à l'aide de la barre de contrôle/barre
d'infos.
Pour modifier le zoom :
(Raccourci : Ctrl+R) Cliquez sur Zoom précédent
. Il s'agit de la valeur paramétrée du zoom avant la
configuration actuelle. Ce bouton vous permet également
de déplacer le zoom à l'intérieur et l'extérieur du
document. Cela est très utile pour examiner une zone en
détail et passer en mode vue d'ensemble. La valeur du
zoom précédent est conservée pour chaque fenêtre. Les
valeurs sont enregistrées même lorsque vous naviguez
d'une fenêtre à l'autre.
(Raccourci : Ctrl+Maj+J) Cliquez sur Zoom vers dessin
. La fenêtre affiche tous les objets contenus dans le
document.
(Raccourci : Ctrl+Maj+P) Cliquez sur Zoom sur page
. La fenêtre affiche la page entière ou la double-page.
(Raccourci : Ctrl+Maj+Z) Cliquez sur Zoom vers
sélection
. Le ou les objets sélectionnés remplissent la fenêtre.
Entrez une valeur dans le champ de
texte. Cliquez sur Entrée pour
implémenter les modifications, ou
sélectionnez les valeurs de zoom
prédéfinies y compris celles ci-dessus
(Page, dessin, sélectionné, précédent)
dans le menu déroulant.
Page 174
Déplacer le document à l'intérieur de la
fenêtre
La manière la plus rapide de naviguer dans le document est d'utiliser le bouton central de la souris (la
molette en général), si votre souris en est équipée. Déplacez la souris tout en maintenant le bouton du
milieu appuyé. Lâchez le bouton pour revenir à l'outil précédent.
Pour déplacer le document dans la fenêtre, vous pouvez également
 utiliser les barres de défilement et flèches sur les bords de la fenêtre.
L'affichage des barres de défilement est optionnel. Allez dans Fenêtre > Barres > Barres de
défilement
pour le désactiver.
 Utilisez la molette de la souris pour faire défiler le document vers le haut et le bas (Maj + molette
pour défiler vers la gauche et la droite).
Vous pouvez alterner les fonctions de la molette entre défilement et zoom dans Services > Options >
Tab souris
. Vous obtenez l'action contraire en cliquant la touche Ctrl.
 Ou sélectionnez l'outil de déplacement depuis la
barre d'outils (raccourci H).
 Ou cliquez sur espace ou Alt+X pour alterner entre l'outil actuel et l'outil de déplacement.
 Ou cliquez et maintenez les touches Alt+X appuyées pour alterner temporairement sur l'outil de
déplacement (lâchez les touches pour retourner à l'outil précédent). Vous pouvez ensuite utiliser
la souris pour déplacer le document à l'intérieur de la fenêtre.
La barre d'infos de l'outil de déplacement est la même que la barre d'infos de l'outil de Zoom
(décrit plus haut).
Page 175
Modifier la taille de la page
Lorsque vous ouvrez un nouveau document Web Designer, la taille de la page est définie sur 760 x
700 pixels (page Web SVA). Vous pouvez cependant modifier la taille de la page si cela est nécessaire,
par exemple pour supporter d'autres résolutions d'écrans comme le VGA.
1. Allez dans le menu Services -> Options.
2. Si nécessaire, cliquez sur l'onglet Taille de la page.
3. Sélectionnez la taille de page requise.
Si vous sélectionnez Personnaliser dans l'outil de sélection, vous pouvez définir une largeur et une
longueur de page personnalisées dans les champs situés en dessous.
Toutes les pages du document (site Internet exporté) peuvent avoir une taille différente. Avec l'option
Taille identique pour toutes les pages du site Internet
, vous définirez une taille identique pour toutes les pages du document.
Vous pouvez redimensionner la longueur des pages en tirant sur les
bords inférieurs de la page avec l'outil Sélection.
Page 176
Pages multiples dans le document
Un document Xtreme Web Designer 5 peut contenir plusieurs pages. Chaque page est exportée dans
une page HTML distincte et chaque document de <product> correspond à un site Internet.
La page actuelle
Si vous cliquez sur une page d'un document multi-page, celle-ci deviendra la page actuelle.
La page actuelle est importante lorsqu'il s'agit d'insérer, de dupliquer
ou de déplacer des pages comme décrit dans les sections suivantes.
Vous reconnaissez la page actuelle dans un document grâce aux
indicateurs qui apparaissent aux coins de la page.
Insérer des pages dans un document
Ce bouton vous permet d'insérer une copie de la Ce
page actuelle.
bou
ton
vou
s
per
met
d'in
sére
r
une
copi
e de
la
pag
e
actu
elle.
La nouvelle page
sera la même que
l'originale, c'est à
dire qu'elle aura la
même taille et la
même orientation.
Les contenus sont
également identiques
à ceux de la page
originale de façon à
ce que vous puissiez
les utiliser comme
modèle pour le
nouveau contenu.
Vous pouvez
Page 177
également utiliser
dans le menu Éditer
-> Pages >
Dupliquer la page
actuelle
Pour insérer une nouvelle page vierge après la page actuelle, sélectionnez Éditer -> Pages -> Nouvelle
page
.
Déplacer des pages à l'intérieur d'un document
Si vous souhaitez changer l'ordre des pages dans le document, voici comment procéder.
Pour déplacer la page actuelle :
 Sélectionnez Éditer -> Pages -> Déplacer la page vers le haut pour intervertir la page
actuelle avec la précédente.
 Sélectionnez Éditer -> Pages -> Déplacer la page vers le bas pour intervertir la page actuelle
avec la suivante.
Ces options de menu seront grisées si vous vous trouvez, respectivement, sur la première ou la dernière
page du document.
Supprimer des pages de votre document
Pour supprimer la page actuelle de votre document, sélectionnez Éditer -> Pages > Supprimer la
page actuelle
. La page actuelle et son contenu seront effacés.
Naviguer entre les pages
Outre les méthodes habituelles de navigation (avec la barre de défilement et molette de la souris), il
existe d'autres moyens de naviguer dans les pages :
Page précédente :
Déplace le document vers le haut. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Préc. :
Aller à la page précédente et centrer dessus.
Page suivante :
Déplace le document vers le bas. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Suiv. :
Aller à la page suivante et centrer dessus
Ou bien cliquez sur les flèches sur la barre
d'état :
La barre d'état est également très pratique pour savoir quelle(s) page(s) vous êtes en train de visionner.
Remarque :
tous ces déplacements sont relatifs à la page que vous voyez et non pas à la page actuelle.
Page 178
La page actuelle
Si vous cliquez sur une page d'un document multi-page, celle-ci deviendra la page actuelle.
La page actuelle est importante lorsqu'il s'agit d'insérer, de dupliquer
ou de déplacer des pages comme décrit dans les sections suivantes.
Vous reconnaissez la page actuelle dans un document grâce aux
indicateurs qui apparaissent aux coins de la page.
Insérer des pages dans un document
Ce bouton vous permet d'insérer une copie de la Ce
page actuelle.
bou
ton
vou
s
per
met
d'in
sére
r
une
copi
e de
la
pag
e
actu
elle.
La nouvelle page
sera la même que
l'originale, c'est à
dire qu'elle aura la
même taille et la
même orientation.
Les contenus sont
également identiques
à ceux de la page
originale de façon à
ce que vous puissiez
les utiliser comme
modèle pour le
nouveau contenu.
Vous pouvez
également utiliser
dans le menu Éditer
-> Pages >
Dupliquer la page
actuelle
Page 179
Pour insérer une nouvelle page vierge après la page actuelle, sélectionnez Éditer -> Pages -> Nouvelle
page
.
Déplacer des pages à l'intérieur d'un document
Si vous souhaitez changer l'ordre des pages dans le document, voici comment procéder.
Pour déplacer la page actuelle :
 Sélectionnez Éditer -> Pages -> Déplacer la page vers le haut pour intervertir la page
actuelle avec la précédente.
 Sélectionnez Éditer -> Pages -> Déplacer la page vers le bas pour intervertir la page actuelle
avec la suivante.
Ces options de menu seront grisées si vous vous trouvez, respectivement, sur la première ou la dernière
page du document.
Supprimer des pages de votre document
Pour supprimer la page actuelle de votre document, sélectionnez Éditer -> Pages > Supprimer la
page actuelle
. La page actuelle et son contenu seront effacés.
Naviguer entre les pages
Outre les méthodes habituelles de navigation (avec la barre de défilement et molette de la souris), il
existe d'autres moyens de naviguer dans les pages :
Page précédente :
Déplace le document vers le haut. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Préc. :
Aller à la page précédente et centrer dessus.
Page suivante :
Déplace le document vers le bas. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Suiv. :
Aller à la page suivante et centrer dessus
Ou bien cliquez sur les flèches sur la barre
d'état :
La barre d'état est également très pratique pour savoir quelle(s) page(s) vous êtes en train de visionner.
Remarque :
tous ces déplacements sont relatifs à la page que vous voyez et non pas à la page actuelle.
Page 180
Insérer des pages dans un document
Ce bouton vous permet d'insérer une copie de la Ce
page actuelle.
bou
ton
vou
s
per
met
d'in
sére
r
une
copi
e de
la
pag
e
actu
elle.
La nouvelle page
sera la même que
l'originale, c'est à
dire qu'elle aura la
même taille et la
même orientation.
Les contenus sont
également identiques
à ceux de la page
originale de façon à
ce que vous puissiez
les utiliser comme
modèle pour le
nouveau contenu.
Vous pouvez
également utiliser
dans le menu Éditer
-> Pages >
Dupliquer la page
actuelle
Pour insérer une nouvelle page vierge après la page actuelle, sélectionnez Éditer -> Pages -> Nouvelle
page
.
Déplacer des pages à l'intérieur d'un document
Si vous souhaitez changer l'ordre des pages dans le document, voici comment procéder.
Pour déplacer la page actuelle :
Page 181
Sélectionnez Éditer -> Pages -> Déplacer la page vers le haut pour intervertir la page
actuelle avec la précédente.
 Sélectionnez Éditer -> Pages -> Déplacer la page vers le bas pour intervertir la page actuelle
avec la suivante.
Ces options de menu seront grisées si vous vous trouvez, respectivement, sur la première ou la dernière
page du document.

Supprimer des pages de votre document
Pour supprimer la page actuelle de votre document, sélectionnez Éditer -> Pages > Supprimer la
page actuelle
. La page actuelle et son contenu seront effacés.
Naviguer entre les pages
Outre les méthodes habituelles de navigation (avec la barre de défilement et molette de la souris), il
existe d'autres moyens de naviguer dans les pages :
Page précédente :
Déplace le document vers le haut. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Préc. :
Aller à la page précédente et centrer dessus.
Page suivante :
Déplace le document vers le bas. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Suiv. :
Aller à la page suivante et centrer dessus
Ou bien cliquez sur les flèches sur la barre
d'état :
La barre d'état est également très pratique pour savoir quelle(s) page(s) vous êtes en train de visionner.
Remarque :
tous ces déplacements sont relatifs à la page que vous voyez et non pas à la page actuelle.
Page 182
Déplacer des pages à l'intérieur d'un document
Si vous souhaitez changer l'ordre des pages dans le document, voici comment procéder.
Pour déplacer la page actuelle :
 Sélectionnez Éditer -> Pages -> Déplacer la page vers le haut pour intervertir la page
actuelle avec la précédente.
 Sélectionnez Éditer -> Pages -> Déplacer la page vers le bas pour intervertir la page actuelle
avec la suivante.
Ces options de menu seront grisées si vous vous trouvez, respectivement, sur la première ou la dernière
page du document.
Supprimer des pages de votre document
Pour supprimer la page actuelle de votre document, sélectionnez Éditer -> Pages > Supprimer la
page actuelle
. La page actuelle et son contenu seront effacés.
Naviguer entre les pages
Outre les méthodes habituelles de navigation (avec la barre de défilement et molette de la souris), il
existe d'autres moyens de naviguer dans les pages :
Page précédente :
Déplace le document vers le haut. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Préc. :
Aller à la page précédente et centrer dessus.
Page suivante :
Déplace le document vers le bas. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Suiv. :
Aller à la page suivante et centrer dessus
Ou bien cliquez sur les flèches sur la barre
d'état :
La barre d'état est également très pratique pour savoir quelle(s) page(s) vous êtes en train de visionner.
Remarque :
tous ces déplacements sont relatifs à la page que vous voyez et non pas à la page actuelle.
Page 183
Supprimer des pages de votre document
Pour supprimer la page actuelle de votre document, sélectionnez Éditer -> Pages > Supprimer la
page actuelle
. La page actuelle et son contenu seront effacés.
Naviguer entre les pages
Outre les méthodes habituelles de navigation (avec la barre de défilement et molette de la souris), il
existe d'autres moyens de naviguer dans les pages :
Page précédente :
Déplace le document vers le haut. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Préc. :
Aller à la page précédente et centrer dessus.
Page suivante :
Déplace le document vers le bas. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Suiv. :
Aller à la page suivante et centrer dessus
Ou bien cliquez sur les flèches sur la barre
d'état :
La barre d'état est également très pratique pour savoir quelle(s) page(s) vous êtes en train de visionner.
Remarque :
tous ces déplacements sont relatifs à la page que vous voyez et non pas à la page actuelle.
Page 184
Naviguer entre les pages
Outre les méthodes habituelles de navigation (avec la barre de défilement et molette de la souris), il
existe d'autres moyens de naviguer dans les pages :
Page précédente :
Déplace le document vers le haut. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Préc. :
Aller à la page précédente et centrer dessus.
Page suivante :
Déplace le document vers le bas. L'étendue de la zone déplacée dépend du niveau de zoom. Plus le
zoom est important, plus le déplacement est grand.
Ctrl+Pg. Suiv. :
Aller à la page suivante et centrer dessus
Ou bien cliquez sur les flèches sur la barre
d'état :
La barre d'état est également très pratique pour savoir quelle(s) page(s) vous êtes en train de visionner.
Remarque :
tous ces déplacements sont relatifs à la page que vous voyez et non pas à la page actuelle.
Page 185
Sauvegarde du document
Cette section traite de la sauvegarde dans le format interne de Web Designer. Consultez le chapitre pour
de plus amples informations
sur la sauvegarde dans d'autres formats.
Nous vous recommandons de réaliser régulièrement une sauvegarde de votre document. Un document
complexe peut représenter des heures de travail qui peuvent être réduites à néant en raison d'une
coupure de courant par exemple. Il est donc recommandé d'enregistrer les modifications régulièrement
dans votre document.
Sauvegarde (dans le menu fichier)
(Raccourci : Ctrl + S ou cliquez sur le bouton de sauvegarde
dans la barre de contrôle Standard
).
À l'aide de cette fonction, vous pouvez sauvegarder rapidement un document sous le même nom. Cette
option est masquée tant que le document ne contient pas de modifications non enregistrées. (C'est-à-dire
lorsque vous avez opéré des modifications mais que vous ne les avez pas sauvegardé.)
Pour un nouveau document qui n'a encore jamais été sauvegardé, cette option fonctionne comme
Enregistrer sous...
.
Enregistrer sous (dans le menu fichier)
Cette option ouvre une boîte de dialogue permettant de sauvegarder le document sous un nom différent
ou dans un répertoire différent. Cette option est utile pour réaliser des sauvegardes de documents Web
Designer.
Enregistrer tout (dans le menu fichier)
Cette commande permet de sauvegarder tous les fichiers ouverts actuellement, sans avoir recours à «
Enregistrer sous » ou « Sauvegarder
».
Page 186
Sauvegarde (dans le menu fichier)
(Raccourci : Ctrl + S ou cliquez sur le bouton de sauvegarde
dans la barre de contrôle Standard
).
À l'aide de cette fonction, vous pouvez sauvegarder rapidement un document sous le même nom. Cette
option est masquée tant que le document ne contient pas de modifications non enregistrées. (C'est-à-dire
lorsque vous avez opéré des modifications mais que vous ne les avez pas sauvegardé.)
Pour un nouveau document qui n'a encore jamais été sauvegardé, cette option fonctionne comme
Enregistrer sous...
.
Enregistrer sous (dans le menu fichier)
Cette option ouvre une boîte de dialogue permettant de sauvegarder le document sous un nom différent
ou dans un répertoire différent. Cette option est utile pour réaliser des sauvegardes de documents Web
Designer.
Enregistrer tout (dans le menu fichier)
Cette commande permet de sauvegarder tous les fichiers ouverts actuellement, sans avoir recours à «
Enregistrer sous » ou « Sauvegarder
».
Page 187
Enregistrer sous (dans le menu fichier)
Cette option ouvre une boîte de dialogue permettant de sauvegarder le document sous un nom différent
ou dans un répertoire différent. Cette option est utile pour réaliser des sauvegardes de documents Web
Designer.
Enregistrer tout (dans le menu fichier)
Cette commande permet de sauvegarder tous les fichiers ouverts actuellement, sans avoir recours à «
Enregistrer sous » ou « Sauvegarder
».
Page 188
Enregistrer tout (dans le menu fichier)
Cette commande permet de sauvegarder tous les fichiers ouverts actuellement, sans avoir recours à «
Enregistrer sous » ou « Sauvegarder
».
Page 189
Dossiers d'aide
Certains documents utilisés pour créer des sites Internet ont besoin d'être reliés à des fichiers externes
qui ne peuvent pas être incrustés dans le fichier .web. Par exemple, vous pouvez avoir un fichier Flash
utilisé sur votre site Internet et vous voudrez garder ce fichier avec votre page parce que vous ne pouvez
pas l'exporter comme un site entièrement opérationnel sans ce fichier Flash. Et si vous devez envoyer le
modèle de votre page à quelqu'un d'autre ou le déplacer sur un autre ordinateur, vous souhaitez que le
fichier Flash suive le fichier principal.
Dans ce cas, Xtreme Web Designer 5 utilise un « fichier d'aide » facultatif en parallèle du fichier modèle
pour conserver ces fichiers externes.
Nommer le fichier d'aide
Le fichier de modèle et son fichier d'aide sont reliés par leur nom. Le fichier d'aide pour
« monSite.web » est toujours « monSite_web_files ». Cette convention permet de voir clairement quel
fichier d'aide appartient à quel fichier de modèle. Donc si vous renommez, copiez ou déplacez un fichier
de modèle, faites-le également pour le fichier d'aide s'il y en a un. Si vous envoyez un fichier de modèle à
quelqu'un, envoyez-lui également le fichier d'aide.
Si vous téléchargez un modèle de conception accompagné d'un fichier d'aide et que vous faites
« Enregistrer sous » pour sauvegarder une copie de ce modèle, Xtreme Web Designer 5 copiera
l'intégralité du fichier d'aide s'il y en a un.
Contenus des fichiers d'aide
Lorsque vous utilisez l'onglet Emplacement de la boîte de dialogue Propriétés Web pour insérer une
référence à un fichier externe dans le modèle de votre site Internet (en utilisant les boutons de navigation),
Xtreme Web Designer 5 copie automatiquement ce fichier dans le fichier d'aide du modèle pour vous.
S'il n'y a pas encore de fichier d'aide, le logiciel le créé.
Notez que si vous changez un objet d'emplacement pour qu'il réfère à un fichier différent, le fichier
original ne sera pas automatiquement supprimé du fichier d'aide. Par conséquent, si vous n'avez plus
besoin d'un fichier, il vous faudra le supprimer manuellement.
Vous pouvez également copier manuellement les fichiers de votre choix dans le fichier d'aide d'un
modèle, en créant le fichier manuellement si nécessaire. Xtreme Web Designer 5 ne supprimera aucun
élément de ce fichier, qu'il soit ou non relié au modèle correspondant. Cela s'explique par le fait qu'il
existe plusieurs manières différentes pour qu'un modèle face référence à un fichier externe. Par exemple,
vous pouvez insérer un élément de code HTML dans votre modèle qui face référence à un fichier externe
que vous avez placé dans votre fichier d'aide. Il est aussi possible qu'un fichier externe face référence à
un autre fichier externe ! Xtreme Web Designer 5 ne peut en aucun cas être sûr qu'un fichier n'est pas
utilisé par le site Internet, c'est pourquoi il ne supprime jamais les fichiers.
Exporter des sites Internet avec les fichiers d'aide
Lorsque vous exportez un document de site Internet, tous les fichiers du fichier d'aide correspondant
sont copiés dans le répertoire qui contient toutes les images générées pour votre site. Ainsi, si vous
exportez « monSite.web » dans « index.htm », tous les fichiers du répertoire « monSite_web_files » sont
copiés dans le répertoire « index_htm_files ».
Page 190
Nommer le fichier d'aide
Le fichier de modèle et son fichier d'aide sont reliés par leur nom. Le fichier d'aide pour
« monSite.web » est toujours « monSite_web_files ». Cette convention permet de voir clairement quel
fichier d'aide appartient à quel fichier de modèle. Donc si vous renommez, copiez ou déplacez un fichier
de modèle, faites-le également pour le fichier d'aide s'il y en a un. Si vous envoyez un fichier de modèle à
quelqu'un, envoyez-lui également le fichier d'aide.
Si vous téléchargez un modèle de conception accompagné d'un fichier d'aide et que vous faites
« Enregistrer sous » pour sauvegarder une copie de ce modèle, Xtreme Web Designer 5 copiera
l'intégralité du fichier d'aide s'il y en a un.
Contenus des fichiers d'aide
Lorsque vous utilisez l'onglet Emplacement de la boîte de dialogue Propriétés Web pour insérer une
référence à un fichier externe dans le modèle de votre site Internet (en utilisant les boutons de navigation),
Xtreme Web Designer 5 copie automatiquement ce fichier dans le fichier d'aide du modèle pour vous.
S'il n'y a pas encore de fichier d'aide, le logiciel le créé.
Notez que si vous changez un objet d'emplacement pour qu'il réfère à un fichier différent, le fichier
original ne sera pas automatiquement supprimé du fichier d'aide. Par conséquent, si vous n'avez plus
besoin d'un fichier, il vous faudra le supprimer manuellement.
Vous pouvez également copier manuellement les fichiers de votre choix dans le fichier d'aide d'un
modèle, en créant le fichier manuellement si nécessaire. Xtreme Web Designer 5 ne supprimera aucun
élément de ce fichier, qu'il soit ou non relié au modèle correspondant. Cela s'explique par le fait qu'il
existe plusieurs manières différentes pour qu'un modèle face référence à un fichier externe. Par exemple,
vous pouvez insérer un élément de code HTML dans votre modèle qui face référence à un fichier externe
que vous avez placé dans votre fichier d'aide. Il est aussi possible qu'un fichier externe face référence à
un autre fichier externe ! Xtreme Web Designer 5 ne peut en aucun cas être sûr qu'un fichier n'est pas
utilisé par le site Internet, c'est pourquoi il ne supprime jamais les fichiers.
Exporter des sites Internet avec les fichiers d'aide
Lorsque vous exportez un document de site Internet, tous les fichiers du fichier d'aide correspondant
sont copiés dans le répertoire qui contient toutes les images générées pour votre site. Ainsi, si vous
exportez « monSite.web » dans « index.htm », tous les fichiers du répertoire « monSite_web_files » sont
copiés dans le répertoire « index_htm_files ».
Page 191
Contenus des fichiers d'aide
Lorsque vous utilisez l'onglet Emplacement de la boîte de dialogue Propriétés Web pour insérer une
référence à un fichier externe dans le modèle de votre site Internet (en utilisant les boutons de navigation),
Xtreme Web Designer 5 copie automatiquement ce fichier dans le fichier d'aide du modèle pour vous.
S'il n'y a pas encore de fichier d'aide, le logiciel le créé.
Notez que si vous changez un objet d'emplacement pour qu'il réfère à un fichier différent, le fichier
original ne sera pas automatiquement supprimé du fichier d'aide. Par conséquent, si vous n'avez plus
besoin d'un fichier, il vous faudra le supprimer manuellement.
Vous pouvez également copier manuellement les fichiers de votre choix dans le fichier d'aide d'un
modèle, en créant le fichier manuellement si nécessaire. Xtreme Web Designer 5 ne supprimera aucun
élément de ce fichier, qu'il soit ou non relié au modèle correspondant. Cela s'explique par le fait qu'il
existe plusieurs manières différentes pour qu'un modèle face référence à un fichier externe. Par exemple,
vous pouvez insérer un élément de code HTML dans votre modèle qui face référence à un fichier externe
que vous avez placé dans votre fichier d'aide. Il est aussi possible qu'un fichier externe face référence à
un autre fichier externe ! Xtreme Web Designer 5 ne peut en aucun cas être sûr qu'un fichier n'est pas
utilisé par le site Internet, c'est pourquoi il ne supprime jamais les fichiers.
Exporter des sites Internet avec les fichiers d'aide
Lorsque vous exportez un document de site Internet, tous les fichiers du fichier d'aide correspondant
sont copiés dans le répertoire qui contient toutes les images générées pour votre site. Ainsi, si vous
exportez « monSite.web » dans « index.htm », tous les fichiers du répertoire « monSite_web_files » sont
copiés dans le répertoire « index_htm_files ».
Page 192
Exporter des sites Internet avec les fichiers d'aide
Lorsque vous exportez un document de site Internet, tous les fichiers du fichier d'aide correspondant
sont copiés dans le répertoire qui contient toutes les images générées pour votre site. Ainsi, si vous
exportez « monSite.web » dans « index.htm », tous les fichiers du répertoire « monSite_web_files » sont
copiés dans le répertoire « index_htm_files ».
Page 193
Fermer le document
Pour fermer le document :
 Sélectionner Fichier > Fermer
 Ou cliquez sur Ctrl+F4 ou Ctrl+W.
 Ou cliquez sur le petit x du bas se trouvant dans le coin supérieur droit de la fenêtre.
Remarque :
sur la plupart des ordinateurs, le x du bas, celui permettant de fermer le document, est plus petit que
celui permettant de fermer le programme.
Page 194
Grille
Afin de vous aider à effectuer la mise en page de votre document, Web Designer peut afficher une grille
d'aide à l'écran. (La grille apparaît uniquement sur l'écran et jamais à l'impression.) La grille peut vous
aider à aligner des objets (comme sur du papier à dessin).
Fenêtre > Afficher grille
(raccourci clavier : #) permet d'afficher ou masquer la grille.
Vous pouvez également choisir Fenêtre > Aligner à la grille
. Les intersections de la grille fonctionnent alors comme des aimants et les objets déplacés sont
automatiquement aligné sur l'intersection la plus proche.
Consultez le chapitre Manipulation des objets
pour de plus amples informations sur l'alignement.
Le type de grille (isométrique/rectangulaire), le point 0,0 (l'origine) et l'espacement des points de la grille
est contrôlé par l'onglet Grille et Règles
de la boîte de dialogue des options. Les modifications seront appliquées uniquement au document
sélectionné.
Vous pouvez déplacer la grille relativement à la page en déplaçant le point 0,0 de la règle (décrit plus
bas).
Page 195
Règles
Les règles sont masquées en mode standard. Pour les afficher :
 Cliquez sur Ctrl+Maj+R.
 Ou sélectionnez Fenêtre > Barres > Règles.
Web Designer utilise les règles pour :
 contrôler les marges, tabulateur et retraits dans l'outil Texte ;
 indiquer quelle partie de la page vous regardez actuellement ;
 indiquer la position X-Y actuelle du pointeur ;
 utiliser des lignes d'aide. Si l'option « Aligner à la grille » est activée, les lignes d'aide seront
alignées automatiquement au cadre. (Pour de plus amples informations sur les lignes d'aide,
consultez la section des instructions et lignes d'aide dans le chapitre Manipulation des objets.)
Lorsque vous créez ou calibrez des objets, vous pouvez vérifier leur taille à l'aide des règles. Vous avez
en outre la possibilité d'utiliser l'outil de sélection
pour un résultat plus précis. Voir sélection d'objets pour de plus amples informations.
Les règles sont affichés sur le bord supérieur gauche de la fenêtre. Une ligne en pointillés sur chaque règle
suit la position actuelle du pointeur.
Les unités et le nombre d'intersections sur les règles sont les mêmes que ceux configurés sur la grille.
Vous pouvez les définir en utilisant les onglets grille et règles
de la boîte de dialogue des options (décrit plus bas). Les unités actuelles et les facteurs de calibrage sont
affichés à la droite de la première règle.
Afficher/masquer les réglettes
Sélectionnez Fenêtre > Barres > Règles
(raccourci clavier : Ctrl + L) pour activer et désactiver les règles. Toutes les modifications seront
appliquées à la fenêtre actuelle et toutes les fenêtres ouvertes ultérieurement. Les fenêtres déjà ouvertes
ne sont pas concernées.
Modifier le point d'origine des réglettes
Il est souvent plus simple de mesurer un objet si vous alignez le point d'origine des réglettes sur ce
dernier. Pour déplacer ce point, tirez la case jusqu'à l'intersection des deux réglettes.
Vous pouvez tirer les réglettes verticalement ou horizontalement le long de la fenêtre d'édition de Web
Designer. La nouvelle position sera indiquée par une ligne en pointillés.
Cette opération déplace également le point d'origine de la grille de manière à ce que les réglettes soient
toujours alignées sur la grille.
Vous pouvez également déplacer le point d'origine depuis le dessous de l'onglet grille et réglettes
de la boîte de dialogue des options.
Page 196
Afficher/masquer les réglettes
Sélectionnez Fenêtre > Barres > Règles
(raccourci clavier : Ctrl + L) pour activer et désactiver les règles. Toutes les modifications seront
appliquées à la fenêtre actuelle et toutes les fenêtres ouvertes ultérieurement. Les fenêtres déjà ouvertes
ne sont pas concernées.
Modifier le point d'origine des réglettes
Il est souvent plus simple de mesurer un objet si vous alignez le point d'origine des réglettes sur ce
dernier. Pour déplacer ce point, tirez la case jusqu'à l'intersection des deux réglettes.
Vous pouvez tirer les réglettes verticalement ou horizontalement le long de la fenêtre d'édition de Web
Designer. La nouvelle position sera indiquée par une ligne en pointillés.
Cette opération déplace également le point d'origine de la grille de manière à ce que les réglettes soient
toujours alignées sur la grille.
Vous pouvez également déplacer le point d'origine depuis le dessous de l'onglet grille et réglettes
de la boîte de dialogue des options.
Page 197
Modifier le point d'origine des réglettes
Il est souvent plus simple de mesurer un objet si vous alignez le point d'origine des réglettes sur ce
dernier. Pour déplacer ce point, tirez la case jusqu'à l'intersection des deux réglettes.
Vous pouvez tirer les réglettes verticalement ou horizontalement le long de la fenêtre d'édition de Web
Designer. La nouvelle position sera indiquée par une ligne en pointillés.
Cette opération déplace également le point d'origine de la grille de manière à ce que les réglettes soient
toujours alignées sur la grille.
Vous pouvez également déplacer le point d'origine depuis le dessous de l'onglet grille et réglettes
de la boîte de dialogue des options.
Page 198
Afficher la réglette de qualité
Ces réglettes (affichées dans la barre de contrôle Standard
) affectent l'affichage du document sur l'écran. Elles n'ont
aucune influence sur le document lui-même ou sur
l'impression.
Il existe cinq réglages de qualité différents :
 Contours seulement. La fonction anti-alias a été généralisée pour les écran de haute qualité.
 Contours avec étapes de fondu.
 Couleur intense (pas d'anti-alias).
 Haute qualité (anti-alias complet et lissage de l'image).
 Très haute qualité (haute qualité améliorée, le meilleur anti-alias de l'industrie. Nouvel affichage
photo bi-cubique complètement remanié qui améliore la qualité des photos recalibrées).
Couleur intense
affiche le document en couleur mais la fonction anti-alias est alors désactivée.
Dans les paramètres des contours
, seuls les contours des formes apparaissent (ils sont affichés sous forme quadrillée). Cela permet de
sélectionner plus facilement des objets cachés derrière d'autres.
Page 199
Galeries
Dans Web Designer, il est souvent possible de choisir un objet parmi plusieurs possibilités, par exemple
les polices, les couleurs, les Cliparts, les attributs de lignes et les Bitmaps. Web Designer utilise les
galeries à cet effet. Cette section du manuel dispense des informations générales concernant les parties
communes aux galeries. Les sections individuelles de ce manuel décrivent les différences spécifiques à
chaque galerie.
1 Calque
2 Cadre
3 Bitmap
4 Ligne
5 Designs
6 Remplissage
Certaines galeries affichent des objets contenus dans des bibliothèques externes au document :
Designs, Remplissage.
D'autres galeries se rapportent à des objets du document ou à des options pour ces objets :
Bitmap, Ligne.
Pour certains types de documents, seules deux galeries sont disponibles ; elles seront grisées si
indisponibles :
 le calque est uniquement disponible pour les documents normaux sans animations.
 Le cadre est uniquement disponible pour les documents avec animations.
Diverses galeries sont décrites en détail plus loin dans ce manuel.
Afficher une galerie
Pour afficher une galerie :
 Sélectionnez dans la barre de contrôle des Galeries.
 Ou choisissez Services > Galeries.
Accrocher et décrocher des galeries
Il est possible d'accrocher une ou plusieurs galeries sur chaque côté de la fenêtre de Web Designer.
Page 200
Exemple d'une galerie accrochée. Il est possible de modifier la taille de la galerie pour libérer de l'espace
par exemple.
Accrocher une galerie
Pour accrocher une galerie :
1. Afficher une galerie comme décrit plus haut.
2. Puis tirer la galerie sur le côté gauche ou droit de votre écran.
3. Répéter le procédé pour d'autres galeries comme requis.
Décrocher une galerie
En cliquant sur un symbole dans la barre de contrôle des galeries
, vous supprimez la galerie de l'écran. Si vous cliquez à nouveau, la galerie sera replacée à sa position
d'accrochage. Pour décrocher une galerie définitivement, éloignez simplement la galerie des bords de
l'écran.
Ou bien maintenez le bouton CTRL de votre clavier enfoncé pendant que vous étirez la galerie pour
supprimer l'accrochage de celle-ci.
Classement des galeries
Si vous avez accroché plus d'une galerie sur un côté, elles se partageront une seule et même colonne.
Vous pouvez modifier la taille des galeries et les déplacer vers le haut ou vers le bas pour changer leur
ordre.
Utiliser des galeries
Plier ou déplier une section dans une galerie :
 Cliquez sur Plier/Déplier
 Ou double-cliquez sur le titre.
 Ou effectuez un clic droit sur une section pour afficher un menu pop up. Sélectionnez la section
Plier/Déplier. Le menu pop up dispose alors d'options permettant de défiler vers la section
précédente ou suivante.
Page 201
Cette illustration montre que la Galerie est dépliée. Les autres galeries ont le même aspect.
Les boutons situés en haut dépendent du type de Galerie (par exemple, Remplissage et Transpsont
propres à la Galerie des Bitmaps
). Cependant, la plupart des Galeries disposent des boutons suivants :
Appliquer :
applique l'élément sélectionné dans la galerie. Cliquez sur l'objet pour le sélectionner.
Options :
ouvre un menu dans lequel vous pouvez choisir :
 Chercher : décrit plus bas dans la recherche par nom.
 Trier : décrit plus bas dans le classement des éléments dans la galerie.
 Propriétés : permet de définir la taille des icônes et les informations affichées dans la galerie.
 Ajouter (Galeries Clipart, remplissage et polices) : décrit plus bas dans la section ajouter à une
galerie.
 Supprimer (Galeries Clipart, remplissage et polices) : décrit plus bas dans la section supprimer
d'une galerie.
Sélectionner des objets
Pour sélectionner un objet :
 Cliquez sur l'objet pour le sélectionner.
 Ou cliquez sur un objet puis, tout en maintenant la touche Maj appuyée, cliquez sur un autre.
Tous les objets se trouvant entre ces deux objets seront alors sélectionnés.
 Ou encore cliquez sur un objet tout en maintenant la touche Ctrl appuyée afin d'ajouter un objet à
la sélection.
Classer à nouveau les objets dans la galerie
(Le reclassement des objets dans la galerie des calques
modifie également l'ordre des calques. Consultez le chapitre calques pour de plus amples informations.)
Vous pouvez déplacer des objets dans les galeries pour les ordonner comme vous le souhaitez (excepté
dans la galerie des lignes
).
Dans toutes les galeries, le menu Options > Trier ouvre une boîte de dialogue. Vous pouvez classer les
objets par nom et, en fonction de la galerie, selon d'autres critères.
Les touches de contrôle primaire permettent de procéder un premier classement. Pour certains
paramètres de triage comme le type de fichier ou la longueur du nom, il peut exister deux ou plus fichiers
similaires. Vous pouvez trier ces fichiers en utilisant les touches secondaires.
Chercher par nom d'objet
Vous pouvez par exemple rechercher tous les noms contenant le mot « rouge » :
Page 202
1. Sélectionnez Options
> Chercher
2. Entrez le mot rouge
dans le champ de
texte.
3. Sélectionnez Chercher
noms et mots-clé
(pour chercher
uniquement le nom de
l'objet (Fichier,
couleur, etc.) ou
Chercher toutes les
infos (pour chercher
par nom et mots-clé
disponibles dans
certaines galeries).
Ajouter à une galerie
Vous pouvez ajouter des objets à ces galeries (galeries de Design et de Remplissage
seulement). Pour cela :
1. Copiez dans un nouveau répertoire les fichiers que vous souhaitez ajouter à l'aide de
l'Explorateur Windows.
o Pour la galerie des Cliparts, les fichiers peuvent être des fichiers vectoriels ou Bitmap.
o Pour la galerie de remplissage, tous les formats Bitmap pris en charge par Web Designer
sont valables (Liste dans Importer et Exporter).
2. Dans la galerie sélectionnée, cliquez sur le bouton Design disque/Remplissages. Une boîte de
dialogue s'affiche.
3. Sélectionnez le dossier via la boîte de dialogue.
4. Cliquez sur Ajouter. Une nouvelle section est créée dans la galerie.
Si vous souhaitez ajouter des objets à ce dossier ultérieurement :
1. Copiez les nouveaux fichiers dans le dossier existant.
2. Dans la galerie, cliquez sur Design disque/Remplissages. Une boîte de dialogue s'affiche.
3. Sélectionnez le dossier que vous souhaitez ajouter via la boîte de dialogue.
4. Cliquez sur Mettre à jour pour mettre à jour la rubrique dans la galerie.
Supprimer des sections dans la galerie.
Pour supprimer une section dans une galerie (galeries Clipart et Remplissage uniquement) :
1. Cliquez sur le titre de la ou des sections que vous souhaitez supprimer.
2. Cliquez sur Supprimer.
Si vous souhaitez récupérer la section ultérieurement, ajoutez ses dossiers à la galerie (décrit plus haut).
Page 203
Afficher une galerie
Pour afficher une galerie :
 Sélectionnez dans la barre de contrôle des Galeries.
 Ou choisissez Services > Galeries.
Accrocher et décrocher des galeries
Il est possible d'accrocher une ou plusieurs galeries sur chaque côté de la fenêtre de Web Designer.
Exemple d'une galerie accrochée. Il est possible de modifier la taille de la galerie pour libérer de l'espace
par exemple.
Accrocher une galerie
Pour accrocher une galerie :
1. Afficher une galerie comme décrit plus haut.
2. Puis tirer la galerie sur le côté gauche ou droit de votre écran.
3. Répéter le procédé pour d'autres galeries comme requis.
Décrocher une galerie
En cliquant sur un symbole dans la barre de contrôle des galeries
, vous supprimez la galerie de l'écran. Si vous cliquez à nouveau, la galerie sera replacée à sa position
d'accrochage. Pour décrocher une galerie définitivement, éloignez simplement la galerie des bords de
l'écran.
Ou bien maintenez le bouton CTRL de votre clavier enfoncé pendant que vous étirez la galerie pour
supprimer l'accrochage de celle-ci.
Classement des galeries
Si vous avez accroché plus d'une galerie sur un côté, elles se partageront une seule et même colonne.
Vous pouvez modifier la taille des galeries et les déplacer vers le haut ou vers le bas pour changer leur
ordre.
Utiliser des galeries
Plier ou déplier une section dans une galerie :
 Cliquez sur Plier/Déplier
Page 204


Ou double-cliquez sur le titre.
Ou effectuez un clic droit sur une section pour afficher un menu pop up. Sélectionnez la section
Plier/Déplier. Le menu pop up dispose alors d'options permettant de défiler vers la section
précédente ou suivante.
Cette illustration montre que la Galerie est dépliée. Les autres galeries ont le même aspect.
Les boutons situés en haut dépendent du type de Galerie (par exemple, Remplissage et Transpsont
propres à la Galerie des Bitmaps
). Cependant, la plupart des Galeries disposent des boutons suivants :
Appliquer :
applique l'élément sélectionné dans la galerie. Cliquez sur l'objet pour le sélectionner.
Options :
ouvre un menu dans lequel vous pouvez choisir :
 Chercher : décrit plus bas dans la recherche par nom.
 Trier : décrit plus bas dans le classement des éléments dans la galerie.
 Propriétés : permet de définir la taille des icônes et les informations affichées dans la galerie.
 Ajouter (Galeries Clipart, remplissage et polices) : décrit plus bas dans la section ajouter à une
galerie.
 Supprimer (Galeries Clipart, remplissage et polices) : décrit plus bas dans la section supprimer
d'une galerie.
Sélectionner des objets
Pour sélectionner un objet :
 Cliquez sur l'objet pour le sélectionner.
 Ou cliquez sur un objet puis, tout en maintenant la touche Maj appuyée, cliquez sur un autre.
Tous les objets se trouvant entre ces deux objets seront alors sélectionnés.
 Ou encore cliquez sur un objet tout en maintenant la touche Ctrl appuyée afin d'ajouter un objet à
la sélection.
Classer à nouveau les objets dans la galerie
(Le reclassement des objets dans la galerie des calques
modifie également l'ordre des calques. Consultez le chapitre calques pour de plus amples informations.)
Vous pouvez déplacer des objets dans les galeries pour les ordonner comme vous le souhaitez (excepté
dans la galerie des lignes
).
Dans toutes les galeries, le menu Options > Trier ouvre une boîte de dialogue. Vous pouvez classer les
objets par nom et, en fonction de la galerie, selon d'autres critères.
Les touches de contrôle primaire permettent de procéder un premier classement. Pour certains
paramètres de triage comme le type de fichier ou la longueur du nom, il peut exister deux ou plus fichiers
similaires. Vous pouvez trier ces fichiers en utilisant les touches secondaires.
Chercher par nom d'objet
Page 205
Vous pouvez par exemple rechercher tous les noms contenant le mot « rouge » :
1. Sélectionnez Options
> Chercher
2. Entrez le mot rouge
dans le champ de
texte.
3. Sélectionnez Chercher
noms et mots-clé
(pour chercher
uniquement le nom de
l'objet (Fichier,
couleur, etc.) ou
Chercher toutes les
infos (pour chercher
par nom et mots-clé
disponibles dans
certaines galeries).
Ajouter à une galerie
Vous pouvez ajouter des objets à ces galeries (galeries de Design et de Remplissage
seulement). Pour cela :
1. Copiez dans un nouveau répertoire les fichiers que vous souhaitez ajouter à l'aide de
l'Explorateur Windows.
o Pour la galerie des Cliparts, les fichiers peuvent être des fichiers vectoriels ou Bitmap.
o Pour la galerie de remplissage, tous les formats Bitmap pris en charge par Web Designer
sont valables (Liste dans Importer et Exporter).
2. Dans la galerie sélectionnée, cliquez sur le bouton Design disque/Remplissages. Une boîte de
dialogue s'affiche.
3. Sélectionnez le dossier via la boîte de dialogue.
4. Cliquez sur Ajouter. Une nouvelle section est créée dans la galerie.
Si vous souhaitez ajouter des objets à ce dossier ultérieurement :
1. Copiez les nouveaux fichiers dans le dossier existant.
2. Dans la galerie, cliquez sur Design disque/Remplissages. Une boîte de dialogue s'affiche.
3. Sélectionnez le dossier que vous souhaitez ajouter via la boîte de dialogue.
4. Cliquez sur Mettre à jour pour mettre à jour la rubrique dans la galerie.
Supprimer des sections dans la galerie.
Pour supprimer une section dans une galerie (galeries Clipart et Remplissage uniquement) :
1. Cliquez sur le titre de la ou des sections que vous souhaitez supprimer.
2. Cliquez sur Supprimer.
Si vous souhaitez récupérer la section ultérieurement, ajoutez ses dossiers à la galerie (décrit plus haut).
Page 206
Accrocher et décrocher des galeries
Il est possible d'accrocher une ou plusieurs galeries sur chaque côté de la fenêtre de Web Designer.
Exemple d'une galerie accrochée. Il est possible de modifier la taille de la galerie pour libérer de l'espace
par exemple.
Accrocher une galerie
Pour accrocher une galerie :
1. Afficher une galerie comme décrit plus haut.
2. Puis tirer la galerie sur le côté gauche ou droit de votre écran.
3. Répéter le procédé pour d'autres galeries comme requis.
Décrocher une galerie
En cliquant sur un symbole dans la barre de contrôle des galeries
, vous supprimez la galerie de l'écran. Si vous cliquez à nouveau, la galerie sera replacée à sa position
d'accrochage. Pour décrocher une galerie définitivement, éloignez simplement la galerie des bords de
l'écran.
Ou bien maintenez le bouton CTRL de votre clavier enfoncé pendant que vous étirez la galerie pour
supprimer l'accrochage de celle-ci.
Classement des galeries
Si vous avez accroché plus d'une galerie sur un côté, elles se partageront une seule et même colonne.
Vous pouvez modifier la taille des galeries et les déplacer vers le haut ou vers le bas pour changer leur
ordre.
Utiliser des galeries
Plier ou déplier une section dans une galerie :
 Cliquez sur Plier/Déplier
 Ou double-cliquez sur le titre.
 Ou effectuez un clic droit sur une section pour afficher un menu pop up. Sélectionnez la section
Plier/Déplier. Le menu pop up dispose alors d'options permettant de défiler vers la section
précédente ou suivante.
Page 207
Cette illustration montre que la Galerie est dépliée. Les autres galeries ont le même aspect.
Les boutons situés en haut dépendent du type de Galerie (par exemple, Remplissage et Transpsont
propres à la Galerie des Bitmaps
). Cependant, la plupart des Galeries disposent des boutons suivants :
Appliquer :
applique l'élément sélectionné dans la galerie. Cliquez sur l'objet pour le sélectionner.
Options :
ouvre un menu dans lequel vous pouvez choisir :
 Chercher : décrit plus bas dans la recherche par nom.
 Trier : décrit plus bas dans le classement des éléments dans la galerie.
 Propriétés : permet de définir la taille des icônes et les informations affichées dans la galerie.
 Ajouter (Galeries Clipart, remplissage et polices) : décrit plus bas dans la section ajouter à une
galerie.
 Supprimer (Galeries Clipart, remplissage et polices) : décrit plus bas dans la section supprimer
d'une galerie.
Sélectionner des objets
Pour sélectionner un objet :
 Cliquez sur l'objet pour le sélectionner.
 Ou cliquez sur un objet puis, tout en maintenant la touche Maj appuyée, cliquez sur un autre.
Tous les objets se trouvant entre ces deux objets seront alors sélectionnés.
 Ou encore cliquez sur un objet tout en maintenant la touche Ctrl appuyée afin d'ajouter un objet à
la sélection.
Classer à nouveau les objets dans la galerie
(Le reclassement des objets dans la galerie des calques
modifie également l'ordre des calques. Consultez le chapitre calques pour de plus amples informations.)
Vous pouvez déplacer des objets dans les galeries pour les ordonner comme vous le souhaitez (excepté
dans la galerie des lignes
).
Dans toutes les galeries, le menu Options > Trier ouvre une boîte de dialogue. Vous pouvez classer les
objets par nom et, en fonction de la galerie, selon d'autres critères.
Les touches de contrôle primaire permettent de procéder un premier classement. Pour certains
paramètres de triage comme le type de fichier ou la longueur du nom, il peut exister deux ou plus fichiers
similaires. Vous pouvez trier ces fichiers en utilisant les touches secondaires.
Chercher par nom d'objet
Vous pouvez par exemple rechercher tous les noms contenant le mot « rouge » :
Page 208
1. Sélectionnez Options
> Chercher
2. Entrez le mot rouge
dans le champ de
texte.
3. Sélectionnez Chercher
noms et mots-clé
(pour chercher
uniquement le nom de
l'objet (Fichier,
couleur, etc.) ou
Chercher toutes les
infos (pour chercher
par nom et mots-clé
disponibles dans
certaines galeries).
Ajouter à une galerie
Vous pouvez ajouter des objets à ces galeries (galeries de Design et de Remplissage
seulement). Pour cela :
1. Copiez dans un nouveau répertoire les fichiers que vous souhaitez ajouter à l'aide de
l'Explorateur Windows.
o Pour la galerie des Cliparts, les fichiers peuvent être des fichiers vectoriels ou Bitmap.
o Pour la galerie de remplissage, tous les formats Bitmap pris en charge par Web Designer
sont valables (Liste dans Importer et Exporter).
2. Dans la galerie sélectionnée, cliquez sur le bouton Design disque/Remplissages. Une boîte de
dialogue s'affiche.
3. Sélectionnez le dossier via la boîte de dialogue.
4. Cliquez sur Ajouter. Une nouvelle section est créée dans la galerie.
Si vous souhaitez ajouter des objets à ce dossier ultérieurement :
1. Copiez les nouveaux fichiers dans le dossier existant.
2. Dans la galerie, cliquez sur Design disque/Remplissages. Une boîte de dialogue s'affiche.
3. Sélectionnez le dossier que vous souhaitez ajouter via la boîte de dialogue.
4. Cliquez sur Mettre à jour pour mettre à jour la rubrique dans la galerie.
Supprimer des sections dans la galerie.
Pour supprimer une section dans une galerie (galeries Clipart et Remplissage uniquement) :
1. Cliquez sur le titre de la ou des sections que vous souhaitez supprimer.
2. Cliquez sur Supprimer.
Si vous souhaitez récupérer la section ultérieurement, ajoutez ses dossiers à la galerie (décrit plus haut).
Page 209
Utiliser des galeries
Plier ou déplier une section dans une galerie :
 Cliquez sur Plier/Déplier
 Ou double-cliquez sur le titre.
 Ou effectuez un clic droit sur une section pour afficher un menu pop up. Sélectionnez la section
Plier/Déplier. Le menu pop up dispose alors d'options permettant de défiler vers la section
précédente ou suivante.
Cette illustration montre que la Galerie est dépliée. Les autres galeries ont le même aspect.
Les boutons situés en haut dépendent du type de Galerie (par exemple, Remplissage et Transpsont
propres à la Galerie des Bitmaps
). Cependant, la plupart des Galeries disposent des boutons suivants :
Appliquer :
applique l'élément sélectionné dans la galerie. Cliquez sur l'objet pour le sélectionner.
Options :
ouvre un menu dans lequel vous pouvez choisir :
 Chercher : décrit plus bas dans la recherche par nom.
 Trier : décrit plus bas dans le classement des éléments dans la galerie.
 Propriétés : permet de définir la taille des icônes et les informations affichées dans la galerie.
 Ajouter (Galeries Clipart, remplissage et polices) : décrit plus bas dans la section ajouter à une
galerie.
 Supprimer (Galeries Clipart, remplissage et polices) : décrit plus bas dans la section supprimer
d'une galerie.
Sélectionner des objets
Pour sélectionner un objet :
 Cliquez sur l'objet pour le sélectionner.
 Ou cliquez sur un objet puis, tout en maintenant la touche Maj appuyée, cliquez sur un autre.
Tous les objets se trouvant entre ces deux objets seront alors sélectionnés.
 Ou encore cliquez sur un objet tout en maintenant la touche Ctrl appuyée afin d'ajouter un objet à
la sélection.
Classer à nouveau les objets dans la galerie
(Le reclassement des objets dans la galerie des calques
modifie également l'ordre des calques. Consultez le chapitre calques pour de plus amples informations.)
Vous pouvez déplacer des objets dans les galeries pour les ordonner comme vous le souhaitez (excepté
dans la galerie des lignes
).
Dans toutes les galeries, le menu Options > Trier ouvre une boîte de dialogue. Vous pouvez classer les
objets par nom et, en fonction de la galerie, selon d'autres critères.
Les touches de contrôle primaire permettent de procéder un premier classement. Pour certains
Page 210
paramètres de triage comme le type de fichier ou la longueur du nom, il peut exister deux ou plus fichiers
similaires. Vous pouvez trier ces fichiers en utilisant les touches secondaires.
Chercher par nom d'objet
Vous pouvez par exemple rechercher tous les noms contenant le mot « rouge » :
1. Sélectionnez Options
> Chercher
2. Entrez le mot rouge
dans le champ de
texte.
3. Sélectionnez Chercher
noms et mots-clé
(pour chercher
uniquement le nom de
l'objet (Fichier,
couleur, etc.) ou
Chercher toutes les
infos (pour chercher
par nom et mots-clé
disponibles dans
certaines galeries).
Ajouter à une galerie
Vous pouvez ajouter des objets à ces galeries (galeries de Design et de Remplissage
seulement). Pour cela :
1. Copiez dans un nouveau répertoire les fichiers que vous souhaitez ajouter à l'aide de
l'Explorateur Windows.
o Pour la galerie des Cliparts, les fichiers peuvent être des fichiers vectoriels ou Bitmap.
o Pour la galerie de remplissage, tous les formats Bitmap pris en charge par Web Designer
sont valables (Liste dans Importer et Exporter).
2. Dans la galerie sélectionnée, cliquez sur le bouton Design disque/Remplissages. Une boîte de
dialogue s'affiche.
3. Sélectionnez le dossier via la boîte de dialogue.
4. Cliquez sur Ajouter. Une nouvelle section est créée dans la galerie.
Si vous souhaitez ajouter des objets à ce dossier ultérieurement :
1. Copiez les nouveaux fichiers dans le dossier existant.
2. Dans la galerie, cliquez sur Design disque/Remplissages. Une boîte de dialogue s'affiche.
3. Sélectionnez le dossier que vous souhaitez ajouter via la boîte de dialogue.
4. Cliquez sur Mettre à jour pour mettre à jour la rubrique dans la galerie.
Supprimer des sections dans la galerie.
Pour supprimer une section dans une galerie (galeries Clipart et Remplissage uniquement) :
1. Cliquez sur le titre de la ou des sections que vous souhaitez supprimer.
2. Cliquez sur Supprimer.
Si vous souhaitez récupérer la section ultérieurement, ajoutez ses dossiers à la galerie (décrit plus haut).
Page 211
Sélectionner des objets
Pour sélectionner un objet :
 Cliquez sur l'objet pour le sélectionner.
 Ou cliquez sur un objet puis, tout en maintenant la touche Maj appuyée, cliquez sur un autre.
Tous les objets se trouvant entre ces deux objets seront alors sélectionnés.
 Ou encore cliquez sur un objet tout en maintenant la touche Ctrl appuyée afin d'ajouter un objet à
la sélection.
Classer à nouveau les objets dans la galerie
(Le reclassement des objets dans la galerie des calques
modifie également l'ordre des calques. Consultez le chapitre calques pour de plus amples informations.)
Vous pouvez déplacer des objets dans les galeries pour les ordonner comme vous le souhaitez (excepté
dans la galerie des lignes
).
Dans toutes les galeries, le menu Options > Trier ouvre une boîte de dialogue. Vous pouvez classer les
objets par nom et, en fonction de la galerie, selon d'autres critères.
Les touches de contrôle primaire permettent de procéder un premier classement. Pour certains
paramètres de triage comme le type de fichier ou la longueur du nom, il peut exister deux ou plus fichiers
similaires. Vous pouvez trier ces fichiers en utilisant les touches secondaires.
Chercher par nom d'objet
Vous pouvez par exemple rechercher tous les noms contenant le mot « rouge » :
1. Sélectionnez Options
> Chercher
2. Entrez le mot rouge
dans le champ de
texte.
3. Sélectionnez Chercher
noms et mots-clé
(pour chercher
uniquement le nom de
l'objet (Fichier,
couleur, etc.) ou
Chercher toutes les
infos (pour chercher
par nom et mots-clé
disponibles dans
certaines galeries).
Ajouter à une galerie
Vous pouvez ajouter des objets à ces galeries (galeries de Design et de Remplissage
seulement). Pour cela :
1. Copiez dans un nouveau répertoire les fichiers que vous souhaitez ajouter à l'aide de
l'Explorateur Windows.
o Pour la galerie des Cliparts, les fichiers peuvent être des fichiers vectoriels ou Bitmap.
o Pour la galerie de remplissage, tous les formats Bitmap pris en charge par Web Designer
sont valables (Liste dans Importer et Exporter).
2. Dans la galerie sélectionnée, cliquez sur le bouton Design disque/Remplissages. Une boîte de
Page 212
dialogue s'affiche.
3. Sélectionnez le dossier via la boîte de dialogue.
4. Cliquez sur Ajouter. Une nouvelle section est créée dans la galerie.
Si vous souhaitez ajouter des objets à ce dossier ultérieurement :
1. Copiez les nouveaux fichiers dans le dossier existant.
2. Dans la galerie, cliquez sur Design disque/Remplissages. Une boîte de dialogue s'affiche.
3. Sélectionnez le dossier que vous souhaitez ajouter via la boîte de dialogue.
4. Cliquez sur Mettre à jour pour mettre à jour la rubrique dans la galerie.
Supprimer des sections dans la galerie.
Pour supprimer une section dans une galerie (galeries Clipart et Remplissage uniquement) :
1. Cliquez sur le titre de la ou des sections que vous souhaitez supprimer.
2. Cliquez sur Supprimer.
Si vous souhaitez récupérer la section ultérieurement, ajoutez ses dossiers à la galerie (décrit plus haut).
Page 213
Classer à nouveau les objets dans la galerie
(Le reclassement des objets dans la galerie des calques
modifie également l'ordre des calques. Consultez le chapitre calques pour de plus amples informations.)
Vous pouvez déplacer des objets dans les galeries pour les ordonner comme vous le souhaitez (excepté
dans la galerie des lignes
).
Dans toutes les galeries, le menu Options > Trier ouvre une boîte de dialogue. Vous pouvez classer les
objets par nom et, en fonction de la galerie, selon d'autres critères.
Les touches de contrôle primaire permettent de procéder un premier classement. Pour certains
paramètres de triage comme le type de fichier ou la longueur du nom, il peut exister deux ou plus fichiers
similaires. Vous pouvez trier ces fichiers en utilisant les touches secondaires.
Chercher par nom d'objet
Vous pouvez par exemple rechercher tous les noms contenant le mot « rouge » :
1. Sélectionnez Options
> Chercher
2. Entrez le mot rouge
dans le champ de
texte.
3. Sélectionnez Chercher
noms et mots-clé
(pour chercher
uniquement le nom de
l'objet (Fichier,
couleur, etc.) ou
Chercher toutes les
infos (pour chercher
par nom et mots-clé
disponibles dans
certaines galeries).
Ajouter à une galerie
Vous pouvez ajouter des objets à ces galeries (galeries de Design et de Remplissage
seulement). Pour cela :
1. Copiez dans un nouveau répertoire les fichiers que vous souhaitez ajouter à l'aide de
l'Explorateur Windows.
o Pour la galerie des Cliparts, les fichiers peuvent être des fichiers vectoriels ou Bitmap.
o Pour la galerie de remplissage, tous les formats Bitmap pris en charge par Web Designer
sont valables (Liste dans Importer et Exporter).
2. Dans la galerie sélectionnée, cliquez sur le bouton Design disque/Remplissages. Une boîte de
dialogue s'affiche.
3. Sélectionnez le dossier via la boîte de dialogue.
4. Cliquez sur Ajouter. Une nouvelle section est créée dans la galerie.
Si vous souhaitez ajouter des objets à ce dossier ultérieurement :
1. Copiez les nouveaux fichiers dans le dossier existant.
2. Dans la galerie, cliquez sur Design disque/Remplissages. Une boîte de dialogue s'affiche.
3. Sélectionnez le dossier que vous souhaitez ajouter via la boîte de dialogue.
4. Cliquez sur Mettre à jour pour mettre à jour la rubrique dans la galerie.
Page 214
Supprimer des sections dans la galerie.
Pour supprimer une section dans une galerie (galeries Clipart et Remplissage uniquement) :
1. Cliquez sur le titre de la ou des sections que vous souhaitez supprimer.
2. Cliquez sur Supprimer.
Si vous souhaitez récupérer la section ultérieurement, ajoutez ses dossiers à la galerie (décrit plus haut).
Page 215
Chercher par nom d'objet
Vous pouvez par exemple rechercher tous les noms contenant le mot « rouge » :
1. Sélectionnez Options
> Chercher
2. Entrez le mot rouge
dans le champ de
texte.
3. Sélectionnez Chercher
noms et mots-clé
(pour chercher
uniquement le nom de
l'objet (Fichier,
couleur, etc.) ou
Chercher toutes les
infos (pour chercher
par nom et mots-clé
disponibles dans
certaines galeries).
Ajouter à une galerie
Vous pouvez ajouter des objets à ces galeries (galeries de Design et de Remplissage
seulement). Pour cela :
1. Copiez dans un nouveau répertoire les fichiers que vous souhaitez ajouter à l'aide de
l'Explorateur Windows.
o Pour la galerie des Cliparts, les fichiers peuvent être des fichiers vectoriels ou Bitmap.
o Pour la galerie de remplissage, tous les formats Bitmap pris en charge par Web Designer
sont valables (Liste dans Importer et Exporter).
2. Dans la galerie sélectionnée, cliquez sur le bouton Design disque/Remplissages. Une boîte de
dialogue s'affiche.
3. Sélectionnez le dossier via la boîte de dialogue.
4. Cliquez sur Ajouter. Une nouvelle section est créée dans la galerie.
Si vous souhaitez ajouter des objets à ce dossier ultérieurement :
1. Copiez les nouveaux fichiers dans le dossier existant.
2. Dans la galerie, cliquez sur Design disque/Remplissages. Une boîte de dialogue s'affiche.
3. Sélectionnez le dossier que vous souhaitez ajouter via la boîte de dialogue.
4. Cliquez sur Mettre à jour pour mettre à jour la rubrique dans la galerie.
Supprimer des sections dans la galerie.
Pour supprimer une section dans une galerie (galeries Clipart et Remplissage uniquement) :
1. Cliquez sur le titre de la ou des sections que vous souhaitez supprimer.
2. Cliquez sur Supprimer.
Si vous souhaitez récupérer la section ultérieurement, ajoutez ses dossiers à la galerie (décrit plus haut).
Page 216
Ajouter à une galerie
Vous pouvez ajouter des objets à ces galeries (galeries de Design et de Remplissage
seulement). Pour cela :
1. Copiez dans un nouveau répertoire les fichiers que vous souhaitez ajouter à l'aide de
l'Explorateur Windows.
o Pour la galerie des Cliparts, les fichiers peuvent être des fichiers vectoriels ou Bitmap.
o Pour la galerie de remplissage, tous les formats Bitmap pris en charge par Web Designer
sont valables (Liste dans Importer et Exporter).
2. Dans la galerie sélectionnée, cliquez sur le bouton Design disque/Remplissages. Une boîte de
dialogue s'affiche.
3. Sélectionnez le dossier via la boîte de dialogue.
4. Cliquez sur Ajouter. Une nouvelle section est créée dans la galerie.
Si vous souhaitez ajouter des objets à ce dossier ultérieurement :
1. Copiez les nouveaux fichiers dans le dossier existant.
2. Dans la galerie, cliquez sur Design disque/Remplissages. Une boîte de dialogue s'affiche.
3. Sélectionnez le dossier que vous souhaitez ajouter via la boîte de dialogue.
4. Cliquez sur Mettre à jour pour mettre à jour la rubrique dans la galerie.
Supprimer des sections dans la galerie.
Pour supprimer une section dans une galerie (galeries Clipart et Remplissage uniquement) :
1. Cliquez sur le titre de la ou des sections que vous souhaitez supprimer.
2. Cliquez sur Supprimer.
Si vous souhaitez récupérer la section ultérieurement, ajoutez ses dossiers à la galerie (décrit plus haut).
Page 217
Supprimer des sections dans la galerie.
Pour supprimer une section dans une galerie (galeries Clipart et Remplissage uniquement) :
1. Cliquez sur le titre de la ou des sections que vous souhaitez supprimer.
2. Cliquez sur Supprimer.
Si vous souhaitez récupérer la section ultérieurement, ajoutez ses dossiers à la galerie (décrit plus haut).
Page 218
Annuler et Rétablir
Dans ce chapitre
Que signifie Annuler et Rétablir ?
La commande Annuler
La commande Rétablir
Que signifie Annuler et Rétablir ?
Nous faisons tous des erreurs et nous changeons d'avis. Web Designer vous permet de corriger ces
erreurs ou d'annuler les changements non souhaités. Toutes les actions que vous effectuez sont
enregistrées dans une liste « Annuler » qui vous permet d'annuler non seulement la dernière opération
mais aussi de remonter sur plusieurs opérations successives. De cette façon, vous pouvez faire des essais
en toute liberté tout en sachant que vous pouvez revenir sur une opération qui ne vous convient pas.
Page 219
Que signifie Annuler et Rétablir ?
Nous faisons tous des erreurs et nous changeons d'avis. Web Designer vous permet de corriger ces
erreurs ou d'annuler les changements non souhaités. Toutes les actions que vous effectuez sont
enregistrées dans une liste « Annuler » qui vous permet d'annuler non seulement la dernière opération
mais aussi de remonter sur plusieurs opérations successives. De cette façon, vous pouvez faire des essais
en toute liberté tout en sachant que vous pouvez revenir sur une opération qui ne vous convient pas.
Page 220
La commande Annuler
Annuler permet d'effacer les effets de la dernière action. Pour
annuler une opération :
 Cliquez sur le bouton Annuler dans la barre de contrôle standard.
 Ou allez sur Éditer > Annuler (la description exacte des prochaines étapes vous guide)
 Ou cliquez sur Ctrl+Z
 Ou cliquez sur la touche virgule (dans tous les outils excepté l'outil de texte)
Vous pouvez utiliser la fonction Annuler à plusieurs reprises pour retourner à l'état antérieur.
Page 221
La commande Rétablir
Rétablir permet d'annuler les effets de la dernière commande
Annuler. Pour rétablir la dernière opération :
 Cliquez sur le bouton Rétablir dans la barre de contrôle standard.
 Ou allez sur Éditer > Rétablir (La description exacte vous indique les prochaines étapes à
suivre).
 Ou cliquez sur Ctrl+Y.
 Ou cliquez sur la touche point (dans tous les outils excepté l'outil de texte).
Vous pouvez utiliser la fonction Rétablir uniquement immédiatement après Annuler. Vous ne pouvez pas
utiliser cette commande après une modification du document (par exemple, en déplaçant ou ajoutant un
objet).
Page 222
Utilisation des objets
Dans ce chapitre
L'outil de sélection
Déplacement des objets
Retirer des objets du document
Dupliquer et cloner
Déplacer les objets vers l'avant et l'arrière
Rotation d'objets
Modification de l'échelle des objets.
Faire tourner les objets
Étirer et écraser des objets
Incliner des objets
Estomper
Accrochage
Objets d'aide et lignes d'aide
Récapitulatif des raccourcis sur le pavé numérique
Grouper et dégrouper des objets
Groupes souples
Alignement
Copier des styles : coller des attributs
Nommer les objets
Répéter les objets
Page 223
L'outil de sélection
L'outil de sélection
est l'outil principal pour les fonctions de sélection, de déplacement,
de calibrage et de rotation. Il est généralement plus utilisé que les
autres outils et est l'outil central dans la manipulation des documents.
Pour utiliser l'outil de sélection
:
 Cliquez sur l'outil de sélection dans la barre d'outil principale.
 Ou appuyez sur « Alt + S », « V » ou « F2 ».
Lorsque vous passez sur l'outil de sélection
, si des objets ou un autre type de composant sont sélectionnés dans un groupe, l'objet parent (groupe)
est sélectionné à la place.
L'outil de sélection étant l'outil le plus utilisé, il existe des combinaisons de touches supplémentaires
permettant d'alterner entre l'outil de sélection pour sélectionner ou pour une autre opération, puis pour
revenir ensuite rapidement à l'outil précédent. Si vous utilisez un autre outil, vous pouvez passer
rapidement à l'outil de sélection
de la manière suivante :
 Utilisez la combinaison Alt+S pour alterner vers l'outil de sélection. En répétant l'opération, vous
alternez à nouveau vers l'outil précédent, ou
Page 224
Sélection d'objets
Pour sélectionner un objet, cliquez sur n'importe quelle partie visible de cet objet.
Modifier la sélection d'objet
Lorsqu'un objet est sélectionné, vous pouvez utiliser les touches suivantes pour modifier la sélection :
 Fin permet de sélectionner l'objet en fond.
 Orig permet de sélectionner l'objet en premier plan.
 La touche de tabulation permet de sélectionner le prochain objet se trouvant sur le calque arrière.
 Maj+Tab permet de sélectionner le prochain objet se trouvant sur le calque avant.
Les objets de premier-plan et d'arrière-plan sont décrits en détail dans le chapitre Manipulation des
objets
.
Sélection
Cliquez et maintenez le bouton de la souris enfoncé pour sélectionner plusieurs objets. La souris trace
alors un rectangle de sélection et tous les objets se trouvant à l'intérieur sont sélectionnés.
Certains autres programmes de dessin nomment ceci la « sélection ».
Si un objet vous gêne pour tracer le rectangle dans la mesure où il serait déplacé par ce mouvement,
maintenez la touche « shift » enfoncée pendant que vous tracez le rectangle de sélection.
Étendre la sélection
Pour sélectionner des objets supplémentaires :
 Utilisez la combinaison Maj+clic
 ou Maj+tirer avec la souris. Vous tracez ainsi un rectangle de sélection et ajoutez des objets
compris dans le rectangle à la sélection.
Sélectionner sous
Maintenez la touche Alt enfoncée pour sélectionner des objets cachés par d'autres objets. Avec la
combinaison Alt+clic, vous pouvez accéder à plusieurs objets superposés.
Sélection interne
Utilisez la combinaison « Ctrl+clic » sur un objet à sélectionner dans un groupe. Ceci est utilisé pour
sélectionner un objet à l'intérieur d'un groupe. Vous pouvez ainsi, par exemple, éditer les contours d'un
objet sans avoir à dégrouper. Les autres objets demeurent inchangés.
Veuillez noter que certaines opérations ne sont pas permises avec une sélection interne. Par exemple, la
sélection et la copie par clic droit ne fonctionnent pas pour la sélection interne.
Déplacement d'objets sélectionnés sous ou dans
Si vous devez déplacer un objet sélectionné qui se trouve sous un autre ou à l'intérieur d'un groupe, un
simple mouvement de glissement de souris ne suffit pas dans la mesure ou plusieurs objets seront alors
déplacés. Pour éviter cela, maintenez les touches « Ctrl+Alt » enfoncées et commencez à tirer. Ainsi seul
l'objet sélectionné sera déplacé. Vous pouvez relâcher les touches une fois que vous avez commencé à
tirer.
Vous pouvez également utiliser les touches fléchées
?de votre clavier pour déplacer l'objet progressivement.
Sélection et calques
Page 225
Vous ne pouvez pas sélectionner des objets dans des calques verrouillés ou invisibles.
Reportez-vous au chapitre Calques & Galerie d'objets pour plus d'informations sur les calques.
Page 226
Modifier la sélection d'objet
Lorsqu'un objet est sélectionné, vous pouvez utiliser les touches suivantes pour modifier la sélection :
 Fin permet de sélectionner l'objet en fond.
 Orig permet de sélectionner l'objet en premier plan.
 La touche de tabulation permet de sélectionner le prochain objet se trouvant sur le calque arrière.
 Maj+Tab permet de sélectionner le prochain objet se trouvant sur le calque avant.
Les objets de premier-plan et d'arrière-plan sont décrits en détail dans le chapitre Manipulation des
objets
.
Sélection
Cliquez et maintenez le bouton de la souris enfoncé pour sélectionner plusieurs objets. La souris trace
alors un rectangle de sélection et tous les objets se trouvant à l'intérieur sont sélectionnés.
Certains autres programmes de dessin nomment ceci la « sélection ».
Si un objet vous gêne pour tracer le rectangle dans la mesure où il serait déplacé par ce mouvement,
maintenez la touche « shift » enfoncée pendant que vous tracez le rectangle de sélection.
Étendre la sélection
Pour sélectionner des objets supplémentaires :
 Utilisez la combinaison Maj+clic
 ou Maj+tirer avec la souris. Vous tracez ainsi un rectangle de sélection et ajoutez des objets
compris dans le rectangle à la sélection.
Sélectionner sous
Maintenez la touche Alt enfoncée pour sélectionner des objets cachés par d'autres objets. Avec la
combinaison Alt+clic, vous pouvez accéder à plusieurs objets superposés.
Sélection interne
Utilisez la combinaison « Ctrl+clic » sur un objet à sélectionner dans un groupe. Ceci est utilisé pour
sélectionner un objet à l'intérieur d'un groupe. Vous pouvez ainsi, par exemple, éditer les contours d'un
objet sans avoir à dégrouper. Les autres objets demeurent inchangés.
Veuillez noter que certaines opérations ne sont pas permises avec une sélection interne. Par exemple, la
sélection et la copie par clic droit ne fonctionnent pas pour la sélection interne.
Déplacement d'objets sélectionnés sous ou dans
Si vous devez déplacer un objet sélectionné qui se trouve sous un autre ou à l'intérieur d'un groupe, un
simple mouvement de glissement de souris ne suffit pas dans la mesure ou plusieurs objets seront alors
déplacés. Pour éviter cela, maintenez les touches « Ctrl+Alt » enfoncées et commencez à tirer. Ainsi seul
l'objet sélectionné sera déplacé. Vous pouvez relâcher les touches une fois que vous avez commencé à
tirer.
Vous pouvez également utiliser les touches fléchées
?de votre clavier pour déplacer l'objet progressivement.
Sélection et calques
Vous ne pouvez pas sélectionner des objets dans des calques verrouillés ou invisibles.
Reportez-vous au chapitre Calques & Galerie d'objets pour plus d'informations sur les calques.
Page 227
Sélection
Cliquez et maintenez le bouton de la souris enfoncé pour sélectionner plusieurs objets. La souris trace
alors un rectangle de sélection et tous les objets se trouvant à l'intérieur sont sélectionnés.
Certains autres programmes de dessin nomment ceci la « sélection ».
Si un objet vous gêne pour tracer le rectangle dans la mesure où il serait déplacé par ce mouvement,
maintenez la touche « shift » enfoncée pendant que vous tracez le rectangle de sélection.
Étendre la sélection
Pour sélectionner des objets supplémentaires :
 Utilisez la combinaison Maj+clic
 ou Maj+tirer avec la souris. Vous tracez ainsi un rectangle de sélection et ajoutez des objets
compris dans le rectangle à la sélection.
Sélectionner sous
Maintenez la touche Alt enfoncée pour sélectionner des objets cachés par d'autres objets. Avec la
combinaison Alt+clic, vous pouvez accéder à plusieurs objets superposés.
Sélection interne
Utilisez la combinaison « Ctrl+clic » sur un objet à sélectionner dans un groupe. Ceci est utilisé pour
sélectionner un objet à l'intérieur d'un groupe. Vous pouvez ainsi, par exemple, éditer les contours d'un
objet sans avoir à dégrouper. Les autres objets demeurent inchangés.
Veuillez noter que certaines opérations ne sont pas permises avec une sélection interne. Par exemple, la
sélection et la copie par clic droit ne fonctionnent pas pour la sélection interne.
Déplacement d'objets sélectionnés sous ou dans
Si vous devez déplacer un objet sélectionné qui se trouve sous un autre ou à l'intérieur d'un groupe, un
simple mouvement de glissement de souris ne suffit pas dans la mesure ou plusieurs objets seront alors
déplacés. Pour éviter cela, maintenez les touches « Ctrl+Alt » enfoncées et commencez à tirer. Ainsi seul
l'objet sélectionné sera déplacé. Vous pouvez relâcher les touches une fois que vous avez commencé à
tirer.
Vous pouvez également utiliser les touches fléchées
?de votre clavier pour déplacer l'objet progressivement.
Sélection et calques
Vous ne pouvez pas sélectionner des objets dans des calques verrouillés ou invisibles.
Reportez-vous au chapitre Calques & Galerie d'objets pour plus d'informations sur les calques.
Page 228
Étendre la sélection
Pour sélectionner des objets supplémentaires :
 Utilisez la combinaison Maj+clic
 ou Maj+tirer avec la souris. Vous tracez ainsi un rectangle de sélection et ajoutez des objets
compris dans le rectangle à la sélection.
Sélectionner sous
Maintenez la touche Alt enfoncée pour sélectionner des objets cachés par d'autres objets. Avec la
combinaison Alt+clic, vous pouvez accéder à plusieurs objets superposés.
Sélection interne
Utilisez la combinaison « Ctrl+clic » sur un objet à sélectionner dans un groupe. Ceci est utilisé pour
sélectionner un objet à l'intérieur d'un groupe. Vous pouvez ainsi, par exemple, éditer les contours d'un
objet sans avoir à dégrouper. Les autres objets demeurent inchangés.
Veuillez noter que certaines opérations ne sont pas permises avec une sélection interne. Par exemple, la
sélection et la copie par clic droit ne fonctionnent pas pour la sélection interne.
Déplacement d'objets sélectionnés sous ou dans
Si vous devez déplacer un objet sélectionné qui se trouve sous un autre ou à l'intérieur d'un groupe, un
simple mouvement de glissement de souris ne suffit pas dans la mesure ou plusieurs objets seront alors
déplacés. Pour éviter cela, maintenez les touches « Ctrl+Alt » enfoncées et commencez à tirer. Ainsi seul
l'objet sélectionné sera déplacé. Vous pouvez relâcher les touches une fois que vous avez commencé à
tirer.
Vous pouvez également utiliser les touches fléchées
?de votre clavier pour déplacer l'objet progressivement.
Sélection et calques
Vous ne pouvez pas sélectionner des objets dans des calques verrouillés ou invisibles.
Reportez-vous au chapitre Calques & Galerie d'objets pour plus d'informations sur les calques.
Page 229
Sélectionner sous
Maintenez la touche Alt enfoncée pour sélectionner des objets cachés par d'autres objets. Avec la
combinaison Alt+clic, vous pouvez accéder à plusieurs objets superposés.
Sélection interne
Utilisez la combinaison « Ctrl+clic » sur un objet à sélectionner dans un groupe. Ceci est utilisé pour
sélectionner un objet à l'intérieur d'un groupe. Vous pouvez ainsi, par exemple, éditer les contours d'un
objet sans avoir à dégrouper. Les autres objets demeurent inchangés.
Veuillez noter que certaines opérations ne sont pas permises avec une sélection interne. Par exemple, la
sélection et la copie par clic droit ne fonctionnent pas pour la sélection interne.
Déplacement d'objets sélectionnés sous ou dans
Si vous devez déplacer un objet sélectionné qui se trouve sous un autre ou à l'intérieur d'un groupe, un
simple mouvement de glissement de souris ne suffit pas dans la mesure ou plusieurs objets seront alors
déplacés. Pour éviter cela, maintenez les touches « Ctrl+Alt » enfoncées et commencez à tirer. Ainsi seul
l'objet sélectionné sera déplacé. Vous pouvez relâcher les touches une fois que vous avez commencé à
tirer.
Vous pouvez également utiliser les touches fléchées
?de votre clavier pour déplacer l'objet progressivement.
Sélection et calques
Vous ne pouvez pas sélectionner des objets dans des calques verrouillés ou invisibles.
Reportez-vous au chapitre Calques & Galerie d'objets pour plus d'informations sur les calques.
Page 230
Sélection interne
Utilisez la combinaison « Ctrl+clic » sur un objet à sélectionner dans un groupe. Ceci est utilisé pour
sélectionner un objet à l'intérieur d'un groupe. Vous pouvez ainsi, par exemple, éditer les contours d'un
objet sans avoir à dégrouper. Les autres objets demeurent inchangés.
Veuillez noter que certaines opérations ne sont pas permises avec une sélection interne. Par exemple, la
sélection et la copie par clic droit ne fonctionnent pas pour la sélection interne.
Déplacement d'objets sélectionnés sous ou dans
Si vous devez déplacer un objet sélectionné qui se trouve sous un autre ou à l'intérieur d'un groupe, un
simple mouvement de glissement de souris ne suffit pas dans la mesure ou plusieurs objets seront alors
déplacés. Pour éviter cela, maintenez les touches « Ctrl+Alt » enfoncées et commencez à tirer. Ainsi seul
l'objet sélectionné sera déplacé. Vous pouvez relâcher les touches une fois que vous avez commencé à
tirer.
Vous pouvez également utiliser les touches fléchées
?de votre clavier pour déplacer l'objet progressivement.
Sélection et calques
Vous ne pouvez pas sélectionner des objets dans des calques verrouillés ou invisibles.
Reportez-vous au chapitre Calques & Galerie d'objets pour plus d'informations sur les calques.
Page 231
Déplacement d'objets sélectionnés sous ou dans
Si vous devez déplacer un objet sélectionné qui se trouve sous un autre ou à l'intérieur d'un groupe, un
simple mouvement de glissement de souris ne suffit pas dans la mesure ou plusieurs objets seront alors
déplacés. Pour éviter cela, maintenez les touches « Ctrl+Alt » enfoncées et commencez à tirer. Ainsi seul
l'objet sélectionné sera déplacé. Vous pouvez relâcher les touches une fois que vous avez commencé à
tirer.
Vous pouvez également utiliser les touches fléchées
?de votre clavier pour déplacer l'objet progressivement.
Sélection et calques
Vous ne pouvez pas sélectionner des objets dans des calques verrouillés ou invisibles.
Reportez-vous au chapitre Calques & Galerie d'objets pour plus d'informations sur les calques.
Page 232
Sélection et calques
Vous ne pouvez pas sélectionner des objets dans des calques verrouillés ou invisibles.
Reportez-vous au chapitre Calques & Galerie d'objets pour plus d'informations sur les calques.
Page 233
Sélection de tous les objets
Pour sélectionner tous les objets :
 Choisissez Édition > Tout sélectionner.
 Ou cliquez sur Ctrl+A.
Page 234
Désélection d'objet
Pour désélectionner un objet :
 Cliquez dans n'importe quelle section non utilisée du document.
 Ou allez dans Édition > Supprimer la sélection.
 Ou cliquez sur Echap.
Pour désélectionner un objet parmi plusieurs :
 Maj+clic sur l'objet. Cette opération permet de désélectionner l'objet. Les autres objets restent
sélectionnés.
Marqueurs de sélection
Chaque objet sélectionné affiche un marqueur de sélection unique indiquant que l'objet est sélectionné. Il
s'agit d'un rappel utile lors de la sélection et désélection de plusieurs objets.
Barre d'état
La barre d'état située dans la partie inférieure de la fenêtre décrit le contenu de la sélection.
Poignées de limites de la sélection
Les poignées des limites de la sélection vous permettent de calibrer et d'étirer les objets sélectionnés.
Voir Étirer et écraser des objets pour plus d'informations. Des clics successifs sur un objet permettent
d'alterner entre l'affichage des limites de la sélection et des poignées de rotation.
Tabulateur
En cliquant sur le tabulateur ou la combinaison Maj+tabulateur, vous pouvez alterner entre les différents
objets sélectionnés (objet précédent et suivant dans le document).
Page 235
Marqueurs de sélection
Chaque objet sélectionné affiche un marqueur de sélection unique indiquant que l'objet est sélectionné. Il
s'agit d'un rappel utile lors de la sélection et désélection de plusieurs objets.
Barre d'état
La barre d'état située dans la partie inférieure de la fenêtre décrit le contenu de la sélection.
Poignées de limites de la sélection
Les poignées des limites de la sélection vous permettent de calibrer et d'étirer les objets sélectionnés.
Voir Étirer et écraser des objets pour plus d'informations. Des clics successifs sur un objet permettent
d'alterner entre l'affichage des limites de la sélection et des poignées de rotation.
Tabulateur
En cliquant sur le tabulateur ou la combinaison Maj+tabulateur, vous pouvez alterner entre les différents
objets sélectionnés (objet précédent et suivant dans le document).
Page 236
Barre d'état
La barre d'état située dans la partie inférieure de la fenêtre décrit le contenu de la sélection.
Poignées de limites de la sélection
Les poignées des limites de la sélection vous permettent de calibrer et d'étirer les objets sélectionnés.
Voir Étirer et écraser des objets pour plus d'informations. Des clics successifs sur un objet permettent
d'alterner entre l'affichage des limites de la sélection et des poignées de rotation.
Tabulateur
En cliquant sur le tabulateur ou la combinaison Maj+tabulateur, vous pouvez alterner entre les différents
objets sélectionnés (objet précédent et suivant dans le document).
Page 237
Poignées de limites de la sélection
Les poignées des limites de la sélection vous permettent de calibrer et d'étirer les objets sélectionnés.
Voir Étirer et écraser des objets pour plus d'informations. Des clics successifs sur un objet permettent
d'alterner entre l'affichage des limites de la sélection et des poignées de rotation.
Tabulateur
En cliquant sur le tabulateur ou la combinaison Maj+tabulateur, vous pouvez alterner entre les différents
objets sélectionnés (objet précédent et suivant dans le document).
Page 238
Tabulateur
En cliquant sur le tabulateur ou la combinaison Maj+tabulateur, vous pouvez alterner entre les différents
objets sélectionnés (objet précédent et suivant dans le document).
Page 239
Déplacement des objets
Pour faire glisser un objet à travers la page
1. Choisir l'Outil de sélection.
2. Faire glisser les objets vers la position souhaitée. Maintenir la touche Ctrl enfoncée pour
restreindre la direction du mouvement à l'un des angles prédéfinis.
Les angles prédéfinis sont définissables par l'utilisateur. (Se reporter au chapitre Personnaliser Web
Designer
.)
Maintenir les touches Ctrl+Alt appuyées afin de pouvoir faire glisser l'objet sélectionné même si le
pointeur ne se trouve pas au-dessus. Ceci est utile lorsque l'objet sélectionné est masqué par un autre
objet ou une partie d'un groupe. Relâcher les touches Ctrl et Alt après avoir commencé le déplacement à
moins que vous ne souhaitiez restreindre le déplacement.
Vous pouvez également déplacer les objets à l'aide des touches de curseur fléchées. Ceci est décrit en
page suivante.
Déposer une copie
Lors d'un déplacement (tout en maintenant le bouton gauche de la souris enfoncé), cliquez sur le bouton
droit de la souris ou appuyez sur la touche + du pavé numérique pour déposer une copie de l'objet.
L'objet original ne bouge pas. Vous pouvez recommencer autant de fois que vous le souhaitez afin de
créer une série d'objets dupliqués.
Vous pouvez également maintenir le bouton droit de la souris enfoncé et tirer. Ceci fait immédiatement
glisser une copie de l'objet. Cliquez à gauche afin de déposer une copie à l'endroit où se trouve la souris.
Remplissages
Généralement, lorsque vous déplacez un objet, vous déplacez également son remplissage :
Déplacement normal de gauche à droite avec un objet à remplissage linéaire.
Ceci s'applique également à la rotation, l'inclinaison, la modification de l'échelle et l'étirement des objets.
Web Designer peut également déplacer l'objet sans déplacer le remplissage d'origine. Pour cela, cliquez
sur la touche - du pavé numérique
pendant le déplacement.
Même déplacement mais en appuyant sur la touche -(moins) pendant que vous faites glisser
Avancer les objets
Généralement, vous pouvez déplacer un objet légèrement à l'aide des touches fléchées?pour faire
avancer l'objet . (Ces touches ont parfois d'autres utilisations, tout particulièrement dans l' Outil d'ajout
de texte
.)
Cette progression n'est affectée ni par l'accrochage magnétique, ni par l'accrochage sur la grille.
(L'accrochage est décrit plus loin.)
Modificateurs de progression
Page 240
Afin de modifier la distance de progression, utilisez ces combinaisons de touches tout en vous servant
des touches fléchées :
 Ctrl avance de 5 fois la distance normale
 Maj avance de 10 fois la distance normale
 Ctrl+Maj avance d'1/5 de la distance normale
 Alt avance d'1 pixel
 Alt+Maj avance de 10 pixels
Vous pouvez modifier la distance de progression normale dans l'onglet Général sous Services>
Options. (Se reporter au chapitre Personnaliser Web Designer
.)
La fonction Avancer fonctionne dans la plupart des outils.
Couper, copier et coller
Ces fonctions vous permettent de déplacer ou de copier un objet dans le même document ou entre
différents documents. La procédure est la suivante :
1. Sélectionner l'objet
2. Pour supprimer l'objet, choisissez « Éditer -> Couper » (ou « Ctrl + X »). Pour copier l'objet
sans le supprimer, choisissez « Éditer -> Copier » (ou « Ctrl + C »). Les deux options placent
l'objet (ou sa copie) dans le presse-papiers.
3. Choisissez « Éditer -> Coller », « Ctrl + V », ou « Insérer ». Ceci permet de coller le contenu
du presse-papiers dans le document
Remarque : si les objets que vous copiez sont tous sur le même calque
, vous pouvez les coller sur un calque en faisant de celui-ci le calque actuel. Le calque dont les objets
sont copiés est alors ignoré.
Cependant, si les objets que vous copiez se situent sur plusieurs calques
, la structure du calque est maintenue lors du collage. Des objets sont collés à partir du même calque d'où
ils ont été copiés, sans tenir compte du calque actuel.
Cela vous permet de copier des données en calques à l'intérieur d'un même document ou d'un document
différent. Tous les calques manquants dans le document cible sont créés automatiquement grâce à cette
manipulation. Ainsi, si vous copiez un bouton de survol de la souris, qui a un objet sur le calque État
normal et un autre sur le calque Survol de la souris, vers un nouveau document, les calques Survol et État
normal seront créés s'ils n'existent pas déjà et les objets du bouton seront copiés sur ces calques.
« Ctrl + shift+ V » colle le contenu du presse-papiers dans la même position X/Y d'où les objets ont été
coupés ou copiés. Ceci s'applique uniquement aux objets coupés ou copiés depuis Web Designer. Les
objets importés depuis d'autres programmes sont toujours collés au centre de la fenêtre actuelle.
L'objet reste dans le presse-papiers de façon à ce que vous puissiez coller le même objet plusieurs fois.
S'il existe un choix de formats dans le presse-papiers, <programname> affichera une boîte de dialogue
Collage spécial
vous permettant de choisir le format souhaité pour le collage (par ex. lorsque vous collez du texte, vous
pouvez avoir le choix entre du « texte non formaté » ou du texte au format « Rich Text »).
Page 241
Déposer une copie
Lors d'un déplacement (tout en maintenant le bouton gauche de la souris enfoncé), cliquez sur le bouton
droit de la souris ou appuyez sur la touche + du pavé numérique pour déposer une copie de l'objet.
L'objet original ne bouge pas. Vous pouvez recommencer autant de fois que vous le souhaitez afin de
créer une série d'objets dupliqués.
Vous pouvez également maintenir le bouton droit de la souris enfoncé et tirer. Ceci fait immédiatement
glisser une copie de l'objet. Cliquez à gauche afin de déposer une copie à l'endroit où se trouve la souris.
Remplissages
Généralement, lorsque vous déplacez un objet, vous déplacez également son remplissage :
Déplacement normal de gauche à droite avec un objet à remplissage linéaire.
Ceci s'applique également à la rotation, l'inclinaison, la modification de l'échelle et l'étirement des objets.
Web Designer peut également déplacer l'objet sans déplacer le remplissage d'origine. Pour cela, cliquez
sur la touche - du pavé numérique
pendant le déplacement.
Même déplacement mais en appuyant sur la touche -(moins) pendant que vous faites glisser
Avancer les objets
Généralement, vous pouvez déplacer un objet légèrement à l'aide des touches fléchées?pour faire
avancer l'objet . (Ces touches ont parfois d'autres utilisations, tout particulièrement dans l' Outil d'ajout
de texte
.)
Cette progression n'est affectée ni par l'accrochage magnétique, ni par l'accrochage sur la grille.
(L'accrochage est décrit plus loin.)
Modificateurs de progression
Afin de modifier la distance de progression, utilisez ces combinaisons de touches tout en vous servant
des touches fléchées :
 Ctrl avance de 5 fois la distance normale
 Maj avance de 10 fois la distance normale
 Ctrl+Maj avance d'1/5 de la distance normale
 Alt avance d'1 pixel
 Alt+Maj avance de 10 pixels
Vous pouvez modifier la distance de progression normale dans l'onglet Général sous Services>
Options. (Se reporter au chapitre Personnaliser Web Designer
.)
La fonction Avancer fonctionne dans la plupart des outils.
Couper, copier et coller
Ces fonctions vous permettent de déplacer ou de copier un objet dans le même document ou entre
différents documents. La procédure est la suivante :
Page 242
1. Sélectionner l'objet
2. Pour supprimer l'objet, choisissez « Éditer -> Couper » (ou « Ctrl + X »). Pour copier l'objet
sans le supprimer, choisissez « Éditer -> Copier » (ou « Ctrl + C »). Les deux options placent
l'objet (ou sa copie) dans le presse-papiers.
3. Choisissez « Éditer -> Coller », « Ctrl + V », ou « Insérer ». Ceci permet de coller le contenu
du presse-papiers dans le document
Remarque : si les objets que vous copiez sont tous sur le même calque
, vous pouvez les coller sur un calque en faisant de celui-ci le calque actuel. Le calque dont les objets
sont copiés est alors ignoré.
Cependant, si les objets que vous copiez se situent sur plusieurs calques
, la structure du calque est maintenue lors du collage. Des objets sont collés à partir du même calque d'où
ils ont été copiés, sans tenir compte du calque actuel.
Cela vous permet de copier des données en calques à l'intérieur d'un même document ou d'un document
différent. Tous les calques manquants dans le document cible sont créés automatiquement grâce à cette
manipulation. Ainsi, si vous copiez un bouton de survol de la souris, qui a un objet sur le calque État
normal et un autre sur le calque Survol de la souris, vers un nouveau document, les calques Survol et État
normal seront créés s'ils n'existent pas déjà et les objets du bouton seront copiés sur ces calques.
« Ctrl + shift+ V » colle le contenu du presse-papiers dans la même position X/Y d'où les objets ont été
coupés ou copiés. Ceci s'applique uniquement aux objets coupés ou copiés depuis Web Designer. Les
objets importés depuis d'autres programmes sont toujours collés au centre de la fenêtre actuelle.
L'objet reste dans le presse-papiers de façon à ce que vous puissiez coller le même objet plusieurs fois.
S'il existe un choix de formats dans le presse-papiers, <programname> affichera une boîte de dialogue
Collage spécial
vous permettant de choisir le format souhaité pour le collage (par ex. lorsque vous collez du texte, vous
pouvez avoir le choix entre du « texte non formaté » ou du texte au format « Rich Text »).
Page 243
Remplissages
Généralement, lorsque vous déplacez un objet, vous déplacez également son remplissage :
Déplacement normal de gauche à droite avec un objet à remplissage linéaire.
Ceci s'applique également à la rotation, l'inclinaison, la modification de l'échelle et l'étirement des objets.
Web Designer peut également déplacer l'objet sans déplacer le remplissage d'origine. Pour cela, cliquez
sur la touche - du pavé numérique
pendant le déplacement.
Même déplacement mais en appuyant sur la touche -(moins) pendant que vous faites glisser
Avancer les objets
Généralement, vous pouvez déplacer un objet légèrement à l'aide des touches fléchées?pour faire
avancer l'objet . (Ces touches ont parfois d'autres utilisations, tout particulièrement dans l' Outil d'ajout
de texte
.)
Cette progression n'est affectée ni par l'accrochage magnétique, ni par l'accrochage sur la grille.
(L'accrochage est décrit plus loin.)
Modificateurs de progression
Afin de modifier la distance de progression, utilisez ces combinaisons de touches tout en vous servant
des touches fléchées :
 Ctrl avance de 5 fois la distance normale
 Maj avance de 10 fois la distance normale
 Ctrl+Maj avance d'1/5 de la distance normale
 Alt avance d'1 pixel
 Alt+Maj avance de 10 pixels
Vous pouvez modifier la distance de progression normale dans l'onglet Général sous Services>
Options. (Se reporter au chapitre Personnaliser Web Designer
.)
La fonction Avancer fonctionne dans la plupart des outils.
Couper, copier et coller
Ces fonctions vous permettent de déplacer ou de copier un objet dans le même document ou entre
différents documents. La procédure est la suivante :
1. Sélectionner l'objet
2. Pour supprimer l'objet, choisissez « Éditer -> Couper » (ou « Ctrl + X »). Pour copier l'objet
sans le supprimer, choisissez « Éditer -> Copier » (ou « Ctrl + C »). Les deux options placent
l'objet (ou sa copie) dans le presse-papiers.
3. Choisissez « Éditer -> Coller », « Ctrl + V », ou « Insérer ». Ceci permet de coller le contenu
du presse-papiers dans le document
Remarque : si les objets que vous copiez sont tous sur le même calque
, vous pouvez les coller sur un calque en faisant de celui-ci le calque actuel. Le calque dont les objets
sont copiés est alors ignoré.
Page 244
Cependant, si les objets que vous copiez se situent sur plusieurs calques
, la structure du calque est maintenue lors du collage. Des objets sont collés à partir du même calque d'où
ils ont été copiés, sans tenir compte du calque actuel.
Cela vous permet de copier des données en calques à l'intérieur d'un même document ou d'un document
différent. Tous les calques manquants dans le document cible sont créés automatiquement grâce à cette
manipulation. Ainsi, si vous copiez un bouton de survol de la souris, qui a un objet sur le calque État
normal et un autre sur le calque Survol de la souris, vers un nouveau document, les calques Survol et État
normal seront créés s'ils n'existent pas déjà et les objets du bouton seront copiés sur ces calques.
« Ctrl + shift+ V » colle le contenu du presse-papiers dans la même position X/Y d'où les objets ont été
coupés ou copiés. Ceci s'applique uniquement aux objets coupés ou copiés depuis Web Designer. Les
objets importés depuis d'autres programmes sont toujours collés au centre de la fenêtre actuelle.
L'objet reste dans le presse-papiers de façon à ce que vous puissiez coller le même objet plusieurs fois.
S'il existe un choix de formats dans le presse-papiers, <programname> affichera une boîte de dialogue
Collage spécial
vous permettant de choisir le format souhaité pour le collage (par ex. lorsque vous collez du texte, vous
pouvez avoir le choix entre du « texte non formaté » ou du texte au format « Rich Text »).
Page 245
Avancer les objets
Généralement, vous pouvez déplacer un objet légèrement à l'aide des touches fléchées?pour faire
avancer l'objet . (Ces touches ont parfois d'autres utilisations, tout particulièrement dans l' Outil d'ajout
de texte
.)
Cette progression n'est affectée ni par l'accrochage magnétique, ni par l'accrochage sur la grille.
(L'accrochage est décrit plus loin.)
Modificateurs de progression
Afin de modifier la distance de progression, utilisez ces combinaisons de touches tout en vous servant
des touches fléchées :
 Ctrl avance de 5 fois la distance normale
 Maj avance de 10 fois la distance normale
 Ctrl+Maj avance d'1/5 de la distance normale
 Alt avance d'1 pixel
 Alt+Maj avance de 10 pixels
Vous pouvez modifier la distance de progression normale dans l'onglet Général sous Services>
Options. (Se reporter au chapitre Personnaliser Web Designer
.)
La fonction Avancer fonctionne dans la plupart des outils.
Couper, copier et coller
Ces fonctions vous permettent de déplacer ou de copier un objet dans le même document ou entre
différents documents. La procédure est la suivante :
1. Sélectionner l'objet
2. Pour supprimer l'objet, choisissez « Éditer -> Couper » (ou « Ctrl + X »). Pour copier l'objet
sans le supprimer, choisissez « Éditer -> Copier » (ou « Ctrl + C »). Les deux options placent
l'objet (ou sa copie) dans le presse-papiers.
3. Choisissez « Éditer -> Coller », « Ctrl + V », ou « Insérer ». Ceci permet de coller le contenu
du presse-papiers dans le document
Remarque : si les objets que vous copiez sont tous sur le même calque
, vous pouvez les coller sur un calque en faisant de celui-ci le calque actuel. Le calque dont les objets
sont copiés est alors ignoré.
Cependant, si les objets que vous copiez se situent sur plusieurs calques
, la structure du calque est maintenue lors du collage. Des objets sont collés à partir du même calque d'où
ils ont été copiés, sans tenir compte du calque actuel.
Cela vous permet de copier des données en calques à l'intérieur d'un même document ou d'un document
différent. Tous les calques manquants dans le document cible sont créés automatiquement grâce à cette
manipulation. Ainsi, si vous copiez un bouton de survol de la souris, qui a un objet sur le calque État
normal et un autre sur le calque Survol de la souris, vers un nouveau document, les calques Survol et État
normal seront créés s'ils n'existent pas déjà et les objets du bouton seront copiés sur ces calques.
« Ctrl + shift+ V » colle le contenu du presse-papiers dans la même position X/Y d'où les objets ont été
coupés ou copiés. Ceci s'applique uniquement aux objets coupés ou copiés depuis Web Designer. Les
objets importés depuis d'autres programmes sont toujours collés au centre de la fenêtre actuelle.
L'objet reste dans le presse-papiers de façon à ce que vous puissiez coller le même objet plusieurs fois.
S'il existe un choix de formats dans le presse-papiers, <programname> affichera une boîte de dialogue
Collage spécial
vous permettant de choisir le format souhaité pour le collage (par ex. lorsque vous collez du texte, vous
pouvez avoir le choix entre du « texte non formaté » ou du texte au format « Rich Text »).
Page 246
Couper, copier et coller
Ces fonctions vous permettent de déplacer ou de copier un objet dans le même document ou entre
différents documents. La procédure est la suivante :
1. Sélectionner l'objet
2. Pour supprimer l'objet, choisissez « Éditer -> Couper » (ou « Ctrl + X »). Pour copier l'objet
sans le supprimer, choisissez « Éditer -> Copier » (ou « Ctrl + C »). Les deux options placent
l'objet (ou sa copie) dans le presse-papiers.
3. Choisissez « Éditer -> Coller », « Ctrl + V », ou « Insérer ». Ceci permet de coller le contenu
du presse-papiers dans le document
Remarque : si les objets que vous copiez sont tous sur le même calque
, vous pouvez les coller sur un calque en faisant de celui-ci le calque actuel. Le calque dont les objets
sont copiés est alors ignoré.
Cependant, si les objets que vous copiez se situent sur plusieurs calques
, la structure du calque est maintenue lors du collage. Des objets sont collés à partir du même calque d'où
ils ont été copiés, sans tenir compte du calque actuel.
Cela vous permet de copier des données en calques à l'intérieur d'un même document ou d'un document
différent. Tous les calques manquants dans le document cible sont créés automatiquement grâce à cette
manipulation. Ainsi, si vous copiez un bouton de survol de la souris, qui a un objet sur le calque État
normal et un autre sur le calque Survol de la souris, vers un nouveau document, les calques Survol et État
normal seront créés s'ils n'existent pas déjà et les objets du bouton seront copiés sur ces calques.
« Ctrl + shift+ V » colle le contenu du presse-papiers dans la même position X/Y d'où les objets ont été
coupés ou copiés. Ceci s'applique uniquement aux objets coupés ou copiés depuis Web Designer. Les
objets importés depuis d'autres programmes sont toujours collés au centre de la fenêtre actuelle.
L'objet reste dans le presse-papiers de façon à ce que vous puissiez coller le même objet plusieurs fois.
S'il existe un choix de formats dans le presse-papiers, <programname> affichera une boîte de dialogue
Collage spécial
vous permettant de choisir le format souhaité pour le collage (par ex. lorsque vous collez du texte, vous
pouvez avoir le choix entre du « texte non formaté » ou du texte au format « Rich Text »).
Page 247
Retirer des objets du document
Sélectionnez tout d'abord les objets que vous souhaitez retirer. Vous avez le choix entre couper les
objets vers le presse-papier ou les supprimer.
Couper des objets
Choisissez « Éditer -> Couper », ou appuyez sur « Ctrl + X ». Le contenu du presse-papiers est écrasé
et vous pouvez coller les objets supprimés ailleurs si vous le souhaitez.
Supprimer des objets
Choisissez « Éditer -> Supprimer », appuyez sur
« Supprimer » ou cliquez sur le bouton Supprimer de la barre
de contrôle Standard
.
Dans ce cas, les objets supprimés ne sont pas copiés dans le presse-papiers. Si vous supprimez un objet
accidentellement, faites Annuler pour le récupérer.
Page 248
Couper des objets
Choisissez « Éditer -> Couper », ou appuyez sur « Ctrl + X ». Le contenu du presse-papiers est écrasé
et vous pouvez coller les objets supprimés ailleurs si vous le souhaitez.
Supprimer des objets
Choisissez « Éditer -> Supprimer », appuyez sur
« Supprimer » ou cliquez sur le bouton Supprimer de la barre
de contrôle Standard
.
Dans ce cas, les objets supprimés ne sont pas copiés dans le presse-papiers. Si vous supprimez un objet
accidentellement, faites Annuler pour le récupérer.
Page 249
Supprimer des objets
Choisissez « Éditer -> Supprimer », appuyez sur
« Supprimer » ou cliquez sur le bouton Supprimer de la barre
de contrôle Standard
.
Dans ce cas, les objets supprimés ne sont pas copiés dans le presse-papiers. Si vous supprimez un objet
accidentellement, faites Annuler pour le récupérer.
Page 250
Dupliquer et cloner
Ces deux options créent une copie de l'objet sélectionné. L'objet original est désélectionné et le double
ou le clone devient l'objet sélectionné.
Vous pouvez également dupliquer un objet tout en le déplaçant, le tournant, en modifiant l'échelle ou
l'inclinant. Lorsque vous le faites glisser (tout en maintenant le bouton gauche de la souris enfoncé),
cliquez sur le bouton droit de la souris ou appuyez sur la touche + du pavé numérique pour déposer une
copie de l'objet. L'objet original ne bouge pas. Vous pouvez recommencer autant de fois que vous le
souhaitez afin de créer une série d'objets dupliqués.
Un autre moyen facile de créer une ou plusieurs copies d'un objet aligné horizontalement ou verticalement
avec précision consiste à le faire glisser tout en maintenant la touche Ctrl enfoncée pour restreindre le
mouvement, et cliquer droit (ou appuyer sur la touche + du pavé numérique) à chaque copie souhaitée.
Pour remplacer rapidement une ligne d'objets, tirez-en un puis faites-le glisser en maintenant la touche
Ctrl et en cliquant droit pour chaque copie souhaitée.
Dupliquer
Choisir Éditer > Dupliquer
ou appuyer sur Ctrl+D. La copie est légèrement déplacée, généralement vers le bas, à droite de
l'original.
La distance de duplication est définissable par l'utilisateur—voir chapitre Personnaliser Web Designer)
.
Cloner
Choisir Éditer > Cloner
ou appuyer sur Ctrl+K. Ceci place une copie exactement au-dessus de l'original. Le clonage constitue
un moyen facile de créer des formes concentriques.
L'unité de mesure standard dans des programmes de graphisme pour les tailles de police et l'épaisseur
des lignes est le POINT (pt). Cet exemple utilise une grande lettre originale A avec un remplissage noir et
un contour blanc de 4 pt d'épaisseur ainsi qu'un clone sans remplissage avec un contour noir de 1 pt.
Page 251
Dupliquer
Choisir Éditer > Dupliquer
ou appuyer sur Ctrl+D. La copie est légèrement déplacée, généralement vers le bas, à droite de
l'original.
La distance de duplication est définissable par l'utilisateur—voir chapitre Personnaliser Web Designer)
.
Cloner
Choisir Éditer > Cloner
ou appuyer sur Ctrl+K. Ceci place une copie exactement au-dessus de l'original. Le clonage constitue
un moyen facile de créer des formes concentriques.
L'unité de mesure standard dans des programmes de graphisme pour les tailles de police et l'épaisseur
des lignes est le POINT (pt). Cet exemple utilise une grande lettre originale A avec un remplissage noir et
un contour blanc de 4 pt d'épaisseur ainsi qu'un clone sans remplissage avec un contour noir de 1 pt.
Page 252
Cloner
Choisir Éditer > Cloner
ou appuyer sur Ctrl+K. Ceci place une copie exactement au-dessus de l'original. Le clonage constitue
un moyen facile de créer des formes concentriques.
L'unité de mesure standard dans des programmes de graphisme pour les tailles de police et l'épaisseur
des lignes est le POINT (pt). Cet exemple utilise une grande lettre originale A avec un remplissage noir et
un contour blanc de 4 pt d'épaisseur ainsi qu'un clone sans remplissage avec un contour noir de 1 pt.
Page 253
Déplacer les objets vers l'avant et l'arrière
Les illustrations complexes ont des objets empilés les uns sur les autres, telles que cette cible :
La cible de gauche est constituée de trois cercles empilés l'un sur l'autre
Pour garantir que les objets sont superposés dans le bon ordre, il faut souvent réorganiser leur ordre de
l'avant vers l'arrière. (L'objet de premier plan couvre toujours les objets inférieurs, qui couvrent
eux-mêmes toujours les objets qui se trouvent plus en arrière. Chaque nouvel objet créé l'est toujours
au-dessus des plus anciens.)
Le menu Arranger vous offre quatre options :
 Mettre au premier plan (Ctrl+F) : permet à l'objet sélectionné de passer au premier plan. Par
conséquent, il masquera tout autre objet qu'il recouvre.
 Déplacer vers l'avant (Ctrl+Maj+F) : ceci déplace l'objet d'un niveau vers l'avant, comme s'il
gravissait une marche d'escalier à la fois.
 Déplacer vers l'arrière (Ctrl+Maj+B) : ceci déplace l'objet d'un niveau vers l'arrière.
 Mettre à l'arrière-plan (Ctrl+B) : ceci déplace l'objet vers l'arrière.
Ces options déplacent les objets vers l'avant et l'arrière dans leur calque. Déplacer vers le calque du
premier plan et Déplacer vers le calque d'arrière-plan
vous permet de déplacer les objets entre les calques visibles. (Les calques invisibles sont ignorés lors du
déplacement des objets.)
Plus d'informations concernant les calques dans le chapitre Calques
Page 254
Rotation d'objets
Cette option se trouve sous Outil de sélection
.
En mode Rotation, le point de référence (autour duquel l'objet tourne)
apparaît tout d'abord au centre de l'objet, symbolisé par une petite cible
comme celle-ci.
Cliquez sur un objet pour mettre l'outil de sélection en mode Rotation.
Pour déplacer le point de référence, faites glisser la cible du point de référence à l'endroit souhaité.
Attention
: si le centre de rotation est déplacé, il restera dans cette même position pour tout objet sélectionné
jusqu'à ce que tous les objets sélectionnés aient été désélectionnés, et à ce moment il retourne au milieu
de n'importe quel objet.
Faire pivoter à l'aide de la souris
L'Outil de sélection
doit être en mode Rotation / Inclinaison (les poignées de sélection ont une forme de flèche).
En tirant les poignées latérales, l'objet s'étire. Ceci est décrit dans le chapitre Étirer et écraser des objets.
Tirez sur une flèche d'angle. En tirant, l'objet tourne autour du point de référence. La barre d'infos affiche
l'angle de rotation en cours.
« shift+ tirer » fait pivoter l'objet autour de son centre (le point de référence est ignoré).
Maintenez la touche « Ctrl » enfoncée pour restreindre la rotation aux angles forcés.
Les angles forcés sont définissables par l'utilisateur. Pour en savoir plus, référez-vous au chapitre «
Personnaliser Web Designer
».
Pour créer une copie tout en faisant pivoter l'objet, cliquez sur la touche « + » du pavé numérique tout en
faisant tourner l'objet ou cliquez sur le bouton droit de la souris.
Faire tourner à un angle précis (à l'aide de la barre d'infos)
Saisir un angle dans le champ de rotation et appuyer sur Entrée. Les angles positifs tournent à l'inverse
des aiguilles d'une montre tandis que les angles négatifs tournent dans le sens des aiguilles d'une montre.
Cliquer sur les flèches de droite pour faire
progresser l'angle de rotation.
Faire tourner les objets en mode Modification de la taille
Il est possible de faire tourner et d'incliner un objet même hors du mode Rotation. En mode Modification
Page 255
de la taille, placer le pointeur de la souris dans les petites zones situées près des poignées du frame de
sélection tel qu'illustré ci-dessus. Le pointeur de la souris se transforme en icône de rotation ou
d'inclinaison indiquant qu'il est désormais possible de faire tourner ou d'incliner l'objet en tirant avec la
souris.
Page 256
Faire pivoter à l'aide de la souris
L'Outil de sélection
doit être en mode Rotation / Inclinaison (les poignées de sélection ont une forme de flèche).
En tirant les poignées latérales, l'objet s'étire. Ceci est décrit dans le chapitre Étirer et écraser des objets.
Tirez sur une flèche d'angle. En tirant, l'objet tourne autour du point de référence. La barre d'infos affiche
l'angle de rotation en cours.
« shift+ tirer » fait pivoter l'objet autour de son centre (le point de référence est ignoré).
Maintenez la touche « Ctrl » enfoncée pour restreindre la rotation aux angles forcés.
Les angles forcés sont définissables par l'utilisateur. Pour en savoir plus, référez-vous au chapitre «
Personnaliser Web Designer
».
Pour créer une copie tout en faisant pivoter l'objet, cliquez sur la touche « + » du pavé numérique tout en
faisant tourner l'objet ou cliquez sur le bouton droit de la souris.
Faire tourner à un angle précis (à l'aide de la barre d'infos)
Saisir un angle dans le champ de rotation et appuyer sur Entrée. Les angles positifs tournent à l'inverse
des aiguilles d'une montre tandis que les angles négatifs tournent dans le sens des aiguilles d'une montre.
Cliquer sur les flèches de droite pour faire
progresser l'angle de rotation.
Faire tourner les objets en mode Modification de la taille
Il est possible de faire tourner et d'incliner un objet même hors du mode Rotation. En mode Modification
de la taille, placer le pointeur de la souris dans les petites zones situées près des poignées du frame de
sélection tel qu'illustré ci-dessus. Le pointeur de la souris se transforme en icône de rotation ou
d'inclinaison indiquant qu'il est désormais possible de faire tourner ou d'incliner l'objet en tirant avec la
souris.
Page 257
Faire tourner à un angle précis (à l'aide de la barre d'infos)
Saisir un angle dans le champ de rotation et appuyer sur Entrée. Les angles positifs tournent à l'inverse
des aiguilles d'une montre tandis que les angles négatifs tournent dans le sens des aiguilles d'une montre.
Cliquer sur les flèches de droite pour faire
progresser l'angle de rotation.
Faire tourner les objets en mode Modification de la taille
Il est possible de faire tourner et d'incliner un objet même hors du mode Rotation. En mode Modification
de la taille, placer le pointeur de la souris dans les petites zones situées près des poignées du frame de
sélection tel qu'illustré ci-dessus. Le pointeur de la souris se transforme en icône de rotation ou
d'inclinaison indiquant qu'il est désormais possible de faire tourner ou d'incliner l'objet en tirant avec la
souris.
Page 258
Faire tourner les objets en mode Modification de la taille
Il est possible de faire tourner et d'incliner un objet même hors du mode Rotation. En mode Modification
de la taille, placer le pointeur de la souris dans les petites zones situées près des poignées du frame de
sélection tel qu'illustré ci-dessus. Le pointeur de la souris se transforme en icône de rotation ou
d'inclinaison indiquant qu'il est désormais possible de faire tourner ou d'incliner l'objet en tirant avec la
souris.
Page 259
Modification de l'échelle des objets.
Cette option se trouve sous Outil de sélection
.
Bouton Modifier les largeurs de contours
Une fois le bouton Modifier les largeurs de
contour
activé, modifier l'échelle d'un objet modifie
aussi les largeurs de ses contours. Si ce bouton
est inactivé, les largeurs des contours resteront
inchangées.
Vous pouvez activer/désactiver ce bouton pendant que vous tirez un objet en cliquant sur la touche / du
pavé numérique.
Lorsqu'elles sont actives, les valeurs de X, Y, celles de la largeur et de la hauteur dans la barre d'info
incluent la largeur du contour ou du pinceau. Il est parfois utile de pouvoir voir et contrôler la taille exacte
de la forme sans prendre en compte l'épaisseur du contour.
Bouton Conserver les proportions
Une fois le bouton Conserver les proportions
activé, le ratio largeur/taille reste constant lors
de la modification de l'échelle de l'objet.
En d'autres termes, la forme garde les mêmes proportions que l'original. Il est recommandé de garder ce
bouton activé la plupart du temps afin de s'assurer que les objets ne se tassent pas lors de la modification
de leur taille.
Une fois ce bouton désactivé, vous pouvez modifier les proportions lorsque vous modifiez l'échelle de
l'objet ; en d'autres termes, vous pouvez étirer l'objet dans un sens ou l'autre en tirant une poignée d'angle
de modification de taille ou en saisissant une nouvelle taille.
Modifier l'échelle à l'aide de la souris
L'Outil de
sélection
doit être en mode
Modification
d'échelle (les
poignées du cadre
de sélection sont
carrées). Si
nécessaire, cliquez
sur l'objet pour
passer en mode
Modification
d'échelle.
Tirez une des poignées d'angle. L'objet change d'échelle à mesure que vous bougez le pointeur en
diagonale. La barre d'infos affiche la modification d'échelle en cours. La modification de l'objet se fait
entre la poignée que vous êtes en train de tirer et celle d'en face. Si vous voulez utiliser un autre point de
l'objet comme point fixe, déplacez le point de référence vers celui-ci et utilisez les boutons de la barre
d'info pour mettre à l'échelle.
Page 260
Maintenez « shift » tout en faisant glisser afin de modifier l'échelle de l'objet autour de son centre. Cela
fonctionne indépendamment de la position du point de référence.
« Ctrl+tirer » modifie la taille de l'objet en multiples de sa taille originale (x2, x3, etc.).
Pour créer une copie tout en modifiant la taille de l'objet (et en laissant l'original à sa place), vous devez
effectuer un clic droit ou appuyer sur la touche « + » du pavé numérique.
En tirant les poignées latérales, l'objet s'étire ou se tasse. Ceci est décrit dans le chapitre Étirer et écraser
des objets.
Modifier l'échelle à l'aide de la barre d'infos
Saisissez des valeurs dans les champs Redimensionner le texte et appuyer sur «
¿ ».
 Les modifications d'échelle inférieures à 100 % réduisent l'objet. 50 réduit de moitié la taille de
l'objet.
 Les modifications d'échelle supérieures à 100 % agrandissent l'objet. 200 double la taille de
l'objet.
Si le bouton Conserver les proportions
est activé, vous pouvez indifféremment saisir la valeur dans l'un des deux champs de texte pour
redimensionner l'objet à hauteur du pourcentage souhaité. Si ce bouton n'est pas activé, vous pouvez
saisir des valeurs séparées pour la largeur et la hauteur.
Vous pouvez également saisir la taille requise de l'objet dans les champs de texte Largeur ou Hauteur.
Si le bouton Conserver les proportions
est activé, l'objet sera redimensionné en maintenant ses proportions. Vous pouvez saisir la taille dans
l'unité de votre choix, 1 cm par exemple.
Si vous vous servez de la barre d'infos pour mettre à l'échelle (ou des champs numériques), cette mise à
l'échelle sera toujours faite autour du point de référence. Vous pouvez positionner celui-ci à tout autre
endroit de l'objet, comme nous l'avons vu précédemment dans la section « Rotation des objets ».
Page 261
Bouton Modifier les largeurs de contours
Une fois le bouton Modifier les largeurs de
contour
activé, modifier l'échelle d'un objet modifie
aussi les largeurs de ses contours. Si ce bouton
est inactivé, les largeurs des contours resteront
inchangées.
Vous pouvez activer/désactiver ce bouton pendant que vous tirez un objet en cliquant sur la touche / du
pavé numérique.
Lorsqu'elles sont actives, les valeurs de X, Y, celles de la largeur et de la hauteur dans la barre d'info
incluent la largeur du contour ou du pinceau. Il est parfois utile de pouvoir voir et contrôler la taille exacte
de la forme sans prendre en compte l'épaisseur du contour.
Bouton Conserver les proportions
Une fois le bouton Conserver les proportions
activé, le ratio largeur/taille reste constant lors
de la modification de l'échelle de l'objet.
En d'autres termes, la forme garde les mêmes proportions que l'original. Il est recommandé de garder ce
bouton activé la plupart du temps afin de s'assurer que les objets ne se tassent pas lors de la modification
de leur taille.
Une fois ce bouton désactivé, vous pouvez modifier les proportions lorsque vous modifiez l'échelle de
l'objet ; en d'autres termes, vous pouvez étirer l'objet dans un sens ou l'autre en tirant une poignée d'angle
de modification de taille ou en saisissant une nouvelle taille.
Modifier l'échelle à l'aide de la souris
L'Outil de
sélection
doit être en mode
Modification
d'échelle (les
poignées du cadre
de sélection sont
carrées). Si
nécessaire, cliquez
sur l'objet pour
passer en mode
Modification
d'échelle.
Tirez une des poignées d'angle. L'objet change d'échelle à mesure que vous bougez le pointeur en
diagonale. La barre d'infos affiche la modification d'échelle en cours. La modification de l'objet se fait
entre la poignée que vous êtes en train de tirer et celle d'en face. Si vous voulez utiliser un autre point de
l'objet comme point fixe, déplacez le point de référence vers celui-ci et utilisez les boutons de la barre
d'info pour mettre à l'échelle.
Maintenez « shift » tout en faisant glisser afin de modifier l'échelle de l'objet autour de son centre. Cela
fonctionne indépendamment de la position du point de référence.
« Ctrl+tirer » modifie la taille de l'objet en multiples de sa taille originale (x2, x3, etc.).
Pour créer une copie tout en modifiant la taille de l'objet (et en laissant l'original à sa place), vous devez
effectuer un clic droit ou appuyer sur la touche « + » du pavé numérique.
Page 262
En tirant les poignées latérales, l'objet s'étire ou se tasse. Ceci est décrit dans le chapitre Étirer et écraser
des objets.
Modifier l'échelle à l'aide de la barre d'infos
Saisissez des valeurs dans les champs Redimensionner le texte et appuyer sur «
¿ ».
 Les modifications d'échelle inférieures à 100 % réduisent l'objet. 50 réduit de moitié la taille de
l'objet.
 Les modifications d'échelle supérieures à 100 % agrandissent l'objet. 200 double la taille de
l'objet.
Si le bouton Conserver les proportions
est activé, vous pouvez indifféremment saisir la valeur dans l'un des deux champs de texte pour
redimensionner l'objet à hauteur du pourcentage souhaité. Si ce bouton n'est pas activé, vous pouvez
saisir des valeurs séparées pour la largeur et la hauteur.
Vous pouvez également saisir la taille requise de l'objet dans les champs de texte Largeur ou Hauteur.
Si le bouton Conserver les proportions
est activé, l'objet sera redimensionné en maintenant ses proportions. Vous pouvez saisir la taille dans
l'unité de votre choix, 1 cm par exemple.
Si vous vous servez de la barre d'infos pour mettre à l'échelle (ou des champs numériques), cette mise à
l'échelle sera toujours faite autour du point de référence. Vous pouvez positionner celui-ci à tout autre
endroit de l'objet, comme nous l'avons vu précédemment dans la section « Rotation des objets ».
Page 263
Bouton Conserver les proportions
Une fois le bouton Conserver les proportions
activé, le ratio largeur/taille reste constant lors
de la modification de l'échelle de l'objet.
En d'autres termes, la forme garde les mêmes proportions que l'original. Il est recommandé de garder ce
bouton activé la plupart du temps afin de s'assurer que les objets ne se tassent pas lors de la modification
de leur taille.
Une fois ce bouton désactivé, vous pouvez modifier les proportions lorsque vous modifiez l'échelle de
l'objet ; en d'autres termes, vous pouvez étirer l'objet dans un sens ou l'autre en tirant une poignée d'angle
de modification de taille ou en saisissant une nouvelle taille.
Modifier l'échelle à l'aide de la souris
L'Outil de
sélection
doit être en mode
Modification
d'échelle (les
poignées du cadre
de sélection sont
carrées). Si
nécessaire, cliquez
sur l'objet pour
passer en mode
Modification
d'échelle.
Tirez une des poignées d'angle. L'objet change d'échelle à mesure que vous bougez le pointeur en
diagonale. La barre d'infos affiche la modification d'échelle en cours. La modification de l'objet se fait
entre la poignée que vous êtes en train de tirer et celle d'en face. Si vous voulez utiliser un autre point de
l'objet comme point fixe, déplacez le point de référence vers celui-ci et utilisez les boutons de la barre
d'info pour mettre à l'échelle.
Maintenez « shift » tout en faisant glisser afin de modifier l'échelle de l'objet autour de son centre. Cela
fonctionne indépendamment de la position du point de référence.
« Ctrl+tirer » modifie la taille de l'objet en multiples de sa taille originale (x2, x3, etc.).
Pour créer une copie tout en modifiant la taille de l'objet (et en laissant l'original à sa place), vous devez
effectuer un clic droit ou appuyer sur la touche « + » du pavé numérique.
En tirant les poignées latérales, l'objet s'étire ou se tasse. Ceci est décrit dans le chapitre Étirer et écraser
des objets.
Modifier l'échelle à l'aide de la barre d'infos
Saisissez des valeurs dans les champs Redimensionner le texte et appuyer sur «
¿ ».
 Les modifications d'échelle inférieures à 100 % réduisent l'objet. 50 réduit de moitié la taille de
l'objet.
 Les modifications d'échelle supérieures à 100 % agrandissent l'objet. 200 double la taille de
Page 264
l'objet.
Si le bouton Conserver les proportions
est activé, vous pouvez indifféremment saisir la valeur dans l'un des deux champs de texte pour
redimensionner l'objet à hauteur du pourcentage souhaité. Si ce bouton n'est pas activé, vous pouvez
saisir des valeurs séparées pour la largeur et la hauteur.
Vous pouvez également saisir la taille requise de l'objet dans les champs de texte Largeur ou Hauteur.
Si le bouton Conserver les proportions
est activé, l'objet sera redimensionné en maintenant ses proportions. Vous pouvez saisir la taille dans
l'unité de votre choix, 1 cm par exemple.
Si vous vous servez de la barre d'infos pour mettre à l'échelle (ou des champs numériques), cette mise à
l'échelle sera toujours faite autour du point de référence. Vous pouvez positionner celui-ci à tout autre
endroit de l'objet, comme nous l'avons vu précédemment dans la section « Rotation des objets ».
Page 265
Modifier l'échelle à l'aide de la souris
L'Outil de
sélection
doit être en mode
Modification
d'échelle (les
poignées du cadre
de sélection sont
carrées). Si
nécessaire, cliquez
sur l'objet pour
passer en mode
Modification
d'échelle.
Tirez une des poignées d'angle. L'objet change d'échelle à mesure que vous bougez le pointeur en
diagonale. La barre d'infos affiche la modification d'échelle en cours. La modification de l'objet se fait
entre la poignée que vous êtes en train de tirer et celle d'en face. Si vous voulez utiliser un autre point de
l'objet comme point fixe, déplacez le point de référence vers celui-ci et utilisez les boutons de la barre
d'info pour mettre à l'échelle.
Maintenez « shift » tout en faisant glisser afin de modifier l'échelle de l'objet autour de son centre. Cela
fonctionne indépendamment de la position du point de référence.
« Ctrl+tirer » modifie la taille de l'objet en multiples de sa taille originale (x2, x3, etc.).
Pour créer une copie tout en modifiant la taille de l'objet (et en laissant l'original à sa place), vous devez
effectuer un clic droit ou appuyer sur la touche « + » du pavé numérique.
En tirant les poignées latérales, l'objet s'étire ou se tasse. Ceci est décrit dans le chapitre Étirer et écraser
des objets.
Modifier l'échelle à l'aide de la barre d'infos
Saisissez des valeurs dans les champs Redimensionner le texte et appuyer sur «
¿ ».
 Les modifications d'échelle inférieures à 100 % réduisent l'objet. 50 réduit de moitié la taille de
l'objet.
 Les modifications d'échelle supérieures à 100 % agrandissent l'objet. 200 double la taille de
l'objet.
Si le bouton Conserver les proportions
est activé, vous pouvez indifféremment saisir la valeur dans l'un des deux champs de texte pour
redimensionner l'objet à hauteur du pourcentage souhaité. Si ce bouton n'est pas activé, vous pouvez
saisir des valeurs séparées pour la largeur et la hauteur.
Vous pouvez également saisir la taille requise de l'objet dans les champs de texte Largeur ou Hauteur.
Si le bouton Conserver les proportions
est activé, l'objet sera redimensionné en maintenant ses proportions. Vous pouvez saisir la taille dans
l'unité de votre choix, 1 cm par exemple.
Si vous vous servez de la barre d'infos pour mettre à l'échelle (ou des champs numériques), cette mise à
l'échelle sera toujours faite autour du point de référence. Vous pouvez positionner celui-ci à tout autre
Page 266
endroit de l'objet, comme nous l'avons vu précédemment dans la section « Rotation des objets ».
Page 267
Modifier l'échelle à l'aide de la barre d'infos
Saisissez des valeurs dans les champs Redimensionner le texte et appuyer sur «
¿ ».
 Les modifications d'échelle inférieures à 100 % réduisent l'objet. 50 réduit de moitié la taille de
l'objet.
 Les modifications d'échelle supérieures à 100 % agrandissent l'objet. 200 double la taille de
l'objet.
Si le bouton Conserver les proportions
est activé, vous pouvez indifféremment saisir la valeur dans l'un des deux champs de texte pour
redimensionner l'objet à hauteur du pourcentage souhaité. Si ce bouton n'est pas activé, vous pouvez
saisir des valeurs séparées pour la largeur et la hauteur.
Vous pouvez également saisir la taille requise de l'objet dans les champs de texte Largeur ou Hauteur.
Si le bouton Conserver les proportions
est activé, l'objet sera redimensionné en maintenant ses proportions. Vous pouvez saisir la taille dans
l'unité de votre choix, 1 cm par exemple.
Si vous vous servez de la barre d'infos pour mettre à l'échelle (ou des champs numériques), cette mise à
l'échelle sera toujours faite autour du point de référence. Vous pouvez positionner celui-ci à tout autre
endroit de l'objet, comme nous l'avons vu précédemment dans la section « Rotation des objets ».
Page 268
Faire tourner les objets
Cette option se trouve sous Outil de sélection. En
cliquant sur les boutons Faire tourner
, l'objet tourne verticalement ou horizontalement autour
du point de référence.
L'échelle et les proportions ne sont pas modifiées — l'objet se contente de tourner.
Page 269
Étirer et écraser des objets
Cette opération est analogue à la modification d'échelle d'objets à cela près que la modification d'échelle
de l'objet s'effectue uniquement dans une direction. Étirer et écraser des objets sont des opérations
similaires, l'étirement rend l'objet plus grand, l'écrasement le rend plus petit.
Étirer/écraser des objets à l'aide de la souris
L'Outil de sélection
doit être en mode échelle. (Les poignées de sélection sont carrées). Si nécessaire, cliquez sur l'objet
pour passer en mode Modification d'échelle.
Utilisez les poignées latérales, du haut et du bas au lieu des coins pour étirer ou écraser une forme dans
une seule dimension. Notez que les poignées ne sont affichées que sur les rectangles sans remplissage
photo car étirer d'autres objets dans une seule dimension ne produit que très rarement des résultats
corrects (les photos sont déformées).
Tirez une des poignées latérales.
L'objet change d'échelle à
mesure que vous bougez le
pointeur dans la direction
appropriée. La barre d'infos
affiche la modification d'échelle
en cours.
Le bouton Conserver les
proportions
est ignoré.
Un clic droit ou appuyer sur la touche « + » du pavé numérique tout en tirant permet d'étirer ou d'écraser
une copie de l'objet, tout en laissant l'original à sa place.
Étirer/écraser des objets à l'aide de la barre d'infos
Le bouton Conserver les proportions
doit être désactivé (s'il est activé, vous modifierez l'échelle de l'objet au lieu de l'étirer ou de l'écraser).
Saisissez la largeur ou la hauteur dans un des champs de texte correspondants (selon vos besoins) puis
appuyez sur «
¿ ». Vous pouvez également saisir une échelle en % (largeur ou hauteur). Ainsi, saisissez 200 % dans le
champ d'échelle du haut pour doubler la largeur de l'objet tout en conservant la même hauteur.
Si l'option Conserver les proportions
est activée, il ne sera pas étiré.
Page 270
Incliner des objets
Cette option se trouve sous Outil de sélection
.
Cette
option
se
trouve
sous
Outil
de
sélecti
on
.
À gauche, l'objet d'origine, à droite, l'objet
incliné à l'horizontale
Incliner à l'aide de la souris
Basculez l'Outil de sélection
en mode Rotation / Inclinaison (les poignées de sélection ont une forme de flèche) en cliquant sur
l'objet.
Tirez une flèche latérale, du haut ou du bas pour incliner l'objet. Notez que les poignées ne sont affichées
que sur les rectangles sans remplissage photo car incliner d'autres objets ne produit que très rarement des
résultats corrects (p. ex. les photos sont déformées).
Lorsque vous tirez, l'objet s'incline dans la direction du
mouvement (vertical ou horizontal).
La barre d'infos affiche l'angle d'inclinaison actuel.
« shift+ tirer » permet d'incliner l'objet autour de son centre. Maintenez la touche « Ctrl » enfoncée pour
restreindre l'inclinaison aux angles forcés. Pour créer une copie tout en laissant l'original à sa place,
effectuez un clic droit ou appuyez sur la touche « + » du pavé numérique tout en faisant glisser. Ou faites
glisser l'objet avec le bouton droit de la souris pour créer des copies instantanées, et des copies
supplémentaires en faisant des clics gauche.
Vous pouvez également incliner un objet à l'aide du mode Modification de la taille dans l'outil de sélection
en utilisant les zones d'inclination. Pour en savoir plus, reportez vous au chapitre Faire pivoter les objets
en mode Modification de la taille
.
Incliner à l'aide de la barre d'infos
Pour incliner horizontalement,
saisissez un angle dans le champ de
texte d'inclinaison et appuyer sur «
¿ ».
Page 271
Estomper
Vous souhaitez parfois brouiller les bords d'un objet afin qu'il se mélange ou se fonde dans un objet
d'arrière-plan. C'est ce qu'on appelle Estomper. Par exemple, lors de la fusion de deux bitmaps lorsque
vous souhaitez éviter d'avoir un bord trop net entre les deux.
La commande Estomper se situe à
droite de la barre supérieure, après les
boutons des galeries.
Pour estomper un objet :
1. Sélectionner le ou les objets que vous souhaitez estomper.
2. Taper une valeur de taille numérique pour l'estompage dans le champ de texte
2. Ou
2. Cliquer sur la flèche et déplacer la réglette du menu contextuel en maintenant le bouton de la
souris enfoncé. Les objets sont estompés au fur et à mesure que vous la faites glisser.
L'estompage mélange ou brouille les bords des objets.
Si vous avez sélectionné plusieurs objets, la plume apparaît autour de chaque objet. Si vous groupez les
objets, la plume apparaîtra autour de l'extérieur du groupe.
Page 272
Accrochage
L'accrochage permet de positionner plus facilement les bords ou certains points spécifiques des objets à
l'endroit précis souhaité. Il peut être utilisé pour aligner les bords sur un point ou une ligne précis ou pour
espacer uniformément les objets à l'aide de la grille.
Xtreme Web Designer 5 offre trois types d'accrochage.
 Accrochage sur la grille
 Accrochage magnétique
 Accrochage sur les lignes de repère et les objets d'aide
L'accrochage sur la grille est utile pour espacer les objets uniformément, ou pour que les tailles soient des
multiples exacts d'une valeur donnée. Les lignes de repère sont utiles pour aligner les bords (bien qu'il soit
bien plus efficace d'utiliser les objets d'aide) et enfin, l'accrochage magnétique est un moyen courant de
positionner les lignes, les points ou les bords avec précision au-dessus d'autres lignes, points ou bords
d'objets proches.
Accrochage sur la grille
Lorsque Accrochage sur la grille est sélectionné, les points de la grille réagissent comme des aimants.
Cette option est gérée dans Fenêtre > Accrochage
sur la grille ou en appuyant sur le . (point) sur le clavier numérique. Tirer une poignée de contrôle à
proximité d'un point de la grille entraîne un accrochage. Vous pouvez contrôler l'espacement de la grille à
partir de la boîte de dialogue des Options (Services > Options)
Lorsqu'un objet est tiré, ses bords s'accrochent aux points de la grille. Quel bord sera accroché dépend
de la direction dans laquelle l'objet est tiré.
Ceci montre une grille ordinaire comportant 5 subdivisions entre les divisions principales. Le contour de
la forme est très épais et de couleur grise. L'objet ayant été tiré vers la gauche et vers le bas, ce sont les
bords inférieurs gauches qui se sont accrochés au point de la grille le plus proche.
Remarque :
l'espacement par défaut de la grille est de 50 pixels pour les lignes de grille principales comportant 50
subdivisions. Cela signifie que la grille est constituée d'espaces d'un pixel d'écran et qu'elle risque de ne
pas s'afficher correctement en zoom normal à 100 %. Si vous appliquez un facteur de zoom de 500 %,
vous pourrez voir que l'accrochage se fait correctement.
Vous pouvez également modifier les valeurs de la grille pour obtenir 10 subdivisions, ce qui implique que
les points de la grille soient espacés de 5 pixels.
Accrochage et largeurs des contours
Page 273
La commande Modifier les largeurs de contours
de la barre d'infos de l'Outil de sélection
permet également de contrôler si l'accrochage doit
se faire au bord du contour de l'objet ou sur la ligne
centrale.
L'exemple ci-dessus montre une forme avec un contour très épais de couleur grise. Il montre également
(sous la forme d'une fine ligne noire) le contour de la forme (vous pouvez voir que le contour épais est
tracé de façon identique des deux côtés de la ligne centrale de sorte qu'il déborde partiellement sur
l'intérieur et sur l'extérieur de la forme).
En désactivant cette commande, lorsque vous tirez un objet, les objets s'accrochent à la ligne centrale
mathématique, à savoir celle qui correspond au bord extérieur de la forme si elle est dépourvue de
contour.
Accrochage magnétique d'objet
L'Accrochage magnétique d'objet est un moyen très efficace
d'aligner avec exactitude les lignes, points et bords des objets
entre eux de façon à ce qu'ils se touchent avec précision.
Ainsi, par exemple, si vous souhaitez que plusieurs lignes démarrent exactement au même point, ou si
vous souhaitez qu'une ligne jouxte le bord d'un cercle avec précision, l'Accrochage magnétique d'objet
constitue la réponse appropriée.
Vous pouvez également utiliser cette fonction pour aligner les centres des objets. Lorsque vous prenez un
objet et que l'aimant est activé, il repère le « point d'intérêt » le plus proche. Lorsque vous faites glisser
l'objet et que l'aimant est activé, alors le point se trouvant sous le pointeur de la souris s'accrochera au
contour ou à un autre « point d'intérêt » se trouvant sur toute forme visible.
Le « point d'intérêt » se définit comme le contour ou tout point de contrôle sur le contour et sur d'autres
position telles que le centre d'objets. Ainsi cet outil est-il doublement intelligent : il accroche non
seulement le point que vous tirez, mais il garantit également que, si vous prenez un objet près d'un bord
ou d'un point, il utilisera sa position exacte pour l'accrochage.
Cette option est contrôlée par le bouton du petit icône
d'aimant sur la barre de contrôle Standard
:
Ou via le menu Fenêtre > Accrochage sur les objets
ou en appuyant sur la touche * du pavé numérique.
Ainsi, par exemple, vous pouvez aligner exactement l'angle d'un carré sur le centre exact d'un cercle en
prenant tout simplement l'angle du carré (ou sa proximité) et en le tirant près du centre du cercle.
L'indicateur d'accrochage de la ligne de statut vous indique quand les objets se sont accrochés.
Le chapitre Personnaliser Web Designer
vous fournira des informations détaillées sur la boîte de dialogue des Options.
La distance d'accrochage est gérée dans l'onglet Souris de la boîte de dialogue Options
(Services> Options). Vous pouvez y spécifier deux distances :
 Un cercle autour de chaque poignée de contrôle.
 Ainsi que la distance des deux côtés des segments de ligne. Ceci permet de rendre les points plus
« collants » que les lignes.
Page 274
Accrochage sur la grille
Lorsque Accrochage sur la grille est sélectionné, les points de la grille réagissent comme des aimants.
Cette option est gérée dans Fenêtre > Accrochage
sur la grille ou en appuyant sur le . (point) sur le clavier numérique. Tirer une poignée de contrôle à
proximité d'un point de la grille entraîne un accrochage. Vous pouvez contrôler l'espacement de la grille à
partir de la boîte de dialogue des Options (Services > Options)
Lorsqu'un objet est tiré, ses bords s'accrochent aux points de la grille. Quel bord sera accroché dépend
de la direction dans laquelle l'objet est tiré.
Ceci montre une grille ordinaire comportant 5 subdivisions entre les divisions principales. Le contour de
la forme est très épais et de couleur grise. L'objet ayant été tiré vers la gauche et vers le bas, ce sont les
bords inférieurs gauches qui se sont accrochés au point de la grille le plus proche.
Remarque :
l'espacement par défaut de la grille est de 50 pixels pour les lignes de grille principales comportant 50
subdivisions. Cela signifie que la grille est constituée d'espaces d'un pixel d'écran et qu'elle risque de ne
pas s'afficher correctement en zoom normal à 100 %. Si vous appliquez un facteur de zoom de 500 %,
vous pourrez voir que l'accrochage se fait correctement.
Vous pouvez également modifier les valeurs de la grille pour obtenir 10 subdivisions, ce qui implique que
les points de la grille soient espacés de 5 pixels.
Accrochage et largeurs des contours
La commande Modifier les largeurs de contours
de la barre d'infos de l'Outil de sélection
permet également de contrôler si l'accrochage doit
se faire au bord du contour de l'objet ou sur la ligne
centrale.
L'exemple ci-dessus montre une forme avec un contour très épais de couleur grise. Il montre également
(sous la forme d'une fine ligne noire) le contour de la forme (vous pouvez voir que le contour épais est
tracé de façon identique des deux côtés de la ligne centrale de sorte qu'il déborde partiellement sur
l'intérieur et sur l'extérieur de la forme).
En désactivant cette commande, lorsque vous tirez un objet, les objets s'accrochent à la ligne centrale
mathématique, à savoir celle qui correspond au bord extérieur de la forme si elle est dépourvue de
contour.
Accrochage magnétique d'objet
Page 275
L'Accrochage magnétique d'objet est un moyen très efficace
d'aligner avec exactitude les lignes, points et bords des objets
entre eux de façon à ce qu'ils se touchent avec précision.
Ainsi, par exemple, si vous souhaitez que plusieurs lignes démarrent exactement au même point, ou si
vous souhaitez qu'une ligne jouxte le bord d'un cercle avec précision, l'Accrochage magnétique d'objet
constitue la réponse appropriée.
Vous pouvez également utiliser cette fonction pour aligner les centres des objets. Lorsque vous prenez un
objet et que l'aimant est activé, il repère le « point d'intérêt » le plus proche. Lorsque vous faites glisser
l'objet et que l'aimant est activé, alors le point se trouvant sous le pointeur de la souris s'accrochera au
contour ou à un autre « point d'intérêt » se trouvant sur toute forme visible.
Le « point d'intérêt » se définit comme le contour ou tout point de contrôle sur le contour et sur d'autres
position telles que le centre d'objets. Ainsi cet outil est-il doublement intelligent : il accroche non
seulement le point que vous tirez, mais il garantit également que, si vous prenez un objet près d'un bord
ou d'un point, il utilisera sa position exacte pour l'accrochage.
Cette option est contrôlée par le bouton du petit icône
d'aimant sur la barre de contrôle Standard
:
Ou via le menu Fenêtre > Accrochage sur les objets
ou en appuyant sur la touche * du pavé numérique.
Ainsi, par exemple, vous pouvez aligner exactement l'angle d'un carré sur le centre exact d'un cercle en
prenant tout simplement l'angle du carré (ou sa proximité) et en le tirant près du centre du cercle.
L'indicateur d'accrochage de la ligne de statut vous indique quand les objets se sont accrochés.
Le chapitre Personnaliser Web Designer
vous fournira des informations détaillées sur la boîte de dialogue des Options.
La distance d'accrochage est gérée dans l'onglet Souris de la boîte de dialogue Options
(Services> Options). Vous pouvez y spécifier deux distances :
 Un cercle autour de chaque poignée de contrôle.
 Ainsi que la distance des deux côtés des segments de ligne. Ceci permet de rendre les points plus
« collants » que les lignes.
Page 276
Accrochage et largeurs des contours
La commande Modifier les largeurs de contours
de la barre d'infos de l'Outil de sélection
permet également de contrôler si l'accrochage doit
se faire au bord du contour de l'objet ou sur la ligne
centrale.
L'exemple ci-dessus montre une forme avec un contour très épais de couleur grise. Il montre également
(sous la forme d'une fine ligne noire) le contour de la forme (vous pouvez voir que le contour épais est
tracé de façon identique des deux côtés de la ligne centrale de sorte qu'il déborde partiellement sur
l'intérieur et sur l'extérieur de la forme).
En désactivant cette commande, lorsque vous tirez un objet, les objets s'accrochent à la ligne centrale
mathématique, à savoir celle qui correspond au bord extérieur de la forme si elle est dépourvue de
contour.
Accrochage magnétique d'objet
L'Accrochage magnétique d'objet est un moyen très efficace
d'aligner avec exactitude les lignes, points et bords des objets
entre eux de façon à ce qu'ils se touchent avec précision.
Ainsi, par exemple, si vous souhaitez que plusieurs lignes démarrent exactement au même point, ou si
vous souhaitez qu'une ligne jouxte le bord d'un cercle avec précision, l'Accrochage magnétique d'objet
constitue la réponse appropriée.
Vous pouvez également utiliser cette fonction pour aligner les centres des objets. Lorsque vous prenez un
objet et que l'aimant est activé, il repère le « point d'intérêt » le plus proche. Lorsque vous faites glisser
l'objet et que l'aimant est activé, alors le point se trouvant sous le pointeur de la souris s'accrochera au
contour ou à un autre « point d'intérêt » se trouvant sur toute forme visible.
Le « point d'intérêt » se définit comme le contour ou tout point de contrôle sur le contour et sur d'autres
position telles que le centre d'objets. Ainsi cet outil est-il doublement intelligent : il accroche non
seulement le point que vous tirez, mais il garantit également que, si vous prenez un objet près d'un bord
ou d'un point, il utilisera sa position exacte pour l'accrochage.
Cette option est contrôlée par le bouton du petit icône
d'aimant sur la barre de contrôle Standard
:
Ou via le menu Fenêtre > Accrochage sur les objets
ou en appuyant sur la touche * du pavé numérique.
Ainsi, par exemple, vous pouvez aligner exactement l'angle d'un carré sur le centre exact d'un cercle en
prenant tout simplement l'angle du carré (ou sa proximité) et en le tirant près du centre du cercle.
L'indicateur d'accrochage de la ligne de statut vous indique quand les objets se sont accrochés.
Le chapitre Personnaliser Web Designer
vous fournira des informations détaillées sur la boîte de dialogue des Options.
La distance d'accrochage est gérée dans l'onglet Souris de la boîte de dialogue Options
(Services> Options). Vous pouvez y spécifier deux distances :
 Un cercle autour de chaque poignée de contrôle.
 Ainsi que la distance des deux côtés des segments de ligne. Ceci permet de rendre les points plus
« collants » que les lignes.
Page 277
Accrochage magnétique d'objet
L'Accrochage magnétique d'objet est un moyen très efficace
d'aligner avec exactitude les lignes, points et bords des objets
entre eux de façon à ce qu'ils se touchent avec précision.
Ainsi, par exemple, si vous souhaitez que plusieurs lignes démarrent exactement au même point, ou si
vous souhaitez qu'une ligne jouxte le bord d'un cercle avec précision, l'Accrochage magnétique d'objet
constitue la réponse appropriée.
Vous pouvez également utiliser cette fonction pour aligner les centres des objets. Lorsque vous prenez un
objet et que l'aimant est activé, il repère le « point d'intérêt » le plus proche. Lorsque vous faites glisser
l'objet et que l'aimant est activé, alors le point se trouvant sous le pointeur de la souris s'accrochera au
contour ou à un autre « point d'intérêt » se trouvant sur toute forme visible.
Le « point d'intérêt » se définit comme le contour ou tout point de contrôle sur le contour et sur d'autres
position telles que le centre d'objets. Ainsi cet outil est-il doublement intelligent : il accroche non
seulement le point que vous tirez, mais il garantit également que, si vous prenez un objet près d'un bord
ou d'un point, il utilisera sa position exacte pour l'accrochage.
Cette option est contrôlée par le bouton du petit icône
d'aimant sur la barre de contrôle Standard
:
Ou via le menu Fenêtre > Accrochage sur les objets
ou en appuyant sur la touche * du pavé numérique.
Ainsi, par exemple, vous pouvez aligner exactement l'angle d'un carré sur le centre exact d'un cercle en
prenant tout simplement l'angle du carré (ou sa proximité) et en le tirant près du centre du cercle.
L'indicateur d'accrochage de la ligne de statut vous indique quand les objets se sont accrochés.
Le chapitre Personnaliser Web Designer
vous fournira des informations détaillées sur la boîte de dialogue des Options.
La distance d'accrochage est gérée dans l'onglet Souris de la boîte de dialogue Options
(Services> Options). Vous pouvez y spécifier deux distances :
 Un cercle autour de chaque poignée de contrôle.
 Ainsi que la distance des deux côtés des segments de ligne. Ceci permet de rendre les points plus
« collants » que les lignes.
Page 278
Objets d'aide et lignes d'aide
Les objets d'aide et les lignes d'aide sont des objets se trouvant sur un calque spécial, le calque de
lignes. Un calque de lignes est créé automatiquement lorsque vous créez une ligne d'aide (voir plus bas)
ou vous pouvez en créer un manuellement par clic droit dans la Galerie des calques et en sélectionnant
Créer un calque de lignes
(voir « Calques pour plus d'informations sur les calques).
Utilisez Accrochage sur la ligne et les objets d'aide
dans le menu Fenêtre (ou touche 2 du pavé numérique) pour activer l'accrochage sur des objets de
ligne.
Tout objet placé sur le calque de lignes devient un objet d'aide. Ceci peut être tout type d'objet, allant de
lignes à tout type d'angle, de formes irrégulières et de formes automatiques. Vous pouvez créer, modifier
la taille et supprimer des objets dans le calque de lignes comme d'ordinaire, mais ils apparaissent avec
des contours en fins pointillés rouges et toute largeur de contour ou couleur de remplissage est ignorée.
Cette information est conservée et si vous passez ultérieurement de l'objet du calque de lignes à un
calque ordinaire, l'épaisseur du contour et les couleurs s'afficheront de nouveau.
Vous pouvez utiliser les objets d'aide pour dessiner des contours de construction tels que les lignes
passant au travers d'un point de fuite pour le dessin en perspective.
Placer des objets sur le calque de lignes
S'assurer tout d'abord qu'un calque de lignes se trouve dans la Galerie des calques
—voir plus haut. Vous pouvez créer des objets directement sur le calque de lignes en le sélectionnant et
en créant des objets comme d'ordinaire.
La Galerie des calques affichant Vous pouvez également couper
un calque de lignes au-dessus de ou copier des objets d'un autre
deux autres calques, sélectionnée. calque puis coller ces objets
dans le même calque de lignes.
Pour coller les objets dans la
même position relative sur le
calque de lignes, utiliser les
raccourcis clavier Ctrl+Maj+ V
Déplacer vers le calque du premier plan et Déplacer vers le calque d'arrière-plan
du menu Arranger permet de sauter le calque de lignes et ne peut donc pas être utilisé pour déplacer des
objets sur le calque de lignes.
Créer une ligne de repère
Les lignes de repère sont des lignes verticales ou horizontales qui constituent un moyen rapide et facile
d'aligner une série d'objets sur la page.
 Activer les règles (Ctrl+L).
 Faire glisser d'une règle sur la page.
Ou
 Double-cliquer sur la règle afin de créer une ligne de repère alignée sur le pointeur.
Ceci crée automatiquement un calque de lignes et insère les lignes de repère sur ce calque.
Ou utiliser la Galerie des calques :
1. Cliquer droit sur la Galerie des calques et choisir Propriétés
2. Si nécessaire, cliquer sur l'onglet Lignes.
3. Sélectionner Horizontal ou Vertical.
4. Cliquer Nouveau.
5. Saisir à l'endroit requis.
Page 279
Supprimer une ligne de repère
À l'aide de l'Outil de sélection
, faire glisser la ligne de repère vers la règle appropriée (la règle verticale pour les lignes de repère
verticales, l'horizontale pour les lignes de repère horizontales).
Ou cliquer droit sur la ligne de repère puis choisir Supprimer.
Page 280
Placer des objets sur le calque de lignes
S'assurer tout d'abord qu'un calque de lignes se trouve dans la Galerie des calques
—voir plus haut. Vous pouvez créer des objets directement sur le calque de lignes en le sélectionnant et
en créant des objets comme d'ordinaire.
La Galerie des calques affichant Vous pouvez également couper
un calque de lignes au-dessus de ou copier des objets d'un autre
deux autres calques, sélectionnée. calque puis coller ces objets
dans le même calque de lignes.
Pour coller les objets dans la
même position relative sur le
calque de lignes, utiliser les
raccourcis clavier Ctrl+Maj+ V
Déplacer vers le calque du premier plan et Déplacer vers le calque d'arrière-plan
du menu Arranger permet de sauter le calque de lignes et ne peut donc pas être utilisé pour déplacer des
objets sur le calque de lignes.
Créer une ligne de repère
Les lignes de repère sont des lignes verticales ou horizontales qui constituent un moyen rapide et facile
d'aligner une série d'objets sur la page.
 Activer les règles (Ctrl+L).
 Faire glisser d'une règle sur la page.
Ou
 Double-cliquer sur la règle afin de créer une ligne de repère alignée sur le pointeur.
Ceci crée automatiquement un calque de lignes et insère les lignes de repère sur ce calque.
Ou utiliser la Galerie des calques :
1. Cliquer droit sur la Galerie des calques et choisir Propriétés
2. Si nécessaire, cliquer sur l'onglet Lignes.
3. Sélectionner Horizontal ou Vertical.
4. Cliquer Nouveau.
5. Saisir à l'endroit requis.
Supprimer une ligne de repère
À l'aide de l'Outil de sélection
, faire glisser la ligne de repère vers la règle appropriée (la règle verticale pour les lignes de repère
verticales, l'horizontale pour les lignes de repère horizontales).
Ou cliquer droit sur la ligne de repère puis choisir Supprimer.
Page 281
Créer une ligne de repère
Les lignes de repère sont des lignes verticales ou horizontales qui constituent un moyen rapide et facile
d'aligner une série d'objets sur la page.
 Activer les règles (Ctrl+L).
 Faire glisser d'une règle sur la page.
Ou
 Double-cliquer sur la règle afin de créer une ligne de repère alignée sur le pointeur.
Ceci crée automatiquement un calque de lignes et insère les lignes de repère sur ce calque.
Ou utiliser la Galerie des calques :
1. Cliquer droit sur la Galerie des calques et choisir Propriétés
2. Si nécessaire, cliquer sur l'onglet Lignes.
3. Sélectionner Horizontal ou Vertical.
4. Cliquer Nouveau.
5. Saisir à l'endroit requis.
Supprimer une ligne de repère
À l'aide de l'Outil de sélection
, faire glisser la ligne de repère vers la règle appropriée (la règle verticale pour les lignes de repère
verticales, l'horizontale pour les lignes de repère horizontales).
Ou cliquer droit sur la ligne de repère puis choisir Supprimer.
Page 282
Supprimer une ligne de repère
À l'aide de l'Outil de sélection
, faire glisser la ligne de repère vers la règle appropriée (la règle verticale pour les lignes de repère
verticales, l'horizontale pour les lignes de repère horizontales).
Ou cliquer droit sur la ligne de repère puis choisir Supprimer.
Page 283
Récapitulatif des raccourcis sur le pavé
numérique
+
/
*
2
.
fait une copie de l'objet pendant que vous le faites glisser, que
vous en modifiez la taille, que vous l'inclinez, etc. L'objet
d'origine n'est pas modifié.
active et désactive la conservation de la largeur des lignes lors de
la modification de l'échelle.
active et désactive la conservation des remplissages lors des
déplacements, des modifications d'échelle, des inclinaisons, etc.
active/désactive l'accrochage magnétique de l'objet.
active et désactive l'accrochage aux lignes d'aide.
active et désactive l'accrochage à la grille.
Page 284
Grouper et dégrouper des objets
Les outils Ombre et Transparence offrent différents résultats selon si les objets sont groupés ou non.
Pour plus d'informations, voir le chapitre Transparence et le chapitre Ombres
.
Vous créerez souvent des ombres complexes à partir de différents objets. L'option de menu Arranger >
Grouper
vous permet de verrouiller ces objets ensemble afin de former ce qui apparaît comme un objet unique.
Vous pouvez ensuite sélectionner les objets groupés et les copier, les redimensionner, les déplacer ou
bien effectuer toute autre opération sur l'ensemble du groupe.
Pour créer un groupe
1. Sélectionnez tout d'abord tous les objets que vous souhaitez grouper.
2. Choisir Arranger > Grouper (ou Ctrl+G) pour créer le groupe.
Dégrouper des objets
1. Sélectionner le groupe.
2. Choisir Arranger > Dégrouper (ou Ctrl+U).
Après cela, tous les objets individuels du groupe restent sélectionnés.
Pour ajouter des objets supplémentaires à un groupe
1. Sélectionner le groupe.
2. Dégrouper (Ctrl+U)
3. Sélectionner les objets supplémentaires.
4. Grouper de nouveau (Ctrl+G)
Vous pouvez également incorporer un groupe à un second groupe en sautant l'étape 2. Web Designer
retiendra l'information concernant le groupe original. Si vous dégroupez les objets ultérieurement, le
groupe original existera toujours.
Retirer des objets d'un groupe
1. Dégrouper les objets.
2. Maj+clic sur les objets que vous souhaitez retirer. Ceci les désélectionnera, les autres objets
resteront sélectionnés.
Vous pouvez ensuite choisir Arranger > Grouper
pour regrouper les objets restants.
Sélectionner un objet individuel au sein d'un groupe
(Par exemple, pour changer sa couleur.) Ctrl+clic sur l'objet. (Vous pouvez également utiliser cette
option pour sélectionner un « groupe dans le groupe ».) Une pression sur Tabulation ou Maj+Tab
déplace la sélection à l'intérieur du groupe, vers le prochain objet ou le précédent. Une fois que vous
avez sélectionné un objet dans un groupe, vous pouvez également utiliser Alt + clic pour sélectionner
l'objet du dessous.
Cela s'appelle « sélection intérieure ».
Groupes et calques
Plus d'informations concernant les calques dans le chapitre Calques.
Si tous les objets à grouper se trouvent dans un même calque, le groupe sera créé dans ce même calque.
Le groupe apparaît au niveau de l'élément le plus en avant du groupe. (Ce qui signifie que le groupe ne
Page 285
devient pas automatiquement l'objet de premier plan.)
Si les objets se trouvent dans plusieurs calques, le groupe est créé dans le calque contenant l'objet le plus
proche du premier plan.
Page 286
Pour créer un groupe
1. Sélectionnez tout d'abord tous les objets que vous souhaitez grouper.
2. Choisir Arranger > Grouper (ou Ctrl+G) pour créer le groupe.
Dégrouper des objets
1. Sélectionner le groupe.
2. Choisir Arranger > Dégrouper (ou Ctrl+U).
Après cela, tous les objets individuels du groupe restent sélectionnés.
Pour ajouter des objets supplémentaires à un groupe
1. Sélectionner le groupe.
2. Dégrouper (Ctrl+U)
3. Sélectionner les objets supplémentaires.
4. Grouper de nouveau (Ctrl+G)
Vous pouvez également incorporer un groupe à un second groupe en sautant l'étape 2. Web Designer
retiendra l'information concernant le groupe original. Si vous dégroupez les objets ultérieurement, le
groupe original existera toujours.
Retirer des objets d'un groupe
1. Dégrouper les objets.
2. Maj+clic sur les objets que vous souhaitez retirer. Ceci les désélectionnera, les autres objets
resteront sélectionnés.
Vous pouvez ensuite choisir Arranger > Grouper
pour regrouper les objets restants.
Sélectionner un objet individuel au sein d'un groupe
(Par exemple, pour changer sa couleur.) Ctrl+clic sur l'objet. (Vous pouvez également utiliser cette
option pour sélectionner un « groupe dans le groupe ».) Une pression sur Tabulation ou Maj+Tab
déplace la sélection à l'intérieur du groupe, vers le prochain objet ou le précédent. Une fois que vous
avez sélectionné un objet dans un groupe, vous pouvez également utiliser Alt + clic pour sélectionner
l'objet du dessous.
Cela s'appelle « sélection intérieure ».
Groupes et calques
Plus d'informations concernant les calques dans le chapitre Calques.
Si tous les objets à grouper se trouvent dans un même calque, le groupe sera créé dans ce même calque.
Le groupe apparaît au niveau de l'élément le plus en avant du groupe. (Ce qui signifie que le groupe ne
devient pas automatiquement l'objet de premier plan.)
Si les objets se trouvent dans plusieurs calques, le groupe est créé dans le calque contenant l'objet le plus
proche du premier plan.
Page 287
Dégrouper des objets
1. Sélectionner le groupe.
2. Choisir Arranger > Dégrouper (ou Ctrl+U).
Après cela, tous les objets individuels du groupe restent sélectionnés.
Pour ajouter des objets supplémentaires à un groupe
1. Sélectionner le groupe.
2. Dégrouper (Ctrl+U)
3. Sélectionner les objets supplémentaires.
4. Grouper de nouveau (Ctrl+G)
Vous pouvez également incorporer un groupe à un second groupe en sautant l'étape 2. Web Designer
retiendra l'information concernant le groupe original. Si vous dégroupez les objets ultérieurement, le
groupe original existera toujours.
Retirer des objets d'un groupe
1. Dégrouper les objets.
2. Maj+clic sur les objets que vous souhaitez retirer. Ceci les désélectionnera, les autres objets
resteront sélectionnés.
Vous pouvez ensuite choisir Arranger > Grouper
pour regrouper les objets restants.
Sélectionner un objet individuel au sein d'un groupe
(Par exemple, pour changer sa couleur.) Ctrl+clic sur l'objet. (Vous pouvez également utiliser cette
option pour sélectionner un « groupe dans le groupe ».) Une pression sur Tabulation ou Maj+Tab
déplace la sélection à l'intérieur du groupe, vers le prochain objet ou le précédent. Une fois que vous
avez sélectionné un objet dans un groupe, vous pouvez également utiliser Alt + clic pour sélectionner
l'objet du dessous.
Cela s'appelle « sélection intérieure ».
Groupes et calques
Plus d'informations concernant les calques dans le chapitre Calques.
Si tous les objets à grouper se trouvent dans un même calque, le groupe sera créé dans ce même calque.
Le groupe apparaît au niveau de l'élément le plus en avant du groupe. (Ce qui signifie que le groupe ne
devient pas automatiquement l'objet de premier plan.)
Si les objets se trouvent dans plusieurs calques, le groupe est créé dans le calque contenant l'objet le plus
proche du premier plan.
Page 288
Pour ajouter des objets supplémentaires à un groupe
1. Sélectionner le groupe.
2. Dégrouper (Ctrl+U)
3. Sélectionner les objets supplémentaires.
4. Grouper de nouveau (Ctrl+G)
Vous pouvez également incorporer un groupe à un second groupe en sautant l'étape 2. Web Designer
retiendra l'information concernant le groupe original. Si vous dégroupez les objets ultérieurement, le
groupe original existera toujours.
Retirer des objets d'un groupe
1. Dégrouper les objets.
2. Maj+clic sur les objets que vous souhaitez retirer. Ceci les désélectionnera, les autres objets
resteront sélectionnés.
Vous pouvez ensuite choisir Arranger > Grouper
pour regrouper les objets restants.
Sélectionner un objet individuel au sein d'un groupe
(Par exemple, pour changer sa couleur.) Ctrl+clic sur l'objet. (Vous pouvez également utiliser cette
option pour sélectionner un « groupe dans le groupe ».) Une pression sur Tabulation ou Maj+Tab
déplace la sélection à l'intérieur du groupe, vers le prochain objet ou le précédent. Une fois que vous
avez sélectionné un objet dans un groupe, vous pouvez également utiliser Alt + clic pour sélectionner
l'objet du dessous.
Cela s'appelle « sélection intérieure ».
Groupes et calques
Plus d'informations concernant les calques dans le chapitre Calques.
Si tous les objets à grouper se trouvent dans un même calque, le groupe sera créé dans ce même calque.
Le groupe apparaît au niveau de l'élément le plus en avant du groupe. (Ce qui signifie que le groupe ne
devient pas automatiquement l'objet de premier plan.)
Si les objets se trouvent dans plusieurs calques, le groupe est créé dans le calque contenant l'objet le plus
proche du premier plan.
Page 289
Retirer des objets d'un groupe
1. Dégrouper les objets.
2. Maj+clic sur les objets que vous souhaitez retirer. Ceci les désélectionnera, les autres objets
resteront sélectionnés.
Vous pouvez ensuite choisir Arranger > Grouper
pour regrouper les objets restants.
Sélectionner un objet individuel au sein d'un groupe
(Par exemple, pour changer sa couleur.) Ctrl+clic sur l'objet. (Vous pouvez également utiliser cette
option pour sélectionner un « groupe dans le groupe ».) Une pression sur Tabulation ou Maj+Tab
déplace la sélection à l'intérieur du groupe, vers le prochain objet ou le précédent. Une fois que vous
avez sélectionné un objet dans un groupe, vous pouvez également utiliser Alt + clic pour sélectionner
l'objet du dessous.
Cela s'appelle « sélection intérieure ».
Groupes et calques
Plus d'informations concernant les calques dans le chapitre Calques.
Si tous les objets à grouper se trouvent dans un même calque, le groupe sera créé dans ce même calque.
Le groupe apparaît au niveau de l'élément le plus en avant du groupe. (Ce qui signifie que le groupe ne
devient pas automatiquement l'objet de premier plan.)
Si les objets se trouvent dans plusieurs calques, le groupe est créé dans le calque contenant l'objet le plus
proche du premier plan.
Page 290
Sélectionner un objet individuel au sein d'un groupe
(Par exemple, pour changer sa couleur.) Ctrl+clic sur l'objet. (Vous pouvez également utiliser cette
option pour sélectionner un « groupe dans le groupe ».) Une pression sur Tabulation ou Maj+Tab
déplace la sélection à l'intérieur du groupe, vers le prochain objet ou le précédent. Une fois que vous
avez sélectionné un objet dans un groupe, vous pouvez également utiliser Alt + clic pour sélectionner
l'objet du dessous.
Cela s'appelle « sélection intérieure ».
Groupes et calques
Plus d'informations concernant les calques dans le chapitre Calques.
Si tous les objets à grouper se trouvent dans un même calque, le groupe sera créé dans ce même calque.
Le groupe apparaît au niveau de l'élément le plus en avant du groupe. (Ce qui signifie que le groupe ne
devient pas automatiquement l'objet de premier plan.)
Si les objets se trouvent dans plusieurs calques, le groupe est créé dans le calque contenant l'objet le plus
proche du premier plan.
Page 291
Groupes et calques
Plus d'informations concernant les calques dans le chapitre Calques.
Si tous les objets à grouper se trouvent dans un même calque, le groupe sera créé dans ce même calque.
Le groupe apparaît au niveau de l'élément le plus en avant du groupe. (Ce qui signifie que le groupe ne
devient pas automatiquement l'objet de premier plan.)
Si les objets se trouvent dans plusieurs calques, le groupe est créé dans le calque contenant l'objet le plus
proche du premier plan.
Page 292
Groupes souples
Les groupes ordinaires tels que ceux décrits sous « Grouper et dégrouper des objets » sont placés sur
un seul calque et ne peuvent pas être étendus. Les Groupes souples
constituent une méthode alternative pour relier les objets les uns aux autres lorsqu'ils se trouvent sur
plusieurs calques différents.
La sélection d'un élément d'un groupe souple sélectionne également tous les autres éléments du même
groupe souple – même les éléments se trouvant sur des calques invisibles ou verrouillés. Ainsi, lorsque
vous supprimez, déplacez, tournez ou transformez autrement un élément d'un groupe souple, tous les
autres éléments subissent la même modification.
La barre d'état affiche la sélection d'un groupe souple.
Les groupes souples sont utiles pour maintenir ensemble les objets étroitement liés. Par exemple, les
états État normal et Survol de souris
d'un bouton de navigation sont réunis dans un groupe souple de sorte que si un état est déplacé ou
modifié, le second l'est également.
Créer des groupes souples
Pour créer un groupe souple, sélectionnez tous les objets à inclure puis choisissez
« Arranger->Appliquer un groupe souple
» (ou appuyez sur « Ctrl+Alt+G »). Notez que si le groupe souple doit inclure des éléments invisibles ou
verrouillés, vous devrez rendre ces calques temporairement visibles et éditables en utilisant la Galerie des
calques afin de pouvoir sélectionner les objets et les réunir dans un groupe souple.
Un objet ne peut pas faire partie de plus d'un groupe souple et les groupes souples ne peuvent pas être
imbriqués (groupes souples faisant parties d'autres groupes souples).
Supprimer des groupes souples
Pour dissoudre un groupe souple, sélectionnez « Arranger->Supprimer un groupe souple
» (ou appuyez sur « Ctrl+Alt+G »). Les objets ne sont pas supprimés, mais ils ne sont plus reliés par un
groupe souple.
Synchronisation de texte
Tous les objets de texte comprenant la même valeur de texte et qui font partie du même groupe souple
sont maintenus synchronisés si un de ces objets de texte est édité. Ainsi, un changement dans un texte
d'un objet entraîne le même changement de tous les autres objets de texte comportant les mêmes
caractères. Seul le texte évalue lui-même s'il est synchronisé, de sorte que des objets de texte différents
peuvent avoir différentes tailles, différentes polices et différents attributs.
Une synchronisation de texte en utilisant des groupes souples est utile lorsqu'un label est copié à plusieurs
emplacements, éventuellement dans différents styles, et que vous souhaitez que chaque objet présente le
même label.
Page 293
Créer des groupes souples
Pour créer un groupe souple, sélectionnez tous les objets à inclure puis choisissez
« Arranger->Appliquer un groupe souple
» (ou appuyez sur « Ctrl+Alt+G »). Notez que si le groupe souple doit inclure des éléments invisibles ou
verrouillés, vous devrez rendre ces calques temporairement visibles et éditables en utilisant la Galerie des
calques afin de pouvoir sélectionner les objets et les réunir dans un groupe souple.
Un objet ne peut pas faire partie de plus d'un groupe souple et les groupes souples ne peuvent pas être
imbriqués (groupes souples faisant parties d'autres groupes souples).
Supprimer des groupes souples
Pour dissoudre un groupe souple, sélectionnez « Arranger->Supprimer un groupe souple
» (ou appuyez sur « Ctrl+Alt+G »). Les objets ne sont pas supprimés, mais ils ne sont plus reliés par un
groupe souple.
Synchronisation de texte
Tous les objets de texte comprenant la même valeur de texte et qui font partie du même groupe souple
sont maintenus synchronisés si un de ces objets de texte est édité. Ainsi, un changement dans un texte
d'un objet entraîne le même changement de tous les autres objets de texte comportant les mêmes
caractères. Seul le texte évalue lui-même s'il est synchronisé, de sorte que des objets de texte différents
peuvent avoir différentes tailles, différentes polices et différents attributs.
Une synchronisation de texte en utilisant des groupes souples est utile lorsqu'un label est copié à plusieurs
emplacements, éventuellement dans différents styles, et que vous souhaitez que chaque objet présente le
même label.
Page 294
Supprimer des groupes souples
Pour dissoudre un groupe souple, sélectionnez « Arranger->Supprimer un groupe souple
» (ou appuyez sur « Ctrl+Alt+G »). Les objets ne sont pas supprimés, mais ils ne sont plus reliés par un
groupe souple.
Synchronisation de texte
Tous les objets de texte comprenant la même valeur de texte et qui font partie du même groupe souple
sont maintenus synchronisés si un de ces objets de texte est édité. Ainsi, un changement dans un texte
d'un objet entraîne le même changement de tous les autres objets de texte comportant les mêmes
caractères. Seul le texte évalue lui-même s'il est synchronisé, de sorte que des objets de texte différents
peuvent avoir différentes tailles, différentes polices et différents attributs.
Une synchronisation de texte en utilisant des groupes souples est utile lorsqu'un label est copié à plusieurs
emplacements, éventuellement dans différents styles, et que vous souhaitez que chaque objet présente le
même label.
Page 295
Synchronisation de texte
Tous les objets de texte comprenant la même valeur de texte et qui font partie du même groupe souple
sont maintenus synchronisés si un de ces objets de texte est édité. Ainsi, un changement dans un texte
d'un objet entraîne le même changement de tous les autres objets de texte comportant les mêmes
caractères. Seul le texte évalue lui-même s'il est synchronisé, de sorte que des objets de texte différents
peuvent avoir différentes tailles, différentes polices et différents attributs.
Une synchronisation de texte en utilisant des groupes souples est utile lorsqu'un label est copié à plusieurs
emplacements, éventuellement dans différents styles, et que vous souhaitez que chaque objet présente le
même label.
Page 296
Alignement
Cette option vous permet d'aligner ou de répartir au moins deux objets avec précision. Sélectionnez les
objets que vous voulez aligner puis choisissez Arranger > Alignement (raccourci Ctrl+Maj+L).
Le petit schéma en haut de la boîte de
dialogue vous montre l'effet produit par
la sélection des différentes options. Les
objets sélectionnés dans le document
ne sont pas modifiés tant que vous
n'avez pas cliqué sur Appliquer.
La boîte de dialogue d'Alignement est
une boîte non modale, ce qui signifie
que vous pouvez la garder à l'écran
tout en continuant à travailler sur le
document simultanément. Vous pouvez
ainsi changer d'outils, dessiner et
modifier votre sélection d'objets tout
en choisissant facilement parmi les
différentes options d'alignement.
Si vous vous êtes trompé dans la
sélection, vous pouvez la modifier et
cliquer sur le bouton Appliquer afin d'
Appliquer
les derniers réglages d'alignement de
nouveau. Ceci pourra vous faire
gagner un temps précieux.
Dans
Cette section de la boîte de dialogue contrôle les limites à l'intérieur desquelles vous alignez ou
répartissez les objets. Les options sont les suivantes :
Limites de la sélection
: les limites sont les bords extérieurs des objets
sélectionnés. Leur position relative sur la page ou
leur double page n'a aucun effet.
Limites de l'objet d'arrière-plan
: les limites sont les bords extérieurs de l'objet
sélectionné et le plus en arrière. Cet objet n'est
pas affecté par l'alignement.
Vous pouvez l'utiliser pour définir l'objet de
« référence » lorsque vous souhaitez aligner
plusieurs objets sur une ligne, par exemple. Les
options de « Limites de la sélection » normales
sur l'objet le plus à gauche en font l'objet de
référence (celui que ne sera pas déplacé)
Page 297
Page(s) :
si les objets sont sur une simple page, les limites
en sont les bords. (Ce qui vous permet, par
exemple, de centrer les objets sur la page ou de
les aligner contre le bord de la page.)
Aligner
Pour aligner des objets de façon à ce que leurs bords gauches soient alignés à gauche par exemple.
1. Sélectionner les objets si nécessaire.
2. Sélectionner l'option Dans nécessaire, à savoir, les limites de la sélection.
3. Sélectionner Aligner à gauche pour des positions horizontales,
4. Laisser les positions verticales sur Aucun changement.
5. Cliquer sur Appliquer.
Les objets sélectionnés se déplacent pour s'aligner sur les bords gauches.
Toutes les options d'alignement fonctionnent de façon similaire. Afin de faire court, seule l'option
d'alignement gauche illustrée dans la boîte de dialogue est décrite. Testez afin d'en apprendre plus sur les
autres options.
Afin de sélectionner rapidement n'importe quelle combinaison d'alignement vertical et horizontal, cliquez
dans le diagramme avec la souris :
 Un seul clic a pour effet d'aligner les positions horizontales et verticales sur la position cliquée
dans n'importe quelle des neuf combinaisons (haut-centré-bas/gauche-centré-droite)
 CTRL + clic droit laisse la position horizontale inchangée et positionne les objets sur une ligne
vers le haut, le centre ou le bas.
 Maj + clic laisse la position verticale inchangée et aligne les objets sur une colonne vers la
gauche, le centre ou la droite.
Répartir
Les options Répartir permettent de positionner tous les objets sélectionnés uniformément sur la zone
Dans (généralement dans les limites de la sélection, mais il peut s'agir de la page ou de la double page).
De même, ici, toutes les options de répartition fonctionnent de façon similaire. Les exemples suivants
montrent comment les différentes options de position verticale alignent les objets.
Répartition des bords supérieurs : les
sommets des objets sont espacés
uniformément. La Répartition des
bords inférieurs
est l'inverse—le bas des objets est
espacé uniformément.
Répartition des centres
: les centres des objets sont espacés
uniformément.
Répartition équi-distante :
les objets sont espacés uniformément.
Les options de position horizontale sont semblables mais fonctionnent dans la direction horizontale.
Ainsi, à titre d'exemple, pour répartir cette série d'ellipses positionnées de manière aléatoire de façon à
ce qu'elles soient espacées à l'identique et alignées sur le bord supérieur :
Page 298
Sélectionner les formes
Afficher la boîte de dialogue
d'Alignement (Ctrl+Maj+L)
 S'assurer que Dans affiche les
Limites de la sélection
 Sélectionner les positions
horizontales : Répartir les
centres
 Sélectionner la position
verticale : Aligner le haut
 Cliquer sur Appliquer
Ils apparaîtront ainsi, tous régulièrement
espacés horizontalement et alignés sur le
sommet.
N'oubliez pas que si vous effectuez une erreur, vous pouvez toujours annuler l'opération.


Page 299
Dans
Cette section de la boîte de dialogue contrôle les limites à l'intérieur desquelles vous alignez ou
répartissez les objets. Les options sont les suivantes :
Limites de la sélection
: les limites sont les bords extérieurs des objets
sélectionnés. Leur position relative sur la page ou
leur double page n'a aucun effet.
Limites de l'objet d'arrière-plan
: les limites sont les bords extérieurs de l'objet
sélectionné et le plus en arrière. Cet objet n'est
pas affecté par l'alignement.
Vous pouvez l'utiliser pour définir l'objet de
« référence » lorsque vous souhaitez aligner
plusieurs objets sur une ligne, par exemple. Les
options de « Limites de la sélection » normales
sur l'objet le plus à gauche en font l'objet de
référence (celui que ne sera pas déplacé)
Page(s) :
si les objets sont sur une simple page, les limites
en sont les bords. (Ce qui vous permet, par
exemple, de centrer les objets sur la page ou de
les aligner contre le bord de la page.)
Aligner
Pour aligner des objets de façon à ce que leurs bords gauches soient alignés à gauche par exemple.
1. Sélectionner les objets si nécessaire.
2. Sélectionner l'option Dans nécessaire, à savoir, les limites de la sélection.
3. Sélectionner Aligner à gauche pour des positions horizontales,
4. Laisser les positions verticales sur Aucun changement.
5. Cliquer sur Appliquer.
Les objets sélectionnés se déplacent pour s'aligner sur les bords gauches.
Toutes les options d'alignement fonctionnent de façon similaire. Afin de faire court, seule l'option
d'alignement gauche illustrée dans la boîte de dialogue est décrite. Testez afin d'en apprendre plus sur les
autres options.
Afin de sélectionner rapidement n'importe quelle combinaison d'alignement vertical et horizontal, cliquez
dans le diagramme avec la souris :
 Un seul clic a pour effet d'aligner les positions horizontales et verticales sur la position cliquée
dans n'importe quelle des neuf combinaisons (haut-centré-bas/gauche-centré-droite)
 CTRL + clic droit laisse la position horizontale inchangée et positionne les objets sur une ligne
vers le haut, le centre ou le bas.
 Maj + clic laisse la position verticale inchangée et aligne les objets sur une colonne vers la
gauche, le centre ou la droite.
Répartir
Les options Répartir permettent de positionner tous les objets sélectionnés uniformément sur la zone
Dans (généralement dans les limites de la sélection, mais il peut s'agir de la page ou de la double page).
Page 300
De même, ici, toutes les options de répartition fonctionnent de façon similaire. Les exemples suivants
montrent comment les différentes options de position verticale alignent les objets.
Répartition des bords supérieurs : les
sommets des objets sont espacés
uniformément. La Répartition des
bords inférieurs
est l'inverse—le bas des objets est
espacé uniformément.
Répartition des centres
: les centres des objets sont espacés
uniformément.
Répartition équi-distante :
les objets sont espacés uniformément.
Les options de position horizontale sont semblables mais fonctionnent dans la direction horizontale.
Ainsi, à titre d'exemple, pour répartir cette série d'ellipses positionnées de manière aléatoire de façon à
ce qu'elles soient espacées à l'identique et alignées sur le bord supérieur :
 Sélectionner les formes
 Afficher la boîte de dialogue
d'Alignement (Ctrl+Maj+L)
 S'assurer que Dans affiche les
Limites de la sélection
 Sélectionner les positions
horizontales : Répartir les
centres
 Sélectionner la position
verticale : Aligner le haut
 Cliquer sur Appliquer
Ils apparaîtront ainsi, tous régulièrement
espacés horizontalement et alignés sur le
sommet.
N'oubliez pas que si vous effectuez une erreur, vous pouvez toujours annuler l'opération.
Page 301
Aligner
Pour aligner des objets de façon à ce que leurs bords gauches soient alignés à gauche par exemple.
1. Sélectionner les objets si nécessaire.
2. Sélectionner l'option Dans nécessaire, à savoir, les limites de la sélection.
3. Sélectionner Aligner à gauche pour des positions horizontales,
4. Laisser les positions verticales sur Aucun changement.
5. Cliquer sur Appliquer.
Les objets sélectionnés se déplacent pour s'aligner sur les bords gauches.
Toutes les options d'alignement fonctionnent de façon similaire. Afin de faire court, seule l'option
d'alignement gauche illustrée dans la boîte de dialogue est décrite. Testez afin d'en apprendre plus sur les
autres options.
Afin de sélectionner rapidement n'importe quelle combinaison d'alignement vertical et horizontal, cliquez
dans le diagramme avec la souris :
 Un seul clic a pour effet d'aligner les positions horizontales et verticales sur la position cliquée
dans n'importe quelle des neuf combinaisons (haut-centré-bas/gauche-centré-droite)
 CTRL + clic droit laisse la position horizontale inchangée et positionne les objets sur une ligne
vers le haut, le centre ou le bas.
 Maj + clic laisse la position verticale inchangée et aligne les objets sur une colonne vers la
gauche, le centre ou la droite.
Répartir
Les options Répartir permettent de positionner tous les objets sélectionnés uniformément sur la zone
Dans (généralement dans les limites de la sélection, mais il peut s'agir de la page ou de la double page).
De même, ici, toutes les options de répartition fonctionnent de façon similaire. Les exemples suivants
montrent comment les différentes options de position verticale alignent les objets.
Répartition des bords supérieurs : les
sommets des objets sont espacés
uniformément. La Répartition des
bords inférieurs
est l'inverse—le bas des objets est
espacé uniformément.
Répartition des centres
: les centres des objets sont espacés
uniformément.
Répartition équi-distante :
les objets sont espacés uniformément.
Les options de position horizontale sont semblables mais fonctionnent dans la direction horizontale.
Ainsi, à titre d'exemple, pour répartir cette série d'ellipses positionnées de manière aléatoire de façon à
ce qu'elles soient espacées à l'identique et alignées sur le bord supérieur :
 Sélectionner les formes
 Afficher la boîte de dialogue
d'Alignement (Ctrl+Maj+L)
 S'assurer que Dans affiche les
Limites de la sélection
Page 302
Sélectionner les positions
horizontales : Répartir les
centres
 Sélectionner la position
verticale : Aligner le haut
 Cliquer sur Appliquer
Ils apparaîtront ainsi, tous régulièrement
espacés horizontalement et alignés sur le
sommet.
N'oubliez pas que si vous effectuez une erreur, vous pouvez toujours annuler l'opération.

Page 303
Répartir
Les options Répartir permettent de positionner tous les objets sélectionnés uniformément sur la zone
Dans (généralement dans les limites de la sélection, mais il peut s'agir de la page ou de la double page).
De même, ici, toutes les options de répartition fonctionnent de façon similaire. Les exemples suivants
montrent comment les différentes options de position verticale alignent les objets.
Répartition des bords supérieurs : les
sommets des objets sont espacés
uniformément. La Répartition des
bords inférieurs
est l'inverse—le bas des objets est
espacé uniformément.
Répartition des centres
: les centres des objets sont espacés
uniformément.
Répartition équi-distante :
les objets sont espacés uniformément.
Les options de position horizontale sont semblables mais fonctionnent dans la direction horizontale.
Ainsi, à titre d'exemple, pour répartir cette série d'ellipses positionnées de manière aléatoire de façon à
ce qu'elles soient espacées à l'identique et alignées sur le bord supérieur :
 Sélectionner les formes
 Afficher la boîte de dialogue
d'Alignement (Ctrl+Maj+L)
 S'assurer que Dans affiche les
Limites de la sélection
 Sélectionner les positions
horizontales : Répartir les
centres
 Sélectionner la position
verticale : Aligner le haut
 Cliquer sur Appliquer
Ils apparaîtront ainsi, tous régulièrement
espacés horizontalement et alignés sur le
sommet.
N'oubliez pas que si vous effectuez une erreur, vous pouvez toujours annuler l'opération.
Page 304
Copier des styles : coller des attributs
Cette option vous permet de copier des attributs (tels que le type de ligne ou la couleur de remplissage)
entre des objets. C'est un moyen rapide d'appliquer une multitude d'attributs à un objet.
Le carré a une couleur, un type
d'ombre, de contour et de remplissage
spécifique. Le copier puis coller ses
attributs sur le cercle du centre produit
un cercle à droite.
1. Sélectionner l'objet dont vous souhaitez copier les attributs.
2. Copier la sélection dans le presse-papier. (Édition > copier ou CTRL + C)
3. Sélectionner l'(es) objet(s) au(x)quel(s) vous souhaitez appliquer les attributs.
4. Éditer > Coller des attributs (ou Ctrl+ Maj +A).
L'objet reste dans le presse-papier jusqu'à ce qu'il soit écrasé par une opération de copier ou de coller.
Ceci vous permet de coller les attributs autant de fois que nécessaire.
Bibliothèques de style
Il est très facile d'utiliser cette technique afin de créer des documents pouvant être utilisés comme
bibliothèques de style. Créer une série de petits objets avec différents remplissages, couleurs et autres
styles d'attributs. Ensuite, le moyen le plus rapide d'utiliser ces styles est le suivant :
 Cliquer sur l'objet source, Ctrl+C pour copier le style
 Passer à l'objet de destination (qui peut être dans un autre document, faire Ctrl+Tab pour passer
rapidement d'un document ouvert à l'autre), cliquer sur l'objet auquel appliquer le style
 Appuyer sur Ctrl+Maj+A pour appliquer les attributs
Remarque :
la plupart des attributs peuvent être copiés de cette façon, dont les ombres, les valeurs d'estompage, les
styles de remplissage, les effets en direct, etc. Toutefois, les biseaux ne peuvent être copiés d'un objet à
l'autre que si l'objet dans lequel le biseau est copié dispose déjà d'un biseau auquel les attributs peuvent
être attribués.
Page 305
Nommer les objets
Vous pouvez attribuer des noms à tout objet dans Xtreme Web
Designer 5 à l'aide du bouton « Appliquer, supprimer ou vérifier les
noms des objets » de la barre d'information de l'Outil de sélection
.
La nomination est un mécanisme général présentant différentes utilisations dont certaines sont décrites
ci-dessous. Le plus souvent, les noms sont utilisés pour former des ensembles d'objets.
Exemples d'utilisations de noms
Animations Flash : les noms sont utilisés dans les animations flash pour sélectionner les objets à
tweener par le Flash exporter. Voir le chapitre Flash
pour plus d'informations.
Répéter les objets : une convention de nomination spéciale est utilisée pour identifier un objet devant
apparaître sur plusieurs pages d'un projet sous exactement la même forme et à la même position sur
chaque page. Cela permet d'éditer une seule copie de l'objet puis de mettre à jour toutes les autres. Voir
la section « Répéter les objets »
dans le chapitre « Démarrer » pour plus d'informations.
Cette boîte de dialogue est indépendante du mode. Vous pouvez donc modifier la sélection pendant que
la boîte de dialogue est ouverte. Elle affiche les noms de la sélection actuelle. Le champ de texte en haut
de la boîte de dialogue vous montre combien d'objets sont actuellement sélectionnés.
Ajouter des noms
Pour ajouter un nom à un objet, sélectionnez l'objet et ouvrez la boîte de dialogue Noms en utilisant le
bouton correspondant de la barre d'information de l'outil Sélection ou en passant par Services >
Noms...
.
Saisissez le nouveau nom dans le champ « Utiliser le nom » ou utilisez la liste déroulante de ce même
champ afin de sélectionner un nom déjà utilisé ailleurs dans le document en cours. Cliquez sur Ajouter.
Le nom apparaît désormais dans la liste « Noms utilisés
».
Noms utilisés
Le champ « Noms utilisés
» affiche les noms appliqués à la sélection actuelle. Si plus d'un objet est sélectionné, la liste de noms
Page 306
n'apparaît que si tous les objets de la sélection ont exactement le même jeu de noms appliqués.
Autrement « <Trop nombreux> » est affiché, ce qui indique qu'il existe des différences en termes de
noms appliqués à différents objets dans la sélection.
Pour supprimer un nom des objets sélectionnés, cliquez sur le nom dans la liste « Noms appliqués » afin
de le sélectionner, puis cliquez sur le bouton Supprimer
.
Page 307
Ajouter des noms
Pour ajouter un nom à un objet, sélectionnez l'objet et ouvrez la boîte de dialogue Noms en utilisant le
bouton correspondant de la barre d'information de l'outil Sélection ou en passant par Services >
Noms...
.
Saisissez le nouveau nom dans le champ « Utiliser le nom » ou utilisez la liste déroulante de ce même
champ afin de sélectionner un nom déjà utilisé ailleurs dans le document en cours. Cliquez sur Ajouter.
Le nom apparaît désormais dans la liste « Noms utilisés
».
Noms utilisés
Le champ « Noms utilisés
» affiche les noms appliqués à la sélection actuelle. Si plus d'un objet est sélectionné, la liste de noms
n'apparaît que si tous les objets de la sélection ont exactement le même jeu de noms appliqués.
Autrement « <Trop nombreux> » est affiché, ce qui indique qu'il existe des différences en termes de
noms appliqués à différents objets dans la sélection.
Pour supprimer un nom des objets sélectionnés, cliquez sur le nom dans la liste « Noms appliqués » afin
de le sélectionner, puis cliquez sur le bouton Supprimer
.
Page 308
Noms utilisés
Le champ « Noms utilisés
» affiche les noms appliqués à la sélection actuelle. Si plus d'un objet est sélectionné, la liste de noms
n'apparaît que si tous les objets de la sélection ont exactement le même jeu de noms appliqués.
Autrement « <Trop nombreux> » est affiché, ce qui indique qu'il existe des différences en termes de
noms appliqués à différents objets dans la sélection.
Pour supprimer un nom des objets sélectionnés, cliquez sur le nom dans la liste « Noms appliqués » afin
de le sélectionner, puis cliquez sur le bouton Supprimer
.
Page 309
Répéter les objets
Il est courant de trouver des éléments tels que des boutons de navigation, en-têtes ou logos répétés sur
toutes les pages de votre site Internet. Web Designer vous permet de répéter tout élément au même
emplacement sur toute page souhaitée de vos pages web. Lorsque vous mettez à jour l'une des copies,
vous pouvez dupliquer rapidement ces changements sur toutes les pages.
Sur la plupart des modèles de designs, les principaux boutons de navigation se répètent. Lors du
changement de tout bouton, tel que le texte ou l'adresse Internet, vous pouvez sélectionner l'élément de
menu Arranger -> Mise à jour des objets répétés, et les boutons de toutes les pages seront mis à jour.
Remarque : la page en cours est utilisée en tant que source des éléments répétés en vue de la mise à jour
de toutes les autres pages. Assurez-vous donc de vous trouver sur la bonne page avant de choisir ce
menu. La page en cours est celle sur laquelle vous travaillez et se distingue par les marqueurs qui
apparaissent aux coins de la page. Cliquez n'importe où sur la page (même à l'extérieur) pour l'activer.
Il est facile de créer vos propres éléments répétés, sélectionnez tout simplement un objet et choisissez
Arranger -> Répéter sur toutes les pages
L'objet sera copié au même emplacement sur toutes les pages. Pour effectuer d'autres changements sur
cet élément, sélectionnez Arranger -> Mise à jour des objets répétés
à nouveau pour mettre à jour toutes les copies.
Si vous souhaitez exclure une copie sur une page, il suffit de supprimer le changement sur cette page.
Toute autre Mise à jour des objets répétés
ne s'appliquera qu'aux éléments existants déjà sur la page.
Pieds de page
Si vous souhaitez faire apparaître un pied de page normal au bas de chaque page, vous pouvez utiliser
ce système de répétition d'objets. Sélectionnez l'élément (il peut s'agir d'un élément individuel, de groupes
ou d'éléments multiples) et utilisez l'option Répéter sur toutes les pages
. Cela est utile pour le positionnement car les éléments du bas de la page apparaîtront alors à la bonne
position, indépendamment de la longueur de la page.
Utilisation avancée des objets répétés
Vous pouvez également faire de tout élément un élément répété en lui attribuant une « répétition
spéciale » : nom.

Sélectionnez l'objet et cliquez sur le bouton « Utiliser le nom »
à la droite de la barre d'information de l'Outil de sélection.
 Attribuez-lui un nom
débutant par
« Répéter : ». Il doit
être suivi par un nom
unique pour cet
élément.
 Cliquez sur le bouton
Ajouter pour appliquer
le nom.
Si vous souhaitez mettre à jour
cet objet sur plusieurs pages,
copiez-le d'abord
manuellement sur toutes les
pages où il doit apparaître. Ou
utilisez le menu Arranger ->
Répéter sur toutes les
Page 310
pages
.
Désormais, lorsque vous éditez ou effectuez d'autres changements sur cet élément et que vous
sélectionnez Arranger -> Mise à jour des objets répétés
, toutes les copies seront mises à jour.
Remarque : cette fonctionnalité met à jour tous les objets répétés à partir de la page en cours sur toutes
les autres pages contenant les mêmes éléments répétés. Seules les pages contenant l'élément répété
seront mises à jour (elle ne crée pas l'élément sur des pages vides)
Il est important de comprendre que ces éléments répétés ne seront pas mis à jour automatiquement mais
uniquement si vous sélectionnez le menu : Arranger -> Mise à jour des objets répétés.
Note technique : cette fonctionnalité fonctionne par l'identification des éléments avec le nom de
« répétition », puis en les remplaçant par les éléments correspondants depuis la page source (la page
sélectionnée).
La page sélectionnée est celle sur laquelle vous travaillez et se distingue
par les éléments qui apparaissent à ses coins.
Si vous utilisez l'option Répéter sur toutes les pages
, un nom Repeating:AutoRepeat approprié est créé automatiquement et s'applique à toutes les copies. A
partir de là, il sera mis à jour à chaque fois que vous sélectionnerez « Mise à jour des objets répétés ».
Vous pouvez appliquer un nom de répétition à n'importe quelle sélection, par exemple un groupe de
boutons, en sélectionnant tous les boutons et en appliquant le nom à toute la sélection à la fois. Attention
cependant, si vous souhaitez traiter séparément différents objets à différents emplacements de la page,
par exemple les en-têtes et les pieds de page, chacun doit avoir un nom de répétition différent,
« Repeating:footer » ´par exemple.
En-têtes et pieds de page
Votre site comporte éventuellement des pages de longueur différente et vous souhaitez peut-être
positionner certains objets répétés en haut de chaque page et d'autres (par ex. pieds de page) en bas de
chaque page. Cette possibilité est traitée automatiquement par Xtreme Web Designer 5.
La position d'un objet répété sur la page détermine s'il est considéré comme un en-tête ou un pied de
page. Les objets répétés en haut de page sont déplacés à la même position en haut de chaque page. Les
autres objets répétés (ceux qui ne couvrent pas une partie spécifique de la moitié supérieure de la page)
sont déplacés à la même position en bas de chaque page.
Page 311
L'outil d'édition des formes
L'Outil d'édition des formes
est l'outil principal utilisé pour à la fois créer des courbes, lignes et
formes précises, ainsi que pour éditer ou modifier des lignes et
formes.
La barre d'info, présentée plus haut, propose un large choix de commandes ainsi que des fonctions de
contrôle numérique précises.
Toutes les lignes et formes de Xtreme Web Designer 5 sont composées d'une séquence de sections de
courbes et de lignes. Les courbes sont parfois appelées courbes « Bézier », d'après le mathématicien qui
les a décrit en premier.
Les sections ou segments d'une ligne sont marqués par des petits points d'ancrage noirs. Vous pouvez
tirer, ajouter ou supprimer ces poignées pour manipuler la forme d'une ligne ou d'un contour.
Dessiner un segment de ligne droite
Dessiner une ligne droite dans l'outil d'édition des formes
:
1. Cliquez sur l'emplacement où vous souhaitez commencer la ligne. (vous pouvez commencer une
ligne n'importe où ; il n'est pas nécessaire de travailler de la gauche vers la droite ou du bas vers
le haut). Il sera alors affiché un carré rouge indiquant la poignée sélectionnée.
2. Sélectionnez la fonction Tracer une ligne sur la barre d'infos. (Raccourci clavier : L) Cela vous
assure qu'au prochain clic, une ligne droite sera tracée.
Cliquez à l'emplacement de la prochaine poignée ou tracez la ligne par glisser-déposer. Cette opération
créée un segment de ligne droite et sélectionne la nouvelle poignée de fin.
Page 312
Mélanger les courbes et lignes droites
Pour créer un objet mélangeant les segments de lignes droites et de courbes, alternez entre les boutons
de Tracer une courbe et Tracer une ligne
lorsque vous créez l'objet. (ou cliquez sur L ou C).
Dessiner un segment de courbe :
Le procédé est similaire à celui du tracé de ligne
droite (décrit plus haut).
1. Cliquez sur l'emplacement où vous souhaitez démarrer la ligne.
2. Si nécessaire, sélectionnez le bouton Tracer une courbe. (Raccourci clavier : C)
3. Cliquez à nouveau avec le bouton de souris ou placez la souris à l'emplacement souhaité pour
créer un deuxième point d'ancrage (comme explique pour les lignes droites). Un segment de
courbe va alors être ajouté à la ligne.
Une segment courbe dispose de poignées de courbe
associées aux points d'ancrage sélectionnés. Vous pouvez les déplacer pour ajuster l'angle et le radius
de la courbe.
Page 313
Dessiner un segment de ligne droite
Dessiner une ligne droite dans l'outil d'édition des formes
:
1. Cliquez sur l'emplacement où vous souhaitez commencer la ligne. (vous pouvez commencer une
ligne n'importe où ; il n'est pas nécessaire de travailler de la gauche vers la droite ou du bas vers
le haut). Il sera alors affiché un carré rouge indiquant la poignée sélectionnée.
2. Sélectionnez la fonction Tracer une ligne sur la barre d'infos. (Raccourci clavier : L) Cela vous
assure qu'au prochain clic, une ligne droite sera tracée.
Cliquez à l'emplacement de la prochaine poignée ou tracez la ligne par glisser-déposer. Cette opération
créée un segment de ligne droite et sélectionne la nouvelle poignée de fin.
Mélanger les courbes et lignes droites
Pour créer un objet mélangeant les segments de lignes droites et de courbes, alternez entre les boutons
de Tracer une courbe et Tracer une ligne
lorsque vous créez l'objet. (ou cliquez sur L ou C).
Dessiner un segment de courbe :
Le procédé est similaire à celui du tracé de ligne
droite (décrit plus haut).
1. Cliquez sur l'emplacement où vous souhaitez démarrer la ligne.
2. Si nécessaire, sélectionnez le bouton Tracer une courbe. (Raccourci clavier : C)
3. Cliquez à nouveau avec le bouton de souris ou placez la souris à l'emplacement souhaité pour
créer un deuxième point d'ancrage (comme explique pour les lignes droites). Un segment de
courbe va alors être ajouté à la ligne.
Une segment courbe dispose de poignées de courbe
associées aux points d'ancrage sélectionnés. Vous pouvez les déplacer pour ajuster l'angle et le radius
de la courbe.
Page 314
Mélanger les courbes et lignes droites
Pour créer un objet mélangeant les segments de lignes droites et de courbes, alternez entre les boutons
de Tracer une courbe et Tracer une ligne
lorsque vous créez l'objet. (ou cliquez sur L ou C).
Dessiner un segment de courbe :
Le procédé est similaire à celui du tracé de ligne
droite (décrit plus haut).
1. Cliquez sur l'emplacement où vous souhaitez démarrer la ligne.
2. Si nécessaire, sélectionnez le bouton Tracer une courbe. (Raccourci clavier : C)
3. Cliquez à nouveau avec le bouton de souris ou placez la souris à l'emplacement souhaité pour
créer un deuxième point d'ancrage (comme explique pour les lignes droites). Un segment de
courbe va alors être ajouté à la ligne.
Une segment courbe dispose de poignées de courbe
associées aux points d'ancrage sélectionnés. Vous pouvez les déplacer pour ajuster l'angle et le radius
de la courbe.
Page 315
Dessiner un segment de courbe :
Le procédé est similaire à celui du tracé de ligne
droite (décrit plus haut).
1. Cliquez sur l'emplacement où vous souhaitez démarrer la ligne.
2. Si nécessaire, sélectionnez le bouton Tracer une courbe. (Raccourci clavier : C)
3. Cliquez à nouveau avec le bouton de souris ou placez la souris à l'emplacement souhaité pour
créer un deuxième point d'ancrage (comme explique pour les lignes droites). Un segment de
courbe va alors être ajouté à la ligne.
Une segment courbe dispose de poignées de courbe
associées aux points d'ancrage sélectionnés. Vous pouvez les déplacer pour ajuster l'angle et le radius
de la courbe.
Page 316
Allonger la ligne
Assurez-vous que la poignée de fin est sélectionnée (contour rouge) puis cliquez à nouveau pour ajouter
une nouvelle section de ligne ou courbe. Chaque clic successif place une nouvelle poignée et dessine un
nouveau segment de ligne depuis la poignée sélectionnée.
Page 317
Terminer la ligne
shift+ clic complète la ligne (la maintient sélectionnée) ou appuyez sur « Esc » pour terminer la ligne et la
désélectionner. Au prochain clic, une nouvelle ligne sera créée.
Page 318
Ajouter une nouvelle poignée
L'outil d'édition de formes
possède trois modes, dépendant de la sélection opérée : aucune poignée sélectionnée (chaque clic va
créer une nouvelle ligne), une poignée de fin (une nouvelle zone sera créée à chaque clic), ou une ou
plusieurs poignées sont sélectionnées (possibilité de déplacer ou modifier les points d'ancrage).
La barre d'infos indique le mode
actuel.
 Nouveau— cliquez pour démarrer une nouvelle ligne,
 Ajouter— cliquez pour allonger la ligne,
 Modifier— tirer ou supprimer les poignées pour opérer une modification.
S'applique uniquement à l'outil d'édition des formes.
À la fin de la ligne :
Assurez-vous que la ligne est sélectionnée, puis ;
1. si nécessaire, cliquez sur le point de fin pour le sélectionner.
2. Positionnez le pointeur et cliquez pour ajouter une nouvelle section.
Au centre d'une ligne :
Assurez-vous que la ligne est sélectionnée, puis ;
1. Cliquez sur la ligne pour ajouter une nouvelle poignée dans la ligne
2. Tirez la poignée à la position souhaitée.
Au début d'une ligne :
Si le point de fin est sélectionné, cliquez sur le point de début pour fermer la forme (procédure décrite
dans « Fermer une forme »). Pour ajouter une nouvelle poignée de contrôle au début d'une ligne :
1. Terminez la ligne en utilisant shift+ clic.
2. Cliquez sur la poignée de début.
3. Positionnez le curseur et cliquez.
Page 319
À la fin de la ligne :
Assurez-vous que la ligne est sélectionnée, puis ;
1. si nécessaire, cliquez sur le point de fin pour le sélectionner.
2. Positionnez le pointeur et cliquez pour ajouter une nouvelle section.
Au centre d'une ligne :
Assurez-vous que la ligne est sélectionnée, puis ;
1. Cliquez sur la ligne pour ajouter une nouvelle poignée dans la ligne
2. Tirez la poignée à la position souhaitée.
Au début d'une ligne :
Si le point de fin est sélectionné, cliquez sur le point de début pour fermer la forme (procédure décrite
dans « Fermer une forme »). Pour ajouter une nouvelle poignée de contrôle au début d'une ligne :
1. Terminez la ligne en utilisant shift+ clic.
2. Cliquez sur la poignée de début.
3. Positionnez le curseur et cliquez.
Page 320
Au centre d'une ligne :
Assurez-vous que la ligne est sélectionnée, puis ;
1. Cliquez sur la ligne pour ajouter une nouvelle poignée dans la ligne
2. Tirez la poignée à la position souhaitée.
Au début d'une ligne :
Si le point de fin est sélectionné, cliquez sur le point de début pour fermer la forme (procédure décrite
dans « Fermer une forme »). Pour ajouter une nouvelle poignée de contrôle au début d'une ligne :
1. Terminez la ligne en utilisant shift+ clic.
2. Cliquez sur la poignée de début.
3. Positionnez le curseur et cliquez.
Page 321
Au début d'une ligne :
Si le point de fin est sélectionné, cliquez sur le point de début pour fermer la forme (procédure décrite
dans « Fermer une forme »). Pour ajouter une nouvelle poignée de contrôle au début d'une ligne :
1. Terminez la ligne en utilisant shift+ clic.
2. Cliquez sur la poignée de début.
3. Positionnez le curseur et cliquez.
Page 322
Sélectionner plusieurs poignées
Vous pouvez sélectionner plusieurs points d'ancrage pour, par exemple, les supprimer, les déplacer en
groupe ou modifier une courbe en ligne droite ou inversement. Pour ce faire :
1. Sélectionnez un point d'ancrage de manière traditionnelle en cliquant dessus.
2. Utilisez la combinaison (Maj + clic pour sélectionner les autres points. (Maj + clic permet
également de désélectionner)
o Ou la combinaison (Maj + Ctrl + clic sur un point d'ancrage pour sélectionner tous les points
se trouvant sur la ligne.
o Vous pouvez également déplacer le pointeur de la souris en diagonale pour créer une
sélection rectangulaire. Tous les points se trouvant dans le rectangle seront sélectionnés.
o Vous pouvez utiliser (Maj + tirer pour créer un rectangle de sélection avec la souris. Tous les
points se trouvant dans le rectangle seront automatiquement ajoutés à la sélection.
3. Si un ou plusieurs points d'une même ligne sont sélectionnés :
o La fonction « Fin » déplace la sélection à la fin de la ligne.
o La fonction « Orig » déplace la sélection vers le début de la ligne.
o La touche de tabulation déplace la sélection vers le prochain point de la ligne.Maj + Tab
permet de déplacer la sélection vers le prochain point situé sur la ligne en direction du début
de la ligne.
Les points de début et de fin sont très importants lorsque vous utilisez les touches flèchées.
Page 323
Supprimer des points
Sélectionnez le ou les points d'ancrage comme décrit plus haut puis cliquez sur Supprimer points
(Barre d'infos Édition des formes
) ou utilisez la touche Suppr.
Page 324
Déplacer les points d'ancrage - Outil d'édition
des formes
Vous pouvez déplacer une ou plusieurs poignées :
 Déplacez les poignées en les tirant à l'aide de la souris.
 Vous pouvez utiliser les touches fléchées sur le clavier.
Pour déplacer une seule poignée, veuillez entrer les nouvelles valeurs dans le champ de texte de la barre
d'infos (voir plus bas).
Utilisation du champ de texte de la barre d'infos
Les deux champs centraux indiquent la position du point sélectionné à l'aide de ses coordonnées X-Y.
Le champ X-Y proche indique les coordonnées des poignées de courbe situées à l'extrémité du point
sélectionné.
Les coordonnées X-Y sont calculées par rapport au coin inférieur gauche de la page. Vous pouvez
modifier cette règle dans la boîte de dialogue des options sous l'onglet Grille et règles
.
Si le point sélectionné se trouve à l'extrémité d'une section de ligne droite, les champs situés à gauche
indiquent la longueur et l'angle de la ligne. Vous pouvez procéder à un ajustement en entrant une nouvelle
valeur et cliquant sur la touche Entrée.
Page 325
Utilisation du champ de texte de la barre d'infos
Les deux champs centraux indiquent la position du point sélectionné à l'aide de ses coordonnées X-Y.
Le champ X-Y proche indique les coordonnées des poignées de courbe situées à l'extrémité du point
sélectionné.
Les coordonnées X-Y sont calculées par rapport au coin inférieur gauche de la page. Vous pouvez
modifier cette règle dans la boîte de dialogue des options sous l'onglet Grille et règles
.
Si le point sélectionné se trouve à l'extrémité d'une section de ligne droite, les champs situés à gauche
indiquent la longueur et l'angle de la ligne. Vous pouvez procéder à un ajustement en entrant une nouvelle
valeur et cliquant sur la touche Entrée.
Page 326
Lissage de ligne
Uniquement l'outil d'édition des formes
Les formes importées ou issues du traceur bitmap (dessin automatique de fichiers images) sont
éventuellement des points inutiles sur une ligne. Les lignes comprenant de trop nombreux points sont peu
maniables et peuvent réduire la vitesse du rendu. Xtreme Web Designer 5 peut lisser la ligne afin
d'éliminer les points inutiles.
Sélectionnez tous les points sur la partie de la ligne que vous souhaitez lisser. (Voir plus haut). La
sélection d'une zone à l'aide de l'outil d'édition des formes
est probablement la méthode la plus simple pour sélectionner de nombreux points simultanément.
Tirez la réglette de lissage jusqu'à la
fin de la barre d'infos d'édition des
formes
.
Le programme sauvegarde les points supprimés afin de pouvoir lisser à nouveau la ligne ultérieurement en
déplaçant la réglette. Les points supprimés sont effacés lorsque vous éditez à nouveau la ligne, par
exemple en tirant sur les poignées.
Astuce : pour vous assurer que des points importants ne sont pas supprimés, vérifiez qu'ils ne sont pas
sélectionnés. (Maj + clic sur le point sélectionné permet de désélectionner.)
Page 327
Limitation de la ligne
Lorsque vous tirez une poignée tout en appuyant sur la touche Ctrl, le mouvement sera limité à des
multiples de l'angle de limitation (contrôlé depuis la boîte de dialogue des Options, Général
). Lorsque vous tirez des poignées d'une courbe, l'angle est déterminant.
Page 328
Modifier les courbes
Utilisation des poignées de courbe
En tirant les poignées de courbe vous ajustez la courbure des segments de courbe accolés.
Déplacez la poignée de courbe en
direction du point d'ancrage ou au
contraire éloignez-la pour tirer la courbe
dans la direction souhaitée.
Déplacement d'un segment de ligne
Vous pouvez également ajuster la courbe en tirant le segment de ligne entre deux points.
Notez qu'il existe une différence entre tirer une ligne pour modifier sa forme, et cliquer sur la ligne pour
ajouter une nouvelle poignée. Lorsque vous tirez sur une ligne droite, elle se transforme en courbe.
Angles précis
Normalement, Xtreme Web Designer 5 dessine une courbe lisse à travers une poignée. Pour cela, les
deux poignées de courbe sont reliées à la fin des points d'ancrage. Si vous déplacez une poignée de
courbe, l'autre le sera automatiquement aussi.
Parfois, vous souhaitez obtenir une angle précis. Pour cela, vous devez séparer les poignées de courbe :
1. Double-cliquez sur le point d'ancrage.
2. Vous pouvez également sélectionner le point d'ancrage et :
Cliquez sur Liaison en pointe
ou cliquez sur la touche Z.
Vous pouvez maintenant déplacer chaque poignée de courbe indépendamment.
Création de courbes lisses
Pour convertir une liaison pointue en courbe lisse :
1. Double-cliquez sur le point d'ancrage.
2. Vous pouvez également sélectionner le point d'ancrage et :
Cliquez sur connexion lisse
ou cliquez sur la touche S.
Les deux poignées de courbe sont alors reliées et se déplacent en sens opposé du point d'ancrage. Cela
peut modifier la forme de la courbe.
Page 329
Utilisation des poignées de courbe
En tirant les poignées de courbe vous ajustez la courbure des segments de courbe accolés.
Déplacez la poignée de courbe en
direction du point d'ancrage ou au
contraire éloignez-la pour tirer la courbe
dans la direction souhaitée.
Déplacement d'un segment de ligne
Vous pouvez également ajuster la courbe en tirant le segment de ligne entre deux points.
Notez qu'il existe une différence entre tirer une ligne pour modifier sa forme, et cliquer sur la ligne pour
ajouter une nouvelle poignée. Lorsque vous tirez sur une ligne droite, elle se transforme en courbe.
Angles précis
Normalement, Xtreme Web Designer 5 dessine une courbe lisse à travers une poignée. Pour cela, les
deux poignées de courbe sont reliées à la fin des points d'ancrage. Si vous déplacez une poignée de
courbe, l'autre le sera automatiquement aussi.
Parfois, vous souhaitez obtenir une angle précis. Pour cela, vous devez séparer les poignées de courbe :
1. Double-cliquez sur le point d'ancrage.
2. Vous pouvez également sélectionner le point d'ancrage et :
Cliquez sur Liaison en pointe
ou cliquez sur la touche Z.
Vous pouvez maintenant déplacer chaque poignée de courbe indépendamment.
Création de courbes lisses
Pour convertir une liaison pointue en courbe lisse :
1. Double-cliquez sur le point d'ancrage.
2. Vous pouvez également sélectionner le point d'ancrage et :
Cliquez sur connexion lisse
ou cliquez sur la touche S.
Les deux poignées de courbe sont alors reliées et se déplacent en sens opposé du point d'ancrage. Cela
peut modifier la forme de la courbe.
Page 330
Déplacement d'un segment de ligne
Vous pouvez également ajuster la courbe en tirant le segment de ligne entre deux points.
Notez qu'il existe une différence entre tirer une ligne pour modifier sa forme, et cliquer sur la ligne pour
ajouter une nouvelle poignée. Lorsque vous tirez sur une ligne droite, elle se transforme en courbe.
Angles précis
Normalement, Xtreme Web Designer 5 dessine une courbe lisse à travers une poignée. Pour cela, les
deux poignées de courbe sont reliées à la fin des points d'ancrage. Si vous déplacez une poignée de
courbe, l'autre le sera automatiquement aussi.
Parfois, vous souhaitez obtenir une angle précis. Pour cela, vous devez séparer les poignées de courbe :
1. Double-cliquez sur le point d'ancrage.
2. Vous pouvez également sélectionner le point d'ancrage et :
Cliquez sur Liaison en pointe
ou cliquez sur la touche Z.
Vous pouvez maintenant déplacer chaque poignée de courbe indépendamment.
Création de courbes lisses
Pour convertir une liaison pointue en courbe lisse :
1. Double-cliquez sur le point d'ancrage.
2. Vous pouvez également sélectionner le point d'ancrage et :
Cliquez sur connexion lisse
ou cliquez sur la touche S.
Les deux poignées de courbe sont alors reliées et se déplacent en sens opposé du point d'ancrage. Cela
peut modifier la forme de la courbe.
Page 331
Angles précis
Normalement, Xtreme Web Designer 5 dessine une courbe lisse à travers une poignée. Pour cela, les
deux poignées de courbe sont reliées à la fin des points d'ancrage. Si vous déplacez une poignée de
courbe, l'autre le sera automatiquement aussi.
Parfois, vous souhaitez obtenir une angle précis. Pour cela, vous devez séparer les poignées de courbe :
1. Double-cliquez sur le point d'ancrage.
2. Vous pouvez également sélectionner le point d'ancrage et :
Cliquez sur Liaison en pointe
ou cliquez sur la touche Z.
Vous pouvez maintenant déplacer chaque poignée de courbe indépendamment.
Création de courbes lisses
Pour convertir une liaison pointue en courbe lisse :
1. Double-cliquez sur le point d'ancrage.
2. Vous pouvez également sélectionner le point d'ancrage et :
Cliquez sur connexion lisse
ou cliquez sur la touche S.
Les deux poignées de courbe sont alors reliées et se déplacent en sens opposé du point d'ancrage. Cela
peut modifier la forme de la courbe.
Page 332
Création de courbes lisses
Pour convertir une liaison pointue en courbe lisse :
1. Double-cliquez sur le point d'ancrage.
2. Vous pouvez également sélectionner le point d'ancrage et :
Cliquez sur connexion lisse
ou cliquez sur la touche S.
Les deux poignées de courbe sont alors reliées et se déplacent en sens opposé du point d'ancrage. Cela
peut modifier la forme de la courbe.
Page 333
Transformation d'une ligne droite en courbe
1. Sélectionnez les poignées à chaque extrémité du segment de la ligne. Vous pouvez sélectionner
plusieurs segments de ligne en sélectionnant simplement toutes les poignées.
2. Cliquez sur Tracer une ligne ou Tracer une courbe dans la barre d'infos ou cliquez sur les
touches L ou C du clavier. (ces raccourcis fonctionnent uniquement dans l'outil d'édition de
formes.)
Après avoir modifié le type de la ligne, vous aurez éventuellement à déplacer les poignées de courbe
pour obtenir une transition lisse entre les segments de ligne droite et de courbe.
Vous pouvez sélectionner plusieurs segments de ligne et les convertir. Les points d'ancrage à chaque
extrémité du segment doivent être sélectionnés.
Page 334
Connexion de lignes
Vous pouvez connecter des lignes uniquement si les deux sont sélectionnées (les points d'ancrage
doivent être activés sur les deux lignes) :
En utilisant l'Outil de sélection, en maintenant enfoncé « shift » et en cliquant sur les lignes pour les
sélectionner (si vous êtes déjà dans l'Outil d'édition des formes, vous pouvez appuyer sur « Alt + S »
pour passer temporairement sur l'Outil de sélection, « shift+ clic » pour sélectionner la seconde ligne,
puis « Alt + S » à nouveau pour retourner à l'Outil d'édition des formes
).
Le mode de sélection des objets est décrit en détail dans le chapitre « Sélection d'objets
».
Lorsque les deux objets sont sélectionnés, dans l'Outil d'édition des formes, tirez la poignée de fin de
l'une des lignes sur la fin de l'autre ligne. Lorsque vous tirez, le pointeur de la souris affiche un symbole +
pour indiquer que les lignes vont être reliées.
Si les extrémités des deux lignes sont déjà très proches, mais pas connectées, vous pouvez faire un zoom
avant, ou éloigner les points d'ancrage de fin pour les rapprocher ensuite. Un symbole + indique
lorsqu'une connexion va être réalisée.
Pour créer une forme remplie, tirez les deux autres poignées externes pour les relier. Comme vous
connectez des poignées de fin, vous pouvez uniquement connecter des lignes et non des formes. Les
formes sont des objets fermés et ne possèdent donc pas de poignées de fin.
Page 335
Segmentation d'une forme
Si vous souhaitez segmenter une ligne ou une forme, vous pouvez sélectionner une poignée existante sur
la ligne ou le contour de la forme, ou créer une nouvelle poignée à l'emplacement où vous souhaitez
casser la ligne (cliquez sur la ligne dans l'outil d'édition des formes
- voir plus haut).
Cliquez sur Séparer au niveau des points
ou cliquez sur la touche B.
Après segmentation d'une ligne, rien n'est visible dans un premier temps. Cependant, si vous déplacez la
poignée, seule une partie de ligne bouge. Si vous segmentez une forme, elle sera transformée en ligne.
Tout remplissage disparaît.
Remarque : la segmentation d'une forme (dans Arranger > Combiner des formes) vous permet aussi de
segmenter des formes en deux formes distinctes. Ceci est décrit dans le chapitre Manipulation des formes
.
Page 336
Fermer une forme
Une forme est un objet fermé qui ne possède pas de poignée de début ou de fin. Seules les formes
peuvent être remplies avec de la couleur.
Pour fermer une forme :
1. Créez un objet ouvert dont la poignée de
fin se trouve très près de la poignée de
début. Tous les points d'ancrage, excepté
la poignée de fin, devraient se trouver dans
la position requise.
2. Placez le pointeur de la souris sur la
poignée de fin.
3. Tirez la poignée de fin sur la poignée de
début puis relâchez le bouton de la souris.
Les deux poignées sont alors
automatiquement reliées.
Ou :
1. Créez un objet ouvert dont toutes les
poignées de contrôle se trouvent dans la
position correcte. Ne créez pas le
segment de ligne final.
2. Déplacez le pointeur sur le point de
départ. Un signe « + » apparaît sur la
droite du pointeur lorsqu'il se trouve sur la
poignée de début.
3. Cliquez pour créer le segment de ligne
final et fermer la forme.
Ou :
1. Sélectionnez l'Outil d'édition des formes.
2. Cliquez sur un point de fin pour le sélectionner.
3. Cliquez sur la touche « ¿ ».
Toutes ces manipulations permettent de fermer une forme. Si une couleur de remplissage est sélectionnée
actuellement, la forme sera remplie automatiquement avec cette couleur.
Page 337
Manipulation des formes
Dans ce chapitre
Combiner les formes
Modification de la largeur de la ligne (épaisseur)
Galerie de lignes
Création de rectangles et carrés
Création de cercles et ellipses
Page 338
Combiner les formes
L'option de menu Arranger > Combiner les formes
met à votre disposition de nombreuses options avancées pour combiner des formes, et ainsi créer de
nouvelles formes en additionnant, coupant ou segmentant. Vous pouvez utiliser cette fonction sur tout
type d'objet, y compris des bitmaps.
Créer des trous dans les formes
Utilisez Arranger > Combiner les formes > Soustraire des formes. Cette fonction est similaire à
Relier les formes
(décrit plus haut). Les différences sont :
 La forme du dessus (ou le groupe du dessus) forme un trou à travers les autres formes.
 Les attributs et couleurs des contours des formes du dessous demeurent inchangées.
 La fonction Combiner les formes modifie les lignes physiquement. Les formes originales ne
peuvent être restaurées qu'à l'aide de la fonction Annuler.
 Le nombre de formes superposées n'a aucune incidence.
Fusionner plusieurs formes en une
Par exemple, pour produire la forme sur la droite, à partir des trois formes situées sur la gauche :
1. Créez deux cercles et un rectangle.
2. Sélectionnez les trois formes.
3. Sélectionnez Arranger > Combiner les formes > Ajouter des formes
La nouvelle forme applique les attributs et couleurs de contours de la forme du dessus (le rectangle dans
l'illustration).
Croisement de formes
Avec la fonction Croiser des formes
, le nouvel objet est créé à partir des parties des formes du dessous qui sont couvertes par l'objet du
dessus.
Sélectionnez les formes que vous
souhaitez masquer et la forme de
premier-plan (le masque).
Page 339
Sélectionnez Arranger > Combiner
les formes > Croiser les formes
. Une nouvelle forme est créée. La
forme de premier-plan disparaît.
Les attributs et couleurs des contours des formes du dessous demeurent inchangées. Les sections non
couvertes par la forme de premier-plan sont effacées. La forme de premier-plan peut être formée par un
groupe pour obtenir des soustractions plus complexes. (Les groupes sont décrits dans le chapitre
Manipulation des objets
.)
Segmentation des formes
Xtreme Web Designer 5 permet de segmenter facilement des formes en deux pièces ou plus. Vous
pouvez utiliser un objet solide ou une ligne pour segmenter. Pour, par exemple, couper un segment dans
un cercle :
1. Créez un cercle et un
triangle au dessus.
2. Sélectionnez les deux.
3. Sélectionnez Arranger >
Combiner les formes
>Segmenter les formes.
Les bords du triangle
coupent le cercle en deux
formes. Le triangle
disparaît.
4. Vous pouvez maintenant
tirer le segment hors du
cercle :
Vous pouvez également utiliser une ligne pour couper un objet :
La ligne doit traverser l'objet de part en part et dépasser également de ses contours. (Comme montré
dans l'illustration). Si la ligne est trop courte, l'opération coupe un segment très fin.
Page 340
Créer des trous dans les formes
Utilisez Arranger > Combiner les formes > Soustraire des formes. Cette fonction est similaire à
Relier les formes
(décrit plus haut). Les différences sont :
 La forme du dessus (ou le groupe du dessus) forme un trou à travers les autres formes.
 Les attributs et couleurs des contours des formes du dessous demeurent inchangées.
 La fonction Combiner les formes modifie les lignes physiquement. Les formes originales ne
peuvent être restaurées qu'à l'aide de la fonction Annuler.
 Le nombre de formes superposées n'a aucune incidence.
Fusionner plusieurs formes en une
Par exemple, pour produire la forme sur la droite, à partir des trois formes situées sur la gauche :
1. Créez deux cercles et un rectangle.
2. Sélectionnez les trois formes.
3. Sélectionnez Arranger > Combiner les formes > Ajouter des formes
La nouvelle forme applique les attributs et couleurs de contours de la forme du dessus (le rectangle dans
l'illustration).
Croisement de formes
Avec la fonction Croiser des formes
, le nouvel objet est créé à partir des parties des formes du dessous qui sont couvertes par l'objet du
dessus.
Sélectionnez les formes que vous
souhaitez masquer et la forme de
premier-plan (le masque).
Sélectionnez Arranger > Combiner
les formes > Croiser les formes
. Une nouvelle forme est créée. La
forme de premier-plan disparaît.
Les attributs et couleurs des contours des formes du dessous demeurent inchangées. Les sections non
couvertes par la forme de premier-plan sont effacées. La forme de premier-plan peut être formée par un
groupe pour obtenir des soustractions plus complexes. (Les groupes sont décrits dans le chapitre
Page 341
Manipulation des objets
.)
Segmentation des formes
Xtreme Web Designer 5 permet de segmenter facilement des formes en deux pièces ou plus. Vous
pouvez utiliser un objet solide ou une ligne pour segmenter. Pour, par exemple, couper un segment dans
un cercle :
1. Créez un cercle et un
triangle au dessus.
2. Sélectionnez les deux.
3. Sélectionnez Arranger >
Combiner les formes
>Segmenter les formes.
Les bords du triangle
coupent le cercle en deux
formes. Le triangle
disparaît.
4. Vous pouvez maintenant
tirer le segment hors du
cercle :
Vous pouvez également utiliser une ligne pour couper un objet :
La ligne doit traverser l'objet de part en part et dépasser également de ses contours. (Comme montré
dans l'illustration). Si la ligne est trop courte, l'opération coupe un segment très fin.
Page 342
Fusionner plusieurs formes en une
Par exemple, pour produire la forme sur la droite, à partir des trois formes situées sur la gauche :
1. Créez deux cercles et un rectangle.
2. Sélectionnez les trois formes.
3. Sélectionnez Arranger > Combiner les formes > Ajouter des formes
La nouvelle forme applique les attributs et couleurs de contours de la forme du dessus (le rectangle dans
l'illustration).
Croisement de formes
Avec la fonction Croiser des formes
, le nouvel objet est créé à partir des parties des formes du dessous qui sont couvertes par l'objet du
dessus.
Sélectionnez les formes que vous
souhaitez masquer et la forme de
premier-plan (le masque).
Sélectionnez Arranger > Combiner
les formes > Croiser les formes
. Une nouvelle forme est créée. La
forme de premier-plan disparaît.
Les attributs et couleurs des contours des formes du dessous demeurent inchangées. Les sections non
couvertes par la forme de premier-plan sont effacées. La forme de premier-plan peut être formée par un
groupe pour obtenir des soustractions plus complexes. (Les groupes sont décrits dans le chapitre
Manipulation des objets
.)
Segmentation des formes
Xtreme Web Designer 5 permet de segmenter facilement des formes en deux pièces ou plus. Vous
pouvez utiliser un objet solide ou une ligne pour segmenter. Pour, par exemple, couper un segment dans
un cercle :
1. Créez un cercle et un
triangle au dessus.
2. Sélectionnez les deux.
3. Sélectionnez Arranger >
Combiner les formes
>Segmenter les formes.
Les bords du triangle
coupent le cercle en deux
formes. Le triangle
disparaît.
Page 343
4. Vous pouvez maintenant
tirer le segment hors du
cercle :
Vous pouvez également utiliser une ligne pour couper un objet :
La ligne doit traverser l'objet de part en part et dépasser également de ses contours. (Comme montré
dans l'illustration). Si la ligne est trop courte, l'opération coupe un segment très fin.
Page 344
Croisement de formes
Avec la fonction Croiser des formes
, le nouvel objet est créé à partir des parties des formes du dessous qui sont couvertes par l'objet du
dessus.
Sélectionnez les formes que vous
souhaitez masquer et la forme de
premier-plan (le masque).
Sélectionnez Arranger > Combiner
les formes > Croiser les formes
. Une nouvelle forme est créée. La
forme de premier-plan disparaît.
Les attributs et couleurs des contours des formes du dessous demeurent inchangées. Les sections non
couvertes par la forme de premier-plan sont effacées. La forme de premier-plan peut être formée par un
groupe pour obtenir des soustractions plus complexes. (Les groupes sont décrits dans le chapitre
Manipulation des objets
.)
Segmentation des formes
Xtreme Web Designer 5 permet de segmenter facilement des formes en deux pièces ou plus. Vous
pouvez utiliser un objet solide ou une ligne pour segmenter. Pour, par exemple, couper un segment dans
un cercle :
1. Créez un cercle et un
triangle au dessus.
2. Sélectionnez les deux.
3. Sélectionnez Arranger >
Combiner les formes
>Segmenter les formes.
Les bords du triangle
coupent le cercle en deux
formes. Le triangle
disparaît.
4. Vous pouvez maintenant
tirer le segment hors du
cercle :
Vous pouvez également utiliser une ligne pour couper un objet :
La ligne doit traverser l'objet de part en part et dépasser également de ses contours. (Comme montré
dans l'illustration). Si la ligne est trop courte, l'opération coupe un segment très fin.
Page 345
Segmentation des formes
Xtreme Web Designer 5 permet de segmenter facilement des formes en deux pièces ou plus. Vous
pouvez utiliser un objet solide ou une ligne pour segmenter. Pour, par exemple, couper un segment dans
un cercle :
1. Créez un cercle et un
triangle au dessus.
2. Sélectionnez les deux.
3. Sélectionnez Arranger >
Combiner les formes
>Segmenter les formes.
Les bords du triangle
coupent le cercle en deux
formes. Le triangle
disparaît.
4. Vous pouvez maintenant
tirer le segment hors du
cercle :
Vous pouvez également utiliser une ligne pour couper un objet :
La ligne doit traverser l'objet de part en part et dépasser également de ses contours. (Comme montré
dans l'illustration). Si la ligne est trop courte, l'opération coupe un segment très fin.
Page 346
Modification de la largeur de la ligne
(épaisseur)
Pour modifier la largeur de la ligne ou la largeur du contour d'une forme, sélectionnez d'abord l'objet ou
les objets :
entrez une nouvelle largeur de ligne dans le champ de texte sur la
barre de contrôle Standard
ou choisissez une largeur par défaut dans le menu.
Habituellement, l'épaisseur de ligne est mesurée en points et son abréviation est « pt. ». 1 point est égal à
1/72è
de pouce ou environ 0,3 mm, c'est-à-dire à peine un peu moins que l'épaisseur d'un pixel sur l'écran
lorsqu'il est affiché avec un zoom à 100%.
Vous pouvez entrer la valeur de l'épaisseur dans n'importe quelle unité, et Xtreme Web Designer 5 la
convertira dans un nombre de points correspondant. Par exemple, vous pouvez entrer 0,5 cm et vous
obtiendrez une ligne d'un demi-centimètre d'épaisseur, mais cette valeur sera affichée sous forme de
points dans le champ de largeur.
Si vous n'avez sélectionné aucun objet et que vous modifiez l'épaisseur de la ligne, les modifications
seront appliquées par défaut à toutes les lignes.
me
Page 347
Galerie de lignes
Vous pouvez utiliser la Galerie des lignes
pour appliquer une série de styles ou attributs, comme des motifs en pointillés, des pointes de flèches et
plus encore.
Pour afficher la Galerie des lignes
:
 Choisissez « Outils -> Galeries -> Galerie des lignes » (« F12 »),
 Ou cliquez sur Galerie des lignes sur la barre de contrôle des galeries.
La galerie des lignes
est segmentée en sections. Pour ouvrir ou fermer chacune des sections, cliquez sur le petit icone du
dossier dans la fenêtre de la galerie.
Pour appliquer n'importe quel style ou attribut à une ligne depuis la galerie, vous pouvez :
 appliquer le style sélectionné par glisser&déposer depuis la galerie sur la forme ou la ligne ;
 vous pouvez également double-cliquer sur le style requis dans la galerie ;
 ou sélectionnez le style puis cliquez sur Appliquer.
Largeur de la ligne
Le champ de texte se trouvant dans la partie supérieure de la galerie permet de dupliquer celui présent
dans la barre de contrôle Standard
.
Motifs en pointillés
Cette section propose une sélection de styles de lignes en pointillés.
Pointes de flèche
La méthode la plus simple d'utiliser une pointe de flèche est de la placer à la fin de la ligne sélectionnée
par glisser&déposer.
Vous pouvez appliquer une pointe de flèche également de cette manière :
 double-cliquez sur la pointe dans la galerie.
 Ou sélectionnez la pointe de flèche souhaitée puis cliquez sur Appliquer.
Web Designer possède deux types de pointes de flèche : flèche de début et flèche de fin. Si la ligne
dispose déjà d'une pointe de début, la pointe de fin sera automatiquement ajoutée à la fin de la ligne.
Page 348
Si la ligne ne dispose pas de pointe de flèche, et que vous utilisez le bouton Appliquer
ou que vous double-cliquez sur un style pour l'appliquer, la pointe de flèche sera ajoutée à la fin de la
ligne.
La taille de la pointe est relative à l'épaisseur de la ligne. Les lignes plus larges ont des pointes de flèches
proportionnellement plus larges.
Si vous maintenez « Ctrl » appuyé et double-cliquez sur une pointe de flèche, le style sera appliqué à
celle située à l'autre bout de la ligne.
Modification du type de connexion
Cette fonction située dans la partie inférieure de la galerie des lignes
définit le style des intersections.
Pour modifier une ligne
existante, vous devez d'abord la
sélectionner.
Pour modifier le type de
connexion actuel,
désélectionnez toutes les lignes.
Sélectionnez le type requis
depuis le menu.
Modification des extrémités
Cette fonction située dans la partie supérieure de la galerie des lignes
définit le style des extrémités des lignes.
Pour modifier une ligne existante, vous
devez d'abord la sélectionner.
Pour modifier les extrémités de ligne par
défaut, vous devez désélectionner toutes
les lignes.
Sélectionnez le type requis depuis le
menu.
Page 349
Modification du type de connexion
Cette fonction située dans la partie inférieure de la galerie des lignes
définit le style des intersections.
Pour modifier une ligne
existante, vous devez d'abord la
sélectionner.
Pour modifier le type de
connexion actuel,
désélectionnez toutes les lignes.
Sélectionnez le type requis
depuis le menu.
Modification des extrémités
Cette fonction située dans la partie supérieure de la galerie des lignes
définit le style des extrémités des lignes.
Pour modifier une ligne existante, vous
devez d'abord la sélectionner.
Pour modifier les extrémités de ligne par
défaut, vous devez désélectionner toutes
les lignes.
Sélectionnez le type requis depuis le
menu.
Page 350
Modification des extrémités
Cette fonction située dans la partie supérieure de la galerie des lignes
définit le style des extrémités des lignes.
Pour modifier une ligne existante, vous
devez d'abord la sélectionner.
Pour modifier les extrémités de ligne par
défaut, vous devez désélectionner toutes
les lignes.
Sélectionnez le type requis depuis le
menu.
Page 351
Création de rectangles et carrés
Pour créer un rectangle :
 utilisez l'outil Rectangle (« shift+ F3 », ou « M »).
Cliquez et glissez sur l'espace de travail pour former un rectangle.
Création d'un carré
Pour créer un carré plutôt qu'un rectangle, maintenez la touche Ctrl enfoncée pendant que vous déplacez
la souris.
Créer des rectangles et arrondir leurs coins
Pour doter votre rectangle de coins arrondis, sélectionnez-le puis
appuyez sur le bouton « Coins arrondis » de la barre d'info de l'
Outil Rectangle
.
Vous pouvez tirer les poignées de sélection présentes aux coins pour ajuster le diamètre des coins
arrondis.
Vous pouvez redimensionner les rectangles à l'aide de l'Outil Rectangle (en tirant les poignées de
contrôle des coins) ou à l'aide de l'Outil de sélection
.
Notez que si vous modifiez les proportions d'un rectangle aux coins arrondis à l'aide de l'Outil de
sélection (en l'étirant dans une seule dimension), les proportions des coins arrondis ne sont pas étirées
mais maintenues. Cependant, si plusieurs objets sont sélectionnés ou si vous étirez un groupe contenant
un rectangle aux coins arrondis, les proportions des coins ne serons pas maintenues.
Page 352
Création d'un carré
Pour créer un carré plutôt qu'un rectangle, maintenez la touche Ctrl enfoncée pendant que vous déplacez
la souris.
Créer des rectangles et arrondir leurs coins
Pour doter votre rectangle de coins arrondis, sélectionnez-le puis
appuyez sur le bouton « Coins arrondis » de la barre d'info de l'
Outil Rectangle
.
Vous pouvez tirer les poignées de sélection présentes aux coins pour ajuster le diamètre des coins
arrondis.
Vous pouvez redimensionner les rectangles à l'aide de l'Outil Rectangle (en tirant les poignées de
contrôle des coins) ou à l'aide de l'Outil de sélection
.
Notez que si vous modifiez les proportions d'un rectangle aux coins arrondis à l'aide de l'Outil de
sélection (en l'étirant dans une seule dimension), les proportions des coins arrondis ne sont pas étirées
mais maintenues. Cependant, si plusieurs objets sont sélectionnés ou si vous étirez un groupe contenant
un rectangle aux coins arrondis, les proportions des coins ne serons pas maintenues.
Page 353
Créer des rectangles et arrondir leurs coins
Pour doter votre rectangle de coins arrondis, sélectionnez-le puis
appuyez sur le bouton « Coins arrondis » de la barre d'info de l'
Outil Rectangle
.
Vous pouvez tirer les poignées de sélection présentes aux coins pour ajuster le diamètre des coins
arrondis.
Vous pouvez redimensionner les rectangles à l'aide de l'Outil Rectangle (en tirant les poignées de
contrôle des coins) ou à l'aide de l'Outil de sélection
.
Notez que si vous modifiez les proportions d'un rectangle aux coins arrondis à l'aide de l'Outil de
sélection (en l'étirant dans une seule dimension), les proportions des coins arrondis ne sont pas étirées
mais maintenues. Cependant, si plusieurs objets sont sélectionnés ou si vous étirez un groupe contenant
un rectangle aux coins arrondis, les proportions des coins ne serons pas maintenues.
Page 354
Création de cercles et ellipses
Pour créer un cercle ou une ellipse :

Sélectionnez l'outil Ellipse («Maj + F4 », ou « L »).
Les boutons Rayon et diamètre
permettent de créer des cercles de
manière automatique.
Cliquez sur Création par limites
et tirez sur l'espace de travail pour dessiner une ellipse. Maintenez la touche « Ctrl » enfoncée pendant
que vous tirez pour tracer un cercle plutôt qu'une ellipse.
Sélectionnez l'option Rayon
pour dessiner des cercles. Le point de départ d'un trait détermine le centre du cercle.
Sélectionnez l'option Diamètre
. Le point de départ d'un trait détermine désormais la position du bord du cercle.
Vous pouvez convertir une ellipse en un cercle à tout moment en effectuant un double-clic sur une
poignée de contrôle.
Page 355
Utilisation des couleurs
Xtreme Web Designer 5 vous permet de contrôler largement l'application, la création et la modification
des couleurs des objets. Pour de simple documents, vous pouvez simplement choisir les couleurs de la
palette de couleurs à l'écran. Les opérations avancées sur les couleurs sont décrites plus loin.
Dans ce chapitre
La palette de couleurs
Appliquer des couleurs de remplissage & de contour par glisser&déposer
Éditer la couleur d'un objet
L'éditeur de couleurs
Couleurs locales et couleurs de thème
Créer des nouvelles couleurs nommées
Éditer les couleurs nommées
Couleurs normales, teintes, nuances et Couleurs liées
Création d'une teinte, d'une nuance ou d'une couleur liée
Page 356
La palette de couleurs
La palette de couleurs s'affiche en bas de la fenêtre. La palette de couleurs donne également accès à
l'éditeur de couleurs et propose un éventail de couleurs prédéfinies, ainsi que l'option spéciale « Aucune
couleur ».
Échantillon de couleur :
la partie externe de l'échantillon de couleur se trouvant sur la gauche de la palette de couleurs montre la
couleur des lignes et le centre indique la couleur de remplissage. Il s'agit des couleurs de tout objet
sélectionné, ou les attributs de couleur courante si aucun objet n'est sélectionné.
Ce bouton vous permet d'accéder à l'éditeur de couleurs
Pipette de couleurs : utilisez la pipette pour sélectionner n'importe quelle couleur affichée sur l'écran ou
dans le document. Voir Utiliser la pipette pour prélever des couleurs
pour plus d'informations.
Aucune couleur : cette option permet de sélectionner un « remplissage sans couleur ». En cliquant sur la
touche Maj en même temps, vous appliquez cette option à une ligne. Veuillez noter que l'effet n'est pas le
même que la transparence à 100 %. L'option « Aucune couleur » est différente de la transparence. Une
forme à laquelle une transparence de 100 % est appliquée reste pleine alors qu'une forme remplie avec
« aucune couleur » est effectivement vide, transparente. Le bouton Aucune couleur
peut également être utilisé pour rétablir la couleur d'origine d'une photo à laquelle une couleur contone a
été appliquée.
Si la longueur de la palette des couleurs dépasse celle de la fenêtre, vous pouvez faire défiler l'ensemble
de la palette à l'aide de la barre de défilement située en dessous ou en faisant glisser la palette des
couleurs tout en maintenant la touche « Alt » de votre clavier enfoncée.
Xtreme Web Designer 5 propose diverses options concernant la taille affichée de la palette de couleurs
(décrites dans le chapitre Personnaliser Web Designer).
Couleurs de la palette
Couleurs (thème) nommées : Les couleurs nommées apparaissent tout d'abord (si elles sont présentes
dans le document, voir ci-dessous).
Les couleurs nommées fournissent des modèles et des designs de couleurs, de manière à ce que le
thème de couleur d'un design puisse être facilement modifié sans avoir à éditer individuellement chaque
objet qu'il contient.
Les couleurs liées sont représentées de manière différente dans la palette de couleurs afin de les
Page 357
distinguer plus facilement des couleurs nommées classiques. Voir Création d'une teinte, d'une nuance ou
d'une couleur liée
.
Couleurs de la palette :
Il existe 46 couleurs prédéfinies dans la palette. Elle comprend 5 dégradés composés de 7 nuances
standard ainsi que 10 dégradés de gris, noir et blanc. Les couleurs de la palette ne peuvent être éditées
(par ex. il n'y a pas de couleurs nommées) et ont été créées à partir d'un nombre limité de couleurs à
appliquer aux objets (soit en tirant la couleur sur l'objet soit en cliquant dessus).
Les petits marqueurs dans les icones de couleurs affichent la couleur nommée (s'il y en a une) ou les
couleurs de palette utilisées pour le ou les objet(s) sélectionné(s).
Les marqueurs en forme de diamant montrent les couleurs
utilisées dans les objets sélectionnés. Un diamant situé en
haut à gauche d'un coin indique la couleur de remplissage,
dans le coin en haut à droite, la couleur de contour.
Les marqueurs en forme de croix affichent les attributs de la
couleur en cours si aucun objet n'est sélectionné. La couleur
de contour se trouve à droite, celle du remplissage à
gauche.
Les marqueurs en forme de triangle affichent les couleurs de
remplissage si vous en avez utilisé un.
Cela fonctionne également lorsque vous choisissez une couleur avec la pipette de couleurs à partir
d'objets déjà existants, voir Utiliser la pipette pour prélever des couleurs
. Les marqueurs des couleurs de contour se mettent à jour instantanément et affichent la couleur de
l'objet sous la pipette lorsque vous la faites glisser.
Reclasser les couleurs sur la palette de couleurs
Vous préférerez peut-être reclasser les couleurs de la palette de couleurs. Pour cela, Ctrl+glisser les
couleurs le long de la palette de couleurs. Cela réorganise aussi la galerie des couleurs
. Seules les couleurs nommées peuvent être replacées dans la palette de couleurs.
Menu contextuel de la palette de couleurs
Cliquez sur une couleur de la palette pour afficher un menu contextuel avec les options suivantes :
Éditer
Ouvre l'éditeur de couleurs avec la couleur
sélectionnée (non disponible pour les couleurs de
palette)
Définir la couleur de
Définit la couleur de remplissage ou de contour
remplissage/Définir la
de l'objet sélectionné avec cette couleur
couleur de contour
Renommer
Renomme une couleur nommée (non disponible
pour les couleurs de la palette)
Supprimer
Supprime une couleur nommée (non disponible
pour les couleurs de la palette)
Si l'objet sélectionné est un bitmap, les options de couleur de remplissage et de contour seront
remplacées par Déterminer la couleur sombre contone/Déterminer la couleur claire contone.
Voir Colorer un bitmap
pour plus d'informations.
Cliquez sur « Aucune couleur » pour remplacer les options de couleur de remplissage et de contour par :
Supprimer la couleur de remplissage/Supprimer la couleur de contour
Page 358
. Ceci règle les attributs relatifs à l'objet sélectionné sur « Aucune couleur ».
Page 359
Couleurs de la palette
Couleurs (thème) nommées : Les couleurs nommées apparaissent tout d'abord (si elles sont présentes
dans le document, voir ci-dessous).
Les couleurs nommées fournissent des modèles et des designs de couleurs, de manière à ce que le
thème de couleur d'un design puisse être facilement modifié sans avoir à éditer individuellement chaque
objet qu'il contient.
Les couleurs liées sont représentées de manière différente dans la palette de couleurs afin de les
distinguer plus facilement des couleurs nommées classiques. Voir Création d'une teinte, d'une nuance ou
d'une couleur liée
.
Couleurs de la palette :
Il existe 46 couleurs prédéfinies dans la palette. Elle comprend 5 dégradés composés de 7 nuances
standard ainsi que 10 dégradés de gris, noir et blanc. Les couleurs de la palette ne peuvent être éditées
(par ex. il n'y a pas de couleurs nommées) et ont été créées à partir d'un nombre limité de couleurs à
appliquer aux objets (soit en tirant la couleur sur l'objet soit en cliquant dessus).
Les petits marqueurs dans les icones de couleurs affichent la couleur nommée (s'il y en a une) ou les
couleurs de palette utilisées pour le ou les objet(s) sélectionné(s).
Les marqueurs en forme de diamant montrent les couleurs
utilisées dans les objets sélectionnés. Un diamant situé en
haut à gauche d'un coin indique la couleur de remplissage,
dans le coin en haut à droite, la couleur de contour.
Les marqueurs en forme de croix affichent les attributs de la
couleur en cours si aucun objet n'est sélectionné. La couleur
de contour se trouve à droite, celle du remplissage à
gauche.
Les marqueurs en forme de triangle affichent les couleurs de
remplissage si vous en avez utilisé un.
Cela fonctionne également lorsque vous choisissez une couleur avec la pipette de couleurs à partir
d'objets déjà existants, voir Utiliser la pipette pour prélever des couleurs
. Les marqueurs des couleurs de contour se mettent à jour instantanément et affichent la couleur de
l'objet sous la pipette lorsque vous la faites glisser.
Reclasser les couleurs sur la palette de couleurs
Vous préférerez peut-être reclasser les couleurs de la palette de couleurs. Pour cela, Ctrl+glisser les
couleurs le long de la palette de couleurs. Cela réorganise aussi la galerie des couleurs
. Seules les couleurs nommées peuvent être replacées dans la palette de couleurs.
Menu contextuel de la palette de couleurs
Cliquez sur une couleur de la palette pour afficher un menu contextuel avec les options suivantes :
Page 360
Éditer
Définir la couleur de
remplissage/Définir la
couleur de contour
Renommer
Ouvre l'éditeur de couleurs avec la couleur
sélectionnée (non disponible pour les couleurs de
palette)
Définit la couleur de remplissage ou de contour
de l'objet sélectionné avec cette couleur
Renomme une couleur nommée (non disponible
pour les couleurs de la palette)
Supprimer
Supprime une couleur nommée (non disponible
pour les couleurs de la palette)
Si l'objet sélectionné est un bitmap, les options de couleur de remplissage et de contour seront
remplacées par Déterminer la couleur sombre contone/Déterminer la couleur claire contone.
Voir Colorer un bitmap
pour plus d'informations.
Cliquez sur « Aucune couleur » pour remplacer les options de couleur de remplissage et de contour par :
Supprimer la couleur de remplissage/Supprimer la couleur de contour
. Ceci règle les attributs relatifs à l'objet sélectionné sur « Aucune couleur ».
Page 361
Reclasser les couleurs sur la palette de couleurs
Vous préférerez peut-être reclasser les couleurs de la palette de couleurs. Pour cela, Ctrl+glisser les
couleurs le long de la palette de couleurs. Cela réorganise aussi la galerie des couleurs
. Seules les couleurs nommées peuvent être replacées dans la palette de couleurs.
Menu contextuel de la palette de couleurs
Cliquez sur une couleur de la palette pour afficher un menu contextuel avec les options suivantes :
Éditer
Ouvre l'éditeur de couleurs avec la couleur
sélectionnée (non disponible pour les couleurs de
palette)
Définir la couleur de
Définit la couleur de remplissage ou de contour
remplissage/Définir la
de l'objet sélectionné avec cette couleur
couleur de contour
Renommer
Renomme une couleur nommée (non disponible
pour les couleurs de la palette)
Supprimer
Supprime une couleur nommée (non disponible
pour les couleurs de la palette)
Si l'objet sélectionné est un bitmap, les options de couleur de remplissage et de contour seront
remplacées par Déterminer la couleur sombre contone/Déterminer la couleur claire contone.
Voir Colorer un bitmap
pour plus d'informations.
Cliquez sur « Aucune couleur » pour remplacer les options de couleur de remplissage et de contour par :
Supprimer la couleur de remplissage/Supprimer la couleur de contour
. Ceci règle les attributs relatifs à l'objet sélectionné sur « Aucune couleur ».
Page 362
Menu contextuel de la palette de couleurs
Cliquez sur une couleur de la palette pour afficher un menu contextuel avec les options suivantes :
Éditer
Ouvre l'éditeur de couleurs avec la couleur
sélectionnée (non disponible pour les couleurs de
palette)
Définir la couleur de
Définit la couleur de remplissage ou de contour
remplissage/Définir la
de l'objet sélectionné avec cette couleur
couleur de contour
Renommer
Renomme une couleur nommée (non disponible
pour les couleurs de la palette)
Supprimer
Supprime une couleur nommée (non disponible
pour les couleurs de la palette)
Si l'objet sélectionné est un bitmap, les options de couleur de remplissage et de contour seront
remplacées par Déterminer la couleur sombre contone/Déterminer la couleur claire contone.
Voir Colorer un bitmap
pour plus d'informations.
Cliquez sur « Aucune couleur » pour remplacer les options de couleur de remplissage et de contour par :
Supprimer la couleur de remplissage/Supprimer la couleur de contour
. Ceci règle les attributs relatifs à l'objet sélectionné sur « Aucune couleur ».
Page 363
Appliquer des couleurs de remplissage & de
contour par glisser&déposer
Pour appliquer une couleur de remplissage à un objet (sélectionné ou non), faites glisser une
couleur de la palette de couleurs et déposez-la au centre de la forme.
 Pour définir la couleur d'une ligne ou d'un contour, déposez-la sur le contour, non pas sur le
centre.
 Pour modifier la couleur actuelle de remplissage, faites glisser une couleur dans un espace vide.
 Pour modifier la couleur de l'arrière-plan d'une page, utilisez « Ctrl » et tirez une couleur sur
l'arrière-plan de la page.
Lorsque vous tirez des couleurs, un indicateur à côté du pointeur vous indique quel effet aura la couleur :
Définir une couleur de remplissage unie (visible lorsque vous passez
au-dessus d'un objet) ou les couleurs intermédiaires dans le cas d'un
remplissage multicolore
Définir la couleur de contour (visible lorsque vous passez au-dessus
d'une ligne)
Définir la couleur de remplissage courante (visible lorsque vous passez
au-dessus d'une zone vide)
Définir la couleur de départ du remplissage gradué (visible lorsque vous
passez au-dessus du début du remplissage)
Définir la couleur de fin du remplissage gradué (visible lorsque vous
passez au-dessus de la fin du remplissage)
Définir la couleur de l'arrière-plan d'une page (visible lorsque vous faites
« Ctrl+tirer » sur la page).
À la place de glisser&déposer, si vous avez déjà sélectionné un objet, vous pouvez simplement cliquer
sur la palette de couleurs. Cela ouvre le menu contextuel de la palette de couleurs à l'emplacement où
vous pouvez définir la couleur de remplissage ou de contour.
Dans tous les autres cas, vous pouvez modifier la couleur de contour par « Maj + clic » sur la palette de
couleurs.
Si une photo ou une forme comportant des bitmaps est sélectionnée, cliquer sur la palette de couleurs
donnera un bitmap contone. Cela signifie que le bitmap sera converti en niveaux de gris (noir et blanc) et
la couleur sélectionnée sera utilisée comme couleur claire contone. La couleur sombre contone est
généralement le noir. Vous pouvez régler les deux couleurs contone dans le menu contextuel de la palette
de couleurs (voir ci-dessus). Voir Colorer un bitmap
pour plus d'informations.
Pour définir Aucune couleur (supprimer)
pour un remplissage ou un contour,
effectuer les opérations comme
soulignées ci-dessus tout en utilisant
l'option « Aucune couleur » au lieu d'une
couleur.

Page 364
Éditer la couleur d'un objet
Sélectionner l'objet dont vous souhaitez modifier la couleur.
Pour éditer la couleur de remplissage ou de contour de (des) l'objet(s) sélectionné(s)
 Choisir Services > Éditeur de couleurs (raccourci Ctrl+E).
 Ou cliquer sur l'icône Éditer couleur sur la palette de couleurs.
 Ou double-cliquer sur le panneau de la couleur de remplissage courante sur la palette de
couleurs.
Pour éditer la couleur de contour de (des) l'objet(s) sélectionné(s)
 Cliquer droit (ou Maj+clic) sur l'icône Éditer couleur sur la palette de couleurs.
 Ou double-cliquer sur le panneau de la couleur de contour courante.
Ceci affiche l'Éditeur de couleurs
qui vous permet de sélectionner n'importe quelle couleur du spectre. Contrairement à de nombreux
programmes de graphisme, l'Éditeur de couleurs peut rester affiché à l'écran pendant que vous continuez
à travailler. Il se transforme pour refléter la couleur des objets sélectionnés ; vous pouvez ainsi aisément
et directement ajuster la couleur de l'objet.sélectionné.
Page 365
L'éditeur de couleurs
L'éditeur de couleurs est utilisé pour modifier la couleur des objets du document.
Pipette de
couleurs
Sélectionner la
couleur à éditer :
couleur de remplissage
ou de contour de
l'objet sélectionné ou Créer une nouvelle couleur nommée
toute couleur nommée
du thème
Cliquez pour afficher
les options avancées.
Couleur précédente
Couleur actuelle
Tirez ici pour choisir
une nuance de la teinte
sélectionnée.
Tirez ici pour
sélectionner une teinte
de couleur.
Le moyen le plus facile de créer une nouvelle couleur est de sélectionner la teinte sur la bande de couleur
inférieure. Toutes les nuances possibles de cette teinte s'affichent dans la section supérieure, il vous suffit
de cliquer ou de tirer dans la section supérieure pour sélectionner une nouvelle couleur. Vous constaterez
que les objets sélectionnés changent de couleur lorsque vous les ajustez dans l'éditeur de couleurs
(appelé « Aperçu en direct »).
Par exemple, pour sélectionner une couleur rose, qui correspond à une nuance pâle de rouge,
sélectionnez rouge dans la section inférieure puis un rouge très pâle (rose) en haut à droite de la section
supérieure.
Couleur précédente et couleur actuelle
Alors que vous passez sur l'Éditeur de couleurs, les deux petits échantillons de couleur en haut à droite
affichent la couleur actuelle et la couleur précédente (avant modification de la couleur). Cette option vous
sera utile si vous souhaitez effectuer une petite modification et comparer l'ancienne et la nouvelle couleur.
Utiliser la pipette pour prélever des couleurs
Au lieu de sélectionner des tonalités et des nuances dans l'Éditeur de couleurs
vous avez la possibilité de prélever une couleur de toute partie du document ou de toute partie de l'écran
de l'ordinateur, et même d'autres fenêtres et programmes.
Pour cela, cliquez et tirez sur l'icône pipette. En tirant, vous voyez que l'Éditeur de couleurs prélève en
continu la couleur se trouvant sous la pipette. Relâchez le bouton de la souris lorsque vous avez la
couleur désirée. Ceci est un moyen facile et rapide d'utiliser la même couleur de nouveau ou de copier
des couleurs d'un objet à l'autre.
La pipette ne prend pas seulement un échantillon de la couleur de l'écran (RVB). Si vous positionnez la
pipette sur une forme avec une couleur de remplissage solide, la pipette va enregistrer cette couleur, y
Page 366
compris le modèle de couleur (RVB, HSV ou CMJN), de sorte que la couleur est copiée de manière
exacte dans l'objet sélectionné. Si la couleur cible est une couleur nommée ou de la palette, la pipette ne
va pas seulement copier la couleur mais va l'appliquer à l'objet sélectionné.
Si l'objet désigné par la pipette est complexe (par exemple il comprend des transparences) et que la
couleur exacte ne peut être déterminée, la couleur RVB de l'écran est appliquée.
Une petite fenêtre s'affiche près du curseur de la
souris et indique la couleur qui est copiée. Il
s'agit du nom de la couleur de la palette, du nom
de la couleur nommée ou le modèle de couleur et
sa valeur.
Néanmoins, lorsque vous êtes amenés à utiliser régulièrement la même couleur, il est préférable de
travailler avec une couleur nommée.
Opérations de couleur avancées
Cliquez sur l'icone Afficher les options avancées
de l'éditeur de couleurs afin de faire apparaître la partie inférieure
de la boîte de dialogue affichant des options supplémentaires.
Type de couleur : Voir
Création d'une teinte, d'une
nuance ou d'une couleur liée
Aucune couleur de Valeurs
Valeur
remplissage
des
hexadécimal
couleurs e RVB
TSV
Vous pouvez saisir des valeurs de couleur RVB (ou TSV) précises. Généralement, le graphisme Internet
requiert de choisir la couleur hexadécimale RVB. Les champs T, S et V vous permettent d'exprimer la
couleur comme valeur TSV (teinte saturation valeur) en pourcentage. Le champ #
permet de saisir la valeur RVB en nombre hexadécimal (0-F).
En outre, un bouton « Aucune couleur de remplissage » et un bouton d'aide sont disponibles.
Page 367
Couleur précédente et couleur actuelle
Alors que vous passez sur l'Éditeur de couleurs, les deux petits échantillons de couleur en haut à droite
affichent la couleur actuelle et la couleur précédente (avant modification de la couleur). Cette option vous
sera utile si vous souhaitez effectuer une petite modification et comparer l'ancienne et la nouvelle couleur.
Utiliser la pipette pour prélever des couleurs
Au lieu de sélectionner des tonalités et des nuances dans l'Éditeur de couleurs
vous avez la possibilité de prélever une couleur de toute partie du document ou de toute partie de l'écran
de l'ordinateur, et même d'autres fenêtres et programmes.
Pour cela, cliquez et tirez sur l'icône pipette. En tirant, vous voyez que l'Éditeur de couleurs prélève en
continu la couleur se trouvant sous la pipette. Relâchez le bouton de la souris lorsque vous avez la
couleur désirée. Ceci est un moyen facile et rapide d'utiliser la même couleur de nouveau ou de copier
des couleurs d'un objet à l'autre.
La pipette ne prend pas seulement un échantillon de la couleur de l'écran (RVB). Si vous positionnez la
pipette sur une forme avec une couleur de remplissage solide, la pipette va enregistrer cette couleur, y
compris le modèle de couleur (RVB, HSV ou CMJN), de sorte que la couleur est copiée de manière
exacte dans l'objet sélectionné. Si la couleur cible est une couleur nommée ou de la palette, la pipette ne
va pas seulement copier la couleur mais va l'appliquer à l'objet sélectionné.
Si l'objet désigné par la pipette est complexe (par exemple il comprend des transparences) et que la
couleur exacte ne peut être déterminée, la couleur RVB de l'écran est appliquée.
Une petite fenêtre s'affiche près du curseur de la
souris et indique la couleur qui est copiée. Il
s'agit du nom de la couleur de la palette, du nom
de la couleur nommée ou le modèle de couleur et
sa valeur.
Néanmoins, lorsque vous êtes amenés à utiliser régulièrement la même couleur, il est préférable de
travailler avec une couleur nommée.
Opérations de couleur avancées
Cliquez sur l'icone Afficher les options avancées
de l'éditeur de couleurs afin de faire apparaître la partie inférieure
de la boîte de dialogue affichant des options supplémentaires.
Type de couleur : Voir
Création d'une teinte, d'une
nuance ou d'une couleur liée
Aucune couleur de Valeurs
Valeur
remplissage
des
hexadécimal
couleurs e RVB
TSV
Vous pouvez saisir des valeurs de couleur RVB (ou TSV) précises. Généralement, le graphisme Internet
requiert de choisir la couleur hexadécimale RVB. Les champs T, S et V vous permettent d'exprimer la
couleur comme valeur TSV (teinte saturation valeur) en pourcentage. Le champ #
Page 368
permet de saisir la valeur RVB en nombre hexadécimal (0-F).
En outre, un bouton « Aucune couleur de remplissage » et un bouton d'aide sont disponibles.
Page 369
Utiliser la pipette pour prélever des couleurs
Au lieu de sélectionner des tonalités et des nuances dans l'Éditeur de couleurs
vous avez la possibilité de prélever une couleur de toute partie du document ou de toute partie de l'écran
de l'ordinateur, et même d'autres fenêtres et programmes.
Pour cela, cliquez et tirez sur l'icône pipette. En tirant, vous voyez que l'Éditeur de couleurs prélève en
continu la couleur se trouvant sous la pipette. Relâchez le bouton de la souris lorsque vous avez la
couleur désirée. Ceci est un moyen facile et rapide d'utiliser la même couleur de nouveau ou de copier
des couleurs d'un objet à l'autre.
La pipette ne prend pas seulement un échantillon de la couleur de l'écran (RVB). Si vous positionnez la
pipette sur une forme avec une couleur de remplissage solide, la pipette va enregistrer cette couleur, y
compris le modèle de couleur (RVB, HSV ou CMJN), de sorte que la couleur est copiée de manière
exacte dans l'objet sélectionné. Si la couleur cible est une couleur nommée ou de la palette, la pipette ne
va pas seulement copier la couleur mais va l'appliquer à l'objet sélectionné.
Si l'objet désigné par la pipette est complexe (par exemple il comprend des transparences) et que la
couleur exacte ne peut être déterminée, la couleur RVB de l'écran est appliquée.
Une petite fenêtre s'affiche près du curseur de la
souris et indique la couleur qui est copiée. Il
s'agit du nom de la couleur de la palette, du nom
de la couleur nommée ou le modèle de couleur et
sa valeur.
Néanmoins, lorsque vous êtes amenés à utiliser régulièrement la même couleur, il est préférable de
travailler avec une couleur nommée.
Opérations de couleur avancées
Cliquez sur l'icone Afficher les options avancées
de l'éditeur de couleurs afin de faire apparaître la partie inférieure
de la boîte de dialogue affichant des options supplémentaires.
Type de couleur : Voir
Création d'une teinte, d'une
nuance ou d'une couleur liée
Aucune couleur de Valeurs
Valeur
remplissage
des
hexadécimal
couleurs e RVB
TSV
Vous pouvez saisir des valeurs de couleur RVB (ou TSV) précises. Généralement, le graphisme Internet
requiert de choisir la couleur hexadécimale RVB. Les champs T, S et V vous permettent d'exprimer la
couleur comme valeur TSV (teinte saturation valeur) en pourcentage. Le champ #
permet de saisir la valeur RVB en nombre hexadécimal (0-F).
En outre, un bouton « Aucune couleur de remplissage » et un bouton d'aide sont disponibles.
Page 370
Opérations de couleur avancées
Cliquez sur l'icone Afficher les options avancées
de l'éditeur de couleurs afin de faire apparaître la partie inférieure
de la boîte de dialogue affichant des options supplémentaires.
Type de couleur : Voir
Création d'une teinte, d'une
nuance ou d'une couleur liée
Aucune couleur de Valeurs
Valeur
remplissage
des
hexadécimal
couleurs e RVB
TSV
Vous pouvez saisir des valeurs de couleur RVB (ou TSV) précises. Généralement, le graphisme Internet
requiert de choisir la couleur hexadécimale RVB. Les champs T, S et V vous permettent d'exprimer la
couleur comme valeur TSV (teinte saturation valeur) en pourcentage. Le champ #
permet de saisir la valeur RVB en nombre hexadécimal (0-F).
En outre, un bouton « Aucune couleur de remplissage » et un bouton d'aide sont disponibles.
Page 371
Couleurs locales et couleurs de thème
Web Designer possède deux types de couleurs :
 Couleurs locales n'est utilisé qu'à un seul endroit du document. Chaque objet a une couleur
distincte et rien n'est partagé. Ceci est utile lorsque vous souhaitez modifier la couleur d'un objet
sans affecter d'autres objets. Les couleurs locales constituent la méthode la meilleure et la plus
facile pour des documents simples utilisant peu de couleurs. Les options « Utiliser une couleur »
et « Éditer la couleur d'un objet » décrivent l'utilisation de couleurs locales.
 Les couleurs de thème (ou couleurs nommées) peuvent être utilisées à volonté dans le
document. (En tant que couleurs nommées, elles sont comparables à des styles d'un traitement de
texte). Les couleurs de thème sont utilisées dans des modèles et garantissent un aspect cohérent
des éléments de votre page, par exemple les boutons ou les barres de navigation. Toute
modification effectuée sur une couleur de thème est immédiatement répercutée sur tous les objets
et parties du dessin utilisant cette couleur. Vous pouvez également copier des couleurs de thème
d'un document à l'autre. Si des couleurs de thème sont déjà présentes dans le design et que vous
chargez ou collez des modèles depuis la galerie de designs contenant les couleurs de thème avec
le même nom, il vous sera demandé si vous souhaitez assortir la couleur actuelle des couleurs de
thème importées à celles existantes. Les couleurs de thème des modèles sont nommées de
manière homogène. Ainsi, lorsque vous importez des éléments depuis différents thèmes, les
couleurs sont parfaitement assorties.
Important : si vous sélectionnez un objet sur la page ayant une couleur nommée appliquée puis la
modifiez avec l'éditeur de couleurs, celle-ci deviendra alors une couleur locale au lieu d'une couleur
nommée (car il est supposé que si vous essayez d'éditer la couleur de l'objet, c'est effectivement ce que
vous souhaitez faire. Si vous souhaitez vraiment changer la couleur nommée, celle-ci et toutes ses
occurrences de la couleur, alors vous devriez le faire en éditant la couleur nommée
).
Page 372
Créer des nouvelles couleurs nommées
Si vous souhaitez utiliser la même couleur à différents endroits de votre dessin, et qu'il est très probable
que vous vouliez modifier cette couleur dans le futur, nous vous recommandons fortement de créer une
couleur nommée
. Ceci est très facile à réaliser avec Xtreme Web Designer 5 :
sélectionnez un objet dont vous voulez utiliser la couleur puis cliquez sur Nouvelle couleur nommée
dans l'Éditeur de couleur
.
Cliquez pour créer une nouvelle couleur
Donnez un nom approprié à
nommée.
la couleur, par exemple
« Couleur Voiture » et
cliquez sur Créer. La
nouvelle couleur s'ajoute à
la Palette de couleurs
.
Vous pouvez maintenant
vous servir de cette couleur
comme des autres, par
glisser-déposer à partir de
la palette des couleurs ou
juste en cliquant dessus (ou
en faisant un clic droit pour
l'utiliser comme une couleur
de la palette) pour
l'appliquer en tant que
couleur de remplissage.
Lorsque vous éditez une
couleur nommée, tous les
objets utilisant cette couleur
seront modifiés.
Page 373
Éditer les couleurs nommées
Pour afficher la couleur nommée dans l'éditeur de couleur afin de pouvoir l'éditer, choisissez dans le
menu de l'éditeur de couleur ou faites un glisser & déplacer de la couleur depuis la palette des couleurs
ver l'éditeur de couleur
.
Vous pouvez ensuite éditer la couleur selon vos besoins. Tous les objets utilisant cette couleur sont
automatiquement et immédiatement mis à jour afin d'afficher la nouvelle couleur.
Pour renommer une Couleur nommée pendant que vous l'éditez, faites un clic droit sur l'éditeur de
couleur et sélectionnez Renommer ou faites un clic droit sur la couleur dans la palette des couleurs et
sélectionnez Renommer
.
Pour supprimer une couleur nommée, faites un clic droit sur la couleur de la palette des couleurs et
choisissez Supprimer
.
Page 374
Couleurs normales, teintes, nuances et
Couleurs liées
Couleurs normales
Celles-ci sont les couleurs normales autonomes à appliquer aux objets.
Xtreme Web Designer 5 peut également définir des couleurs liées à une autre couleur, à savoir, lorsque la
couleur mère change, la couleur liée change également. Vous pouvez liéer une couleur à sa couleur mère
de trois façons—Teintes, Nuances et Couleurs liées
. Ces techniques très puissantes permettent, par exemple, de recolorer des dessins aux nuances
complexes en un seul clic. Certains des cliparts d'exemple utilisent cette technique.
Teintes
Les teintes sont basées sur d'autres couleurs, (appelées couleurs mères) et sont toujours une version plus
pâle que la version mère. Elles ont deux utilisations principales :
 Où vous avez des nuances plus pâles d'une couleur mère et souhaitez replacer la couleur mère à
l'avenir par des teintes se mettant automatiquement à jour.
 Pour étendre la palette de couleurs disponible des encres d'impression.
 Par exemple, une teinte rouge de 25 % donnera une couleur rose. Par conséquent, avec une
encre rouge, vous pouvez obtenir un rouge pur et un rose à partir d'une même encre. De même,
pour une impression noir et blanc, il est souvent utile d'utiliser des teintes afin de créer différentes
nuances de gris.
 Si vous imprimez une palette de couleurs limitée (il est souvent meilleur marché d'imprimer une ou
deux couleurs plutôt que faire une impression en quadrichromie).
Une teinte peut être basée sur tout type de couleurs, incluant une autre teinte.
Toute modification effectuée sur une couleur mère modifiera les teintes basées sur celle-ci. Par exemple,
vous pouvez définir la couleur rose comme 50 % d'une couleur mère rouge. Si vous changez la couleur
mère en orange, le rose passera automatiquement à l'orange clair.
Nuances
Celles-ci permettent de créer des couleurs plus claires ou plus foncées basées sur une couleur mère. En
changeant la couleur mère, vous modifiez toutes les teintes associées. Par exemple, un dessin d'une
voiture peut utiliser des nuances pour souligner les reflets et les ombres de la carrosserie. Une simple
édition de la couleur mère entraîne une modification de toutes les couleurs de la carrosserie tout en
maintenant les nuances. Le réglage des nuances de cette manière prend plus de temps mais est un moyen
très efficace de modifier les couleurs.
Pour de meilleurs résultats, la couleur mère doit être un couleur « pure » saturée. En mode de couleur
TSV, la saturation et la valeur doivent idéalement être fixées à 100 %. Dans l'Éditeur de couleurs
, la croix doit être placée dans le coin en haut à gauche.
Couleurs liées
Les couleurs liées sont similaires aux nuances mais offrent une plus grande flexibilité. Elles sont également
basées sur une couleur mère mais c'est vous qui définissez quels attributs la couleur liée doit partager
avec sa couleur mère. Par exemple, vous pouvez créer une couleur liée qui sera une version plus saturée
de la couleur mère, mais dont teinte et la luminosité seront celles de la couleur mère.
Page 375
Couleurs normales
Celles-ci sont les couleurs normales autonomes à appliquer aux objets.
Xtreme Web Designer 5 peut également définir des couleurs liées à une autre couleur, à savoir, lorsque la
couleur mère change, la couleur liée change également. Vous pouvez liéer une couleur à sa couleur mère
de trois façons—Teintes, Nuances et Couleurs liées
. Ces techniques très puissantes permettent, par exemple, de recolorer des dessins aux nuances
complexes en un seul clic. Certains des cliparts d'exemple utilisent cette technique.
Teintes
Les teintes sont basées sur d'autres couleurs, (appelées couleurs mères) et sont toujours une version plus
pâle que la version mère. Elles ont deux utilisations principales :
 Où vous avez des nuances plus pâles d'une couleur mère et souhaitez replacer la couleur mère à
l'avenir par des teintes se mettant automatiquement à jour.
 Pour étendre la palette de couleurs disponible des encres d'impression.
 Par exemple, une teinte rouge de 25 % donnera une couleur rose. Par conséquent, avec une
encre rouge, vous pouvez obtenir un rouge pur et un rose à partir d'une même encre. De même,
pour une impression noir et blanc, il est souvent utile d'utiliser des teintes afin de créer différentes
nuances de gris.
 Si vous imprimez une palette de couleurs limitée (il est souvent meilleur marché d'imprimer une ou
deux couleurs plutôt que faire une impression en quadrichromie).
Une teinte peut être basée sur tout type de couleurs, incluant une autre teinte.
Toute modification effectuée sur une couleur mère modifiera les teintes basées sur celle-ci. Par exemple,
vous pouvez définir la couleur rose comme 50 % d'une couleur mère rouge. Si vous changez la couleur
mère en orange, le rose passera automatiquement à l'orange clair.
Nuances
Celles-ci permettent de créer des couleurs plus claires ou plus foncées basées sur une couleur mère. En
changeant la couleur mère, vous modifiez toutes les teintes associées. Par exemple, un dessin d'une
voiture peut utiliser des nuances pour souligner les reflets et les ombres de la carrosserie. Une simple
édition de la couleur mère entraîne une modification de toutes les couleurs de la carrosserie tout en
maintenant les nuances. Le réglage des nuances de cette manière prend plus de temps mais est un moyen
très efficace de modifier les couleurs.
Pour de meilleurs résultats, la couleur mère doit être un couleur « pure » saturée. En mode de couleur
TSV, la saturation et la valeur doivent idéalement être fixées à 100 %. Dans l'Éditeur de couleurs
, la croix doit être placée dans le coin en haut à gauche.
Couleurs liées
Les couleurs liées sont similaires aux nuances mais offrent une plus grande flexibilité. Elles sont également
basées sur une couleur mère mais c'est vous qui définissez quels attributs la couleur liée doit partager
avec sa couleur mère. Par exemple, vous pouvez créer une couleur liée qui sera une version plus saturée
de la couleur mère, mais dont teinte et la luminosité seront celles de la couleur mère.
Page 376
Teintes
Les teintes sont basées sur d'autres couleurs, (appelées couleurs mères) et sont toujours une version plus
pâle que la version mère. Elles ont deux utilisations principales :
 Où vous avez des nuances plus pâles d'une couleur mère et souhaitez replacer la couleur mère à
l'avenir par des teintes se mettant automatiquement à jour.
 Pour étendre la palette de couleurs disponible des encres d'impression.
 Par exemple, une teinte rouge de 25 % donnera une couleur rose. Par conséquent, avec une
encre rouge, vous pouvez obtenir un rouge pur et un rose à partir d'une même encre. De même,
pour une impression noir et blanc, il est souvent utile d'utiliser des teintes afin de créer différentes
nuances de gris.
 Si vous imprimez une palette de couleurs limitée (il est souvent meilleur marché d'imprimer une ou
deux couleurs plutôt que faire une impression en quadrichromie).
Une teinte peut être basée sur tout type de couleurs, incluant une autre teinte.
Toute modification effectuée sur une couleur mère modifiera les teintes basées sur celle-ci. Par exemple,
vous pouvez définir la couleur rose comme 50 % d'une couleur mère rouge. Si vous changez la couleur
mère en orange, le rose passera automatiquement à l'orange clair.
Nuances
Celles-ci permettent de créer des couleurs plus claires ou plus foncées basées sur une couleur mère. En
changeant la couleur mère, vous modifiez toutes les teintes associées. Par exemple, un dessin d'une
voiture peut utiliser des nuances pour souligner les reflets et les ombres de la carrosserie. Une simple
édition de la couleur mère entraîne une modification de toutes les couleurs de la carrosserie tout en
maintenant les nuances. Le réglage des nuances de cette manière prend plus de temps mais est un moyen
très efficace de modifier les couleurs.
Pour de meilleurs résultats, la couleur mère doit être un couleur « pure » saturée. En mode de couleur
TSV, la saturation et la valeur doivent idéalement être fixées à 100 %. Dans l'Éditeur de couleurs
, la croix doit être placée dans le coin en haut à gauche.
Couleurs liées
Les couleurs liées sont similaires aux nuances mais offrent une plus grande flexibilité. Elles sont également
basées sur une couleur mère mais c'est vous qui définissez quels attributs la couleur liée doit partager
avec sa couleur mère. Par exemple, vous pouvez créer une couleur liée qui sera une version plus saturée
de la couleur mère, mais dont teinte et la luminosité seront celles de la couleur mère.
Page 377
Nuances
Celles-ci permettent de créer des couleurs plus claires ou plus foncées basées sur une couleur mère. En
changeant la couleur mère, vous modifiez toutes les teintes associées. Par exemple, un dessin d'une
voiture peut utiliser des nuances pour souligner les reflets et les ombres de la carrosserie. Une simple
édition de la couleur mère entraîne une modification de toutes les couleurs de la carrosserie tout en
maintenant les nuances. Le réglage des nuances de cette manière prend plus de temps mais est un moyen
très efficace de modifier les couleurs.
Pour de meilleurs résultats, la couleur mère doit être un couleur « pure » saturée. En mode de couleur
TSV, la saturation et la valeur doivent idéalement être fixées à 100 %. Dans l'Éditeur de couleurs
, la croix doit être placée dans le coin en haut à gauche.
Couleurs liées
Les couleurs liées sont similaires aux nuances mais offrent une plus grande flexibilité. Elles sont également
basées sur une couleur mère mais c'est vous qui définissez quels attributs la couleur liée doit partager
avec sa couleur mère. Par exemple, vous pouvez créer une couleur liée qui sera une version plus saturée
de la couleur mère, mais dont teinte et la luminosité seront celles de la couleur mère.
Page 378
Couleurs liées
Les couleurs liées sont similaires aux nuances mais offrent une plus grande flexibilité. Elles sont également
basées sur une couleur mère mais c'est vous qui définissez quels attributs la couleur liée doit partager
avec sa couleur mère. Par exemple, vous pouvez créer une couleur liée qui sera une version plus saturée
de la couleur mère, mais dont teinte et la luminosité seront celles de la couleur mère.
Page 379
Création d'une teinte, d'une nuance ou d'une
couleur liée
Reportez-vous ci-dessous pour une description des Teintes, Nuances et Couleurs liées
. Elles sont utiles pour les endroits où vous voulez qu'une nuance plus claire ou plus foncée suive celle de
la couleur mère.
Les teintes, nuances et couleurs liées doivent avoir une couleur « mère » dominante qui doit être une
Couleur nommée, de façon à ce que lorsque vous modifiez cette couleur mère, la teinte change aussi.
Créez donc au besoin tout d'abord une couleur mère. (Voir Créer des nouvelles couleurs nommées
).
Création d'une teinte, d'une nuance ou d'une couleur liée :
1. Sélectionner l'(es) objet(s) au(x)quel(s) vous souhaitez appliquer la couleur.
2. Ouvrez l'Éditeur de couleurs qui vous montre les options avancées.
3. Sélectionnez le menu déroulant des « Couleurs normales », puis l'option Teinte, Nuance ou
Couleur liée.
4. Dans le menu déroulant Couleur mère, choisissez la couleur nommée à laquelle vous souhaitez
rattacher cette couleur.
5. Réglez la Teinte, la Nuance ou la Couleur liée dans la section supérieure de l'éditeur de
couleurs.
Si les options teinte, nuance et couleurs liées n'apparaissent pas dans le menu déroulant, cela signifie
sûrement que vous n'avez pas encore créé de couleur mère à relier à d'autres, ou alors que vous êtes en
train d'éditer la seule et unique couleur nommée dans le dessin.
Sur la gauche, vous pouvez voir que la nouvelle couleur est une teinte de la couleur mère
« Jaune » et que par conséquent, l'éditeur ne propose que des teintes plus pâles de la couleur
mère. Sur la droite, si vous choisissez une nuance, vous avez le choix entre des nuances plus
claires ou plus foncées que la couleur mère.
Si vous souhaitez vous servir de ces couleurs à plusieurs endroits du document, nous vous
recommandons de faire de cette couleur une couleur nommée, de façon à ce qu'elle apparaisse dans la
palette des couleurs et que vous puissiez l'employer facilement. Pour ce faire, cliquez sur l'icône
Page 380
Nouvelle couleur nommée
en haut de l'Éditeur de couleur et nommez celle-ci. Elle apparaît à présent dans la palette des couleurs et
vous pouvez la réutiliser.
Éditer la couleur mère
Utiliser les teintes, nuances et couleurs liées permet de suivre toute modification effectuée sur la couleur
mère. Pour voir le résultat, essayer d'éditer la Couleur nommée mère (la faire glisser depuis la Palette
de couleurs vers l'Éditeur de couleurs
et modifier la couleur). Vous verrez les objets avec la teinte, la nuance ou la couleur liée changer
simultanément avec la couleur mère.
Remarque : veillez à ne pas éditer la couleur des objets sur la page sur laquelle vous avez appliqué des
couleurs Nommées, des Teintes, des Nuances ou des Couleurs liées car elles se changeraient en
Couleurs locales
.
Page 381
Éditer la couleur mère
Utiliser les teintes, nuances et couleurs liées permet de suivre toute modification effectuée sur la couleur
mère. Pour voir le résultat, essayer d'éditer la Couleur nommée mère (la faire glisser depuis la Palette
de couleurs vers l'Éditeur de couleurs
et modifier la couleur). Vous verrez les objets avec la teinte, la nuance ou la couleur liée changer
simultanément avec la couleur mère.
Remarque : veillez à ne pas éditer la couleur des objets sur la page sur laquelle vous avez appliqué des
couleurs Nommées, des Teintes, des Nuances ou des Couleurs liées car elles se changeraient en
Couleurs locales
.
Page 382
Utilisation du texte
Dans ce chapitre
Introduction
Terminologie
Outil Texte
Menu des polices
Texte simple
Texte en colonne
Zones de texte
Texte le long d'une courbe
Édition de texte
Vérificateur d'orthographe
Synchronisation de texte à l'aide de groupes souples
Tabulations, marges et retraits
Les objets de renvoi de texte
Appliquer des styles de texte
Liens hypertextes
Texte à l'intérieur de groupes pour sites Web
Copier les polices
Copier/coller un texte formaté (RTF)
Visualiser les polices utilisées actuellement
Intégration des polices
Compatibilité de texte navigateur
Page 383
Introduction
Les options d'édition de texte de Xtreme Web Designer 5 sont très proches de celles de votre éditeur
de texte ou de votre programme de traitement de texte, mais elles fournissent en outre une série de
caractéristiques que vous ne trouverez pas dans ces logiciels :
vous pouvez agrandir ou grossir un texte de façon conséquente.
Vous pouvez appliquer l'ensemble des attributs et des effets
de Xtreme Web Designer 5 : remplissages, estompage,
transparence, fondus de couleurs, ombres, tout en continuant
à éditer le texte.
Vous pouvez convertir les contours de personnages en
formes que vous pouvez éditer comme des formes normales.
Vous pouvez ajuster le texte à une courbe. Tout texte peut être tourné, incliné ou étiré.
Page 384
Terminologie
Police ou Style de police
: ensemble de caractères ayant un style homogène.
Famille de police
: ensemble de polices similaires. Par exemple Garamond et Garamond Italic constituent des polices
différentes de la même famille Garamond.
Justification :
autre façon de décrire l'alignement d'un texte. Un texte aligné à gauche est parfois dit justifié à gauche.
Monospace
: les caractères individuels d'une police monospace ont la même largeur. Parfois désignées comme des
polices à chasse fixe. Utile pour les listings de programmes. Courier est la police monospace la plus
répandue. La plupart des polices sont des polices espacées proportionnellement, c'est-à-dire que les
caractères varient en largeur.
Point
: la taille du texte ou de la police est généralement mesurée en points, abrégée en pt. 1 pt correspond
environ à 1/72 de pouce ; ainsi un texte de 72 pt fait environ 1 pouce, bien que différentes polices d'une
taille donnée puissent varier.
Page 385
Outil Texte
Utilisez l'Outil Texte
(raccourci F8) pour saisir ou modifier du texte.
Xtreme Web Designer 5 prend en charge trois types d'objets-texte de base.
 Lignes de texte simple : cliquez sur la page et tapez votre texte.
 Colonnes de texte : cliquez et faites glisser le curseur de votre souris pour créer une colonne et
saisir le texte.
 Zones de texte : cliquez et faites glisser en diagonale pour créer une zone rectangulaire et saisir le
texte.
Après avoir créé un objet-texte, vous pouvez le transformer (le faire tourner, le redimensionner, l'incliner)
et lui appliquer tous les attributs usuels, couleur de remplissage, transparence, estompage, etc. à l'aide
des outils habituels. Vous pouvez également l'attacher à une courbe. Le texte restera éditable.
Page 386
Menu des polices
Le menu des polices comprend toutes les polices installées et les classe en trois sections. La section
supérieure présente toutes les polices utilisées actuellement dans le document. La seconde section montre
les polices « Web safe ». Il s'agit des polices que vous pouvez utiliser en toute sécurité sur les pages web
car tous les navigateurs Internet communs les prennent en charge. Pour en savoir plus, consultez la
section « Polices web safe ». La dernière section affiche une liste alphabétique de toutes les autres
polices installées. Chaque nom de police est affiché dans le menu dans son propre type de caractères
pour faciliter la sélection.
Ces polices pour lesquelles de nombreux styles sont disponibles sont affichées avec un petit triangle noir
sur le côté droit du menu. Positionnez le pointeur de la souris sur le nom d'une de ces polices pour faire
apparaître un petit sous-menu contenant une liste des styles disponibles pour cette police. Il vous suffit
alors de déplacer la souris sur le style désiré pour le sélectionner.
Polices Web safe
Seul un petit ensemble de polices peut être utilisé en toute sécurité pour le texte principal d'un site
Internet – il s'agit des seules polices dont vous pouvez être sûr qu'elles existent sur l'ordinateur du visiteur.
Bien qu'il n'existe pas de garantie, il existe un sous-ensemble de polices largement utilisées par environ
98 % des ordinateurs, y compris des ordinateurs Apple Mac et certains ordinateurs Linux. Ces polices
sont appelées « Polices Web safe » et sont répertoriées dans une section séparée du menu des polices.
Si vous tentez d'exporter un site web en utilisant d'autres polices que les polices Web safe, vous serez
averti.
Prévisualisation des polices en temps réel
Lorsque vous déplacez le curseur de la souris sur une entrée du menu des polices, le texte sélectionné
est alors prévisualisé immédiatement dans la police correspondante. Cette modification ne sera
Page 387
permanente que si vous cliquez sur cette police pour la sélectionner. Lorsque vous bougez à nouveau la
souris, le texte sera de nouveau affiché dans la police d'origine jusqu'à ce que le curseur soit positionné à
nouveau sur une autre police dans le menu. Cette fonction permet de visualiser très rapidement un grand
nombre de polices.
Si vous maintenez la touche Maj enfoncée lorsque vous parcourez le menu des polices, la sélection n'est
pas mise à jour instantanément, une petite pause est nécessaire avant la mise à jour. Cette fonction est
utile si vous trouvez que la prévisualisation instantanée ralentit votre parcours du menu (si vous avez
sélectionné un large volume de texte, par exemple).
Prévisualisation de la taille des polices en temps réel
À côté du menu de taille des polices se trouve un petit menu contextuel avec réglette, similaire à celle
utilisée dans Web Designer. Cela permet de contrôler directement et en temps réel la taille des polices, et
ajustera la taille des polices du texte sélectionné en temps réel lorsque vous déplacez la réglette.
Comme les réglettes utilisées dans d'autres emplacements du programme, vous pouvez utiliser celle-ci de
deux manières différentes. Pour afficher le menu, cliquez puis relâchez. Vous pouvez maintenant déplacer
la réglette ou utiliser la molette de la souris pour ajuster rapidement les valeurs. Dans ce cas, vous pouvez
ajuster très rapidement la taille des points à l'aide de la souris et visionner directement le résultat sur la
page du document dans lequel vous travaillez.
Vous pouvez également utiliser les réglettes du menu contextuel en cliquant puis tirant puis relâchant le
bouton et la réglette. Il s'agit d'une manière encore plus directe d'ajuster le contrôle (moins de clics
requis).
Navigation du menu des polices instantanées
Lorsque le menu des polices est affiché, vous pouvez entrer les premiers caractères du nom de la police
et le menu défilera automatiquement jusqu'à la section correspondante dans la liste. Par exemple, si vous
entrez « ver », le menu va défiler automatiquement jusqu'à la police Verdana.
Page 388
Polices Web safe
Seul un petit ensemble de polices peut être utilisé en toute sécurité pour le texte principal d'un site
Internet – il s'agit des seules polices dont vous pouvez être sûr qu'elles existent sur l'ordinateur du visiteur.
Bien qu'il n'existe pas de garantie, il existe un sous-ensemble de polices largement utilisées par environ
98 % des ordinateurs, y compris des ordinateurs Apple Mac et certains ordinateurs Linux. Ces polices
sont appelées « Polices Web safe » et sont répertoriées dans une section séparée du menu des polices.
Si vous tentez d'exporter un site web en utilisant d'autres polices que les polices Web safe, vous serez
averti.
Prévisualisation des polices en temps réel
Lorsque vous déplacez le curseur de la souris sur une entrée du menu des polices, le texte sélectionné
est alors prévisualisé immédiatement dans la police correspondante. Cette modification ne sera
permanente que si vous cliquez sur cette police pour la sélectionner. Lorsque vous bougez à nouveau la
souris, le texte sera de nouveau affiché dans la police d'origine jusqu'à ce que le curseur soit positionné à
nouveau sur une autre police dans le menu. Cette fonction permet de visualiser très rapidement un grand
nombre de polices.
Si vous maintenez la touche Maj enfoncée lorsque vous parcourez le menu des polices, la sélection n'est
pas mise à jour instantanément, une petite pause est nécessaire avant la mise à jour. Cette fonction est
utile si vous trouvez que la prévisualisation instantanée ralentit votre parcours du menu (si vous avez
sélectionné un large volume de texte, par exemple).
Prévisualisation de la taille des polices en temps réel
À côté du menu de taille des polices se trouve un petit menu contextuel avec réglette, similaire à celle
utilisée dans Web Designer. Cela permet de contrôler directement et en temps réel la taille des polices, et
ajustera la taille des polices du texte sélectionné en temps réel lorsque vous déplacez la réglette.
Comme les réglettes utilisées dans d'autres emplacements du programme, vous pouvez utiliser celle-ci de
deux manières différentes. Pour afficher le menu, cliquez puis relâchez. Vous pouvez maintenant déplacer
la réglette ou utiliser la molette de la souris pour ajuster rapidement les valeurs. Dans ce cas, vous pouvez
ajuster très rapidement la taille des points à l'aide de la souris et visionner directement le résultat sur la
page du document dans lequel vous travaillez.
Vous pouvez également utiliser les réglettes du menu contextuel en cliquant puis tirant puis relâchant le
bouton et la réglette. Il s'agit d'une manière encore plus directe d'ajuster le contrôle (moins de clics
requis).
Navigation du menu des polices instantanées
Lorsque le menu des polices est affiché, vous pouvez entrer les premiers caractères du nom de la police
et le menu défilera automatiquement jusqu'à la section correspondante dans la liste. Par exemple, si vous
entrez « ver », le menu va défiler automatiquement jusqu'à la police Verdana.
Page 389
Prévisualisation des polices en temps réel
Lorsque vous déplacez le curseur de la souris sur une entrée du menu des polices, le texte sélectionné
est alors prévisualisé immédiatement dans la police correspondante. Cette modification ne sera
permanente que si vous cliquez sur cette police pour la sélectionner. Lorsque vous bougez à nouveau la
souris, le texte sera de nouveau affiché dans la police d'origine jusqu'à ce que le curseur soit positionné à
nouveau sur une autre police dans le menu. Cette fonction permet de visualiser très rapidement un grand
nombre de polices.
Si vous maintenez la touche Maj enfoncée lorsque vous parcourez le menu des polices, la sélection n'est
pas mise à jour instantanément, une petite pause est nécessaire avant la mise à jour. Cette fonction est
utile si vous trouvez que la prévisualisation instantanée ralentit votre parcours du menu (si vous avez
sélectionné un large volume de texte, par exemple).
Prévisualisation de la taille des polices en temps réel
À côté du menu de taille des polices se trouve un petit menu contextuel avec réglette, similaire à celle
utilisée dans Web Designer. Cela permet de contrôler directement et en temps réel la taille des polices, et
ajustera la taille des polices du texte sélectionné en temps réel lorsque vous déplacez la réglette.
Comme les réglettes utilisées dans d'autres emplacements du programme, vous pouvez utiliser celle-ci de
deux manières différentes. Pour afficher le menu, cliquez puis relâchez. Vous pouvez maintenant déplacer
la réglette ou utiliser la molette de la souris pour ajuster rapidement les valeurs. Dans ce cas, vous pouvez
ajuster très rapidement la taille des points à l'aide de la souris et visionner directement le résultat sur la
page du document dans lequel vous travaillez.
Vous pouvez également utiliser les réglettes du menu contextuel en cliquant puis tirant puis relâchant le
bouton et la réglette. Il s'agit d'une manière encore plus directe d'ajuster le contrôle (moins de clics
requis).
Navigation du menu des polices instantanées
Lorsque le menu des polices est affiché, vous pouvez entrer les premiers caractères du nom de la police
et le menu défilera automatiquement jusqu'à la section correspondante dans la liste. Par exemple, si vous
entrez « ver », le menu va défiler automatiquement jusqu'à la police Verdana.
Page 390
Prévisualisation de la taille des polices en temps réel
À côté du menu de taille des polices se trouve un petit menu contextuel avec réglette, similaire à celle
utilisée dans Web Designer. Cela permet de contrôler directement et en temps réel la taille des polices, et
ajustera la taille des polices du texte sélectionné en temps réel lorsque vous déplacez la réglette.
Comme les réglettes utilisées dans d'autres emplacements du programme, vous pouvez utiliser celle-ci de
deux manières différentes. Pour afficher le menu, cliquez puis relâchez. Vous pouvez maintenant déplacer
la réglette ou utiliser la molette de la souris pour ajuster rapidement les valeurs. Dans ce cas, vous pouvez
ajuster très rapidement la taille des points à l'aide de la souris et visionner directement le résultat sur la
page du document dans lequel vous travaillez.
Vous pouvez également utiliser les réglettes du menu contextuel en cliquant puis tirant puis relâchant le
bouton et la réglette. Il s'agit d'une manière encore plus directe d'ajuster le contrôle (moins de clics
requis).
Navigation du menu des polices instantanées
Lorsque le menu des polices est affiché, vous pouvez entrer les premiers caractères du nom de la police
et le menu défilera automatiquement jusqu'à la section correspondante dans la liste. Par exemple, si vous
entrez « ver », le menu va défiler automatiquement jusqu'à la police Verdana.
Page 391
Navigation du menu des polices instantanées
Lorsque le menu des polices est affiché, vous pouvez entrer les premiers caractères du nom de la police
et le menu défilera automatiquement jusqu'à la section correspondante dans la liste. Par exemple, si vous
entrez « ver », le menu va défiler automatiquement jusqu'à la police Verdana.
Page 392
Texte simple
Si vous souhaitez saisir une petite quantité de texte simple, positionnez le pointeur où vous souhaitez le
faire puis cliquez. Un curseur rouge apparaît à l'endroit où vous avez cliqué et vous pouvez alors
commencer la saisie à partir du clavier.
Si vous faites une erreur, utilisez Supprimer et Retour.
Appuyez sur Entrée pour terminer la ligne et commencer une nouvelle ligne de texte en dessous.
L'espacement de l'interligne est commandé par la boîte de dialogue de l'espacement de ligne de la barre
d'infos.
Les contours de texte n'ont par défaut aucune couleur. Pour attribuer une couleur aux contours du texte
sélectionné, cliquez sur une couleur de la palette en maintenant la touche Maj enfoncée. Vous pouvez
ensuite ajuster l'épaisseur grâce à la fonction de largeur de ligne. Vous souhaitez sûrement arrondir les
intersections
afin de lui conférer une apparence plus douce (contrôle en haut de la Galerie des lignes).
La largeur de ligne est décrite dans le chapitre Dessiner des lignes. L'application de couleurs est décrite
dans le chapitre Utilisation des couleurs
.
Vous pouvez continuer à saisir du texte même après avoir appliqué une rotation, une couleur de
remplissage ainsi que divers types d'effets en direct ou placé le texte sur une courbe.
Page 393
Texte en colonne
Si vous saisissez de grandes quantités de texte, sur plusieurs lignes, l'utilisation d'une colonne sera sans
doute plus pratique. Le texte sera automatiquement réorganisé si vous modifiez la largeur de la colonne.
Saisir une colonne de texte :
1. Sélectionner l'Outil d'ajout de texte.
2. Déplacez le pointeur de la souris où vous souhaitez que la colonne démarre.
3. Faites-le glisser afin de créer une ligne horizontale de la largeur de la colonne. Cette ligne rouge
vous indiquera la largeur de la colonne. Elle ne sera pas imprimée.
4. Saisissez le texte. Vous n'avez pas besoin d'appuyer sur entrée à la fin de la ligne. Lorsque le
texte atteint le bord de la colonne, il continue automatiquement sur une nouvelle ligne.
Remarque
: si vous cliquez ailleurs ou si vous changez d'ouitl avant de commencer la saisie, la colonne de texte sera
supprimée et il ne restera plus rien sur la page. Toutefois, ne commencez la saisie qu'après avoir tiré la
ligne de la largeur de la colonne.
Au lieu de saisir le texte, vous pouvez créer le texte dans un éditeur de texte séparé, ou dans un logiciel
de traitement de texte, le copier dans le presse-papier et le coller dans Xtreme Web Designer 5. La
fonction copier-coller supporte le texte au format RTF.
Les mots se répartissent sur deux lignes uniquement s'ils comportent un tiret (touche moins).
L'effet de taper un tiret dans « running »
Si vous saisissez Ctrl+- (touche moins), cela insère un trait d'union
qui est en réalité un tiret apparaissant uniquement lorsque le mot peut être coupé à la fin d'une ligne. Ceci
est particulièrement utile dans les colonnes de texte étroites ; afin d'éviter trop de blancs, essayez de
mettre un trait d'union à certains mots. Si vous insérez un tiret demi-cadratin, le mot se coupera en fin de
ligne. On l'appelle « trait d'union » parce que lorsque le mot apparaît en milieu de ligne, le tiret disparaît
(contrairement à un tiret demi-cadratin normal ou un tiret) et il coupe les mots intelligemment si besoin
est.
Lors de l'édition du texte, un trait d'union est traité comme un caractère invisible (il n'occupe pas
d'espace), mais vous pouvez vérifier qu'il est dans le texte en déplaçant le curseur à gauche ou à droite
sur l'endroit où se trouve le caractère invisible.
Un tiret
peut être inséré en tapant Ctrl+Maj+ - (touche moins). Un tiret ne provoquera pas un retour à la ligne.
Ceci est très utile lorsque vous avez des tirets dans des mots que vous ne souhaitez pas voir coupés à la
fin de lignes.
Modifier la largeur de la colonne.
Tirer les deux poignées rouges aux extrémités de la ligne.
Modifier l'angle de la colonne
Maj+tirer l'une des deux poignées rouges aux extrémités de la ligne pour modifier l'angle de la colonne.
Autre possibilité : Ctrl+tirer pour restreindre la ligne aux angles forcés. Ou encore, vous pouvez utiliser l'
Outil de sélection
pour faire tourner l'objet.
Pour plus d'informations sur les angles forcés, voir le chapitre Introduction à Xtreme Web Designer 5.
Page 394
Modifier la largeur de la colonne.
Tirer les deux poignées rouges aux extrémités de la ligne.
Modifier l'angle de la colonne
Maj+tirer l'une des deux poignées rouges aux extrémités de la ligne pour modifier l'angle de la colonne.
Autre possibilité : Ctrl+tirer pour restreindre la ligne aux angles forcés. Ou encore, vous pouvez utiliser l'
Outil de sélection
pour faire tourner l'objet.
Pour plus d'informations sur les angles forcés, voir le chapitre Introduction à Xtreme Web Designer 5.
Page 395
Modifier l'angle de la colonne
Maj+tirer l'une des deux poignées rouges aux extrémités de la ligne pour modifier l'angle de la colonne.
Autre possibilité : Ctrl+tirer pour restreindre la ligne aux angles forcés. Ou encore, vous pouvez utiliser l'
Outil de sélection
pour faire tourner l'objet.
Pour plus d'informations sur les angles forcés, voir le chapitre Introduction à Xtreme Web Designer 5.
Page 396
Zones de texte
Dans l'Outil Texte
, si vous cliquez et tirez diagonalement sur la page, vous créerez une zone de texte rectangulaire. Le
curseur clignotant se positionnera en haut à gauche et vous pourrez saisir ou coller du texte.
Une zone de texte peut contenir un texte « fluide ». Il s'agit d'un bloc de texte unique, coulant d'une zone
de texte à l'autre. On parle d'un texte fluide car, tout comme l'eau, lorsque vous ajoutez ou supprimez du
texte dans une zone, il s'adapte en fonction des zones de texte connectées.
Si le texte dépasse du bas de la zone de texte, le texte dépassant sera grisé mais il sera possible de
continuer à l'éditer normalement.
Connecter les zones de texte—flux de texte
Lorsque le texte dépasse du bas de la zone de texte, un indicateur de dépassement s'affiche au bas de la
zone de texte. Si vous le faites glisser au-dessus de tout autre zone de texte, le texte dépassant s'écoulera
dans la nouvelle zone de texte et les deux zones seront connectées. Ceci est indiqué par une flèche de
flux.
Faites glisser l'indicateur de dépassement d'une zone de texte à l'autre pour connecter deux zones de
façon à ce que le texte s'écoule de l'une vers l'autre. Vous pouvez en lier autant que vous le souhaitez.
Astuce :
il existe un moyen rapide de créer du texte fluide. Si le curseur de texte se trouve dans une zone avec du
texte qui dépasse, cliquer-tirer sur la page pour créer une nouvelle zone de texte. La nouvelle zone de
texte sera automatiquement connectée et le texte s'écoulera dans la nouvelle zone.
Astuce :
vous pouvez faire passer du texte d'une zone vers une autre sur n'importe quelle page, même des pages
précédentes. Si vous avez besoin de faire passer du texte dans une zone située de nombreuses pages
auparavant, il sera sans doute plus facile d'utiliser la méthode ci-dessus ; à moins que vous ne fassiez un
zoom arrière afin d'obtenir de petites pages vous permettant de faire glisser la flèche de dépassement par
dessus les pages.
Pour déconnecter une zone de texte d'une autre, faites glisser l'indicateur de dépassement et déposez-le
hors d'une zone de texte.
Si vous supprimez une zone de texte connectée à une autre, seule la zone sera supprimée, le texte
passera sur les zones de texte restantes.
Redimensionner des zones de texte
Dans l'Outil Texte
, vous pouvez cliquer et tirer sur l'une des poignées de contrôle d'angle. Le texte dans la zone sera
reformaté afin de s'ajuster à la nouvelle taille.
Vous pouvez également utiliser l'Outil de sélection pour redimensionner l'objet-texte, mais dans ce
cas-là, le comportement sera différent. C'est la taille du texte lui-même qui change si vous redimensionnez
un texte à l'aide de l'Outil de sélection. Ceci est cohérent par rapport au mode de fonctionnement normal
de l'Outil de sélection
.
Toutefois, dans le cas de zones de texte fluide, il existe un risque d'effets secondaires indésirables : vous
ne souhaitez sans doute pas qu'une partie d'un texte fluide diffère d'un point de taille du reste. Le
Page 397
comportement de l'Outil de sélection
varie si vous redimensionnez une zone de texte contenant un texte fluide ou si vous redimensionnez
l'ensemble du texte. La règle à suivre est la suivante :
 Si vous redimensionnez une zone de texte simple non connectée (ou une colonne simple ou de
texte), alors le « contenant » de la zone et le contenu du texte seront redimensionnés ensemble.
 Si vous sélectionnez les zones de texte de l'ensemble du texte fluide (elles doivent se trouver sur
une seule et même page), le redimensionnement s'effectuera à la fois sur le texte et sur les zones.
 Mais si vous redimensionnez une zone de texte faisant partie d'une série de zones de texte, seule
la taille du contenant sera modifiée et le texte à l'intérieur conservera sa taille originale et sera
reformaté pour s'ajuster à la nouvelle taille. Ceci rappelle le redimensionnement d'une zone de
texte avec l'Outil Texte.
Si vous souhaitez redimensionner tout le texte d'un article de texte, sélectionnez-le intégralement à l'aide
de « Ctrl+A » et appliquez-lui la taille de police souhaitée.
Vous pouvez faire pivoter une zone de texte à l'aide de l'Outil de sélection
comme d'habitude, et le texte s'« écoulera » normalement par la zone de texte pivotée.
Le flux de texte ne sera pas affecté si vous faites tourner n'importe quelle zone de texte.
Maintenez la touche CTRL enfoncée lorsque vous faites tourner pour contraindre l'angle de rotation du
texte à des angles de 90 degrés et à des angles alignés le long de l'écran.
Compte de mots
Le compte de mots et de caractères total du texte courant est affiché dans la ligne de statut. Elle affiche
aussi le nombre de mots dépassant. Si une section du texte est sélectionnée, elle affiche le compte de
cette sélection à la place.
Page 398
Connecter les zones de texte—flux de texte
Lorsque le texte dépasse du bas de la zone de texte, un indicateur de dépassement s'affiche au bas de la
zone de texte. Si vous le faites glisser au-dessus de tout autre zone de texte, le texte dépassant s'écoulera
dans la nouvelle zone de texte et les deux zones seront connectées. Ceci est indiqué par une flèche de
flux.
Faites glisser l'indicateur de dépassement d'une zone de texte à l'autre pour connecter deux zones de
façon à ce que le texte s'écoule de l'une vers l'autre. Vous pouvez en lier autant que vous le souhaitez.
Astuce :
il existe un moyen rapide de créer du texte fluide. Si le curseur de texte se trouve dans une zone avec du
texte qui dépasse, cliquer-tirer sur la page pour créer une nouvelle zone de texte. La nouvelle zone de
texte sera automatiquement connectée et le texte s'écoulera dans la nouvelle zone.
Astuce :
vous pouvez faire passer du texte d'une zone vers une autre sur n'importe quelle page, même des pages
précédentes. Si vous avez besoin de faire passer du texte dans une zone située de nombreuses pages
auparavant, il sera sans doute plus facile d'utiliser la méthode ci-dessus ; à moins que vous ne fassiez un
zoom arrière afin d'obtenir de petites pages vous permettant de faire glisser la flèche de dépassement par
dessus les pages.
Pour déconnecter une zone de texte d'une autre, faites glisser l'indicateur de dépassement et déposez-le
hors d'une zone de texte.
Si vous supprimez une zone de texte connectée à une autre, seule la zone sera supprimée, le texte
passera sur les zones de texte restantes.
Redimensionner des zones de texte
Dans l'Outil Texte
, vous pouvez cliquer et tirer sur l'une des poignées de contrôle d'angle. Le texte dans la zone sera
reformaté afin de s'ajuster à la nouvelle taille.
Vous pouvez également utiliser l'Outil de sélection pour redimensionner l'objet-texte, mais dans ce
cas-là, le comportement sera différent. C'est la taille du texte lui-même qui change si vous redimensionnez
un texte à l'aide de l'Outil de sélection. Ceci est cohérent par rapport au mode de fonctionnement normal
de l'Outil de sélection
.
Toutefois, dans le cas de zones de texte fluide, il existe un risque d'effets secondaires indésirables : vous
ne souhaitez sans doute pas qu'une partie d'un texte fluide diffère d'un point de taille du reste. Le
comportement de l'Outil de sélection
varie si vous redimensionnez une zone de texte contenant un texte fluide ou si vous redimensionnez
l'ensemble du texte. La règle à suivre est la suivante :
 Si vous redimensionnez une zone de texte simple non connectée (ou une colonne simple ou de
texte), alors le « contenant » de la zone et le contenu du texte seront redimensionnés ensemble.
 Si vous sélectionnez les zones de texte de l'ensemble du texte fluide (elles doivent se trouver sur
une seule et même page), le redimensionnement s'effectuera à la fois sur le texte et sur les zones.
 Mais si vous redimensionnez une zone de texte faisant partie d'une série de zones de texte, seule
la taille du contenant sera modifiée et le texte à l'intérieur conservera sa taille originale et sera
reformaté pour s'ajuster à la nouvelle taille. Ceci rappelle le redimensionnement d'une zone de
texte avec l'Outil Texte.
Page 399
Si vous souhaitez redimensionner tout le texte d'un article de texte, sélectionnez-le intégralement à l'aide
de « Ctrl+A » et appliquez-lui la taille de police souhaitée.
Vous pouvez faire pivoter une zone de texte à l'aide de l'Outil de sélection
comme d'habitude, et le texte s'« écoulera » normalement par la zone de texte pivotée.
Le flux de texte ne sera pas affecté si vous faites tourner n'importe quelle zone de texte.
Maintenez la touche CTRL enfoncée lorsque vous faites tourner pour contraindre l'angle de rotation du
texte à des angles de 90 degrés et à des angles alignés le long de l'écran.
Compte de mots
Le compte de mots et de caractères total du texte courant est affiché dans la ligne de statut. Elle affiche
aussi le nombre de mots dépassant. Si une section du texte est sélectionnée, elle affiche le compte de
cette sélection à la place.
Page 400
Redimensionner des zones de texte
Dans l'Outil Texte
, vous pouvez cliquer et tirer sur l'une des poignées de contrôle d'angle. Le texte dans la zone sera
reformaté afin de s'ajuster à la nouvelle taille.
Vous pouvez également utiliser l'Outil de sélection pour redimensionner l'objet-texte, mais dans ce
cas-là, le comportement sera différent. C'est la taille du texte lui-même qui change si vous redimensionnez
un texte à l'aide de l'Outil de sélection. Ceci est cohérent par rapport au mode de fonctionnement normal
de l'Outil de sélection
.
Toutefois, dans le cas de zones de texte fluide, il existe un risque d'effets secondaires indésirables : vous
ne souhaitez sans doute pas qu'une partie d'un texte fluide diffère d'un point de taille du reste. Le
comportement de l'Outil de sélection
varie si vous redimensionnez une zone de texte contenant un texte fluide ou si vous redimensionnez
l'ensemble du texte. La règle à suivre est la suivante :
 Si vous redimensionnez une zone de texte simple non connectée (ou une colonne simple ou de
texte), alors le « contenant » de la zone et le contenu du texte seront redimensionnés ensemble.
 Si vous sélectionnez les zones de texte de l'ensemble du texte fluide (elles doivent se trouver sur
une seule et même page), le redimensionnement s'effectuera à la fois sur le texte et sur les zones.
 Mais si vous redimensionnez une zone de texte faisant partie d'une série de zones de texte, seule
la taille du contenant sera modifiée et le texte à l'intérieur conservera sa taille originale et sera
reformaté pour s'ajuster à la nouvelle taille. Ceci rappelle le redimensionnement d'une zone de
texte avec l'Outil Texte.
Si vous souhaitez redimensionner tout le texte d'un article de texte, sélectionnez-le intégralement à l'aide
de « Ctrl+A » et appliquez-lui la taille de police souhaitée.
Vous pouvez faire pivoter une zone de texte à l'aide de l'Outil de sélection
comme d'habitude, et le texte s'« écoulera » normalement par la zone de texte pivotée.
Le flux de texte ne sera pas affecté si vous faites tourner n'importe quelle zone de texte.
Maintenez la touche CTRL enfoncée lorsque vous faites tourner pour contraindre l'angle de rotation du
texte à des angles de 90 degrés et à des angles alignés le long de l'écran.
Compte de mots
Le compte de mots et de caractères total du texte courant est affiché dans la ligne de statut. Elle affiche
aussi le nombre de mots dépassant. Si une section du texte est sélectionnée, elle affiche le compte de
cette sélection à la place.
Page 401
Compte de mots
Le compte de mots et de caractères total du texte courant est affiché dans la ligne de statut. Elle affiche
aussi le nombre de mots dépassant. Si une section du texte est sélectionnée, elle affiche le compte de
cette sélection à la place.
Page 402
Texte le long d'une courbe
Pour placer du texte le long d'une courbe de votre choix :
1. Créez soit un texte
basique, un texte en
colonne ou une zone de
texte (voir plus haut).
2. Sélectionnez votre
objet-texte et une courbe.
3. Choisissez Arranger ->
Ajuster le texte à la
courbe.
Vous pouvez également sélectionner une courbe ou une ligne puis cliquer sur la ligne où vous souhaitez
que le texte démarre dans l'Outil Texte
et le saisir. Ceci ajustera automatiquement le texte le long de la ligne. Lorsque vous atteignez l'extrémité
de la ligne, le texte revient à la ligne, juste en dessous du début de la précédente.
Si vous ne voulez pas que le texte revienne à la ligne, cliquez sur « shift+clic » sur la ligne.
Pour masquer la courbe afin qu'elle ne soit pas visible, sélectionnez l'Outil de changement de formes
et réglez la couleur de la ligne sur Aucune couleur ou une largeur de Aucun
. Vous pouvez également éditer la courbe normalement de cette façon.
L'application de couleurs est décrite dans le chapitre Utilisation des couleurs
.
Ajuster la marge gauche et droite d'un texte à une courbe
Si vous commencez à saisir ou placer une colonne de texte sur une courbe, vous pouvez changer la
position de départ et de fin des poignées rouges. Il vous suffit de les tirer le long de la courbe comme
requis. Si vous centrez du texte, il se trouvera entre ces deux marges.
Échanger les côtés de la ligne
Cliquer droit sur le texte et sélectionner l'option de menu Inverser le texte sur la courbe
.
Vous pouvez aussi inverser la direction de la ligne (Outil de changement de formes, bouton Inverser
les chemins
sur la barre d'infos), le texte se déplacera de l'autre côté de la ligne ou, dans le cas d'une forme fermée,
passera de l'intérieur à l'extérieur de la forme.
Page 403
Ajuster la marge gauche et droite d'un texte à une courbe
Si vous commencez à saisir ou placer une colonne de texte sur une courbe, vous pouvez changer la
position de départ et de fin des poignées rouges. Il vous suffit de les tirer le long de la courbe comme
requis. Si vous centrez du texte, il se trouvera entre ces deux marges.
Échanger les côtés de la ligne
Cliquer droit sur le texte et sélectionner l'option de menu Inverser le texte sur la courbe
.
Vous pouvez aussi inverser la direction de la ligne (Outil de changement de formes, bouton Inverser
les chemins
sur la barre d'infos), le texte se déplacera de l'autre côté de la ligne ou, dans le cas d'une forme fermée,
passera de l'intérieur à l'extérieur de la forme.
Page 404
Échanger les côtés de la ligne
Cliquer droit sur le texte et sélectionner l'option de menu Inverser le texte sur la courbe
.
Vous pouvez aussi inverser la direction de la ligne (Outil de changement de formes, bouton Inverser
les chemins
sur la barre d'infos), le texte se déplacera de l'autre côté de la ligne ou, dans le cas d'une forme fermée,
passera de l'intérieur à l'extérieur de la forme.
Page 405
Édition de texte
Double-cliquer sur un objet-texte d'un outil quelconque vous fait passer sur l'Outil Texte
et place le curseur de la souris sur la position de clic dans le texte.
Toutes les opérations usuelles des logiciels de traitement de texte effectuées avec le curseur et la souris
sont disponibles. Par exemple :
 Cliquez où vous souhaitez placer le curseur.
 Utilisez les touches fléchées pour vous déplacez vers la droite, la gauche, le haut ou le bas.
 Utilisez « Ctrl+les touches fléchées de droite et de gauche » pour vous déplacer un mot vers la
droite ou la gauche.
 Appuyer sur « Début » ou « Fin » pour aller au début ou à la fin de la ligne.
 Appuyer sur « Ctrl + Début » ou « Ctrl + Fin » pour aller au début ou à la fin de l'objet texte.
Sélection du texte :
 "shift+ une » des touches ci-dessus pour sélectionner du texte
 Un double-clic sélectionne un mot.
 Un triple clic, ou « Ctrl+L », sélectionne une ligne entière de texte.
 Un quadruple clic (4x) sélectionne un paragraphe de texte entier.
 Ou survolez seulement le texte dans l'Outil Texte pour le sélectionner.
 « Ctrl + A » sélectionne l'ensemble du texte de l'objet-texte (vous devez pour cela vous trouver
dans l'Outil Texte.)
Si du texte est sélectionné, tout modification d'un attribut s'appliquera uniquement à la section
sélectionnée du texte. Si votre curseur se trouve simplement dans le texte, toute modification d'attribut,
telle que la sélection une nouvelle couleur, n'apparaîtra que lorsque vous saisirez un nouveau texte.
Sélectionner la totalité de l'objet texte
Il existe un raccourci rapide permettant de sélectionner la totalité de l'objet texte. Au lieu d'utiliser
Ctrl+A ou de passer sur tout le texte, appuyez simplement sur la touche Echap
. Cela supprimera le curseur mais sélectionnera la totalité du texte (la ligne de statut confirmera 1 objet
texte). L'application d'un effet ou d'un attribut à l'ensemble de l'article de texte est ainsi grandement
facilitée.
Par exemple, pour changer la taille de police de l'ensemble de l'objet texte, appuyez simplement sur
Echap
et sélectionnez la nouvelle taille dans la barre d'infos.
Changer la casse
Appuyer sur Ctrl+W pour changer la casse du caractère après le curseur de texte et avancer le curseur.
Ainsi, si vous avez saisi une section de texte avec la touche verrou maj activée involontairement, placez
simplement le curseur au début et appuyez en maintenant les touches Ctrl+W enfoncées.
Vous pouvez changer la casse d'une section de texte sélectionnée de la même manière. Le curseur ne
sera pas déplacé.
Guillemets intelligents
Lorsque vous tapez des guillemets simples ' ou des guillemets doubles " Xtreme les convertit
automatiquement en guillemets ouvrant ou fermant appropriés et visuellement adaptés. Ainsi, cela
modifie 'ceci' en 'cela' et les "guillemets" en « guillemets ». Le programme est assez intelligent pour
assimiler l'utilisation d'apostrophes dans les mots remplaçant un caractère manquant, tel que 'don't' qui
devient 'don't'
.
Page 406
Saisir des caractères spéciaux
Il existe de nombreux raccourcis utiles permettant l'insertion de caractères spéciaux, tels que © ou ™.
Voir la section Caractères spéciaux (dans l'outil d'ajout de texte)
du chapitre « Menus et raccourcis clavier ».
Tous ces raccourcis (à l'exception de l'espace insécable) sont compatibles avec Microsoft Word.
Utilisation de texte factice (« Lorem Ipsum »)
Lors de la création de mises en page, il est courant de se servir d'un texte factice, qui a l'apparence d'un
texte avec des caractères typiquement latins mais ne veut rien dire du tout. Ce texte commence par
« Lorem ipsum dolor sit amet... ».
Note historique : ce même texte factice est utilisé depuis plus de 500 ans dans le domaine de l'imprimerie
et des parties de ce texte en latin appartiennent à de vrais textes écrits il y a de cela plus de 2000 ans.
Vous pouvez insérer un paragraphe de texte factice en utilisant la combinaison Ctrl+Maj+L (L pour
Lorem) lorsque vous vous trouvez dans l'outil texte. Si vous voulez insérer plus de texte, répétez cette
combinaison plusieurs fois.
Page 407
Sélectionner la totalité de l'objet texte
Il existe un raccourci rapide permettant de sélectionner la totalité de l'objet texte. Au lieu d'utiliser
Ctrl+A ou de passer sur tout le texte, appuyez simplement sur la touche Echap
. Cela supprimera le curseur mais sélectionnera la totalité du texte (la ligne de statut confirmera 1 objet
texte). L'application d'un effet ou d'un attribut à l'ensemble de l'article de texte est ainsi grandement
facilitée.
Par exemple, pour changer la taille de police de l'ensemble de l'objet texte, appuyez simplement sur
Echap
et sélectionnez la nouvelle taille dans la barre d'infos.
Changer la casse
Appuyer sur Ctrl+W pour changer la casse du caractère après le curseur de texte et avancer le curseur.
Ainsi, si vous avez saisi une section de texte avec la touche verrou maj activée involontairement, placez
simplement le curseur au début et appuyez en maintenant les touches Ctrl+W enfoncées.
Vous pouvez changer la casse d'une section de texte sélectionnée de la même manière. Le curseur ne
sera pas déplacé.
Guillemets intelligents
Lorsque vous tapez des guillemets simples ' ou des guillemets doubles " Xtreme les convertit
automatiquement en guillemets ouvrant ou fermant appropriés et visuellement adaptés. Ainsi, cela
modifie 'ceci' en 'cela' et les "guillemets" en « guillemets ». Le programme est assez intelligent pour
assimiler l'utilisation d'apostrophes dans les mots remplaçant un caractère manquant, tel que 'don't' qui
devient 'don't'
.
Saisir des caractères spéciaux
Il existe de nombreux raccourcis utiles permettant l'insertion de caractères spéciaux, tels que © ou ™.
Voir la section Caractères spéciaux (dans l'outil d'ajout de texte)
du chapitre « Menus et raccourcis clavier ».
Tous ces raccourcis (à l'exception de l'espace insécable) sont compatibles avec Microsoft Word.
Utilisation de texte factice (« Lorem Ipsum »)
Lors de la création de mises en page, il est courant de se servir d'un texte factice, qui a l'apparence d'un
texte avec des caractères typiquement latins mais ne veut rien dire du tout. Ce texte commence par
« Lorem ipsum dolor sit amet... ».
Note historique : ce même texte factice est utilisé depuis plus de 500 ans dans le domaine de l'imprimerie
et des parties de ce texte en latin appartiennent à de vrais textes écrits il y a de cela plus de 2000 ans.
Vous pouvez insérer un paragraphe de texte factice en utilisant la combinaison Ctrl+Maj+L (L pour
Lorem) lorsque vous vous trouvez dans l'outil texte. Si vous voulez insérer plus de texte, répétez cette
combinaison plusieurs fois.
Page 408
Changer la casse
Appuyer sur Ctrl+W pour changer la casse du caractère après le curseur de texte et avancer le curseur.
Ainsi, si vous avez saisi une section de texte avec la touche verrou maj activée involontairement, placez
simplement le curseur au début et appuyez en maintenant les touches Ctrl+W enfoncées.
Vous pouvez changer la casse d'une section de texte sélectionnée de la même manière. Le curseur ne
sera pas déplacé.
Guillemets intelligents
Lorsque vous tapez des guillemets simples ' ou des guillemets doubles " Xtreme les convertit
automatiquement en guillemets ouvrant ou fermant appropriés et visuellement adaptés. Ainsi, cela
modifie 'ceci' en 'cela' et les "guillemets" en « guillemets ». Le programme est assez intelligent pour
assimiler l'utilisation d'apostrophes dans les mots remplaçant un caractère manquant, tel que 'don't' qui
devient 'don't'
.
Saisir des caractères spéciaux
Il existe de nombreux raccourcis utiles permettant l'insertion de caractères spéciaux, tels que © ou ™.
Voir la section Caractères spéciaux (dans l'outil d'ajout de texte)
du chapitre « Menus et raccourcis clavier ».
Tous ces raccourcis (à l'exception de l'espace insécable) sont compatibles avec Microsoft Word.
Utilisation de texte factice (« Lorem Ipsum »)
Lors de la création de mises en page, il est courant de se servir d'un texte factice, qui a l'apparence d'un
texte avec des caractères typiquement latins mais ne veut rien dire du tout. Ce texte commence par
« Lorem ipsum dolor sit amet... ».
Note historique : ce même texte factice est utilisé depuis plus de 500 ans dans le domaine de l'imprimerie
et des parties de ce texte en latin appartiennent à de vrais textes écrits il y a de cela plus de 2000 ans.
Vous pouvez insérer un paragraphe de texte factice en utilisant la combinaison Ctrl+Maj+L (L pour
Lorem) lorsque vous vous trouvez dans l'outil texte. Si vous voulez insérer plus de texte, répétez cette
combinaison plusieurs fois.
Page 409
Guillemets intelligents
Lorsque vous tapez des guillemets simples ' ou des guillemets doubles " Xtreme les convertit
automatiquement en guillemets ouvrant ou fermant appropriés et visuellement adaptés. Ainsi, cela
modifie 'ceci' en 'cela' et les "guillemets" en « guillemets ». Le programme est assez intelligent pour
assimiler l'utilisation d'apostrophes dans les mots remplaçant un caractère manquant, tel que 'don't' qui
devient 'don't'
.
Saisir des caractères spéciaux
Il existe de nombreux raccourcis utiles permettant l'insertion de caractères spéciaux, tels que © ou ™.
Voir la section Caractères spéciaux (dans l'outil d'ajout de texte)
du chapitre « Menus et raccourcis clavier ».
Tous ces raccourcis (à l'exception de l'espace insécable) sont compatibles avec Microsoft Word.
Utilisation de texte factice (« Lorem Ipsum »)
Lors de la création de mises en page, il est courant de se servir d'un texte factice, qui a l'apparence d'un
texte avec des caractères typiquement latins mais ne veut rien dire du tout. Ce texte commence par
« Lorem ipsum dolor sit amet... ».
Note historique : ce même texte factice est utilisé depuis plus de 500 ans dans le domaine de l'imprimerie
et des parties de ce texte en latin appartiennent à de vrais textes écrits il y a de cela plus de 2000 ans.
Vous pouvez insérer un paragraphe de texte factice en utilisant la combinaison Ctrl+Maj+L (L pour
Lorem) lorsque vous vous trouvez dans l'outil texte. Si vous voulez insérer plus de texte, répétez cette
combinaison plusieurs fois.
Page 410
Saisir des caractères spéciaux
Il existe de nombreux raccourcis utiles permettant l'insertion de caractères spéciaux, tels que © ou ™.
Voir la section Caractères spéciaux (dans l'outil d'ajout de texte)
du chapitre « Menus et raccourcis clavier ».
Tous ces raccourcis (à l'exception de l'espace insécable) sont compatibles avec Microsoft Word.
Utilisation de texte factice (« Lorem Ipsum »)
Lors de la création de mises en page, il est courant de se servir d'un texte factice, qui a l'apparence d'un
texte avec des caractères typiquement latins mais ne veut rien dire du tout. Ce texte commence par
« Lorem ipsum dolor sit amet... ».
Note historique : ce même texte factice est utilisé depuis plus de 500 ans dans le domaine de l'imprimerie
et des parties de ce texte en latin appartiennent à de vrais textes écrits il y a de cela plus de 2000 ans.
Vous pouvez insérer un paragraphe de texte factice en utilisant la combinaison Ctrl+Maj+L (L pour
Lorem) lorsque vous vous trouvez dans l'outil texte. Si vous voulez insérer plus de texte, répétez cette
combinaison plusieurs fois.
Page 411
Utilisation de texte factice (« Lorem Ipsum »)
Lors de la création de mises en page, il est courant de se servir d'un texte factice, qui a l'apparence d'un
texte avec des caractères typiquement latins mais ne veut rien dire du tout. Ce texte commence par
« Lorem ipsum dolor sit amet... ».
Note historique : ce même texte factice est utilisé depuis plus de 500 ans dans le domaine de l'imprimerie
et des parties de ce texte en latin appartiennent à de vrais textes écrits il y a de cela plus de 2000 ans.
Vous pouvez insérer un paragraphe de texte factice en utilisant la combinaison Ctrl+Maj+L (L pour
Lorem) lorsque vous vous trouvez dans l'outil texte. Si vous voulez insérer plus de texte, répétez cette
combinaison plusieurs fois.
Page 412
Vérificateur d'orthographe
L'Outil Texte inclut un vérificateur d'orthographe. Pour le mettre en
marche, sélectionnez l'icone du Vérificateur d'orthographe sur la
barre d'info de l'Outil Texte
qui ouvre alors un menu.
Sélectionnez « Procéder à une
vérification d'orthographe dès la
saisie du texte
». Tous les mots du document qui
n'ont pas été reconnus sont soulignés
par une ligne pointillée rouge.
Pour corriger une faute, faites un clic droit sur le mot pour ouvrir le menu contextuel. Le haut du menu
contextuel suggère des mots correctement écrits. Sélectionnez l'une des suggestions pour remplacer le
mot.
Sélection de la langue
Le menu qui s'affiche lorsque vous cliquez sur l'icone du Vérificateur d'orthographe énumère toutes les
langues pour lesquelles des dictionnaires sont installés. Par défaut, la langue correspondant au réglage
local actuel est sélectionnée. Vous pouvez choisir différentes langues pour différents objets-textes de
manière à utiliser plusieurs langues dans votre document si nécessaire.
Pour changer la langue associée à un objet-texte, sélectionner l'objet-texte. Puis, dans l'Outil Texte,
choisissez la langue requise à partir du menu du Vérificateur d'orthographe. L'orthographe de
l'objet-texte est maintenant vérifiée en fonction du dictionnaire correspondant à la langue choisie.
Si vous souhaitez saisir plusieurs objets-texte en utilisant une langue différente de la langue par défaut,
vous pouvez changer l'attribut de langue actuelle de manière à ne pas devoir changer la langue pour
chaque objet texte. Pour cela, assurez-vous que rien n'est sélectionné (clic sur une zone vide de votre
projet à l'aide de l'Outil de sélection). Puis, choisissez dans l'Outil de sélection la langue souhaitée à l'aide
du menu du Vérificateur d'orthographe. Un message vous demandera si vous souhaitez définir l'attribut
de langue actuel. Cliquer sur « Définir » pour confirmer. Désormais, chaque nouvel objet-texte créé sera
associé à la langue choisie. Notez que l'attribut actuel n'est pas re-chargé lorsque vous enregistrez et
chargez votre projet. Vous devrez donc répéter la procédure ci-dessus pour régler à nouveau l'attribut
de langue actuelle la prochaine fois que vous chargez le document, si vous souhaitez continuer à entrer de
nouveaux objets-texte avec la même langue.
Si vous avez un objet-texte pour lequel vous ne souhaitez pas exécuter le Vérificateur d'orthographe,
sélectionnez l'objet et choisissez l'option « Pas de langue (ignorer) » dans le menu du Vérificateur
d'orthographe.
Dictionnaire utilisateur
Les termes utilisés régulièrement mais qui ne sont pas inclus dans le dictionnaire fourni avec Xtreme Web
Designer 5 peuvent être ajoutés à votre dictionnaire personnel. Pour cela, réalisez un clic droit sur le
terme concerné et choisissez « Ajouter au dictionnaire utilisateur ». Le terme n'apparaît alors plus comme
une erreur. Le dictionnaire utilisateur s'applique à tous les documents utilisés sur votre ordinateur et à
toutes les langues.
Page 413
Sélection de la langue
Le menu qui s'affiche lorsque vous cliquez sur l'icone du Vérificateur d'orthographe énumère toutes les
langues pour lesquelles des dictionnaires sont installés. Par défaut, la langue correspondant au réglage
local actuel est sélectionnée. Vous pouvez choisir différentes langues pour différents objets-textes de
manière à utiliser plusieurs langues dans votre document si nécessaire.
Pour changer la langue associée à un objet-texte, sélectionner l'objet-texte. Puis, dans l'Outil Texte,
choisissez la langue requise à partir du menu du Vérificateur d'orthographe. L'orthographe de
l'objet-texte est maintenant vérifiée en fonction du dictionnaire correspondant à la langue choisie.
Si vous souhaitez saisir plusieurs objets-texte en utilisant une langue différente de la langue par défaut,
vous pouvez changer l'attribut de langue actuelle de manière à ne pas devoir changer la langue pour
chaque objet texte. Pour cela, assurez-vous que rien n'est sélectionné (clic sur une zone vide de votre
projet à l'aide de l'Outil de sélection). Puis, choisissez dans l'Outil de sélection la langue souhaitée à l'aide
du menu du Vérificateur d'orthographe. Un message vous demandera si vous souhaitez définir l'attribut
de langue actuel. Cliquer sur « Définir » pour confirmer. Désormais, chaque nouvel objet-texte créé sera
associé à la langue choisie. Notez que l'attribut actuel n'est pas re-chargé lorsque vous enregistrez et
chargez votre projet. Vous devrez donc répéter la procédure ci-dessus pour régler à nouveau l'attribut
de langue actuelle la prochaine fois que vous chargez le document, si vous souhaitez continuer à entrer de
nouveaux objets-texte avec la même langue.
Si vous avez un objet-texte pour lequel vous ne souhaitez pas exécuter le Vérificateur d'orthographe,
sélectionnez l'objet et choisissez l'option « Pas de langue (ignorer) » dans le menu du Vérificateur
d'orthographe.
Dictionnaire utilisateur
Les termes utilisés régulièrement mais qui ne sont pas inclus dans le dictionnaire fourni avec Xtreme Web
Designer 5 peuvent être ajoutés à votre dictionnaire personnel. Pour cela, réalisez un clic droit sur le
terme concerné et choisissez « Ajouter au dictionnaire utilisateur ». Le terme n'apparaît alors plus comme
une erreur. Le dictionnaire utilisateur s'applique à tous les documents utilisés sur votre ordinateur et à
toutes les langues.
Page 414
Dictionnaire utilisateur
Les termes utilisés régulièrement mais qui ne sont pas inclus dans le dictionnaire fourni avec Xtreme Web
Designer 5 peuvent être ajoutés à votre dictionnaire personnel. Pour cela, réalisez un clic droit sur le
terme concerné et choisissez « Ajouter au dictionnaire utilisateur ». Le terme n'apparaît alors plus comme
une erreur. Le dictionnaire utilisateur s'applique à tous les documents utilisés sur votre ordinateur et à
toutes les langues.
Page 415
Synchronisation de texte à l'aide de groupes
souples
Dans certains projets, vous pouvez avoir besoin que plusieurs objets-texte affichent le même texte mais
dans différents styles. Une animation de texte dans un document d'animation ou un passage de souris sur
des boutons qui s'allument lorsque le pointeur de la souris passe au-dessus d'eux dans un navigateur
Internet alors en sont des exemples pertinents. Normalement, si vous souhaitez changer le texte affiché
sur ces objets, vous devez tous les éditer individuellement.
En ajoutant ces objets-texte apparentés dans un groupe souple, vous pouvez garantir qu'ils afficheront
toujours le même texte. Pour ajouter les objets-texte apparentés dans un groupe souple, assurez-vous
tout d'abord qu'ils contiennent déjà le même texte (autrement, ils ne seront pas synchronisés).
Sélectionnez-les ensuite à l'aide de l'Outil de sélection. Sélectionner Arranger ->Appliquer le groupe
souple
(Ctrl+Alt+G).
Désormais, lorsque le texte est édité sur un objet-texte, les autres seront mis à jour automatiquement,
même s'ils sont répartis sur différents calques (ou dans le cas de documents d'animation, sur différents
cadres) à travers votre document. Notez que cette synchronisation fonctionne même si certains objets
texte se trouvent sur des calques verrouillés ou invisibles.
Pour dégrouper un groupe souple, sélectionnez Arranger->Supprimer le groupe souple (Ctrl+Alt+U).
Pour plus d'informations sur les gGroupes souples, veuillez consulter le paragraphe groupes souples du
chapitre Manipulation d'objet
.
Page 416
Tabulations, marges et retraits
Règles
Pour paramétrer les tabulations, les marges et les retraits, il vous faut activer les règles dans votre
document.
Pour cela :
 Choisir Fenêtres > Barres > Règles.
 Ou appuyez sur Ctrl+Maj+R (ceci est un nouveau raccourci).
 Ou appuyez sur Ctrl+L (si vous n'êtes pas dans l'Outil d'ajout de texte).
Les caractéristiques de texte avancées n'apparaissent sur la règle que lorsque vous utilisez l'Outil d'ajout
de texte et que le curseur de texte se trouve dans un article de texte ou si l'objet texte est sélectionné
dans l'Outil d'ajout de texte
.
Dans l'Outil d'ajout de texte, lorsque vous tirez les marges ou les tabulations sur la règle, vous obtenez un
repère vertical temporaire facilitant l'alignement des tabulations ou des marges sur les objets se trouvant
ailleurs sur la page. Lorsque vous déplacez des tabulations et des marges et que l'alignement magnétique
est activé, elles seront alignées l'une par rapport à l'autre, facilitant ainsi leur positionnement.
Marges et retraits
Toute modification effectuée concerne le paragraphe de texte courant. (C'est-à-dire le paragraphe
contenant le curseur de texte) ou, si vous avez une section de texte sélectionnée, les paragraphes de la
section sélectionnée.
Vous pouvez appliquer les changements à tout le texte d'un article en sélectionnant la totalité du texte s'y
trouvant (Ctrl+A). Pour modifier plus d'un article, sélectionnez les objets textes tout en étant dans l'Outil
de sélection puis passez dans l'Outil d'ajout de texte
et effectuez les modifications nécessaires.
Marge de gauche
. La faire glisser pour modifier la marge gauche du texte.
Marge de première ligne.
La faire glisser pour modifier la marge gauche de la première ligne du
paragraphe (utile pour des listes, telles que montré ci-dessous).
Marge de droite.
La faire glisser pour modifier la marge droite du texte.
Montrer la marge gauche et la marge de première ligne.
Page 417
Montrer la marge droite
Texte le long d'une courbe
Si vous avez ajusté une ligne de texte le long d'une courbe à l'aide de l'option Ajuster le texte à la
courbe
, alors la ligne de la courbe constitue la marge. Si le texte est plus long que la ligne, il dépassera de
l'extrémité.
Si vous avez cliqué sur la ligne ou ajusté une colonne de texte à une courbe ou ligne, des indicateurs de
marges gauche et droite (petits carrés rouges) peuvent être tirés le long de la ligne afin d'ajuster les
marges utilisées pour la justification.
Tabulations
Par défaut, les articles de texte sont créés avec des tabulations de 0,5 cm d'espacement. Ce qui signifie
qu'il vous suffit d'appuyer sur la touche Tabulation et votre texte sera déplacé jusqu'au taquet suivant. Si
vous souhaitez un autre espacement entre les tabulations, il vous suffit de définir de nouveaux taquets.
Ces tabulations par défaut sont affichées sous forme de petits L sur la règle :
Tabulations standard, indiquées par des petits L
Personnaliser les tabulations
Pour créer une tabulation personnalisée, cliquez simplement sur la règle où vous souhaitez placer la
nouvelle. Elle remplacera les tabulations par défaut jusqu'à cet endroit de la règle.
Par exemple :
Le triangle indique une tabulation personnalisée.
Pour définir plus d'une tabulation, cliquer plusieurs fois sur la règle.
Pour déplacer une tabulation personnalisée, la faire glisser le long de la règle.
Pour supprimer une tabulation, la faire glisser hors de la règle (les tabulations par défaut se
repositionneront).
Personnaliser les types de tabulations
Vous pouvez définir différents types de tabulations personnalisées. Par défaut, les tabulations
personnalisées sont des tabulations d'alignement à gauche. Ce qui signifie que le texte sera aligné sur la
tabulation à gauche du texte.
Page 418
Pour changer de type de tabulation, cliquer sur l'icône de tabulation sur la règle.
Les types de tabulations suivantes sont disponibles. Vous n'êtes pas limité à un seul type par article, vous
pouvez choisir un type différent puis définir d'autres tabulations.
Alignement gauche :
le texte sera aligné sur la tabulation de gauche.
Alignement droite :
le texte sera aligné sur la tabulation de droite.
Alignement centré :
le texte sera centré sur la tabulation.
Alignement décimal :
les virgules dans le texte seront alignées sur la tabulation. Ceci est utile
pour les listes et, quelle que soit la longueur du nombre, les virgules
(points) seront alignées sur les tabulations.
Comment créer des alinéas en retrait
Les alinéas en retrait, tels qu'ils sont généralement connus, constituent la première ligne d'un paragraphe
avec une marge négative ou une marge en retrait vers la droite de la marge de gauche usuelle. Les listes
avec numéros ou avec puces sont des exemples d'alinéas en retrait.
Pour créer des alinéas en retrait
1. Tirer la marge de gauche vers l'intérieur.
2. Cliquez sur la règle en vous éloignant de la marge gauche (créant ainsi un nouveau taquet de
tabulation) et faites glisser ce taquet afin qu'il se trouve exactement au-dessus de la marge
gauche.
3. Chaque ligne commencera désormais avec un retrait : vous pouvez insérer un caractère spécial
ou un nombre et appuyer sur la touche Tabulation pour vous déplacer vers la marge gauche.
Toutes les autres lignes de texte (comme ce paragraphe) seront en retrait par rapport à la marge
gauche.
Page 419
Règles
Pour paramétrer les tabulations, les marges et les retraits, il vous faut activer les règles dans votre
document.
Pour cela :
 Choisir Fenêtres > Barres > Règles.
 Ou appuyez sur Ctrl+Maj+R (ceci est un nouveau raccourci).
 Ou appuyez sur Ctrl+L (si vous n'êtes pas dans l'Outil d'ajout de texte).
Les caractéristiques de texte avancées n'apparaissent sur la règle que lorsque vous utilisez l'Outil d'ajout
de texte et que le curseur de texte se trouve dans un article de texte ou si l'objet texte est sélectionné
dans l'Outil d'ajout de texte
.
Dans l'Outil d'ajout de texte, lorsque vous tirez les marges ou les tabulations sur la règle, vous obtenez un
repère vertical temporaire facilitant l'alignement des tabulations ou des marges sur les objets se trouvant
ailleurs sur la page. Lorsque vous déplacez des tabulations et des marges et que l'alignement magnétique
est activé, elles seront alignées l'une par rapport à l'autre, facilitant ainsi leur positionnement.
Marges et retraits
Toute modification effectuée concerne le paragraphe de texte courant. (C'est-à-dire le paragraphe
contenant le curseur de texte) ou, si vous avez une section de texte sélectionnée, les paragraphes de la
section sélectionnée.
Vous pouvez appliquer les changements à tout le texte d'un article en sélectionnant la totalité du texte s'y
trouvant (Ctrl+A). Pour modifier plus d'un article, sélectionnez les objets textes tout en étant dans l'Outil
de sélection puis passez dans l'Outil d'ajout de texte
et effectuez les modifications nécessaires.
Marge de gauche
. La faire glisser pour modifier la marge gauche du texte.
Marge de première ligne.
La faire glisser pour modifier la marge gauche de la première ligne du
paragraphe (utile pour des listes, telles que montré ci-dessous).
Marge de droite.
La faire glisser pour modifier la marge droite du texte.
Montrer la marge gauche et la marge de première ligne.
Page 420
Montrer la marge droite
Texte le long d'une courbe
Si vous avez ajusté une ligne de texte le long d'une courbe à l'aide de l'option Ajuster le texte à la
courbe
, alors la ligne de la courbe constitue la marge. Si le texte est plus long que la ligne, il dépassera de
l'extrémité.
Si vous avez cliqué sur la ligne ou ajusté une colonne de texte à une courbe ou ligne, des indicateurs de
marges gauche et droite (petits carrés rouges) peuvent être tirés le long de la ligne afin d'ajuster les
marges utilisées pour la justification.
Tabulations
Par défaut, les articles de texte sont créés avec des tabulations de 0,5 cm d'espacement. Ce qui signifie
qu'il vous suffit d'appuyer sur la touche Tabulation et votre texte sera déplacé jusqu'au taquet suivant. Si
vous souhaitez un autre espacement entre les tabulations, il vous suffit de définir de nouveaux taquets.
Ces tabulations par défaut sont affichées sous forme de petits L sur la règle :
Tabulations standard, indiquées par des petits L
Personnaliser les tabulations
Pour créer une tabulation personnalisée, cliquez simplement sur la règle où vous souhaitez placer la
nouvelle. Elle remplacera les tabulations par défaut jusqu'à cet endroit de la règle.
Par exemple :
Le triangle indique une tabulation personnalisée.
Pour définir plus d'une tabulation, cliquer plusieurs fois sur la règle.
Pour déplacer une tabulation personnalisée, la faire glisser le long de la règle.
Pour supprimer une tabulation, la faire glisser hors de la règle (les tabulations par défaut se
repositionneront).
Personnaliser les types de tabulations
Vous pouvez définir différents types de tabulations personnalisées. Par défaut, les tabulations
personnalisées sont des tabulations d'alignement à gauche. Ce qui signifie que le texte sera aligné sur la
tabulation à gauche du texte.
Page 421
Pour changer de type de tabulation, cliquer sur l'icône de tabulation sur la règle.
Les types de tabulations suivantes sont disponibles. Vous n'êtes pas limité à un seul type par article, vous
pouvez choisir un type différent puis définir d'autres tabulations.
Alignement gauche :
le texte sera aligné sur la tabulation de gauche.
Alignement droite :
le texte sera aligné sur la tabulation de droite.
Alignement centré :
le texte sera centré sur la tabulation.
Alignement décimal :
les virgules dans le texte seront alignées sur la tabulation. Ceci est utile
pour les listes et, quelle que soit la longueur du nombre, les virgules
(points) seront alignées sur les tabulations.
Comment créer des alinéas en retrait
Les alinéas en retrait, tels qu'ils sont généralement connus, constituent la première ligne d'un paragraphe
avec une marge négative ou une marge en retrait vers la droite de la marge de gauche usuelle. Les listes
avec numéros ou avec puces sont des exemples d'alinéas en retrait.
Pour créer des alinéas en retrait
1. Tirer la marge de gauche vers l'intérieur.
2. Cliquez sur la règle en vous éloignant de la marge gauche (créant ainsi un nouveau taquet de
tabulation) et faites glisser ce taquet afin qu'il se trouve exactement au-dessus de la marge
gauche.
3. Chaque ligne commencera désormais avec un retrait : vous pouvez insérer un caractère spécial
ou un nombre et appuyer sur la touche Tabulation pour vous déplacer vers la marge gauche.
Toutes les autres lignes de texte (comme ce paragraphe) seront en retrait par rapport à la marge
gauche.
Page 422
Marges et retraits
Toute modification effectuée concerne le paragraphe de texte courant. (C'est-à-dire le paragraphe
contenant le curseur de texte) ou, si vous avez une section de texte sélectionnée, les paragraphes de la
section sélectionnée.
Vous pouvez appliquer les changements à tout le texte d'un article en sélectionnant la totalité du texte s'y
trouvant (Ctrl+A). Pour modifier plus d'un article, sélectionnez les objets textes tout en étant dans l'Outil
de sélection puis passez dans l'Outil d'ajout de texte
et effectuez les modifications nécessaires.
Marge de gauche
. La faire glisser pour modifier la marge gauche du texte.
Marge de première ligne.
La faire glisser pour modifier la marge gauche de la première ligne du
paragraphe (utile pour des listes, telles que montré ci-dessous).
Marge de droite.
La faire glisser pour modifier la marge droite du texte.
Montrer la marge gauche et la marge de première ligne.
Montrer la marge droite
Texte le long d'une courbe
Si vous avez ajusté une ligne de texte le long d'une courbe à l'aide de l'option Ajuster le texte à la
courbe
, alors la ligne de la courbe constitue la marge. Si le texte est plus long que la ligne, il dépassera de
l'extrémité.
Si vous avez cliqué sur la ligne ou ajusté une colonne de texte à une courbe ou ligne, des indicateurs de
marges gauche et droite (petits carrés rouges) peuvent être tirés le long de la ligne afin d'ajuster les
marges utilisées pour la justification.
Page 423
Tabulations
Par défaut, les articles de texte sont créés avec des tabulations de 0,5 cm d'espacement. Ce qui signifie
qu'il vous suffit d'appuyer sur la touche Tabulation et votre texte sera déplacé jusqu'au taquet suivant. Si
vous souhaitez un autre espacement entre les tabulations, il vous suffit de définir de nouveaux taquets.
Ces tabulations par défaut sont affichées sous forme de petits L sur la règle :
Tabulations standard, indiquées par des petits L
Personnaliser les tabulations
Pour créer une tabulation personnalisée, cliquez simplement sur la règle où vous souhaitez placer la
nouvelle. Elle remplacera les tabulations par défaut jusqu'à cet endroit de la règle.
Par exemple :
Le triangle indique une tabulation personnalisée.
Pour définir plus d'une tabulation, cliquer plusieurs fois sur la règle.
Pour déplacer une tabulation personnalisée, la faire glisser le long de la règle.
Pour supprimer une tabulation, la faire glisser hors de la règle (les tabulations par défaut se
repositionneront).
Personnaliser les types de tabulations
Vous pouvez définir différents types de tabulations personnalisées. Par défaut, les tabulations
personnalisées sont des tabulations d'alignement à gauche. Ce qui signifie que le texte sera aligné sur la
tabulation à gauche du texte.
Pour changer de type de tabulation, cliquer sur l'icône de tabulation sur la règle.
Les types de tabulations suivantes sont disponibles. Vous n'êtes pas limité à un seul type par article, vous
pouvez choisir un type différent puis définir d'autres tabulations.
Alignement gauche :
le texte sera aligné sur la tabulation de gauche.
Alignement droite :
le texte sera aligné sur la tabulation de droite.
Alignement centré :
le texte sera centré sur la tabulation.
Alignement décimal :
Page 424
les virgules dans le texte seront alignées sur la tabulation. Ceci est utile
pour les listes et, quelle que soit la longueur du nombre, les virgules
(points) seront alignées sur les tabulations.
Comment créer des alinéas en retrait
Les alinéas en retrait, tels qu'ils sont généralement connus, constituent la première ligne d'un paragraphe
avec une marge négative ou une marge en retrait vers la droite de la marge de gauche usuelle. Les listes
avec numéros ou avec puces sont des exemples d'alinéas en retrait.
Pour créer des alinéas en retrait
1. Tirer la marge de gauche vers l'intérieur.
2. Cliquez sur la règle en vous éloignant de la marge gauche (créant ainsi un nouveau taquet de
tabulation) et faites glisser ce taquet afin qu'il se trouve exactement au-dessus de la marge
gauche.
3. Chaque ligne commencera désormais avec un retrait : vous pouvez insérer un caractère spécial
ou un nombre et appuyer sur la touche Tabulation pour vous déplacer vers la marge gauche.
Toutes les autres lignes de texte (comme ce paragraphe) seront en retrait par rapport à la marge
gauche.
Page 425
Texte le long d'une courbe
Si vous avez ajusté une ligne de texte le long d'une courbe à l'aide de l'option Ajuster le texte à la
courbe
, alors la ligne de la courbe constitue la marge. Si le texte est plus long que la ligne, il dépassera de
l'extrémité.
Si vous avez cliqué sur la ligne ou ajusté une colonne de texte à une courbe ou ligne, des indicateurs de
marges gauche et droite (petits carrés rouges) peuvent être tirés le long de la ligne afin d'ajuster les
marges utilisées pour la justification.
Tabulations
Par défaut, les articles de texte sont créés avec des tabulations de 0,5 cm d'espacement. Ce qui signifie
qu'il vous suffit d'appuyer sur la touche Tabulation et votre texte sera déplacé jusqu'au taquet suivant. Si
vous souhaitez un autre espacement entre les tabulations, il vous suffit de définir de nouveaux taquets.
Ces tabulations par défaut sont affichées sous forme de petits L sur la règle :
Tabulations standard, indiquées par des petits L
Personnaliser les tabulations
Pour créer une tabulation personnalisée, cliquez simplement sur la règle où vous souhaitez placer la
nouvelle. Elle remplacera les tabulations par défaut jusqu'à cet endroit de la règle.
Par exemple :
Le triangle indique une tabulation personnalisée.
Pour définir plus d'une tabulation, cliquer plusieurs fois sur la règle.
Pour déplacer une tabulation personnalisée, la faire glisser le long de la règle.
Pour supprimer une tabulation, la faire glisser hors de la règle (les tabulations par défaut se
repositionneront).
Personnaliser les types de tabulations
Vous pouvez définir différents types de tabulations personnalisées. Par défaut, les tabulations
personnalisées sont des tabulations d'alignement à gauche. Ce qui signifie que le texte sera aligné sur la
tabulation à gauche du texte.
Pour changer de type de tabulation, cliquer sur l'icône de tabulation sur la règle.
Les types de tabulations suivantes sont disponibles. Vous n'êtes pas limité à un seul type par article, vous
pouvez choisir un type différent puis définir d'autres tabulations.
Alignement gauche :
le texte sera aligné sur la tabulation de gauche.
Alignement droite :
Page 426
le texte sera aligné sur la tabulation de droite.
Alignement centré :
le texte sera centré sur la tabulation.
Alignement décimal :
les virgules dans le texte seront alignées sur la tabulation. Ceci est utile
pour les listes et, quelle que soit la longueur du nombre, les virgules
(points) seront alignées sur les tabulations.
Comment créer des alinéas en retrait
Les alinéas en retrait, tels qu'ils sont généralement connus, constituent la première ligne d'un paragraphe
avec une marge négative ou une marge en retrait vers la droite de la marge de gauche usuelle. Les listes
avec numéros ou avec puces sont des exemples d'alinéas en retrait.
Pour créer des alinéas en retrait
1. Tirer la marge de gauche vers l'intérieur.
2. Cliquez sur la règle en vous éloignant de la marge gauche (créant ainsi un nouveau taquet de
tabulation) et faites glisser ce taquet afin qu'il se trouve exactement au-dessus de la marge
gauche.
3. Chaque ligne commencera désormais avec un retrait : vous pouvez insérer un caractère spécial
ou un nombre et appuyer sur la touche Tabulation pour vous déplacer vers la marge gauche.
Toutes les autres lignes de texte (comme ce paragraphe) seront en retrait par rapport à la marge
gauche.
Page 427
Tabulations
Par défaut, les articles de texte sont créés avec des tabulations de 0,5 cm d'espacement. Ce qui signifie
qu'il vous suffit d'appuyer sur la touche Tabulation et votre texte sera déplacé jusqu'au taquet suivant. Si
vous souhaitez un autre espacement entre les tabulations, il vous suffit de définir de nouveaux taquets.
Ces tabulations par défaut sont affichées sous forme de petits L sur la règle :
Tabulations standard, indiquées par des petits L
Personnaliser les tabulations
Pour créer une tabulation personnalisée, cliquez simplement sur la règle où vous souhaitez placer la
nouvelle. Elle remplacera les tabulations par défaut jusqu'à cet endroit de la règle.
Par exemple :
Le triangle indique une tabulation personnalisée.
Pour définir plus d'une tabulation, cliquer plusieurs fois sur la règle.
Pour déplacer une tabulation personnalisée, la faire glisser le long de la règle.
Pour supprimer une tabulation, la faire glisser hors de la règle (les tabulations par défaut se
repositionneront).
Personnaliser les types de tabulations
Vous pouvez définir différents types de tabulations personnalisées. Par défaut, les tabulations
personnalisées sont des tabulations d'alignement à gauche. Ce qui signifie que le texte sera aligné sur la
tabulation à gauche du texte.
Pour changer de type de tabulation, cliquer sur l'icône de tabulation sur la règle.
Les types de tabulations suivantes sont disponibles. Vous n'êtes pas limité à un seul type par article, vous
pouvez choisir un type différent puis définir d'autres tabulations.
Alignement gauche :
le texte sera aligné sur la tabulation de gauche.
Alignement droite :
le texte sera aligné sur la tabulation de droite.
Alignement centré :
le texte sera centré sur la tabulation.
Alignement décimal :
Page 428
les virgules dans le texte seront alignées sur la tabulation. Ceci est utile
pour les listes et, quelle que soit la longueur du nombre, les virgules
(points) seront alignées sur les tabulations.
Comment créer des alinéas en retrait
Les alinéas en retrait, tels qu'ils sont généralement connus, constituent la première ligne d'un paragraphe
avec une marge négative ou une marge en retrait vers la droite de la marge de gauche usuelle. Les listes
avec numéros ou avec puces sont des exemples d'alinéas en retrait.
Pour créer des alinéas en retrait
1. Tirer la marge de gauche vers l'intérieur.
2. Cliquez sur la règle en vous éloignant de la marge gauche (créant ainsi un nouveau taquet de
tabulation) et faites glisser ce taquet afin qu'il se trouve exactement au-dessus de la marge
gauche.
3. Chaque ligne commencera désormais avec un retrait : vous pouvez insérer un caractère spécial
ou un nombre et appuyer sur la touche Tabulation pour vous déplacer vers la marge gauche.
Toutes les autres lignes de texte (comme ce paragraphe) seront en retrait par rapport à la marge
gauche.
Page 429
Personnaliser les tabulations
Pour créer une tabulation personnalisée, cliquez simplement sur la règle où vous souhaitez placer la
nouvelle. Elle remplacera les tabulations par défaut jusqu'à cet endroit de la règle.
Par exemple :
Le triangle indique une tabulation personnalisée.
Pour définir plus d'une tabulation, cliquer plusieurs fois sur la règle.
Pour déplacer une tabulation personnalisée, la faire glisser le long de la règle.
Pour supprimer une tabulation, la faire glisser hors de la règle (les tabulations par défaut se
repositionneront).
Personnaliser les types de tabulations
Vous pouvez définir différents types de tabulations personnalisées. Par défaut, les tabulations
personnalisées sont des tabulations d'alignement à gauche. Ce qui signifie que le texte sera aligné sur la
tabulation à gauche du texte.
Pour changer de type de tabulation, cliquer sur l'icône de tabulation sur la règle.
Les types de tabulations suivantes sont disponibles. Vous n'êtes pas limité à un seul type par article, vous
pouvez choisir un type différent puis définir d'autres tabulations.
Alignement gauche :
le texte sera aligné sur la tabulation de gauche.
Alignement droite :
le texte sera aligné sur la tabulation de droite.
Alignement centré :
le texte sera centré sur la tabulation.
Alignement décimal :
les virgules dans le texte seront alignées sur la tabulation. Ceci est utile
pour les listes et, quelle que soit la longueur du nombre, les virgules
(points) seront alignées sur les tabulations.
Comment créer des alinéas en retrait
Page 430
Les alinéas en retrait, tels qu'ils sont généralement connus, constituent la première ligne d'un paragraphe
avec une marge négative ou une marge en retrait vers la droite de la marge de gauche usuelle. Les listes
avec numéros ou avec puces sont des exemples d'alinéas en retrait.
Pour créer des alinéas en retrait
1. Tirer la marge de gauche vers l'intérieur.
2. Cliquez sur la règle en vous éloignant de la marge gauche (créant ainsi un nouveau taquet de
tabulation) et faites glisser ce taquet afin qu'il se trouve exactement au-dessus de la marge
gauche.
3. Chaque ligne commencera désormais avec un retrait : vous pouvez insérer un caractère spécial
ou un nombre et appuyer sur la touche Tabulation pour vous déplacer vers la marge gauche.
Toutes les autres lignes de texte (comme ce paragraphe) seront en retrait par rapport à la marge
gauche.
Page 431
Personnaliser les types de tabulations
Vous pouvez définir différents types de tabulations personnalisées. Par défaut, les tabulations
personnalisées sont des tabulations d'alignement à gauche. Ce qui signifie que le texte sera aligné sur la
tabulation à gauche du texte.
Pour changer de type de tabulation, cliquer sur l'icône de tabulation sur la règle.
Les types de tabulations suivantes sont disponibles. Vous n'êtes pas limité à un seul type par article, vous
pouvez choisir un type différent puis définir d'autres tabulations.
Alignement gauche :
le texte sera aligné sur la tabulation de gauche.
Alignement droite :
le texte sera aligné sur la tabulation de droite.
Alignement centré :
le texte sera centré sur la tabulation.
Alignement décimal :
les virgules dans le texte seront alignées sur la tabulation. Ceci est utile
pour les listes et, quelle que soit la longueur du nombre, les virgules
(points) seront alignées sur les tabulations.
Comment créer des alinéas en retrait
Les alinéas en retrait, tels qu'ils sont généralement connus, constituent la première ligne d'un paragraphe
avec une marge négative ou une marge en retrait vers la droite de la marge de gauche usuelle. Les listes
avec numéros ou avec puces sont des exemples d'alinéas en retrait.
Pour créer des alinéas en retrait
1. Tirer la marge de gauche vers l'intérieur.
2. Cliquez sur la règle en vous éloignant de la marge gauche (créant ainsi un nouveau taquet de
tabulation) et faites glisser ce taquet afin qu'il se trouve exactement au-dessus de la marge
gauche.
3. Chaque ligne commencera désormais avec un retrait : vous pouvez insérer un caractère spécial
ou un nombre et appuyer sur la touche Tabulation pour vous déplacer vers la marge gauche.
Toutes les autres lignes de texte (comme ce paragraphe) seront en retrait par rapport à la marge
gauche.
Page 432
Comment créer des alinéas en retrait
Les alinéas en retrait, tels qu'ils sont généralement connus, constituent la première ligne d'un paragraphe
avec une marge négative ou une marge en retrait vers la droite de la marge de gauche usuelle. Les listes
avec numéros ou avec puces sont des exemples d'alinéas en retrait.
Pour créer des alinéas en retrait
1. Tirer la marge de gauche vers l'intérieur.
2. Cliquez sur la règle en vous éloignant de la marge gauche (créant ainsi un nouveau taquet de
tabulation) et faites glisser ce taquet afin qu'il se trouve exactement au-dessus de la marge
gauche.
3. Chaque ligne commencera désormais avec un retrait : vous pouvez insérer un caractère spécial
ou un nombre et appuyer sur la touche Tabulation pour vous déplacer vers la marge gauche.
Toutes les autres lignes de texte (comme ce paragraphe) seront en retrait par rapport à la marge
gauche.
Page 433
Les objets de renvoi de texte
Dans Xtreme Web Designer 5, vous pouvez configurer n'importe quel objet pour un renvoi de texte, de
sorte que le texte qui se trouve sous lui est automatiquement renvoyé autour de l'objet au lieu d'être
affiché au-dessus. Cela permet de mettre en page plus facilement de longs passages de texte combinés à
des photos ou graphiques. Lorsque vous avez configuré les renvois, vous pouvez ajuster les positions des
graphiques et photos et le texte sera automatiquement positionné autour.
Utiliser un objet comme renvoi
Pour utiliser un objet comme renvoi de texte, sélectionnez la fonction Renvoyer texte sous... dans le
menu Arranger
pour ouvrir la boîte de dialogue des propriétés des renvois. Ou effectuez un clic droit sur l'objet et
sélectionnez la même option dans le menu contextuel.
Le cas échéant, configurez une marge de
renvoi pour cet objet. Cela permet de
déterminer la taille de la marge entre les bords
de l'objet et le texte qu'il renvoie. Pour fermer
la boîte de dialogue et retourner à l'option de
renvoi de texte, cliquez sur Renvoi
.
Pour annuler le renvoi, ouvrez simplement la boîte de dialogue des propriétés du renvoi pour l'objet et
cliquez sur « Ne pas renvoyer »
. Veuillez noter que lorsque vous effectuez un renvoi d'objets de texte, seul le texte qui se trouve sous
l'objet est renvoyé et non tout le texte.
Veuillez noter que les lignes de texte ne correspondent pas aux objets de renvoi, mais uniquement les
zones de texte et les colonnes de texte.
Page 434
Utiliser un objet comme renvoi
Pour utiliser un objet comme renvoi de texte, sélectionnez la fonction Renvoyer texte sous... dans le
menu Arranger
pour ouvrir la boîte de dialogue des propriétés des renvois. Ou effectuez un clic droit sur l'objet et
sélectionnez la même option dans le menu contextuel.
Le cas échéant, configurez une marge de
renvoi pour cet objet. Cela permet de
déterminer la taille de la marge entre les bords
de l'objet et le texte qu'il renvoie. Pour fermer
la boîte de dialogue et retourner à l'option de
renvoi de texte, cliquez sur Renvoi
.
Pour annuler le renvoi, ouvrez simplement la boîte de dialogue des propriétés du renvoi pour l'objet et
cliquez sur « Ne pas renvoyer »
. Veuillez noter que lorsque vous effectuez un renvoi d'objets de texte, seul le texte qui se trouve sous
l'objet est renvoyé et non tout le texte.
Veuillez noter que les lignes de texte ne correspondent pas aux objets de renvoi, mais uniquement les
zones de texte et les colonnes de texte.
Page 435
Appliquer des styles de texte
Changer la taille de la police
Il existe quatre façons de charger la taille de la police :




Saisir une valeur dans le champ de texte de taille sur la barre d'infos et appuyer sur Entrée.
Ou la sélectionner dans le menu déroulant de Taille de police sur la barre d'infos.
Ou augmenter/diminuer la taille de police manuellement à l'aide des raccourcis clavier
Ctrl+Maj+> et Ctrl+Maj+<. Ceci s'applique uniquement si toutes les parties du texte sélectionné
ont la même taille de police.
Ou utiliser l'Outil de sélection pour modifier l'échelle de l'ensemble de l'objet texte.
Gras et italique
Cliquer sur le bouton Gras ou Italique
sur la barre d'infos (Ctrl + B ou Ctrl + I)
La police active est alors affíchée en gras ou en italique.
Attention
: Xtreme Web Designer 5 ne permet d'appliquer les options gras ou italique à un texte si la police
italique/gras correspondante n'est pas installée. Néanmoins, vous pouvez émuler facilement le même effet.
Pour rendre une police en gras, attribuez-lui une épaisseur très fine. Pour incliner une police, utilisez la
fonction inclinaison de l'outil de sélection. Pour en savoir plus, consultez la section Menu des polices.
Souligner
Cliquez sur le bouton Souligner dans la barre d'infos pour
souligner le texte sélectionné.
La couleur et la taille du trait de soulignage sont automatiquement dérivées de la taille et la couleur du
texte.
Justification ou alignement du texte
La justification s'applique systématiquement à toute la ligne. Toute section sélectionnée est ignorée.
Lorsque vous utilisez un texte simple, la position
initiale du curseur de la souris sur la page est considérée
comme point de départ pour la justification du texte.
Justification gauche
: aligne le bord gauche du texte sur la position initiale du curseur.
Justification centrée
: centre le texte sur la position du curseur.
Justification droite
: aligne le bord droit du texte sur la position initiale du curseur.
Indice et exposant
Cliquer sur le bouton approprié sur la barre d'infos
.
Texte normal Indice exposant
Espacement des lignes
Page 436
L'espacement des lignes vous permet de modifier
l'espacement entre deux lignes (et affecte ainsi
l'espacement vertical).
L'espacement des lignes se mesure en pourcentages (120 %) ou points (12 pt). Vous pouvez soit saisir la
valeur d'espacement de lignes dans le champ de texte soit cliquer sur les flèches pour faire progresser les
valeurs.
Un paramètre en pourcentage a l'avantage de modifier l'échelle proportionnellement si vous changez la
taille de la police. Si un pourcentage est appliqué à une ligne de texte avec plus d'une taille de police, la
police la plus grande sera utilisée. Par exemple, si une ligne contient du texte en 90 % et 100 %,
l'espacement de ligne sera calculé en 100 %.
Espacement des paragraphes
Les deux derniers champs à l'extrémité de la barre d'infos
de l'outil d'ajout de texte vous permettent de régler
l'espacement au-dessus et /ou en dessous des paragraphes.
Ceci est particulièrement utile lorsque vous souhaitez un espacement d'une demi-ligne entre les
paragraphes.
Tout comme dans Word de Microsoft, si vous définissez un espacement au-dessus et en dessous des
paragraphes, l'espacement entre ces derniers sera celui de plus grande valeur. L'espacement des
paragraphes appliqué au-dessus des paragraphes abaissera le premier dans un cadre de texte.
Page 437
Changer la taille de la police
Il existe quatre façons de charger la taille de la police :




Saisir une valeur dans le champ de texte de taille sur la barre d'infos et appuyer sur Entrée.
Ou la sélectionner dans le menu déroulant de Taille de police sur la barre d'infos.
Ou augmenter/diminuer la taille de police manuellement à l'aide des raccourcis clavier
Ctrl+Maj+> et Ctrl+Maj+<. Ceci s'applique uniquement si toutes les parties du texte sélectionné
ont la même taille de police.
Ou utiliser l'Outil de sélection pour modifier l'échelle de l'ensemble de l'objet texte.
Gras et italique
Cliquer sur le bouton Gras ou Italique
sur la barre d'infos (Ctrl + B ou Ctrl + I)
La police active est alors affíchée en gras ou en italique.
Attention
: Xtreme Web Designer 5 ne permet d'appliquer les options gras ou italique à un texte si la police
italique/gras correspondante n'est pas installée. Néanmoins, vous pouvez émuler facilement le même effet.
Pour rendre une police en gras, attribuez-lui une épaisseur très fine. Pour incliner une police, utilisez la
fonction inclinaison de l'outil de sélection. Pour en savoir plus, consultez la section Menu des polices.
Souligner
Cliquez sur le bouton Souligner dans la barre d'infos pour
souligner le texte sélectionné.
La couleur et la taille du trait de soulignage sont automatiquement dérivées de la taille et la couleur du
texte.
Justification ou alignement du texte
La justification s'applique systématiquement à toute la ligne. Toute section sélectionnée est ignorée.
Lorsque vous utilisez un texte simple, la position
initiale du curseur de la souris sur la page est considérée
comme point de départ pour la justification du texte.
Justification gauche
: aligne le bord gauche du texte sur la position initiale du curseur.
Justification centrée
: centre le texte sur la position du curseur.
Justification droite
: aligne le bord droit du texte sur la position initiale du curseur.
Indice et exposant
Cliquer sur le bouton approprié sur la barre d'infos
.
Texte normal Indice exposant
Espacement des lignes
L'espacement des lignes vous permet de modifier
l'espacement entre deux lignes (et affecte ainsi
Page 438
l'espacement vertical).
L'espacement des lignes se mesure en pourcentages (120 %) ou points (12 pt). Vous pouvez soit saisir la
valeur d'espacement de lignes dans le champ de texte soit cliquer sur les flèches pour faire progresser les
valeurs.
Un paramètre en pourcentage a l'avantage de modifier l'échelle proportionnellement si vous changez la
taille de la police. Si un pourcentage est appliqué à une ligne de texte avec plus d'une taille de police, la
police la plus grande sera utilisée. Par exemple, si une ligne contient du texte en 90 % et 100 %,
l'espacement de ligne sera calculé en 100 %.
Espacement des paragraphes
Les deux derniers champs à l'extrémité de la barre d'infos
de l'outil d'ajout de texte vous permettent de régler
l'espacement au-dessus et /ou en dessous des paragraphes.
Ceci est particulièrement utile lorsque vous souhaitez un espacement d'une demi-ligne entre les
paragraphes.
Tout comme dans Word de Microsoft, si vous définissez un espacement au-dessus et en dessous des
paragraphes, l'espacement entre ces derniers sera celui de plus grande valeur. L'espacement des
paragraphes appliqué au-dessus des paragraphes abaissera le premier dans un cadre de texte.
Page 439
Gras et italique
Cliquer sur le bouton Gras ou Italique
sur la barre d'infos (Ctrl + B ou Ctrl + I)
La police active est alors affíchée en gras ou en italique.
Attention
: Xtreme Web Designer 5 ne permet d'appliquer les options gras ou italique à un texte si la police
italique/gras correspondante n'est pas installée. Néanmoins, vous pouvez émuler facilement le même effet.
Pour rendre une police en gras, attribuez-lui une épaisseur très fine. Pour incliner une police, utilisez la
fonction inclinaison de l'outil de sélection. Pour en savoir plus, consultez la section Menu des polices.
Souligner
Cliquez sur le bouton Souligner dans la barre d'infos pour
souligner le texte sélectionné.
La couleur et la taille du trait de soulignage sont automatiquement dérivées de la taille et la couleur du
texte.
Justification ou alignement du texte
La justification s'applique systématiquement à toute la ligne. Toute section sélectionnée est ignorée.
Lorsque vous utilisez un texte simple, la position
initiale du curseur de la souris sur la page est considérée
comme point de départ pour la justification du texte.
Justification gauche
: aligne le bord gauche du texte sur la position initiale du curseur.
Justification centrée
: centre le texte sur la position du curseur.
Justification droite
: aligne le bord droit du texte sur la position initiale du curseur.
Indice et exposant
Cliquer sur le bouton approprié sur la barre d'infos
.
Texte normal Indice exposant
Espacement des lignes
L'espacement des lignes vous permet de modifier
l'espacement entre deux lignes (et affecte ainsi
l'espacement vertical).
L'espacement des lignes se mesure en pourcentages (120 %) ou points (12 pt). Vous pouvez soit saisir la
valeur d'espacement de lignes dans le champ de texte soit cliquer sur les flèches pour faire progresser les
valeurs.
Un paramètre en pourcentage a l'avantage de modifier l'échelle proportionnellement si vous changez la
taille de la police. Si un pourcentage est appliqué à une ligne de texte avec plus d'une taille de police, la
police la plus grande sera utilisée. Par exemple, si une ligne contient du texte en 90 % et 100 %,
l'espacement de ligne sera calculé en 100 %.
Espacement des paragraphes
Page 440
Les deux derniers champs à l'extrémité de la barre d'infos
de l'outil d'ajout de texte vous permettent de régler
l'espacement au-dessus et /ou en dessous des paragraphes.
Ceci est particulièrement utile lorsque vous souhaitez un espacement d'une demi-ligne entre les
paragraphes.
Tout comme dans Word de Microsoft, si vous définissez un espacement au-dessus et en dessous des
paragraphes, l'espacement entre ces derniers sera celui de plus grande valeur. L'espacement des
paragraphes appliqué au-dessus des paragraphes abaissera le premier dans un cadre de texte.
Page 441
Souligner
Cliquez sur le bouton Souligner dans la barre d'infos pour
souligner le texte sélectionné.
La couleur et la taille du trait de soulignage sont automatiquement dérivées de la taille et la couleur du
texte.
Justification ou alignement du texte
La justification s'applique systématiquement à toute la ligne. Toute section sélectionnée est ignorée.
Lorsque vous utilisez un texte simple, la position
initiale du curseur de la souris sur la page est considérée
comme point de départ pour la justification du texte.
Justification gauche
: aligne le bord gauche du texte sur la position initiale du curseur.
Justification centrée
: centre le texte sur la position du curseur.
Justification droite
: aligne le bord droit du texte sur la position initiale du curseur.
Indice et exposant
Cliquer sur le bouton approprié sur la barre d'infos
.
Texte normal Indice exposant
Espacement des lignes
L'espacement des lignes vous permet de modifier
l'espacement entre deux lignes (et affecte ainsi
l'espacement vertical).
L'espacement des lignes se mesure en pourcentages (120 %) ou points (12 pt). Vous pouvez soit saisir la
valeur d'espacement de lignes dans le champ de texte soit cliquer sur les flèches pour faire progresser les
valeurs.
Un paramètre en pourcentage a l'avantage de modifier l'échelle proportionnellement si vous changez la
taille de la police. Si un pourcentage est appliqué à une ligne de texte avec plus d'une taille de police, la
police la plus grande sera utilisée. Par exemple, si une ligne contient du texte en 90 % et 100 %,
l'espacement de ligne sera calculé en 100 %.
Espacement des paragraphes
Les deux derniers champs à l'extrémité de la barre d'infos
de l'outil d'ajout de texte vous permettent de régler
l'espacement au-dessus et /ou en dessous des paragraphes.
Ceci est particulièrement utile lorsque vous souhaitez un espacement d'une demi-ligne entre les
paragraphes.
Tout comme dans Word de Microsoft, si vous définissez un espacement au-dessus et en dessous des
paragraphes, l'espacement entre ces derniers sera celui de plus grande valeur. L'espacement des
paragraphes appliqué au-dessus des paragraphes abaissera le premier dans un cadre de texte.
Page 442
Justification ou alignement du texte
La justification s'applique systématiquement à toute la ligne. Toute section sélectionnée est ignorée.
Lorsque vous utilisez un texte simple, la position
initiale du curseur de la souris sur la page est considérée
comme point de départ pour la justification du texte.
Justification gauche
: aligne le bord gauche du texte sur la position initiale du curseur.
Justification centrée
: centre le texte sur la position du curseur.
Justification droite
: aligne le bord droit du texte sur la position initiale du curseur.
Indice et exposant
Cliquer sur le bouton approprié sur la barre d'infos
.
Texte normal Indice exposant
Espacement des lignes
L'espacement des lignes vous permet de modifier
l'espacement entre deux lignes (et affecte ainsi
l'espacement vertical).
L'espacement des lignes se mesure en pourcentages (120 %) ou points (12 pt). Vous pouvez soit saisir la
valeur d'espacement de lignes dans le champ de texte soit cliquer sur les flèches pour faire progresser les
valeurs.
Un paramètre en pourcentage a l'avantage de modifier l'échelle proportionnellement si vous changez la
taille de la police. Si un pourcentage est appliqué à une ligne de texte avec plus d'une taille de police, la
police la plus grande sera utilisée. Par exemple, si une ligne contient du texte en 90 % et 100 %,
l'espacement de ligne sera calculé en 100 %.
Espacement des paragraphes
Les deux derniers champs à l'extrémité de la barre d'infos
de l'outil d'ajout de texte vous permettent de régler
l'espacement au-dessus et /ou en dessous des paragraphes.
Ceci est particulièrement utile lorsque vous souhaitez un espacement d'une demi-ligne entre les
paragraphes.
Tout comme dans Word de Microsoft, si vous définissez un espacement au-dessus et en dessous des
paragraphes, l'espacement entre ces derniers sera celui de plus grande valeur. L'espacement des
paragraphes appliqué au-dessus des paragraphes abaissera le premier dans un cadre de texte.
Page 443
Indice et exposant
Cliquer sur le bouton approprié sur la barre d'infos
.
Texte normal Indice exposant
Espacement des lignes
L'espacement des lignes vous permet de modifier
l'espacement entre deux lignes (et affecte ainsi
l'espacement vertical).
L'espacement des lignes se mesure en pourcentages (120 %) ou points (12 pt). Vous pouvez soit saisir la
valeur d'espacement de lignes dans le champ de texte soit cliquer sur les flèches pour faire progresser les
valeurs.
Un paramètre en pourcentage a l'avantage de modifier l'échelle proportionnellement si vous changez la
taille de la police. Si un pourcentage est appliqué à une ligne de texte avec plus d'une taille de police, la
police la plus grande sera utilisée. Par exemple, si une ligne contient du texte en 90 % et 100 %,
l'espacement de ligne sera calculé en 100 %.
Espacement des paragraphes
Les deux derniers champs à l'extrémité de la barre d'infos
de l'outil d'ajout de texte vous permettent de régler
l'espacement au-dessus et /ou en dessous des paragraphes.
Ceci est particulièrement utile lorsque vous souhaitez un espacement d'une demi-ligne entre les
paragraphes.
Tout comme dans Word de Microsoft, si vous définissez un espacement au-dessus et en dessous des
paragraphes, l'espacement entre ces derniers sera celui de plus grande valeur. L'espacement des
paragraphes appliqué au-dessus des paragraphes abaissera le premier dans un cadre de texte.
Page 444
Espacement des lignes
L'espacement des lignes vous permet de modifier
l'espacement entre deux lignes (et affecte ainsi
l'espacement vertical).
L'espacement des lignes se mesure en pourcentages (120 %) ou points (12 pt). Vous pouvez soit saisir la
valeur d'espacement de lignes dans le champ de texte soit cliquer sur les flèches pour faire progresser les
valeurs.
Un paramètre en pourcentage a l'avantage de modifier l'échelle proportionnellement si vous changez la
taille de la police. Si un pourcentage est appliqué à une ligne de texte avec plus d'une taille de police, la
police la plus grande sera utilisée. Par exemple, si une ligne contient du texte en 90 % et 100 %,
l'espacement de ligne sera calculé en 100 %.
Espacement des paragraphes
Les deux derniers champs à l'extrémité de la barre d'infos
de l'outil d'ajout de texte vous permettent de régler
l'espacement au-dessus et /ou en dessous des paragraphes.
Ceci est particulièrement utile lorsque vous souhaitez un espacement d'une demi-ligne entre les
paragraphes.
Tout comme dans Word de Microsoft, si vous définissez un espacement au-dessus et en dessous des
paragraphes, l'espacement entre ces derniers sera celui de plus grande valeur. L'espacement des
paragraphes appliqué au-dessus des paragraphes abaissera le premier dans un cadre de texte.
Page 445
Espacement des paragraphes
Les deux derniers champs à l'extrémité de la barre d'infos
de l'outil d'ajout de texte vous permettent de régler
l'espacement au-dessus et /ou en dessous des paragraphes.
Ceci est particulièrement utile lorsque vous souhaitez un espacement d'une demi-ligne entre les
paragraphes.
Tout comme dans Word de Microsoft, si vous définissez un espacement au-dessus et en dessous des
paragraphes, l'espacement entre ces derniers sera celui de plus grande valeur. L'espacement des
paragraphes appliqué au-dessus des paragraphes abaissera le premier dans un cadre de texte.
Page 446
Liens hypertextes
Vous pouvez appliquer un lien à toute partie d'un objet-texte, de sorte que, lorsque le document est
exporté au format HTML, le texte présente un lien cliquable dans les navigateurs Internet.
Utilisez l'Outil Texte pour sélectionner les mots ou caractères auxquels
vous souhaitez appliquer le lien, puis cliquez sur le bouton de lien sur la
barre d'outil Web
.
Cela ouvre la boîte de dialogue des Propriétés Web avec l'Onglet de lien
sélectionné. Sur cet onglet, vous pouvez choisir d'établir un lien avec un URL, une autre page de votre
site ou même un calque pop-up.
Par défaut, lorsque vous appliquez un lien à du texte, ce dernier apparaît souligné et avec la couleur de
lien hypertexte définie pour le document actuel. Vous pouvez modifier la couleur du lien et décider de
souligner ou non les liens dans l'onglet site Web de la boîte de dialogue Propriétés Web (menu
Outils->Propriétés Web
). Vous pouvez également définir la couleur à afficher lorsque l'utilisateur déplace le curseur de la souris
sur un lien hypertexte dans un navigateur Internet (« Couleur de survol de la souris »), ainsi que la
« Couleur visitée » utilisée pour afficher les liens déjà cliqués par l'utilisateur depuis son navigateur.
Lorsque vous définissez les trois couleurs de lien hypertexte générales, vous pouvez sélectionner des
couleurs de thème nommées existantes, utilisées sur votre site Web, à l'aide des menus déroulants, ou
vous pouvez cliquer sur le bouton Éditer afin de faire apparaître l'Éditeur de couleur
qui vous permet de choisir la couleur souhaitée.
Vous pouvez également choisir de redéfinir les couleurs de lien hypertexte générales pour des liens
individuels, si nécessaire. Sur l'onglet de lien de la boîte de dialogue des Propriétés Web, désélectionner
l'option « Utiliser les couleurs générales de lien vers des sites ». Alors, le lien sélectionné sera affiché en
utilisant la couleur de texte définie dans le document plutôt que la couleur de lien hypertexte générale.
Page 447
Texte à l'intérieur de groupes pour sites Web
Lors de l'exportation d'un document en tant que site Web, tous les groupes sont exportés en tant
qu'images. Ainsi, un texte à l'intérieur de groupes n'est pas présent en tant que texte sur votre site exporté
et il ne peut donc pas être repéré par les moteurs de recherche ou sélectionné et copié en tant que texte
par un visiteur de votre site.
Pour les boutons graphiques, les titres, les logos etc., cela est habituellement souhaitable car le texte fait
partie de l'élément graphique. Mais vous pouvez avoir des éléments de texte plus importants dans des
groupes que vous souhaitez conserver en tant que texte sur votre page Web exportée. Pour gérer cela,
vous devez uniquement appliquer le nom spécial « Texte HTML » à votre objet-texte. Le moyen le plus
simple est le suivant :
1. Rendez-vous dans l'Outil Texte puis cliquez sur le texte pour insérer le curseur.
2. Appuyer sur Esc pour sélectionner tout le texte.
3. Ouvrez la boîte de dialogue (Outils->Noms...).
4. Si vous l'avez déjà utilisé dans le document en cours, sélectionnez le nom « HTMLText » depuis
le menu déroulant « Appliquer le nom » ou saisissez le nom « HTMLText ». Cliquez ensuite sur le
bouton « Ajouter » pour ajouter le nom.
Désormais, lorsque vous exportez votre site, votre texte est conservé en tant que texte et le reste du
groupe est converti en une image. Tous les panneaux de texte fournis dans la Galerie des designs
ont déjà ce nom appliqué aux objets-texte de la galerie. Le texte des panneaux sera donc exporté en
tant que texte.
Les navigateurs ne peuvent pas reproduire de texte pivoté. Vous ne pouvez donc pas utiliser ce nom
pour forcer l'exportation en tant que texte de texte pivoté. Dans ce cas, le nom est ignoré.
Page 448
Copier les polices
La fonction Appliquer les attributs
permet de copier des attributs de n'importe quel texte pour les appliquer à un autre texte du document :
 Sélectionnez le texte source dont vous souhaitez conserver les attributs. Il peut s'agir également
d'un seul mot (double-cliquez dessus).
 Sélectionnez Édition > Copier (ou Ctrl+C).
 Sélectionnez ensuite le texte ou la partie de texte à laquelle vous souhaitez appliquer les attributs.
 Sélectionnez Édition > Appliquer les attributs (Ctrl+Maj+A).
Si le curseur de texte est positionné dans un texte au moment où vous utilisez la fonction Appliquer les
attributs
, les attributs du paragraphe seront également appliqués (par exemple les retraits, marges, etc.).
Si vous avez sélectionné une partie de texte, la fonction Appliquer les attributs
va permettre d'appliquer tous les éléments visuels du texte source.
Appliquer les attributs à tout le texte
Lorsque le curseur est placé dans un objet texte colonne ou simple texte, vous pouvez sélectionner
l'objet texte complet en cliquant sur Echap. Vous pouvez ensuite appliquer un attribut, définir une
couleur, le tout appliqué au texte entier. Cette opération est souvent plus rapide que la fonction
Sélectionner tout (Ctrl+A).
Cette méthode fonctionne pour des segments de texte uniquement lorsque tous les segments de texte
sont sélectionnés. Pour cela, vous pouvez cliquer sur les différents segments de texte avec Maj+Clic
dans l'outil de sélection
. Cette méthode fonctionne uniquement lorsque les zones de texte sont situées sur une seule page. Si le
texte est situé sur plusieurs pages et que vous souhaitez le modifier, vous devez d'abord le sélectionner
avec la fonction Sélectionner tout (Ctrl+A) puis appliquer les attributs requis.
Page 449
Appliquer les attributs à tout le texte
Lorsque le curseur est placé dans un objet texte colonne ou simple texte, vous pouvez sélectionner
l'objet texte complet en cliquant sur Echap. Vous pouvez ensuite appliquer un attribut, définir une
couleur, le tout appliqué au texte entier. Cette opération est souvent plus rapide que la fonction
Sélectionner tout (Ctrl+A).
Cette méthode fonctionne pour des segments de texte uniquement lorsque tous les segments de texte
sont sélectionnés. Pour cela, vous pouvez cliquer sur les différents segments de texte avec Maj+Clic
dans l'outil de sélection
. Cette méthode fonctionne uniquement lorsque les zones de texte sont situées sur une seule page. Si le
texte est situé sur plusieurs pages et que vous souhaitez le modifier, vous devez d'abord le sélectionner
avec la fonction Sélectionner tout (Ctrl+A) puis appliquer les attributs requis.
Page 450
Copier/coller un texte formaté (RTF)
Vous pouvez copier des textes appelés « Rich Text » dans d'autres applications comme les traitements
de texte et les coller dans Xtreme Web Designer 5 ; le texte, la police, les marges, l'espacement seront
conservés. Cela simplifie énormément l'édition du style de votre texte.
Si vous appliquez un format « Rich Text » (RTF) copié dans une autre application, vous avez la
possibilité de copier le texte comme « Texte non formaté » : il apparaîtra alors dans la police et le style
indiqués par le curseur. Au format « Rich Text », le formatage du texte source sera conservé.
Cela fonctionne également à l'inverse. Vous pouvez copier un texte dans Web Designer et le coller dans
d'autres applications prenant en charge l'édition dans ce format (police, taille, couleur, marges, etc.).
Cette méthode fonctionne uniquement si vous sélectionnez et copiez un objet de texte unique ou depuis
un texte.
Certaines applications, comme Microsofot Word, disposent d'un menu « Coller » spécial, proposant de
nombreuses options. Ces applications permettent même de sélectionner le format de l'objet collé (texte
ou graphique).
Page 451
Visualiser les polices utilisées actuellement
Il est parfois utile de visualiser les polices actuellement utilisées dans le document, en particulier lorsque
vous souhaitez partager des fichiers avec d'autres utilisateurs de Web Designer qui n'ont pas forcément
installé les mêmes polices.
Pour obtenir une liste complète des polices utilisées dans votre document, sélectionnez Fichier > Info
document
.
Toutes les polices utilisées dans le document mais qui ne sont pas installées dans votre système sont
signalées par la mention Non installé
.
Lorsque vous souhaitez partager un document avec un utilisateur qui n'a pas installé les mêmes polices
que vous, et que cette personne ne doit pas éditer le texte, vous pouvez alors convertir le texte en formes
éditables (voir plus bas).
Page 452
Intégration des polices
Xtreme Web Designer 5 enregistre les formes des caractères de toutes les polices utilisées dans votre
document. Cela signifie que si vous donnez à quelqu'un d'autre votre fichier de projet, ou si vous
transférez le fichier sur un autre ordinateur, le texte apparaîtra parfaitement, même si les polices correctes
ne sont pas installées sur cet ordinateur. Cette option n'incruste que les caractères d'une police qui sont
utilisés dans le document (la police n'est pas incluse en entier). Ainsi, sur les ordinateurs ne comportant
pas les polices, le texte ajouté dans la police manquante ne présentera éventuellement pas les formes de
caractère correctes.
Page 453
Compatibilité de texte navigateur
C'est une réalité bien triste, mais différents navigateurs affichent le même texte de manière relativement
différente, habituellement avec une différence de taille ou de longueur de ligne. Au moment de la
rédaction du présent document, seul un navigateur Internet permet d'obtenir les tailles de texte correctes
(Firefox 3 pour Mac), tous les autres navigateurs affichent un texte qui est souvent trop long, dont les
tailles sont arrondies à des pixels entiers (par exemple, un texte en 10 pt n'est pas affiché en 10 mais à la
taille de pixel entier la plus proche (13 pixels).
Xtreme Web Designer 5 est conçu pour simuler le comportement des navigateurs les plus courants, pour
ajuster les tailles intermédiaires à des pixels entiers et pour ajuster les longueurs de ligne afin de simuler le
texte tel qu'il apparaît sur les navigateurs Windows. Vous pouvez désactiver cet ajustement dans la boîte
de dialogue Options, onglet Général (menu Outils-> Options) en décochant l'option « Afficher les
longueurs de texte compatibles avec Windows
».
Note avancée : si vous utilisez Web Designer ou si vous désactivez cette option de compatibilité, puis
que vous saisissez une taille intermédiaire, par exemple 13,6 pixels ou 10pt, vous obtiendrez un texte
exactement et précisément mis à cet échelle. Cependant, nous vous avons prévenu que la plupart des
navigateurs Internet afficheront ce texte à une taille légèrement plus large ou plus petite que ce que vous
voyez dans Xtreme Web Designer 5.
Une autre conséquence de ce (mauvais) comportement des navigateurs est que pour les petites tailles de
police, le passage d'une taille à l'autre représente un écart relativement élevé. Ainsi, il ne sera pas possible
d'obtenir une taille de police entre 9 pix et 10 pix. La plupart des navigateurs ne peuvent pas afficher de
taille intermédiaire (que vous utilisiez des points, des cadratins ou toute autre unité). Vous verrez donc les
tailles de texte de Xtreme Web Designer 5 passer d'une taille à l'autre lorsque vous redimensionnez les
objets.
Page 454
L'outil de remplissage
Création d'un remplissage de couleur
dégradé
Le procédé de création d'un remplissage est à peu près similaire pour
tous les types de remplissage :
1. sélectionnez l'objet ou les objets auxquels vous souhaitez appliquer le remplissage.
2. Sélectionnez l'outil de remplissage (raccourci : F5)
3. Sélectionnez le type de remplissage depuis le menu déroulant.
4. Cliquez et tirez la sélection sur l'objet pour créer le remplissage.
4. Ou encore, tirez sur l'une des poignées de remplissage pour ajuster la taille du remplissage et sa
position.
Xtreme Web Designer 5 affiche un aperçu interactif et fluide du remplissage lorsque vous tirez. Il s'agit
d'un avantage non négligeable en comparaison avec les outils de remplissage basés sur des boîtes de
dialogue. L'opération est non seulement plus rapide, et plus simple, mais elle vous permet également
d'obtenir dès le début des positions de démarrage et de fin correctes.
Lorsque vous tirez, une petite flèche s'affiche, indiquant la direction du remplissage. Vous pouvez en
outre sélectionner les poignées de remplissage et les tirer pour ajuster la position et l'angle du
remplissage.
Colorer les remplissages
Sélectionner l'une des poignées de remplissage et cliquez sur une couleur dans la palette ou utilisez l'
éditeur de couleurs
pour définir une nouvelle couleur. Vous pouvez alterner entre les poignées de remplissage en cliquant sur
le tabulateur.
Modifier la sélection
Dans l'outil de remplissage, un clic sur l'objet est suffisant pour le sélectionner, il n'est pas nécessaire
d'aller dans l'outil de sélection
pour sélectionner d'autres objets.
Page 455
Création d'un remplissage de couleur dégradé
Le procédé de création d'un remplissage est à peu près similaire pour
tous les types de remplissage :
1. sélectionnez l'objet ou les objets auxquels vous souhaitez appliquer le remplissage.
2. Sélectionnez l'outil de remplissage (raccourci : F5)
3. Sélectionnez le type de remplissage depuis le menu déroulant.
4. Cliquez et tirez la sélection sur l'objet pour créer le remplissage.
4. Ou encore, tirez sur l'une des poignées de remplissage pour ajuster la taille du remplissage et sa
position.
Xtreme Web Designer 5 affiche un aperçu interactif et fluide du remplissage lorsque vous tirez. Il s'agit
d'un avantage non négligeable en comparaison avec les outils de remplissage basés sur des boîtes de
dialogue. L'opération est non seulement plus rapide, et plus simple, mais elle vous permet également
d'obtenir dès le début des positions de démarrage et de fin correctes.
Lorsque vous tirez, une petite flèche s'affiche, indiquant la direction du remplissage. Vous pouvez en
outre sélectionner les poignées de remplissage et les tirer pour ajuster la position et l'angle du
remplissage.
Colorer les remplissages
Sélectionner l'une des poignées de remplissage et cliquez sur une couleur dans la palette ou utilisez l'
éditeur de couleurs
pour définir une nouvelle couleur. Vous pouvez alterner entre les poignées de remplissage en cliquant sur
le tabulateur.
Modifier la sélection
Dans l'outil de remplissage, un clic sur l'objet est suffisant pour le sélectionner, il n'est pas nécessaire
d'aller dans l'outil de sélection
pour sélectionner d'autres objets.
Page 456
Types de remplissage
Web Designer possède les types de couleurs de remplissage suivants :
Remplissage uniforme
: la surface de la forme est composée d'une seule couleur
unie.
Remplissage linéaire
: la couleur de remplissage est graduellement modifiée.
Remplissage circulaire
: le dégradé de couleur s'effectue de façon circulaire,
partant d'un point pour s'étendre vers l'extérieur en
cercles.
Remplissage elliptique
: similaire au remplissage circulaire, mais le dégradé
s'effectue dans une forme elliptique.
Remplissage bitmap : l'objet est rempli avec un ou
plusieurs copies empilées du bitmap ou de la photo.
Toutes les photos que vous voyez dans Xtreme Web
Designer 5 sont des formes composées de remplissages
bitmap (normalement des rectangles). Vous pouvez utiliser
n'importe quel bitmap se trouvant dans les galeries Bitmap
ou de remplissage
.
Nuage fractal
: cette fonction produit un motif de remplissage aléatoire,
très utile pour représenter des nuages ou de la brume.
Plasma fractal
: il s'agit d'un motif de remplissage aléatoire qui possède
plus de contraste qu'un remplissage en nuage fractal.
L'Outil de remplissage
vous permet d'appliquer ces types de remplissage à l'objet sélectionné ainsi que d'éditer et d'ajuster les
remplissages.
Sélectionner automatiquement l'intérieur
Dans l'Outil de remplissage, la « Sélection de l'intérieur » est automatique si vous cliquez sur un objet,
c'est-à-dire une partie d'un groupe, au lieu de sélectionner un groupe en entier. Dans l'Outil de
remplissage, si vous cliquez sur un objet qui se trouve à l'intérieur d'un groupe, cet objet sera sélectionné
au lieu du groupe en entier. Cela s'appelle « sélection intérieure ». Cela facilite l'édition de photos et de
remplissages à l'intérieur d'un groupe. Si vous souhaitez modifier les attributs du remplissage d'un groupe,
vous devez d'abord sélectionner le groupe en utilisant l'Outil de sélection.
Page 457
Barre d'infos de l'outil de remplissage
Type de
remplissage
Quadrillage Effet du
Bitmap
du
remplissag nom
remplissage e
Poignée de Couleur de
remplissag poignée/
e/
Grain
Résolution
Type de remplissage
permet de sélectionner le type du remplissage. Depuis ce menu :
 lorsque qu'un objet est sélectionné, le remplissage sera appliqué à cet objet ;
 sans objet sélectionné, le type de remplissage par défaut est défini puis il est utilisé pour les
nouveaux objets dessinés.
Le Quadrillage du remplissage
est appliqué pour les remplissages bitmap ou fractal. Les options sont décrites plus bas, dans les
remplissages bitmap. Le quadrillage du remplissage modifie la répétition de l'effet de remplissage. Les
options sont les suivantes :
 Simple : le remplissage est utilisé une fois uniquement, quelle que soit la taille de l'objet. La zone
située autour de la « tuile » est transparente.
 Répété : il y a répétition de l'effet de remplissage afin de remplir l'objet entier.
 Répété inversé : disponible uniquement pour les remplissages fractal et bitmap. Similaire à la tuile
répétée, mais chaque second carreau est inversé. Cela aide à masquer les lignes de jointure là où
les tuiles se rejoignent.
Une ellipse avec un remplissage en ellipse répété
Effet de remplissage
est ????utilisé pour tous les types de remplissage. Il permet de contrôler le dégradé des couleurs de
remplissage de la première à la dernière couleur :
 Transition : permet de créer un fondu enchaîné linéaire entre deux couleurs.
 Arc-en-ciel : permet de réaliser une transition sur le bord le plus court de cercle de couleur
TSV. Par exemple, un mélange de jaune et de cyan donnera un cyan jaune vert.
Cette option est sans effet lorsque les deux couleurs sont noir, blanc ou gris.
 Alt Arc-en-ciel : la fonction est similaire à Arc-en-ciel, mais la transition sera réalisée sur le bord
le plus long du cercle de couleur. Par exemple, le jaune et le cyan iront du jaune rouge magenta
bleu au cyan.
Nom bitmap affiche un menu déroulant comprenant des images d'aperçu de tous les bitmaps de la
Galerie bitmap
, et est une méthode simple pour sélectionner un bitmap/une photo requis lors d'un remplissage bitmap.
Poignée de remplissage
: indique si la poignée de début ou de fin est sélectionnée. Ce champ est vide en présence de
remplissages uniformes.
Résolution
(uniquement pour les remplissages fractal et bitmap) : indique la résolution du bitmap (tant que les
Page 458
poignée de remplissage ne sont pas sélectionnées). Vous pouvez entrer des nouvelles valeurs de
résolution pour modifier la taille du bitmap. Les résolutions basses montrent les différents pixels du
bitmap. Vous avez rarement besoin d'une résolution supérieure à 150 dpi, même lorsqu'il s'agit de
caractères d'écriture. 96 DPI suffit pour la résolution d'écran.
Couleur de poignée de remplissage
(excepté pour les remplissages bitmap) : indique la couleur appliquée à la poignée de remplissage
sélectionnée.
Page 459
Remplissages uniformes
Pour appliquer ou modifier un remplissage uniforme :
1. sélectionnez un remplissage uniforme depuis le
menu de type de remplissage.
2. Sélectionnez une couleur dans la Palette des
couleurs.
La palette de couleurs est décrite dans le chapitre Utilisation des couleurs
.
Page 460
Remplissages linéaires
Pour appliquer un
remplissage
linéaire :
1. Sélectionnez un remplissage linéaire dans le menu des types de remplissage. (Pas nécessaire si
l'objet actuel dispose d'un remplissage uniforme).
2. Positionnez le pointeur de la souris à l'endroit où vous souhaitez démarrer le remplissage. (Cela
peut également se situer en dehors de l'objet)
3. Tirez le pointeur de la souris à l'endroit où vous souhaitez terminer le remplissage. (Ce point peut
également se trouver en dehors de l'objet).
La flèche affichée sur l'objet sélectionné est appelée flèche de remplissage. Elle indique la direction et
l'étendue du remplissage. Vous pouvez au choix sélectionner chaque fin de la flèche en cliquant dessus.
Déplacer la poignée de début ou de fin du remplissage
Pour modifier la direction et l'étendue du remplissage :
1. Positionnez le pointeur de la souris sur la poignée que vous
souhaitez déplacer. Lorsqu'il est en position, le pointeur
change de forme.
2. Tirez la poignée.
Modifier les couleurs de remplissage
Pour modifier la couleur dans un remplissage :
 Faire un glisser&déplacer de la couleur depuis la Palette des couleurs sur une poignée de
remplissage (vous n'avez pas besoin de sélectionner la poignée en premier).
 Ou placez la couleur dans l'objet par glisser&déposer. Chaque remplissage dispose d'une ligne
médiane imaginaire le long de la flèche de remplissage. Si vous placez la couleur sur la poignée
de début, vous en modifiez la couleur, de même pour la poignée de fin.
 Ou, si l'une des poignées de fin est sélectionnée (surlignée), cliquez simplement sur une couleur.
Vous pouvez utiliser le « Tabulateur » pour sélectionner l'autre poignée de remplissage, et cliquer
sur la couleur choisie.
La palette de couleurs est décrite dans le chapitre Utilisation des couleurs
.
Chaque méthode change la couleur d'une seule poignée ; elle ne change pas les autres poignées de
remplissage sélectionnées, ou :
1. Sélectionnez la poignée de votre choix (ou les poignées, dans le cas où vous avez plusieurs
objets).
2. Sélectionnez la couleur souhaitée dans la palette.
3. Cette opération modifie toutes les poignées de remplissage sélectionnées.
Page 461
Déplacer la poignée de début ou de fin du remplissage
Pour modifier la direction et l'étendue du remplissage :
1. Positionnez le pointeur de la souris sur la poignée que vous
souhaitez déplacer. Lorsqu'il est en position, le pointeur
change de forme.
2. Tirez la poignée.
Modifier les couleurs de remplissage
Pour modifier la couleur dans un remplissage :
 Faire un glisser&déplacer de la couleur depuis la Palette des couleurs sur une poignée de
remplissage (vous n'avez pas besoin de sélectionner la poignée en premier).
 Ou placez la couleur dans l'objet par glisser&déposer. Chaque remplissage dispose d'une ligne
médiane imaginaire le long de la flèche de remplissage. Si vous placez la couleur sur la poignée
de début, vous en modifiez la couleur, de même pour la poignée de fin.
 Ou, si l'une des poignées de fin est sélectionnée (surlignée), cliquez simplement sur une couleur.
Vous pouvez utiliser le « Tabulateur » pour sélectionner l'autre poignée de remplissage, et cliquer
sur la couleur choisie.
La palette de couleurs est décrite dans le chapitre Utilisation des couleurs
.
Chaque méthode change la couleur d'une seule poignée ; elle ne change pas les autres poignées de
remplissage sélectionnées, ou :
1. Sélectionnez la poignée de votre choix (ou les poignées, dans le cas où vous avez plusieurs
objets).
2. Sélectionnez la couleur souhaitée dans la palette.
3. Cette opération modifie toutes les poignées de remplissage sélectionnées.
Page 462
Modifier les couleurs de remplissage
Pour modifier la couleur dans un remplissage :
 Faire un glisser&déplacer de la couleur depuis la Palette des couleurs sur une poignée de
remplissage (vous n'avez pas besoin de sélectionner la poignée en premier).
 Ou placez la couleur dans l'objet par glisser&déposer. Chaque remplissage dispose d'une ligne
médiane imaginaire le long de la flèche de remplissage. Si vous placez la couleur sur la poignée
de début, vous en modifiez la couleur, de même pour la poignée de fin.
 Ou, si l'une des poignées de fin est sélectionnée (surlignée), cliquez simplement sur une couleur.
Vous pouvez utiliser le « Tabulateur » pour sélectionner l'autre poignée de remplissage, et cliquer
sur la couleur choisie.
La palette de couleurs est décrite dans le chapitre Utilisation des couleurs
.
Chaque méthode change la couleur d'une seule poignée ; elle ne change pas les autres poignées de
remplissage sélectionnées, ou :
1. Sélectionnez la poignée de votre choix (ou les poignées, dans le cas où vous avez plusieurs
objets).
2. Sélectionnez la couleur souhaitée dans la palette.
3. Cette opération modifie toutes les poignées de remplissage sélectionnées.
Page 463
Remplissages circulaires
Pour les remplissages circulaires, les opérations
d'application du remplissage, de déplacement des
poignées et de modification des couleurs sont les même
que pour les remplissages linéaires. La poignée de début
est le centre du remplissage.
Les remplissages circulaires sont utiles pour créer des effets projecteurs.
Toute modification du rapport largeur hauteur de l'objet entraîne automatiquement la modification d'un
remplissage circulaire en remplissage elliptique (vois plus bas).
Page 464
Remplissages elliptiques
Un remplissage elliptique s'applique de la même manière
qu'un remplissage linéaire. Lorsque vous tirez le pointeur
de la souris, vous créez d'abord un cercle avec deux
poignées de fin. Vous pouvez ensuite tirer les poignées de
fin pour créer une ellipse adaptée.
Appuyer sur la touche Maj de votre clavier et faire glisser le curseur de la souris préserve les proportions
du remplissage. Appuyer sur CTRL et faire glisser limite la rotation aux angles prédéfinis. Le
déplacement des poignées et la modification des couleurs se font de la même façon que pour les
remplissages linéaires.
Une façon rapide d'appliquer un remplissage elliptique :
Appuyez sur la touche Maj de votre clavier et faites glisser le curseur de la souris.
Page 465
Remplissages bitmap
La Galerie des Bitmaps est décrite dans Galerie Bitmap dans le chapitre sur la manipulation des photos,
voir ci-dessous pour la Galerie des remplissages
.
Les remplissages bitmap sont parmi les plus puissants types de remplissage. Ils permettent d'utiliser
n'importe quelle photo ou texture comme remplissage, et cela pour n'importe quelle forme, et vous
pouvez en modifier directement la taille, l'angle, la position et le quadrillage. Vous pouvez également
colorer des remplissages bitmap. Vous pouvez utiliser tout type de bitmap comme remplissage, y
compris des photos au format JPEG et des Bitmaps alpha-channel (semi-transparent).
Lorsque vous importez un fichier photo dans Xtreme Web Designer 5 (p.ex. un fichier JPG ou PNG), il
apparaît en tant que forme avec un type de remplissage bitmap. Lorsqu'un tel objet est sélectionné, la
ligne de statut l'affiche en tant que photo, mais elle est similaire à une forme à laquelle on aurait appliqué
une photo en tant que remplissage bitmap.
Pour remplir une forme avec un remplissage bitmap ou photo, opérez de la manière suivante :
 Tirez n'importe quel bitmap depuis la Galerie de bitmap ou depuis l'explorateur de fichiers de
Windows et placez-le sur n'importe quelle forme, maintenez la touche Maj appuyée et déposez
ou
 Tirez n'importe quel remplissage depuis la Galerie de remplissages sur la forme (il n'est pas
nécessaire ici de maintenir la touche Maj appuyée dans ce cas).
 Sélectionnez l'entrée Bitmap sur la gauche du menu déroulant de la barre d'outil de remplissage
puis sélectionnez le bitmap sélectionné dans le menu déroulant (il affiche uniquement les Bitmaps
qui ont été chargés auparavant).
Vous pouvez remplir un objet avec un ou plusieurs quadrillages (répétitions de l'image bitmap).
Carreau individuel
Répéter le quadrillage Répété inversé : les carreaux
(photo)
sont parfaitement accordés.
Le remplissage dispose de trois poignées. Vous pouvez les utiliser pour Redimensionner et repositionner
les remplissages de bitmap
. Une méthode alternative de définition de la taille du bitmap consiste à entrer manuellement la valeur de
la résolution. Commencez par désélectionner les poignées de remplissage en cliquant n'importe où sur
l'image autre que sur une de ces poignées puis entrez une nouvelle résolution dpi.
Remplacer des remplissages bitmap
Si une forme contient déjà un bitmap, ou qu'il s'agit d'une photo, vous pouvez juste placer par
glisser-déposer un nouveau bitmap depuis n'importe quelle source, comme l'explorateur Windows, et il
remplacera automatiquement le bitmap existant. La nouvelle image est ajustée dans la forme de manière à
y être adaptée. Cette opération remplacera aussi toutes les autres instances de cette photo sur la page en
cours.
Si vous maintenez la touche Maj
enfoncée pendant que vous remplacez une photo de cette façon, la position, l'échelle et la rotation du
Page 466
remplissage bitmap seront préservées.
Colorer un bitmap
Vous pouvez colorer un bitmap ou un remplissage de photo en cliquant seulement sur n'importe quelle
couleur dans la Palette de couleurs (assurez-vous qu'aucune poignée de remplissage n'est sélectionnée,
en cliquant sur l'image). Un Contone sera alors créé (techniquement il s'agit d'un Duotone) qui va du noir
vers la couleur sélectionnée. Vous pouvez également effectuer un clic droit sur la palette de couleurs et
sélectionner l'option Déterminer la couleur claire contone ou Déterminer la couleur sombre
contone
.
Pour par exemple transformer une image couleur en noir et blanc, il vous suffit de cliquer sur la couleur
Blanc dans la palette de couleurs.
Pour annuler n'importe quelle couleur
appliquée, cliquez sur Non. Cliquez
sur Couleur
pour chacune des poignées de
remplissage. La couleur originale du
bitmap est restaurée.
Le champ Résolution dans la barre d'infos
affiche la résolution que vous pouvez définir en déplaçant les poignées de remplissage ou en entrant
manuellement une valeur.
Calibrer et positionner un remplissage bitmap
Une fois que le remplissage est créé, vous pouvez
le déplacer dans l'image pour le repositionner à
l'intérieur de la forme.
Lorsque vous passez avec la souris sur les
poignées extérieures de remplissage, le curseur de
la souris se transforme en un curseur « de
rotation ». Si vous tirez sur ces poignées, le
remplissage bitmap sera étiré et tourné, tout en
conservant ses proportions actuelles ; maintenez la
touche N enfoncée pendant que vous tirez pour
changer les dimensions horizontales et verticales
indépendamment les unes des autres, pour
pouvoir incliner le remplissage. La barre d'infos
affiche la résolution du remplissage bitmap (vous
pouvez l'ajuster, ainsi la taille du bitmap, en
entrant une nouvelle valeur).
Un exemple
Page 467
Pour remplir l'ellipse située sur la gauche avec la photo du centre ;
1. Tirez la photo ou le fichier Bitmap de l'explorateur Windows (ou de la Galerie des Bitmaps s'ils
sont déjà utilisés dans le document) sur l'ellipse et faites-la glisser en maintenant la touche Maj.
L'outil de Remplissage devient l'outil actuel.
2. Vous pouvez alors ajouter les angles et la taille de l'image en tirant sur les poignées de
Remplissage.
L'exemple ci-dessus présente une ombre simple. Voir le chapitre sur l'outil ombres
pour de plus amples informations.
Page 468
Remplacer des remplissages bitmap
Si une forme contient déjà un bitmap, ou qu'il s'agit d'une photo, vous pouvez juste placer par
glisser-déposer un nouveau bitmap depuis n'importe quelle source, comme l'explorateur Windows, et il
remplacera automatiquement le bitmap existant. La nouvelle image est ajustée dans la forme de manière à
y être adaptée. Cette opération remplacera aussi toutes les autres instances de cette photo sur la page en
cours.
Si vous maintenez la touche Maj
enfoncée pendant que vous remplacez une photo de cette façon, la position, l'échelle et la rotation du
remplissage bitmap seront préservées.
Colorer un bitmap
Vous pouvez colorer un bitmap ou un remplissage de photo en cliquant seulement sur n'importe quelle
couleur dans la Palette de couleurs (assurez-vous qu'aucune poignée de remplissage n'est sélectionnée,
en cliquant sur l'image). Un Contone sera alors créé (techniquement il s'agit d'un Duotone) qui va du noir
vers la couleur sélectionnée. Vous pouvez également effectuer un clic droit sur la palette de couleurs et
sélectionner l'option Déterminer la couleur claire contone ou Déterminer la couleur sombre
contone
.
Pour par exemple transformer une image couleur en noir et blanc, il vous suffit de cliquer sur la couleur
Blanc dans la palette de couleurs.
Pour annuler n'importe quelle couleur
appliquée, cliquez sur Non. Cliquez
sur Couleur
pour chacune des poignées de
remplissage. La couleur originale du
bitmap est restaurée.
Le champ Résolution dans la barre d'infos
affiche la résolution que vous pouvez définir en déplaçant les poignées de remplissage ou en entrant
manuellement une valeur.
Calibrer et positionner un remplissage bitmap
Une fois que le remplissage est créé, vous pouvez
le déplacer dans l'image pour le repositionner à
l'intérieur de la forme.
Lorsque vous passez avec la souris sur les
poignées extérieures de remplissage, le curseur de
la souris se transforme en un curseur « de
rotation ». Si vous tirez sur ces poignées, le
remplissage bitmap sera étiré et tourné, tout en
conservant ses proportions actuelles ; maintenez la
touche N enfoncée pendant que vous tirez pour
changer les dimensions horizontales et verticales
indépendamment les unes des autres, pour
pouvoir incliner le remplissage. La barre d'infos
Page 469
affiche la résolution du remplissage bitmap (vous
pouvez l'ajuster, ainsi la taille du bitmap, en
entrant une nouvelle valeur).
Un exemple
Pour remplir l'ellipse située sur la gauche avec la photo du centre ;
1. Tirez la photo ou le fichier Bitmap de l'explorateur Windows (ou de la Galerie des Bitmaps s'ils
sont déjà utilisés dans le document) sur l'ellipse et faites-la glisser en maintenant la touche Maj.
L'outil de Remplissage devient l'outil actuel.
2. Vous pouvez alors ajouter les angles et la taille de l'image en tirant sur les poignées de
Remplissage.
L'exemple ci-dessus présente une ombre simple. Voir le chapitre sur l'outil ombres
pour de plus amples informations.
Page 470
Colorer un bitmap
Vous pouvez colorer un bitmap ou un remplissage de photo en cliquant seulement sur n'importe quelle
couleur dans la Palette de couleurs (assurez-vous qu'aucune poignée de remplissage n'est sélectionnée,
en cliquant sur l'image). Un Contone sera alors créé (techniquement il s'agit d'un Duotone) qui va du noir
vers la couleur sélectionnée. Vous pouvez également effectuer un clic droit sur la palette de couleurs et
sélectionner l'option Déterminer la couleur claire contone ou Déterminer la couleur sombre
contone
.
Pour par exemple transformer une image couleur en noir et blanc, il vous suffit de cliquer sur la couleur
Blanc dans la palette de couleurs.
Pour annuler n'importe quelle couleur
appliquée, cliquez sur Non. Cliquez
sur Couleur
pour chacune des poignées de
remplissage. La couleur originale du
bitmap est restaurée.
Le champ Résolution dans la barre d'infos
affiche la résolution que vous pouvez définir en déplaçant les poignées de remplissage ou en entrant
manuellement une valeur.
Calibrer et positionner un remplissage bitmap
Une fois que le remplissage est créé, vous pouvez
le déplacer dans l'image pour le repositionner à
l'intérieur de la forme.
Lorsque vous passez avec la souris sur les
poignées extérieures de remplissage, le curseur de
la souris se transforme en un curseur « de
rotation ». Si vous tirez sur ces poignées, le
remplissage bitmap sera étiré et tourné, tout en
conservant ses proportions actuelles ; maintenez la
touche N enfoncée pendant que vous tirez pour
changer les dimensions horizontales et verticales
indépendamment les unes des autres, pour
pouvoir incliner le remplissage. La barre d'infos
affiche la résolution du remplissage bitmap (vous
pouvez l'ajuster, ainsi la taille du bitmap, en
entrant une nouvelle valeur).
Un exemple
Page 471
Pour remplir l'ellipse située sur la gauche avec la photo du centre ;
1. Tirez la photo ou le fichier Bitmap de l'explorateur Windows (ou de la Galerie des Bitmaps s'ils
sont déjà utilisés dans le document) sur l'ellipse et faites-la glisser en maintenant la touche Maj.
L'outil de Remplissage devient l'outil actuel.
2. Vous pouvez alors ajouter les angles et la taille de l'image en tirant sur les poignées de
Remplissage.
L'exemple ci-dessus présente une ombre simple. Voir le chapitre sur l'outil ombres
pour de plus amples informations.
Page 472
Calibrer et positionner un remplissage bitmap
Une fois que le remplissage est créé, vous pouvez
le déplacer dans l'image pour le repositionner à
l'intérieur de la forme.
Lorsque vous passez avec la souris sur les
poignées extérieures de remplissage, le curseur de
la souris se transforme en un curseur « de
rotation ». Si vous tirez sur ces poignées, le
remplissage bitmap sera étiré et tourné, tout en
conservant ses proportions actuelles ; maintenez la
touche N enfoncée pendant que vous tirez pour
changer les dimensions horizontales et verticales
indépendamment les unes des autres, pour
pouvoir incliner le remplissage. La barre d'infos
affiche la résolution du remplissage bitmap (vous
pouvez l'ajuster, ainsi la taille du bitmap, en
entrant une nouvelle valeur).
Un exemple
Pour remplir l'ellipse située sur la gauche avec la photo du centre ;
1. Tirez la photo ou le fichier Bitmap de l'explorateur Windows (ou de la Galerie des Bitmaps s'ils
sont déjà utilisés dans le document) sur l'ellipse et faites-la glisser en maintenant la touche Maj.
L'outil de Remplissage devient l'outil actuel.
2. Vous pouvez alors ajouter les angles et la taille de l'image en tirant sur les poignées de
Remplissage.
L'exemple ci-dessus présente une ombre simple. Voir le chapitre sur l'outil ombres
pour de plus amples informations.
Page 473
Un exemple
Pour remplir l'ellipse située sur la gauche avec la photo du centre ;
1. Tirez la photo ou le fichier Bitmap de l'explorateur Windows (ou de la Galerie des Bitmaps s'ils
sont déjà utilisés dans le document) sur l'ellipse et faites-la glisser en maintenant la touche Maj.
L'outil de Remplissage devient l'outil actuel.
2. Vous pouvez alors ajouter les angles et la taille de l'image en tirant sur les poignées de
Remplissage.
L'exemple ci-dessus présente une ombre simple. Voir le chapitre sur l'outil ombres
pour de plus amples informations.
Page 474
Remplissages fractals
Xtreme Web Designer 5 prend en charge deux types de remplissages fractals qui, grâce à un calcul
mathématique, présentent un aspect très naturel. Ils sont très adaptés pour simuler un ciel ou des nuages,
ou une autre texture naturelle.
Chaque fois que vous créez un nouveau remplissage fractal, un nouveau motif est créé. Pour remplacer
un fractal existant avec un nouveau motif, sélectionnez à nouveau le type fractal dans le menu de
remplissage.
Le contrôle du grain dans la barre d'infos
permet de contrôler précisément le grain du
motif. Les valeurs faibles produisent un motif
doux et fluide, les valeurs élevées produisent
un motif granuleux.
Vous pouvez ajuster la taille et la position du remplissage fractal en tirant et ajustant les poignées de
remplissage. Désélectionnez les poignées de remplissage (cliquez sur le remplissage loin des poignées)
pour afficher la résolution et le contrôle du grain.
Remplissage en nuage fractal. Sur la gauche, un grain égal à 1, sur la droite, un grain égal à 50.
Remplissage en plasma fractal. Sur la gauche, un grain égal à 5, sur la droite, un grain égal à 50.
Notez la différence entre le grain et la résolution. Le grain contrôle la fluidité du motif. La résolution
définit la taille du bitmap fractal ainsi que le degré d'affichage des différents pixels.
Vous pouvez modifier les couleurs de début et fin d'un remplissage fractal. Sélectionnez les poignées du
centre ou externes, puis appliquez une couleur en utilisant la palette de couleurs ou à l'aide de la galerie
de couleurs
. Pour supprimer toute couleur appliquée, appliquez « Aucune couleur ».
Page 475
Graduations de couleurs en plusieurs étapes
De nombreux types de remplissage de couleur par graduation (linéaire, circulaire, elliptique, en cône, en
diamant) prennent en charge les remplissages en plusieurs étapes, ce qui signifie qu'au lieu d'opérer
uniquement une transition d'une couleur vers une autre, vous pouvez passer par différentes étapes de
remplissage.
Pour ajouter une nouvelle étape de coloration à la transition, sélectionnez l'outil de remplissage afin
d'afficher la flèche de remplissage, puis :
 tirez une couleur dans la flèche de remplissage, à l'endroit requis.
 Ou effectuez un double-clic sur la flèche de remplissage pour créer une nouvelle poignée de
remplissage, enfin cliquez sur une couleur ou affichez l'éditeur de couleurs.
Vous pouvez repositionner les poignées de remplissage en tirant.
En sélectionnant une poignée de remplissage, cliquez sur le tabulateur pour sélectionner la prochaine
poignée. Si l'éditeur de couleurs
est activé, il sera mis à jour pour refléter la nouvelle poignée de remplissage.
Pour supprimer une poignée étape de remplissage, cliquez dessus pour la sélectionner puis cliquez sur la
touche Suppr.
Page 476
Galerie des remplissages
La galerie des remplissages
contient des textures bitmaps adaptées comme remplissages.
Pour afficher la galerie des remplissages
:
 Choisissez Services > Galeries > Galerie de remplissages.
 Ou cliquez sur Galerie des lignes sur la barre de contrôle des
galeries.
 Ou cliquez sur Maj + F11
Importer : importe le bitmap sélectionné dans le document. Une copie du bitmap apparaît alors dans la
galerie bitmap. Il est également possible de placer un bitmap sur une page blanche par glisser-déposer.
Cette opération est souvent plus simple et rapide que la fonction Importer
.
Remplissage :
importe et applique le bitmap sélectionné comme :
 remplissage bitmap de l'objet sélectionné.
 Si aucun objet n'est sélectionné, le bitmap est inséré dans le document comme un nouvel objet
photo.
Vous pouvez également placer le bitmap par glisser-déposer dans un objet ou appliquer un remplissage
bitmap.
Il existe des différences entre tirer un bitmap depuis la galerie des bitmap ou la galerie des
remplissages : lorsque vous tirez des bitmaps depuis la galerie des remplissages
et que vous les déposez sur des formes pour créer un remplissage bitmap, le remplissage sera empilé et
la taille du bitmap ne sera pas adaptée de manière optimale à celle de la forme. Cette différence de
comportement provient du fait que les textures employées normalement sont appliquées depuis la galerie
des remplissages et elle devraient normalement être empilées et leur forme non ajustée.
Transp.
(transparence) : importe et applique le bitmap sélectionné comme :
 bitmap transparent à l'objet sélectionné.
 Ou définit les attributs de la transparence actuelle.
Charger des remplissages :
télécharger des remplissages gratuits de Xara.
Arrière-plan :
définit le remplissage sélectionné comme arrière-plan pour la page.
Supprimer :
supprime le remplissage ou dossier sélectionné.
Remplissage disque :
Page 477
ajouter de nouveaux remplissages depuis votre disque dur ou un CD.
Options :
vous permet de définir la taille des icônes d'aperçu et de déterminer si toutes les informations sur le
bitmap sont affichées, et enfin de chercher et classer les remplissages.
Arrêter le téléchargement :
si vous disposez d'une connexion lente, et que le chargement de remplissages en ligne dure trop de
temps à votre goût, vous pouvez arrêter le téléchargement et continuer ultérieurement.
Les fonctions chercher et trouver sont décrites dans le chapitre Manipulation de documents .
Le chapitre Manipulation du document comprend des informations générales concernant les galeries.
Page 478
Transparence
L'Outil de transparence
permet de définir la transparence des objets et couleurs des différents
calques.
Forme
Tuiles
Nom du
Poignée/résolution Degré de
bitmap
transparence
Vous pouvez contrôler tous les degrés de transparence, de complètement transparent à totalement
opaque. Web Designer propose en outre, contrairement à d'autres programmes, une grande variété de
transparences pour les dégradés de couleur.
Vous pouvez appliquer des transparences uniformes ou en dégradé sur tous les types d'objets, y compris
les objets bitmap.
Appliquer une transparence uniforme
Elle est appelée « transparence uniforme » dans la mesure où toutes les parties de l'objet ont le même
niveau de transparence, par opposition à la transparence en dégradé.
1. Sélection d'un ou plusieurs objets
2. Sélectionnez l'outil de transparence (raccourci F6)
3. Déplacez la réglette de transparence sur la barre d'infos
Xtreme Web Designer 5 propose un aperçu en temps réel. Lorsque vous déplacez la réglette de
transparence, l'effet sur les objets du document est affiché en direct.
Appliquer une transparence en dégradé
La transparence en dégradé fonctionne de manière similaire au remplissage de couleur par graduation. Il
suffit de tirer sur les objets dans l'Outil de transparence
pour créer une transparence en transition. Il existe une palette de formes de transparence très semblable,
allant de la forme linéaire au circulaire ou encore elliptique. Pour créer un fondu dégradé :
1. Sélection d'un ou plusieurs objets
2. Dans l'Outil de transparence, tirez sur les objets pour produire une transition linéaire sur
l'objet.
3. Sélectionnez des formes alternatives de transparence depuis le menu déroulant sur la barre
d'infos.
Vous pouvez sélectionner et ajuster la position et la transparence en utilisant les poignées affichées sur
l'objet.
Référez-vous au chapitre Remplissages pour de plus amples informations sur la manipulation des
poignées et les différentes formes de remplissage (dans ce cas, formes de transparence).
Page 479
Appliquer une transparence uniforme
Elle est appelée « transparence uniforme » dans la mesure où toutes les parties de l'objet ont le même
niveau de transparence, par opposition à la transparence en dégradé.
1. Sélection d'un ou plusieurs objets
2. Sélectionnez l'outil de transparence (raccourci F6)
3. Déplacez la réglette de transparence sur la barre d'infos
Xtreme Web Designer 5 propose un aperçu en temps réel. Lorsque vous déplacez la réglette de
transparence, l'effet sur les objets du document est affiché en direct.
Appliquer une transparence en dégradé
La transparence en dégradé fonctionne de manière similaire au remplissage de couleur par graduation. Il
suffit de tirer sur les objets dans l'Outil de transparence
pour créer une transparence en transition. Il existe une palette de formes de transparence très semblable,
allant de la forme linéaire au circulaire ou encore elliptique. Pour créer un fondu dégradé :
1. Sélection d'un ou plusieurs objets
2. Dans l'Outil de transparence, tirez sur les objets pour produire une transition linéaire sur
l'objet.
3. Sélectionnez des formes alternatives de transparence depuis le menu déroulant sur la barre
d'infos.
Vous pouvez sélectionner et ajuster la position et la transparence en utilisant les poignées affichées sur
l'objet.
Référez-vous au chapitre Remplissages pour de plus amples informations sur la manipulation des
poignées et les différentes formes de remplissage (dans ce cas, formes de transparence).
Page 480
Appliquer une transparence en dégradé
La transparence en dégradé fonctionne de manière similaire au remplissage de couleur par graduation. Il
suffit de tirer sur les objets dans l'Outil de transparence
pour créer une transparence en transition. Il existe une palette de formes de transparence très semblable,
allant de la forme linéaire au circulaire ou encore elliptique. Pour créer un fondu dégradé :
1. Sélection d'un ou plusieurs objets
2. Dans l'Outil de transparence, tirez sur les objets pour produire une transition linéaire sur
l'objet.
3. Sélectionnez des formes alternatives de transparence depuis le menu déroulant sur la barre
d'infos.
Vous pouvez sélectionner et ajuster la position et la transparence en utilisant les poignées affichées sur
l'objet.
Référez-vous au chapitre Remplissages pour de plus amples informations sur la manipulation des
poignées et les différentes formes de remplissage (dans ce cas, formes de transparence).
Page 481
Appliquer une transparence à plusieurs
objets
Lorsque vous appliquez une transparence à des objets groupés, la transparence est appliquée à tous les
objets, considérés comme un groupe. Mais si les objets ne sont pas groupés, la transparence sera
appliquée individuellement à chaque objet, et vous obtenez un effet totalement différent lorsque les objets
sont superposés.
Transparence individuelle (gauche) ou transparence de groupe (droite)
Mélange de transparence individuelle et de groupe
Vous avez la possibilité de combiner les méthodes ci-dessus pour créer des transparences complexes.
Vous pouvez par exemple définir la transparence d'un objet à 50%, puis le grouper et appliquer une
transparence au groupe également. Vous pouvez aussi bien appliquer une transparence à un groupe en
premier lieu, puis appliquer ultérieurement des attributs aux objets individuels dans le groupe. Il suffit pour
cela de maintenir la touche Ctrl enfoncée, cliquer sur l'objet et modifier ses attributs.
Page 482
Mélange de transparence individuelle et de groupe
Vous avez la possibilité de combiner les méthodes ci-dessus pour créer des transparences complexes.
Vous pouvez par exemple définir la transparence d'un objet à 50%, puis le grouper et appliquer une
transparence au groupe également. Vous pouvez aussi bien appliquer une transparence à un groupe en
premier lieu, puis appliquer ultérieurement des attributs aux objets individuels dans le groupe. Il suffit pour
cela de maintenir la touche Ctrl enfoncée, cliquer sur l'objet et modifier ses attributs.
Page 483
Ombres
Dans ce chapitre
L'outil Ombres
Appliquer une ombre
Modifier le remplissage ou la couleur de l'ombre
Supprimer une ombre
Appliquer une ombre à plusieurs objets
Sélectionner des objets à l'aide de l'outil ombres
Appliquer des ombres copiées à d'autres objets
Page 484
L'outil Ombres
L'Outil ombres
(raccourci Ctrl+F2) vous permet d'appliquer, de supprimer, et de
modifier les ombres semi-transparentes (ou douces).
Xtreme Web Designer 5 propose trois sortes d'ombres :
 Ombre verticale : l'ombre est projetée sur un mur derrière l'objet.
 Ombre horizontale : l'ombre de l'objet est projetée sur le sol ou la surface.
Halo : l'ombre créé un effet de halo autour de l'objet.
La transparence des ombres douces augmente vers les pointes, ce qui rend l'effet très réaliste. Les
ombres sont totalement indépendantes de la résolution : vous pouvez les calibrer sans perte de qualité.
Page 485
Appliquer une ombre
Appliquer une ombre verticale
Pour appliquer une ombre verticale :
1. sélectionnez un objet.
2. Sélectionnez l'outil
ombres.
3. Sélectionnez le bouton
Ombre verticale dans la
barre d'infos de l'outil
ombres.
4. Vous pouvez éloigner ou
rapprocher l'ombre de
l'objet pour créer une
distance imaginaire plus
ou moins élevée entre
l'objet et le mur.
Pour créer d'une autre manière une ombre verticale :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Tirez du centre de l'objet en direction de l'ombre.
Appliquer une ombre horizontale
1. sélectionnez un objet.
2. Sélectionnez l'outil
ombres.
3. Sélectionnez le bouton
Ombre horizontale dans
la barre d'infos de l'outil
ombres.
4. Éloignez-vous ou
rapprochez-vous de
l'objet pour modifier la
taille ou l'angle de la
direction. L'angle peut se
situer jusqu'à 70° de la
verticale.
Appliquer un halo
Un halo appliqué à un objet peut apporter une certaine dramatique au graphisme.
Pour créer un halo :
1. Sélectionner l'objet.
2. Sélectionnez l'outil
ombres.
3. Sélectionnez le bouton
Halo dans la barre d'info
de l'outil ombres.
Page 486
4. Éloignez-vous ou
rapprochez-vous de
l'objet pour modifier la
taille du halo.
Modifier la netteté des pointes de l'ombre
Cela modifie la taille de l'ombre. Un
léger flou créé l'impression d'une
source lumineuse précise, un large
flou donne l'impression d'une
lumière diffuse ou distante. Il est
recommandé de toujours créer un
léger flou sur les ombres, car cela
est plus réaliste.
Pour rendre une ombre floue :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Vous pouvez au choix déplacer la réglette de flou sur la barre d'infos de l'outil ombres, ou entrer
une valeur dans le champ situé sur la droite.
Modifier la transparence de l'ombre
Une ombre semi-transparente
est plus réaliste qu'une ombre
opaque. Vous pouvez modifier
le niveau de transparence de
l'ombre comme vous le
souhaitez.
Pour modifier la transparence :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Vous pouvez au choix déplacer la réglette de transparence sur la barre d'infos de l'outil ombres,
ou entrer une valeur dans le champ situé sur la droite.
Page 487
Appliquer une ombre verticale
Pour appliquer une ombre verticale :
1. sélectionnez un objet.
2. Sélectionnez l'outil
ombres.
3. Sélectionnez le bouton
Ombre verticale dans la
barre d'infos de l'outil
ombres.
4. Vous pouvez éloigner ou
rapprocher l'ombre de
l'objet pour créer une
distance imaginaire plus
ou moins élevée entre
l'objet et le mur.
Pour créer d'une autre manière une ombre verticale :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Tirez du centre de l'objet en direction de l'ombre.
Appliquer une ombre horizontale
1. sélectionnez un objet.
2. Sélectionnez l'outil
ombres.
3. Sélectionnez le bouton
Ombre horizontale dans
la barre d'infos de l'outil
ombres.
4. Éloignez-vous ou
rapprochez-vous de
l'objet pour modifier la
taille ou l'angle de la
direction. L'angle peut se
situer jusqu'à 70° de la
verticale.
Appliquer un halo
Un halo appliqué à un objet peut apporter une certaine dramatique au graphisme.
Pour créer un halo :
1. Sélectionner l'objet.
2. Sélectionnez l'outil
ombres.
3. Sélectionnez le bouton
Halo dans la barre d'info
de l'outil ombres.
4. Éloignez-vous ou
rapprochez-vous de
l'objet pour modifier la
Page 488
taille du halo.
Modifier la netteté des pointes de l'ombre
Cela modifie la taille de l'ombre. Un
léger flou créé l'impression d'une
source lumineuse précise, un large
flou donne l'impression d'une
lumière diffuse ou distante. Il est
recommandé de toujours créer un
léger flou sur les ombres, car cela
est plus réaliste.
Pour rendre une ombre floue :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Vous pouvez au choix déplacer la réglette de flou sur la barre d'infos de l'outil ombres, ou entrer
une valeur dans le champ situé sur la droite.
Modifier la transparence de l'ombre
Une ombre semi-transparente
est plus réaliste qu'une ombre
opaque. Vous pouvez modifier
le niveau de transparence de
l'ombre comme vous le
souhaitez.
Pour modifier la transparence :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Vous pouvez au choix déplacer la réglette de transparence sur la barre d'infos de l'outil ombres,
ou entrer une valeur dans le champ situé sur la droite.
Page 489
Appliquer une ombre horizontale
1. sélectionnez un objet.
2. Sélectionnez l'outil
ombres.
3. Sélectionnez le bouton
Ombre horizontale dans
la barre d'infos de l'outil
ombres.
4. Éloignez-vous ou
rapprochez-vous de
l'objet pour modifier la
taille ou l'angle de la
direction. L'angle peut se
situer jusqu'à 70° de la
verticale.
Appliquer un halo
Un halo appliqué à un objet peut apporter une certaine dramatique au graphisme.
Pour créer un halo :
1. Sélectionner l'objet.
2. Sélectionnez l'outil
ombres.
3. Sélectionnez le bouton
Halo dans la barre d'info
de l'outil ombres.
4. Éloignez-vous ou
rapprochez-vous de
l'objet pour modifier la
taille du halo.
Modifier la netteté des pointes de l'ombre
Cela modifie la taille de l'ombre. Un
léger flou créé l'impression d'une
source lumineuse précise, un large
flou donne l'impression d'une
lumière diffuse ou distante. Il est
recommandé de toujours créer un
léger flou sur les ombres, car cela
est plus réaliste.
Pour rendre une ombre floue :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Vous pouvez au choix déplacer la réglette de flou sur la barre d'infos de l'outil ombres, ou entrer
une valeur dans le champ situé sur la droite.
Modifier la transparence de l'ombre
Page 490
Une ombre semi-transparente
est plus réaliste qu'une ombre
opaque. Vous pouvez modifier
le niveau de transparence de
l'ombre comme vous le
souhaitez.
Pour modifier la transparence :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Vous pouvez au choix déplacer la réglette de transparence sur la barre d'infos de l'outil ombres,
ou entrer une valeur dans le champ situé sur la droite.
Page 491
Appliquer un halo
Un halo appliqué à un objet peut apporter une certaine dramatique au graphisme.
Pour créer un halo :
1. Sélectionner l'objet.
2. Sélectionnez l'outil
ombres.
3. Sélectionnez le bouton
Halo dans la barre d'info
de l'outil ombres.
4. Éloignez-vous ou
rapprochez-vous de
l'objet pour modifier la
taille du halo.
Modifier la netteté des pointes de l'ombre
Cela modifie la taille de l'ombre. Un
léger flou créé l'impression d'une
source lumineuse précise, un large
flou donne l'impression d'une
lumière diffuse ou distante. Il est
recommandé de toujours créer un
léger flou sur les ombres, car cela
est plus réaliste.
Pour rendre une ombre floue :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Vous pouvez au choix déplacer la réglette de flou sur la barre d'infos de l'outil ombres, ou entrer
une valeur dans le champ situé sur la droite.
Modifier la transparence de l'ombre
Une ombre semi-transparente
est plus réaliste qu'une ombre
opaque. Vous pouvez modifier
le niveau de transparence de
l'ombre comme vous le
souhaitez.
Pour modifier la transparence :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Vous pouvez au choix déplacer la réglette de transparence sur la barre d'infos de l'outil ombres,
ou entrer une valeur dans le champ situé sur la droite.
Page 492
Modifier la netteté des pointes de l'ombre
Cela modifie la taille de l'ombre. Un
léger flou créé l'impression d'une
source lumineuse précise, un large
flou donne l'impression d'une
lumière diffuse ou distante. Il est
recommandé de toujours créer un
léger flou sur les ombres, car cela
est plus réaliste.
Pour rendre une ombre floue :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Vous pouvez au choix déplacer la réglette de flou sur la barre d'infos de l'outil ombres, ou entrer
une valeur dans le champ situé sur la droite.
Modifier la transparence de l'ombre
Une ombre semi-transparente
est plus réaliste qu'une ombre
opaque. Vous pouvez modifier
le niveau de transparence de
l'ombre comme vous le
souhaitez.
Pour modifier la transparence :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Vous pouvez au choix déplacer la réglette de transparence sur la barre d'infos de l'outil ombres,
ou entrer une valeur dans le champ situé sur la droite.
Page 493
Modifier la transparence de l'ombre
Une ombre semi-transparente
est plus réaliste qu'une ombre
opaque. Vous pouvez modifier
le niveau de transparence de
l'ombre comme vous le
souhaitez.
Pour modifier la transparence :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Vous pouvez au choix déplacer la réglette de transparence sur la barre d'infos de l'outil ombres,
ou entrer une valeur dans le champ situé sur la droite.
Page 494
Modifier le remplissage ou la couleur de
l'ombre
Après avoir appliqué une ombre à un objet, vous pouvez modifier sa couleur ou son effet de
remplissage. Vous pouvez également appliquer n'importe quel effet de couleur de Xtreme Web Designer
5 à l'ombre, y compris les remplissages par étapes.
Pour modifier la couleur d'une ombre :
Pour obtenir de plus amples informations concernant la palette de couleurs, référez-vous au chapitre
Manipulation des couleurs
.
 La méthode la plus simple consiste à appliquer une couleur à une ombre par simple
glisser-déposer depuis la palette. (Assurez-vous que vous déposez bien la couleur sur l'ombre et
non l'objet.)
 Il existe une méthode légèrement plus complexe mais qui vous permet de garder le contrôle total
sur la couleur :
1. Sélectionnez l'ombre en utilisant l'outil de sélection. (Assurez-vous que vous avez
sélectionné l'ombre et non l'objet.)
2. Utilisez l'éditeur de couleur pour l'édition.
Page 495
Supprimer une ombre
Pour supprimer une ombre douce :
1. sélectionnez un objet.
2. Sélectionnez l'outil ombres.
3. Sélectionnez le bouton Aucune ombre
sur la barre d'infos de l'outil ombres.
Page 496
Appliquer une ombre à plusieurs objets
Le résultat de l'application d'une ombre sera différent si les objets sont groupés ou non :
 si les objets sont groupés, les ombres superposées sont fusionnées (c'est-à-dire que les
superpositions ne seront pas plus foncées).
 Si les objets ne sont pas groupés, chaque objet dispose de son ombre propre. Les zones où les
ombres se chevauchent sont donc plus foncées.
 Si plusieurs objets avec ombres sont sélectionnés, tout changement sera appliqué à toutes les
ombres.
Page 497
Sélectionner des objets à l'aide de l'outil
ombres
Avant d'appliquer ou éditer une ombre sur un objet, vous devez d'abord sélectionner l'objet. Pour
sélectionner un objet, utilisez l'outil de sélection. Vous pouvez également utiliser l'outil ombres, en
cliquant simplement sur l'objet lorsque l'outil ombres
est activé.
Page 498
Appliquer des ombres copiées à d'autres
objets
Lorsque vous avez obtenu une ombre comme vous le souhaitez, vous pouvez la copier et l'appliquer à
un autre objet en utilisant la fonction « coller ». Copiez simplement l'ombre souhaitée (Édition > Copier
), sélectionnez l'objet ou les objets auxquels vous souhaitez attribuer l'ombre, puis sélectionnez Édition >
Coller des attributs
.
Page 499
Boîte de dialogue des
propriétés Internet
La boîte de dialogue des propriétés Internet est une boîte de dialogue à plusieurs onglets qui vous
permet de d'ajouter et de configurer la plupart des caractéristiques liées au Web dans Xtreme Web
Designer 5 et de définir différentes propriétés Internet pour des objets, des pages et la totalité de vitre
site Web. Pour l'ouvrir, servez-vous de l'option du menu Services-Propriétés Internet...
(raccourci Maj+Ctrl+W).
Notez également que certaines options de la barre d'outils Internet,
telles que le bouton des liens, permettent eux aussi d'ouvrir cette boîte
de dialogue.
Cette boîte de dialogue ne dépend d'aucun mode, vous pouvez donc la laisser ouverte pendant que vous
sélectionnez différentes pages et objets de votre document. Cela permet de définir facilement des
propriétés sur différents objets et pages de votre site Internet. Utilisez le bouton OK pour appliquer vos
changements et fermer la boîte de dialogue, ou le bouton Appliquer
pour appliquer vos changements sans fermer ensuite la boîte de dialogue.
Pensez que chaque document (fichier .web) de Xtreme Web Designer 5 produit un site Internet lorsque
vous l'exportez. Les termes «document» et «site internet» peuvent donc être employés indifféremment.
Notez que lorsque votre document en cours est une animation, la boîte de dialogue des propriétés
Internet apparaît sous une forme différente, avec certaines fonctions en plus et d'autres en moins, car
celles-ci ne s'appliquent pas aux animations. Reportez-vous au chapitre Flash
pour en savoir plus sur l'utilisation de cette boite de dialogue pour animations.
Les parties suivantes se rapportent tour à tour à chaque onglet de la boîte de dialogue.
Dans ce chapitre
Onglet Lien
Onglet page
Onglet site Internet
Onglet Passage de la souris
Onglet image
Onglet objets fictifs
Onglet Publication
Page 500
Onglet Lien
Les paramètres de cet onglet s'appliquent à (aux) l'objet(s) ou texte sélectionnés. Vous utiliserez cet
onglet typiquement pour ajouter un lien à un objet de votre page Internet (par ex. un bouton ou une
photo), ou à un texte, de façon à ce que les visiteurs de votre site qui cliquent sur l'objet/texte soient
redirigés vers une autre page. Vous pouvez ajouter des liens vers d'autres pages de votre site Internet,
vers une URL (adresse Web) ou même de manière à faire s'ouvrir une fenêtre popup.
Pour ajouter un lien à quelques mots d'un paragraphe de texte, allez dans Outil texte
et surlignez le texte que vous souhaitez lier pour le sélectionner. Puis configurez le lien dans cet onglet.
La partie principale de cet onglet vous permet de choisir ce qui doit se passer quand on clique sur l'objet
ou le texte sélectionné.
Lien vers une adresse Internet
Saisissez une adresse Internet à relier à cette adresse. Si vous cochez la case «Correction auto. de
l'adresse
», votre adresse sera adaptée si besoin lorsque vous cliquerez sur OK ou Appliquer. Par exemple, si
vous saisissez « www.xara.com », cela sera corrigé en « http://www.xara.com/ ».
Vous pouvez entrer une adresse e-mail dans le champ d'adresse des liens, et dans ce cas, quand le
visiteur cliquera sur le lien, cela aura pour effet d'ouvrir son programme d'e-mails avec le champ À:
pré-rempli. Vous pouvez également, en option, spécifier un objet et des adresses e-mail CC ou CCi
devant être copiées sur le mail et même spécifier le corps de texte qui doit être utilisé par défaut. Par
exemple, cela définit l'adresse du destinataire À: et les quatre autres paramètres :
[email protected] objet :e-mail de la part du site Internet CC :[email protected]
CCi :[email protected] body : e-mail automatique
Remarque technique : Xtreme Web Designer 5 encode votre adresse e-mail de façon à en réduire
l'apparence pour éviter que des robots SPAM ne la trouvent en faisant des recherches sur Internet. Pour
cela, Javascript est requis et doit donc être pris en charge par votre navigateur (actuellement plus de
95 % des navigateurs le prennent en charge).
Page 501
Lien vers une page
Sélectionnez cette option pour créer un lien vers une autre page de votre site Internet actuel. La liste du
menu déroulant vous permet de faire vos choix de liens.
Conseil : si votre site Internet comporte de nombreuses pages, le fait de leur donner à chacune un nom
pertinent facilitera vos opérations de configuration et d'entretien des liens de votre page, car la liste des
pages affichera les noms des pages et non plus uniquement « Page 1 », « Page 2 », « Page 3 », etc.
Veuillez consulter la partie Onglet de page
ci-dessous pour plus d'informations sur la définition des noms de pages.
En plus d'afficher les différentes pages de votre site, la liste déroulante contient également des entrées
spéciales : Page suivante et Page précédente
. Utilisez-les pour ajouter un lien menant à la page suivante ou précédente de votre site. Pour l'utilisation
de ces liens, l'ordre des pages est déterminé par l'ordre des pages telles qu'elles apparaissent dans
Xtreme Web Designer 5. Un lien « Suivant » sur la dernière page renvoie à la première page, et un lien
« Précédant » sur la première page renvoie à la dernière page du site.
Lien vers un point d'ancrage
Cette option vous permet de faire passer le visiteur du site sur une partie spécifique d'une page de votre
site Internet.
Pour définir un pont d'accroche, allez tout d'abord sur la page et l'objet vers lequel vous souhaitez faire
passer votre visiteur. Sélectionnez l'objet et ajoutez-lui un nom via l'option Services > Noms...
. Puis sélectionnez l'objet auquel vous souhaitez ajouter le lien et choisissez le nom du point d'ancrage que
vous avez ajouté à partir de la liste disponible dans l'option « Lien vers un point d'ancrage ».
Notez que lorsque vous créez un lien vers un objet se trouvant tout en bas d'une grande page Web, le
navigateur Internet fait automatiquement défiler la page vers la bas de façon à ce que votre objet ancré
soit immédiatement visible.
Calque popup
Vous pouvez ajouter tout contenu de votre choix sous la forme d'un calque séparé sur votre page, et
faire que ce contenu s'affiche uniquement lorsque votre visiteur clique sur un lien. Vous pourriez par
exemple ajouter un texte descriptif à propos d'une photo se trouvant sur votre site et faire que ce texte ne
s'affiche que si le visiteur clique sur la photo.
Pour ajouter un calque de popup, vous avez tout d'abord besoin
d'Ajouter le calque lui-même en utilisant la Galerie de calques
puis d'ajouter le contenu de votre popup à ce calque.
Pour plus de détails, veuillez consulter le chapitre Galerie de calques
. Voua pouvez ensuite sélectionner le calque à partir de la liste disponible près de l'option « Calque
popup ».
Maintenant, lorsqu'un visiteur clique sur votre objet, le contenu du calque apparaît ! Le fait de cliquer sur
un autre endroit de la page fait disparaître le popup.
Notez que tout le contenu du calque popup est chargé dès qu'un visiteur entre sur la page. Donc si vous
souhaitez faie apparaître un grand nombre de photos popup, utilisez plutôt la fonction Photo popup
décrite ci-dessous.
Le chapitre « Pour bien démarrer »
contient des instructions pas à pas pour ajouter des claques popup.
Photo popup
Cette option vous donne un moyen très simple d'ajouter des photos popup à votre site Internet sans
avoir à ajouter de calques ! Il vous suffit tout simplement d'importer votre photo puis d'utiliser l'Outil de
Page 502
sélection pour la mettre à la bonne dimension de façon à ce qu'elle ait la taille d'une photo miniature sur
la page de votre site. Puis sélectionnez-la et choisissez l'option « Photo popup » dans l'onglet Lien des
Propriétés Internet
. Vous pouvez définir la taille de votre choix pour la photo popup en paramétrant la valeur « Largeur de
l'image popup » (définie à 500 pixels par défaut). E c'est tout, maintenant lorsqu'un visiteur clique sur la
photo miniature, elle apparaît dans un format plus grand sous forme d'un popup.
Un autre avantage de ces photos popup par rapport aux calques photo est que la photo plus grande n'est
chargée par le navigateur que si le visiteur clique sur la miniature. C'est pourquoi cette méthode est
beaucoup plus adaptée pour présenter un grand nombre de photos, car seules les miniatures son
chargées dans un premier temps, ce qui accélère le chargement de la page.
Vous pouvez, en option, afficher un titre au-dessus de chaque photo popup. Saisissez simplement une
« Description d'image » pour chaque photo miniature en utilisant l'onglet image de cette boîte de
dialogue. Pour plus de détails, veuillez vous reporter à la section Onglet image
.
Notez que cette fonction marche sur d'autres objets que sur des photos, comme par exemple des formes
et des groupes, mais ne peut être utilisée directement sur du texte. Vous pouvez insérer du texte dans un
groupe (Ctrl+G) pour contourner cette restriction.
Utiliser les couleurs habituelles de liens de sites Internet
Cette option vous permet de choisir la façon dont le texte des liens doit s'afficher. Elle est sélectionnée
par défaut, ce qui signifie que le texte du lien apparaîtra avec la couleur de lien que vous avez définie pour
l'ensemble du site Internet. Vous pouvez paramétrer cette couleur dans l'onglet site Internet (veuillez
consulter la partie Onglet site Internet).
Si vous décochez cette option, le lien texte sélectionné conservera la couleur que vous lui donnerez sur la
page. Vous pouvez ainsi avoir des liens de différentes couleurs si vous le souhaitez.
Ouvrir le lien dans
Cette option ne joue aucun rôle si les options de lien « Calque popup » ou « Photo popup » sont
sélectionnées. Mais pour les autres liens, elle vous permet de commander au navigateur Internet la façon
dont la page cible doit être chargée. Par défaut, elle est définie sur « Non spécifié » ce qui signifie en
général que le navigateur ouvrira le lien dans la même fenêtre et le même frame que le lien.
Page 503
La liste déroulante contient quatre options qui permettent au navigateur d'exécuter des actions spéciales.
Vousp ouvez sélectionner l'une de ces options ou saisir le nom d'un frame :
Nouvelle fenêtre (_blank)
Ouvre le lien dans une nouvelle fenêtre du navigateur.
Même frame (_self)
Ouvre le lien dans ce frame (le frame qui contient cet objet).
Frame parent (_parent)
Ouvre le lien dans la fenêtre parente ou dans le frameset qui contient le frame.
Même fenêtre (_top)
Ouvre le lien dans la fenêtre de navigation principale, et remplace tous les frames existants.
Si vous souhaitez que le lien soit chargé dans un frame spécifique du navigateur, saisissez le nom du frame
dans ce champ.
Emplacement cliquable
Cet option vous permet de définir l'emplacement dans l'objet sur le quel il faut cliquer pour appeler le
lien. Cependant cette option n'est pas prise en charge pour les sites Internet HTML (le rectangle
entourant l'objet est toujours utilisé), elle fonctionne seulement dans le cas d'une exportation Flash.
Forme d'objet
: le visiteur doit cliquer à l'intérieur du contour exact de l'objet pour faire s'ouvrir le lien.
Rectangle entourant l'objet
: le visiteur peut cliquer n'importe où dans le rectangle (boîte de délimitation) entourant l'objet pour faire
s'ouvrir le lien.
Page 504
Lien vers une adresse Internet
Saisissez une adresse Internet à relier à cette adresse. Si vous cochez la case «Correction auto. de
l'adresse
», votre adresse sera adaptée si besoin lorsque vous cliquerez sur OK ou Appliquer. Par exemple, si
vous saisissez « www.xara.com », cela sera corrigé en « http://www.xara.com/ ».
Vous pouvez entrer une adresse e-mail dans le champ d'adresse des liens, et dans ce cas, quand le
visiteur cliquera sur le lien, cela aura pour effet d'ouvrir son programme d'e-mails avec le champ À:
pré-rempli. Vous pouvez également, en option, spécifier un objet et des adresses e-mail CC ou CCi
devant être copiées sur le mail et même spécifier le corps de texte qui doit être utilisé par défaut. Par
exemple, cela définit l'adresse du destinataire À: et les quatre autres paramètres :
[email protected] objet :e-mail de la part du site Internet CC :[email protected]
CCi :[email protected] body : e-mail automatique
Remarque technique : Xtreme Web Designer 5 encode votre adresse e-mail de façon à en réduire
l'apparence pour éviter que des robots SPAM ne la trouvent en faisant des recherches sur Internet. Pour
cela, Javascript est requis et doit donc être pris en charge par votre navigateur (actuellement plus de
95 % des navigateurs le prennent en charge).
Lien vers une page
Sélectionnez cette option pour créer un lien vers une autre page de votre site Internet actuel. La liste du
menu déroulant vous permet de faire vos choix de liens.
Conseil : si votre site Internet comporte de nombreuses pages, le fait de leur donner à chacune un nom
pertinent facilitera vos opérations de configuration et d'entretien des liens de votre page, car la liste des
pages affichera les noms des pages et non plus uniquement « Page 1 », « Page 2 », « Page 3 », etc.
Veuillez consulter la partie Onglet de page
ci-dessous pour plus d'informations sur la définition des noms de pages.
En plus d'afficher les différentes pages de votre site, la liste déroulante contient également des entrées
spéciales : Page suivante et Page précédente
. Utilisez-les pour ajouter un lien menant à la page suivante ou précédente de votre site. Pour l'utilisation
de ces liens, l'ordre des pages est déterminé par l'ordre des pages telles qu'elles apparaissent dans
Xtreme Web Designer 5. Un lien « Suivant » sur la dernière page renvoie à la première page, et un lien
« Précédant » sur la première page renvoie à la dernière page du site.
Lien vers un point d'ancrage
Cette option vous permet de faire passer le visiteur du site sur une partie spécifique d'une page de votre
site Internet.
Pour définir un pont d'accroche, allez tout d'abord sur la page et l'objet vers lequel vous souhaitez faire
passer votre visiteur. Sélectionnez l'objet et ajoutez-lui un nom via l'option Services > Noms...
. Puis sélectionnez l'objet auquel vous souhaitez ajouter le lien et choisissez le nom du point d'ancrage que
vous avez ajouté à partir de la liste disponible dans l'option « Lien vers un point d'ancrage ».
Notez que lorsque vous créez un lien vers un objet se trouvant tout en bas d'une grande page Web, le
navigateur Internet fait automatiquement défiler la page vers la bas de façon à ce que votre objet ancré
soit immédiatement visible.
Calque popup
Vous pouvez ajouter tout contenu de votre choix sous la forme d'un calque séparé sur votre page, et
faire que ce contenu s'affiche uniquement lorsque votre visiteur clique sur un lien. Vous pourriez par
exemple ajouter un texte descriptif à propos d'une photo se trouvant sur votre site et faire que ce texte ne
s'affiche que si le visiteur clique sur la photo.
Page 505
Pour ajouter un calque de popup, vous avez tout d'abord besoin
d'Ajouter le calque lui-même en utilisant la Galerie de calques
puis d'ajouter le contenu de votre popup à ce calque.
Pour plus de détails, veuillez consulter le chapitre Galerie de calques
. Voua pouvez ensuite sélectionner le calque à partir de la liste disponible près de l'option « Calque
popup ».
Maintenant, lorsqu'un visiteur clique sur votre objet, le contenu du calque apparaît ! Le fait de cliquer sur
un autre endroit de la page fait disparaître le popup.
Notez que tout le contenu du calque popup est chargé dès qu'un visiteur entre sur la page. Donc si vous
souhaitez faie apparaître un grand nombre de photos popup, utilisez plutôt la fonction Photo popup
décrite ci-dessous.
Le chapitre « Pour bien démarrer »
contient des instructions pas à pas pour ajouter des claques popup.
Photo popup
Cette option vous donne un moyen très simple d'ajouter des photos popup à votre site Internet sans
avoir à ajouter de calques ! Il vous suffit tout simplement d'importer votre photo puis d'utiliser l'Outil de
sélection pour la mettre à la bonne dimension de façon à ce qu'elle ait la taille d'une photo miniature sur
la page de votre site. Puis sélectionnez-la et choisissez l'option « Photo popup » dans l'onglet Lien des
Propriétés Internet
. Vous pouvez définir la taille de votre choix pour la photo popup en paramétrant la valeur « Largeur de
l'image popup » (définie à 500 pixels par défaut). E c'est tout, maintenant lorsqu'un visiteur clique sur la
photo miniature, elle apparaît dans un format plus grand sous forme d'un popup.
Un autre avantage de ces photos popup par rapport aux calques photo est que la photo plus grande n'est
chargée par le navigateur que si le visiteur clique sur la miniature. C'est pourquoi cette méthode est
beaucoup plus adaptée pour présenter un grand nombre de photos, car seules les miniatures son
chargées dans un premier temps, ce qui accélère le chargement de la page.
Vous pouvez, en option, afficher un titre au-dessus de chaque photo popup. Saisissez simplement une
« Description d'image » pour chaque photo miniature en utilisant l'onglet image de cette boîte de
dialogue. Pour plus de détails, veuillez vous reporter à la section Onglet image
.
Notez que cette fonction marche sur d'autres objets que sur des photos, comme par exemple des formes
et des groupes, mais ne peut être utilisée directement sur du texte. Vous pouvez insérer du texte dans un
groupe (Ctrl+G) pour contourner cette restriction.
Page 506
Utiliser les couleurs habituelles de liens de sites Internet
Cette option vous permet de choisir la façon dont le texte des liens doit s'afficher. Elle est sélectionnée
par défaut, ce qui signifie que le texte du lien apparaîtra avec la couleur de lien que vous avez définie pour
l'ensemble du site Internet. Vous pouvez paramétrer cette couleur dans l'onglet site Internet (veuillez
consulter la partie Onglet site Internet).
Si vous décochez cette option, le lien texte sélectionné conservera la couleur que vous lui donnerez sur la
page. Vous pouvez ainsi avoir des liens de différentes couleurs si vous le souhaitez.
Ouvrir le lien dans
Cette option ne joue aucun rôle si les options de lien « Calque popup » ou « Photo popup » sont
sélectionnées. Mais pour les autres liens, elle vous permet de commander au navigateur Internet la façon
dont la page cible doit être chargée. Par défaut, elle est définie sur « Non spécifié » ce qui signifie en
général que le navigateur ouvrira le lien dans la même fenêtre et le même frame que le lien.
La liste déroulante contient quatre options qui permettent au navigateur d'exécuter des actions spéciales.
Vousp ouvez sélectionner l'une de ces options ou saisir le nom d'un frame :
Nouvelle fenêtre (_blank)
Ouvre le lien dans une nouvelle fenêtre du navigateur.
Même frame (_self)
Ouvre le lien dans ce frame (le frame qui contient cet objet).
Frame parent (_parent)
Ouvre le lien dans la fenêtre parente ou dans le frameset qui contient le frame.
Même fenêtre (_top)
Ouvre le lien dans la fenêtre de navigation principale, et remplace tous les frames existants.
Si vous souhaitez que le lien soit chargé dans un frame spécifique du navigateur, saisissez le nom du frame
dans ce champ.
Emplacement cliquable
Cet option vous permet de définir l'emplacement dans l'objet sur le quel il faut cliquer pour appeler le
lien. Cependant cette option n'est pas prise en charge pour les sites Internet HTML (le rectangle
entourant l'objet est toujours utilisé), elle fonctionne seulement dans le cas d'une exportation Flash.
Page 507
Forme d'objet
: le visiteur doit cliquer à l'intérieur du contour exact de l'objet pour faire s'ouvrir le lien.
Rectangle entourant l'objet
: le visiteur peut cliquer n'importe où dans le rectangle (boîte de délimitation) entourant l'objet pour faire
s'ouvrir le lien.
Page 508
Lien vers une page
Sélectionnez cette option pour créer un lien vers une autre page de votre site Internet actuel. La liste du
menu déroulant vous permet de faire vos choix de liens.
Conseil : si votre site Internet comporte de nombreuses pages, le fait de leur donner à chacune un nom
pertinent facilitera vos opérations de configuration et d'entretien des liens de votre page, car la liste des
pages affichera les noms des pages et non plus uniquement « Page 1 », « Page 2 », « Page 3 », etc.
Veuillez consulter la partie Onglet de page
ci-dessous pour plus d'informations sur la définition des noms de pages.
En plus d'afficher les différentes pages de votre site, la liste déroulante contient également des entrées
spéciales : Page suivante et Page précédente
. Utilisez-les pour ajouter un lien menant à la page suivante ou précédente de votre site. Pour l'utilisation
de ces liens, l'ordre des pages est déterminé par l'ordre des pages telles qu'elles apparaissent dans
Xtreme Web Designer 5. Un lien « Suivant » sur la dernière page renvoie à la première page, et un lien
« Précédant » sur la première page renvoie à la dernière page du site.
Lien vers un point d'ancrage
Cette option vous permet de faire passer le visiteur du site sur une partie spécifique d'une page de votre
site Internet.
Pour définir un pont d'accroche, allez tout d'abord sur la page et l'objet vers lequel vous souhaitez faire
passer votre visiteur. Sélectionnez l'objet et ajoutez-lui un nom via l'option Services > Noms...
. Puis sélectionnez l'objet auquel vous souhaitez ajouter le lien et choisissez le nom du point d'ancrage que
vous avez ajouté à partir de la liste disponible dans l'option « Lien vers un point d'ancrage ».
Notez que lorsque vous créez un lien vers un objet se trouvant tout en bas d'une grande page Web, le
navigateur Internet fait automatiquement défiler la page vers la bas de façon à ce que votre objet ancré
soit immédiatement visible.
Calque popup
Vous pouvez ajouter tout contenu de votre choix sous la forme d'un calque séparé sur votre page, et
faire que ce contenu s'affiche uniquement lorsque votre visiteur clique sur un lien. Vous pourriez par
exemple ajouter un texte descriptif à propos d'une photo se trouvant sur votre site et faire que ce texte ne
s'affiche que si le visiteur clique sur la photo.
Pour ajouter un calque de popup, vous avez tout d'abord besoin
d'Ajouter le calque lui-même en utilisant la Galerie de calques
puis d'ajouter le contenu de votre popup à ce calque.
Pour plus de détails, veuillez consulter le chapitre Galerie de calques
. Voua pouvez ensuite sélectionner le calque à partir de la liste disponible près de l'option « Calque
popup ».
Maintenant, lorsqu'un visiteur clique sur votre objet, le contenu du calque apparaît ! Le fait de cliquer sur
un autre endroit de la page fait disparaître le popup.
Notez que tout le contenu du calque popup est chargé dès qu'un visiteur entre sur la page. Donc si vous
souhaitez faie apparaître un grand nombre de photos popup, utilisez plutôt la fonction Photo popup
décrite ci-dessous.
Le chapitre « Pour bien démarrer »
contient des instructions pas à pas pour ajouter des claques popup.
Photo popup
Cette option vous donne un moyen très simple d'ajouter des photos popup à votre site Internet sans
avoir à ajouter de calques ! Il vous suffit tout simplement d'importer votre photo puis d'utiliser l'Outil de
Page 509
sélection pour la mettre à la bonne dimension de façon à ce qu'elle ait la taille d'une photo miniature sur
la page de votre site. Puis sélectionnez-la et choisissez l'option « Photo popup » dans l'onglet Lien des
Propriétés Internet
. Vous pouvez définir la taille de votre choix pour la photo popup en paramétrant la valeur « Largeur de
l'image popup » (définie à 500 pixels par défaut). E c'est tout, maintenant lorsqu'un visiteur clique sur la
photo miniature, elle apparaît dans un format plus grand sous forme d'un popup.
Un autre avantage de ces photos popup par rapport aux calques photo est que la photo plus grande n'est
chargée par le navigateur que si le visiteur clique sur la miniature. C'est pourquoi cette méthode est
beaucoup plus adaptée pour présenter un grand nombre de photos, car seules les miniatures son
chargées dans un premier temps, ce qui accélère le chargement de la page.
Vous pouvez, en option, afficher un titre au-dessus de chaque photo popup. Saisissez simplement une
« Description d'image » pour chaque photo miniature en utilisant l'onglet image de cette boîte de
dialogue. Pour plus de détails, veuillez vous reporter à la section Onglet image
.
Notez que cette fonction marche sur d'autres objets que sur des photos, comme par exemple des formes
et des groupes, mais ne peut être utilisée directement sur du texte. Vous pouvez insérer du texte dans un
groupe (Ctrl+G) pour contourner cette restriction.
Utiliser les couleurs habituelles de liens de sites Internet
Cette option vous permet de choisir la façon dont le texte des liens doit s'afficher. Elle est sélectionnée
par défaut, ce qui signifie que le texte du lien apparaîtra avec la couleur de lien que vous avez définie pour
l'ensemble du site Internet. Vous pouvez paramétrer cette couleur dans l'onglet site Internet (veuillez
consulter la partie Onglet site Internet).
Si vous décochez cette option, le lien texte sélectionné conservera la couleur que vous lui donnerez sur la
page. Vous pouvez ainsi avoir des liens de différentes couleurs si vous le souhaitez.
Ouvrir le lien dans
Cette option ne joue aucun rôle si les options de lien « Calque popup » ou « Photo popup » sont
sélectionnées. Mais pour les autres liens, elle vous permet de commander au navigateur Internet la façon
dont la page cible doit être chargée. Par défaut, elle est définie sur « Non spécifié » ce qui signifie en
général que le navigateur ouvrira le lien dans la même fenêtre et le même frame que le lien.
Page 510
La liste déroulante contient quatre options qui permettent au navigateur d'exécuter des actions spéciales.
Vousp ouvez sélectionner l'une de ces options ou saisir le nom d'un frame :
Nouvelle fenêtre (_blank)
Ouvre le lien dans une nouvelle fenêtre du navigateur.
Même frame (_self)
Ouvre le lien dans ce frame (le frame qui contient cet objet).
Frame parent (_parent)
Ouvre le lien dans la fenêtre parente ou dans le frameset qui contient le frame.
Même fenêtre (_top)
Ouvre le lien dans la fenêtre de navigation principale, et remplace tous les frames existants.
Si vous souhaitez que le lien soit chargé dans un frame spécifique du navigateur, saisissez le nom du frame
dans ce champ.
Emplacement cliquable
Cet option vous permet de définir l'emplacement dans l'objet sur le quel il faut cliquer pour appeler le
lien. Cependant cette option n'est pas prise en charge pour les sites Internet HTML (le rectangle
entourant l'objet est toujours utilisé), elle fonctionne seulement dans le cas d'une exportation Flash.
Forme d'objet
: le visiteur doit cliquer à l'intérieur du contour exact de l'objet pour faire s'ouvrir le lien.
Rectangle entourant l'objet
: le visiteur peut cliquer n'importe où dans le rectangle (boîte de délimitation) entourant l'objet pour faire
s'ouvrir le lien.
Page 511
Lien vers un point d'ancrage
Cette option vous permet de faire passer le visiteur du site sur une partie spécifique d'une page de votre
site Internet.
Pour définir un pont d'accroche, allez tout d'abord sur la page et l'objet vers lequel vous souhaitez faire
passer votre visiteur. Sélectionnez l'objet et ajoutez-lui un nom via l'option Services > Noms...
. Puis sélectionnez l'objet auquel vous souhaitez ajouter le lien et choisissez le nom du point d'ancrage que
vous avez ajouté à partir de la liste disponible dans l'option « Lien vers un point d'ancrage ».
Notez que lorsque vous créez un lien vers un objet se trouvant tout en bas d'une grande page Web, le
navigateur Internet fait automatiquement défiler la page vers la bas de façon à ce que votre objet ancré
soit immédiatement visible.
Calque popup
Vous pouvez ajouter tout contenu de votre choix sous la forme d'un calque séparé sur votre page, et
faire que ce contenu s'affiche uniquement lorsque votre visiteur clique sur un lien. Vous pourriez par
exemple ajouter un texte descriptif à propos d'une photo se trouvant sur votre site et faire que ce texte ne
s'affiche que si le visiteur clique sur la photo.
Pour ajouter un calque de popup, vous avez tout d'abord besoin
d'Ajouter le calque lui-même en utilisant la Galerie de calques
puis d'ajouter le contenu de votre popup à ce calque.
Pour plus de détails, veuillez consulter le chapitre Galerie de calques
. Voua pouvez ensuite sélectionner le calque à partir de la liste disponible près de l'option « Calque
popup ».
Maintenant, lorsqu'un visiteur clique sur votre objet, le contenu du calque apparaît ! Le fait de cliquer sur
un autre endroit de la page fait disparaître le popup.
Notez que tout le contenu du calque popup est chargé dès qu'un visiteur entre sur la page. Donc si vous
souhaitez faie apparaître un grand nombre de photos popup, utilisez plutôt la fonction Photo popup
décrite ci-dessous.
Le chapitre « Pour bien démarrer »
contient des instructions pas à pas pour ajouter des claques popup.
Photo popup
Cette option vous donne un moyen très simple d'ajouter des photos popup à votre site Internet sans
avoir à ajouter de calques ! Il vous suffit tout simplement d'importer votre photo puis d'utiliser l'Outil de
sélection pour la mettre à la bonne dimension de façon à ce qu'elle ait la taille d'une photo miniature sur
la page de votre site. Puis sélectionnez-la et choisissez l'option « Photo popup » dans l'onglet Lien des
Propriétés Internet
. Vous pouvez définir la taille de votre choix pour la photo popup en paramétrant la valeur « Largeur de
l'image popup » (définie à 500 pixels par défaut). E c'est tout, maintenant lorsqu'un visiteur clique sur la
photo miniature, elle apparaît dans un format plus grand sous forme d'un popup.
Un autre avantage de ces photos popup par rapport aux calques photo est que la photo plus grande n'est
chargée par le navigateur que si le visiteur clique sur la miniature. C'est pourquoi cette méthode est
beaucoup plus adaptée pour présenter un grand nombre de photos, car seules les miniatures son
chargées dans un premier temps, ce qui accélère le chargement de la page.
Vous pouvez, en option, afficher un titre au-dessus de chaque photo popup. Saisissez simplement une
« Description d'image » pour chaque photo miniature en utilisant l'onglet image de cette boîte de
dialogue. Pour plus de détails, veuillez vous reporter à la section Onglet image
.
Notez que cette fonction marche sur d'autres objets que sur des photos, comme par exemple des formes
Page 512
et des groupes, mais ne peut être utilisée directement sur du texte. Vous pouvez insérer du texte dans un
groupe (Ctrl+G) pour contourner cette restriction.
Utiliser les couleurs habituelles de liens de sites Internet
Cette option vous permet de choisir la façon dont le texte des liens doit s'afficher. Elle est sélectionnée
par défaut, ce qui signifie que le texte du lien apparaîtra avec la couleur de lien que vous avez définie pour
l'ensemble du site Internet. Vous pouvez paramétrer cette couleur dans l'onglet site Internet (veuillez
consulter la partie Onglet site Internet).
Si vous décochez cette option, le lien texte sélectionné conservera la couleur que vous lui donnerez sur la
page. Vous pouvez ainsi avoir des liens de différentes couleurs si vous le souhaitez.
Ouvrir le lien dans
Cette option ne joue aucun rôle si les options de lien « Calque popup » ou « Photo popup » sont
sélectionnées. Mais pour les autres liens, elle vous permet de commander au navigateur Internet la façon
dont la page cible doit être chargée. Par défaut, elle est définie sur « Non spécifié » ce qui signifie en
général que le navigateur ouvrira le lien dans la même fenêtre et le même frame que le lien.
La liste déroulante contient quatre options qui permettent au navigateur d'exécuter des actions spéciales.
Vousp ouvez sélectionner l'une de ces options ou saisir le nom d'un frame :
Nouvelle fenêtre (_blank)
Ouvre le lien dans une nouvelle fenêtre du navigateur.
Même frame (_self)
Ouvre le lien dans ce frame (le frame qui contient cet objet).
Frame parent (_parent)
Ouvre le lien dans la fenêtre parente ou dans le frameset qui contient le frame.
Même fenêtre (_top)
Ouvre le lien dans la fenêtre de navigation principale, et remplace tous les frames existants.
Si vous souhaitez que le lien soit chargé dans un frame spécifique du navigateur, saisissez le nom du frame
dans ce champ.
Emplacement cliquable
Cet option vous permet de définir l'emplacement dans l'objet sur le quel il faut cliquer pour appeler le
Page 513
lien. Cependant cette option n'est pas prise en charge pour les sites Internet HTML (le rectangle
entourant l'objet est toujours utilisé), elle fonctionne seulement dans le cas d'une exportation Flash.
Forme d'objet
: le visiteur doit cliquer à l'intérieur du contour exact de l'objet pour faire s'ouvrir le lien.
Rectangle entourant l'objet
: le visiteur peut cliquer n'importe où dans le rectangle (boîte de délimitation) entourant l'objet pour faire
s'ouvrir le lien.
Page 514
Calque popup
Vous pouvez ajouter tout contenu de votre choix sous la forme d'un calque séparé sur votre page, et
faire que ce contenu s'affiche uniquement lorsque votre visiteur clique sur un lien. Vous pourriez par
exemple ajouter un texte descriptif à propos d'une photo se trouvant sur votre site et faire que ce texte ne
s'affiche que si le visiteur clique sur la photo.
Pour ajouter un calque de popup, vous avez tout d'abord besoin
d'Ajouter le calque lui-même en utilisant la Galerie de calques
puis d'ajouter le contenu de votre popup à ce calque.
Pour plus de détails, veuillez consulter le chapitre Galerie de calques
. Voua pouvez ensuite sélectionner le calque à partir de la liste disponible près de l'option « Calque
popup ».
Maintenant, lorsqu'un visiteur clique sur votre objet, le contenu du calque apparaît ! Le fait de cliquer sur
un autre endroit de la page fait disparaître le popup.
Notez que tout le contenu du calque popup est chargé dès qu'un visiteur entre sur la page. Donc si vous
souhaitez faie apparaître un grand nombre de photos popup, utilisez plutôt la fonction Photo popup
décrite ci-dessous.
Le chapitre « Pour bien démarrer »
contient des instructions pas à pas pour ajouter des claques popup.
Photo popup
Cette option vous donne un moyen très simple d'ajouter des photos popup à votre site Internet sans
avoir à ajouter de calques ! Il vous suffit tout simplement d'importer votre photo puis d'utiliser l'Outil de
sélection pour la mettre à la bonne dimension de façon à ce qu'elle ait la taille d'une photo miniature sur
la page de votre site. Puis sélectionnez-la et choisissez l'option « Photo popup » dans l'onglet Lien des
Propriétés Internet
. Vous pouvez définir la taille de votre choix pour la photo popup en paramétrant la valeur « Largeur de
l'image popup » (définie à 500 pixels par défaut). E c'est tout, maintenant lorsqu'un visiteur clique sur la
photo miniature, elle apparaît dans un format plus grand sous forme d'un popup.
Un autre avantage de ces photos popup par rapport aux calques photo est que la photo plus grande n'est
chargée par le navigateur que si le visiteur clique sur la miniature. C'est pourquoi cette méthode est
beaucoup plus adaptée pour présenter un grand nombre de photos, car seules les miniatures son
chargées dans un premier temps, ce qui accélère le chargement de la page.
Vous pouvez, en option, afficher un titre au-dessus de chaque photo popup. Saisissez simplement une
« Description d'image » pour chaque photo miniature en utilisant l'onglet image de cette boîte de
dialogue. Pour plus de détails, veuillez vous reporter à la section Onglet image
.
Notez que cette fonction marche sur d'autres objets que sur des photos, comme par exemple des formes
et des groupes, mais ne peut être utilisée directement sur du texte. Vous pouvez insérer du texte dans un
groupe (Ctrl+G) pour contourner cette restriction.
Page 515
Utiliser les couleurs habituelles de liens de sites Internet
Cette option vous permet de choisir la façon dont le texte des liens doit s'afficher. Elle est sélectionnée
par défaut, ce qui signifie que le texte du lien apparaîtra avec la couleur de lien que vous avez définie pour
l'ensemble du site Internet. Vous pouvez paramétrer cette couleur dans l'onglet site Internet (veuillez
consulter la partie Onglet site Internet).
Si vous décochez cette option, le lien texte sélectionné conservera la couleur que vous lui donnerez sur la
page. Vous pouvez ainsi avoir des liens de différentes couleurs si vous le souhaitez.
Ouvrir le lien dans
Cette option ne joue aucun rôle si les options de lien « Calque popup » ou « Photo popup » sont
sélectionnées. Mais pour les autres liens, elle vous permet de commander au navigateur Internet la façon
dont la page cible doit être chargée. Par défaut, elle est définie sur « Non spécifié » ce qui signifie en
général que le navigateur ouvrira le lien dans la même fenêtre et le même frame que le lien.
La liste déroulante contient quatre options qui permettent au navigateur d'exécuter des actions spéciales.
Vousp ouvez sélectionner l'une de ces options ou saisir le nom d'un frame :
Nouvelle fenêtre (_blank)
Ouvre le lien dans une nouvelle fenêtre du navigateur.
Même frame (_self)
Ouvre le lien dans ce frame (le frame qui contient cet objet).
Frame parent (_parent)
Ouvre le lien dans la fenêtre parente ou dans le frameset qui contient le frame.
Même fenêtre (_top)
Ouvre le lien dans la fenêtre de navigation principale, et remplace tous les frames existants.
Si vous souhaitez que le lien soit chargé dans un frame spécifique du navigateur, saisissez le nom du frame
dans ce champ.
Emplacement cliquable
Cet option vous permet de définir l'emplacement dans l'objet sur le quel il faut cliquer pour appeler le
lien. Cependant cette option n'est pas prise en charge pour les sites Internet HTML (le rectangle
entourant l'objet est toujours utilisé), elle fonctionne seulement dans le cas d'une exportation Flash.
Page 516
Forme d'objet
: le visiteur doit cliquer à l'intérieur du contour exact de l'objet pour faire s'ouvrir le lien.
Rectangle entourant l'objet
: le visiteur peut cliquer n'importe où dans le rectangle (boîte de délimitation) entourant l'objet pour faire
s'ouvrir le lien.
Page 517
Photo popup
Cette option vous donne un moyen très simple d'ajouter des photos popup à votre site Internet sans
avoir à ajouter de calques ! Il vous suffit tout simplement d'importer votre photo puis d'utiliser l'Outil de
sélection pour la mettre à la bonne dimension de façon à ce qu'elle ait la taille d'une photo miniature sur
la page de votre site. Puis sélectionnez-la et choisissez l'option « Photo popup » dans l'onglet Lien des
Propriétés Internet
. Vous pouvez définir la taille de votre choix pour la photo popup en paramétrant la valeur « Largeur de
l'image popup » (définie à 500 pixels par défaut). E c'est tout, maintenant lorsqu'un visiteur clique sur la
photo miniature, elle apparaît dans un format plus grand sous forme d'un popup.
Un autre avantage de ces photos popup par rapport aux calques photo est que la photo plus grande n'est
chargée par le navigateur que si le visiteur clique sur la miniature. C'est pourquoi cette méthode est
beaucoup plus adaptée pour présenter un grand nombre de photos, car seules les miniatures son
chargées dans un premier temps, ce qui accélère le chargement de la page.
Vous pouvez, en option, afficher un titre au-dessus de chaque photo popup. Saisissez simplement une
« Description d'image » pour chaque photo miniature en utilisant l'onglet image de cette boîte de
dialogue. Pour plus de détails, veuillez vous reporter à la section Onglet image
.
Notez que cette fonction marche sur d'autres objets que sur des photos, comme par exemple des formes
et des groupes, mais ne peut être utilisée directement sur du texte. Vous pouvez insérer du texte dans un
groupe (Ctrl+G) pour contourner cette restriction.
Utiliser les couleurs habituelles de liens de sites Internet
Cette option vous permet de choisir la façon dont le texte des liens doit s'afficher. Elle est sélectionnée
par défaut, ce qui signifie que le texte du lien apparaîtra avec la couleur de lien que vous avez définie pour
l'ensemble du site Internet. Vous pouvez paramétrer cette couleur dans l'onglet site Internet (veuillez
consulter la partie Onglet site Internet).
Si vous décochez cette option, le lien texte sélectionné conservera la couleur que vous lui donnerez sur la
page. Vous pouvez ainsi avoir des liens de différentes couleurs si vous le souhaitez.
Ouvrir le lien dans
Page 518
Cette option ne joue aucun rôle si les options de lien « Calque popup » ou « Photo popup » sont
sélectionnées. Mais pour les autres liens, elle vous permet de commander au navigateur Internet la façon
dont la page cible doit être chargée. Par défaut, elle est définie sur « Non spécifié » ce qui signifie en
général que le navigateur ouvrira le lien dans la même fenêtre et le même frame que le lien.
La liste déroulante contient quatre options qui permettent au navigateur d'exécuter des actions spéciales.
Vousp ouvez sélectionner l'une de ces options ou saisir le nom d'un frame :
Nouvelle fenêtre (_blank)
Ouvre le lien dans une nouvelle fenêtre du navigateur.
Même frame (_self)
Ouvre le lien dans ce frame (le frame qui contient cet objet).
Frame parent (_parent)
Ouvre le lien dans la fenêtre parente ou dans le frameset qui contient le frame.
Même fenêtre (_top)
Ouvre le lien dans la fenêtre de navigation principale, et remplace tous les frames existants.
Si vous souhaitez que le lien soit chargé dans un frame spécifique du navigateur, saisissez le nom du frame
dans ce champ.
Emplacement cliquable
Cet option vous permet de définir l'emplacement dans l'objet sur le quel il faut cliquer pour appeler le
lien. Cependant cette option n'est pas prise en charge pour les sites Internet HTML (le rectangle
entourant l'objet est toujours utilisé), elle fonctionne seulement dans le cas d'une exportation Flash.
Forme d'objet
: le visiteur doit cliquer à l'intérieur du contour exact de l'objet pour faire s'ouvrir le lien.
Rectangle entourant l'objet
: le visiteur peut cliquer n'importe où dans le rectangle (boîte de délimitation) entourant l'objet pour faire
s'ouvrir le lien.
Page 519
Utiliser les couleurs habituelles de liens de sites Internet
Cette option vous permet de choisir la façon dont le texte des liens doit s'afficher. Elle est sélectionnée
par défaut, ce qui signifie que le texte du lien apparaîtra avec la couleur de lien que vous avez définie pour
l'ensemble du site Internet. Vous pouvez paramétrer cette couleur dans l'onglet site Internet (veuillez
consulter la partie Onglet site Internet).
Si vous décochez cette option, le lien texte sélectionné conservera la couleur que vous lui donnerez sur la
page. Vous pouvez ainsi avoir des liens de différentes couleurs si vous le souhaitez.
Ouvrir le lien dans
Cette option ne joue aucun rôle si les options de lien « Calque popup » ou « Photo popup » sont
sélectionnées. Mais pour les autres liens, elle vous permet de commander au navigateur Internet la façon
dont la page cible doit être chargée. Par défaut, elle est définie sur « Non spécifié » ce qui signifie en
général que le navigateur ouvrira le lien dans la même fenêtre et le même frame que le lien.
La liste déroulante contient quatre options qui permettent au navigateur d'exécuter des actions spéciales.
Vousp ouvez sélectionner l'une de ces options ou saisir le nom d'un frame :
Nouvelle fenêtre (_blank)
Ouvre le lien dans une nouvelle fenêtre du navigateur.
Même frame (_self)
Ouvre le lien dans ce frame (le frame qui contient cet objet).
Frame parent (_parent)
Ouvre le lien dans la fenêtre parente ou dans le frameset qui contient le frame.
Même fenêtre (_top)
Ouvre le lien dans la fenêtre de navigation principale, et remplace tous les frames existants.
Si vous souhaitez que le lien soit chargé dans un frame spécifique du navigateur, saisissez le nom du frame
dans ce champ.
Emplacement cliquable
Cet option vous permet de définir l'emplacement dans l'objet sur le quel il faut cliquer pour appeler le
lien. Cependant cette option n'est pas prise en charge pour les sites Internet HTML (le rectangle
entourant l'objet est toujours utilisé), elle fonctionne seulement dans le cas d'une exportation Flash.
Forme d'objet
: le visiteur doit cliquer à l'intérieur du contour exact de l'objet pour faire s'ouvrir le lien.
Rectangle entourant l'objet
: le visiteur peut cliquer n'importe où dans le rectangle (boîte de délimitation) entourant l'objet pour faire
s'ouvrir le lien.
Page 520
Ouvrir le lien dans
Cette option ne joue aucun rôle si les options de lien « Calque popup » ou « Photo popup » sont
sélectionnées. Mais pour les autres liens, elle vous permet de commander au navigateur Internet la façon
dont la page cible doit être chargée. Par défaut, elle est définie sur « Non spécifié » ce qui signifie en
général que le navigateur ouvrira le lien dans la même fenêtre et le même frame que le lien.
La liste déroulante contient quatre options qui permettent au navigateur d'exécuter des actions spéciales.
Vousp ouvez sélectionner l'une de ces options ou saisir le nom d'un frame :
Nouvelle fenêtre (_blank)
Ouvre le lien dans une nouvelle fenêtre du navigateur.
Même frame (_self)
Ouvre le lien dans ce frame (le frame qui contient cet objet).
Frame parent (_parent)
Ouvre le lien dans la fenêtre parente ou dans le frameset qui contient le frame.
Même fenêtre (_top)
Ouvre le lien dans la fenêtre de navigation principale, et remplace tous les frames existants.
Si vous souhaitez que le lien soit chargé dans un frame spécifique du navigateur, saisissez le nom du frame
dans ce champ.
Emplacement cliquable
Cet option vous permet de définir l'emplacement dans l'objet sur le quel il faut cliquer pour appeler le
lien. Cependant cette option n'est pas prise en charge pour les sites Internet HTML (le rectangle
entourant l'objet est toujours utilisé), elle fonctionne seulement dans le cas d'une exportation Flash.
Forme d'objet
: le visiteur doit cliquer à l'intérieur du contour exact de l'objet pour faire s'ouvrir le lien.
Rectangle entourant l'objet
: le visiteur peut cliquer n'importe où dans le rectangle (boîte de délimitation) entourant l'objet pour faire
s'ouvrir le lien.
Page 521
Emplacement cliquable
Cet option vous permet de définir l'emplacement dans l'objet sur le quel il faut cliquer pour appeler le
lien. Cependant cette option n'est pas prise en charge pour les sites Internet HTML (le rectangle
entourant l'objet est toujours utilisé), elle fonctionne seulement dans le cas d'une exportation Flash.
Forme d'objet
: le visiteur doit cliquer à l'intérieur du contour exact de l'objet pour faire s'ouvrir le lien.
Rectangle entourant l'objet
: le visiteur peut cliquer n'importe où dans le rectangle (boîte de délimitation) entourant l'objet pour faire
s'ouvrir le lien.
Page 522
Onglet page
Les options de cet onglet s'appliquent à la page en cours, et non à (aux) l'objet(s) sélectionné. La page
en cours est marquée par des lignes d'angle noires juste à l'extérieur de chaque coin de la page. Tous les
champs de cet onglet sont optionnels ; vous n'Avez pas absolument besoin de remplir ces champs pour
toutes les pages de votre site.
Si vous souhaitez avoir le même titre, la même description et les mêmes mots-clé sur toutes les pages de
votre site, vous pouvez paramétrer cela une fois pour toutes dans l'onglet Site Internet, ce qui vous évite
de le faire pour chaque page.
Nom de fichier de la page
: utilisez ce champ pour définir le nom que vous souhaitez utiliser pour cette page lorsqu'elle sera
exportée. Si vous souhaitez que la page soit exportée sous le nom « home.htm », nommez ce champ
« home ».
On appelle généralement la première page d'un site « index.htm » ou « home.htm » car lorsqu'un visiteur
spécifie une URL composée uniquement d'un nom de domaine, sans nom de page, (par ex.
« www.xara.com ») celui-ci est souvent automatiquement redirigé par le serveur Internet vers la page
index.htm si celle-ci est disponible.
Titre de la page
: vous pouvez, en option, donner un titre à votre page. Si vous choisissez d'en donner un, il sera utilisé
par les navigateurs Internet et sera affiché dans le frame de la fenêtre de navigation ou de l'onglet. Par
exemple, au moment où nous écrivons, la page d'accueil de www.xara.com porte le nom de « Graphics
Software by Xara », que vous pouvez voir affiché par le navigateur Internet si vous vous rendez sur le
site.
Avancé : le titre est inséré dans l'entête de la page en utilisant l'élément HTML « >title> ».
Description de la page
: ce texte de description de la page peut être affiché par les moteurs de recherche dans leurs résultats de
recherche quand des visiteurs trouvent votre page au cours d'une recherche Internet. La description de la
page peut donc aussi être affiché par des navigateurs et autres services Internet.
Avancé : la description est insérée dans l'entête de la page en tant que métadonnée
('<meta name="description" …..).
Mots-clé de page
Page 523
: vous pouvez ici entrer des mots-clé utilisés par les moteurs de recherche et qui aideront les visiteurs à
tomber sur votre site. Entrez des mots-clé que les visiteurs sont susceptibles de taper pour leur recherche
de pages ou sites comme les vôtres.
Si vous maîtriser le HTML, les mots-clés sont entrés dans les entêtes en tant que métadonnées :
Avancé : les mots-clés sont insérés dans l'entête de la page en tant que métadonnée
('<meta name="keywords" …..).
Code tracker :
ce champ vous sert à coller un code HTML valide dans votre page. Si vous maîtrisez le HTML, le code
devra être inséré tel quel à la fin de votre page, juste avant le tag de clôture « </body> ».
Ceci est en général utile pour insérer le code tracker qui sert à établir les statistiques de visite de votre
page. Par exemple, Google Analytics met à votre disposition un snippet HTML que vous pouvez coller
dans ce champ pour la page Internet que vous souhaitez tracker.
Ceci est à utiliser avec précaution car le fait d'insérer un code ou un script erronés dans votre page peut
créer de graves problèmes sur toute la page Internet.
Si vous avez besoin d'insérer exactement le même code sur toutes les pages de votre site Internet, vous
pouvez utiliser le champ de Code Tracker de l'onglet site Internet
de cette boîte de dialogue au lieu de l'entrer pour chacune des pages via l'onglet Page.
Page 524
Onglet site Internet
Les paramètres de cet onglet s'appliquent à la totalité du document/site Internet, et donc ce n'est pas
l'objet ni la page sélectionnés qui importent.
Titre, Description & mots-clés : ces champs se trouvent dans la section Onglet Page
ci-dessus. En option, vous pouvez définir ces champs de façon à ce qu'ils s'appliquent à toutes les pages
de votre site Internet, sauf si les paramètres de l'onglet Page les annule. Ainsi, une page sans titre propre
paramétré dans l'onglet Page recevra le titre que vous aurez spécifié ici.
Tracker Code : cela rempli les mêmes objectifs que le champ Tracker Code de l'onglet Page. Pour plus
de détails, veuillez vous reporter à la section Onglet Page
.
Cependant, dans le cas de ce champ, si le code est spécifié ici dans l'onglet Site Internet il est inclus
dans toutes les pages de votre site en plus de
tout autre code spécifié pour chaque page dans l'onglet Page. Cela vous permet d'inclure du code dans
toutes les pages, et même temps d'ajouter un autre code aux pages qui en ont besoin.
Couleurs de liens de sites Internet
Cette section de l'ongle site Internet vous permet de contrôler la façon dont le texte des liens doit
apparaître sur votre site Internet.
Liens texte soulignés
: il est habituel d'utiliser le soulignement pour faire resortir les liens cliquables d'un texte, et cette option
est donc sélectionnée par défaut. Décochez-la si vous ne souhaitez pas que vos les liens soient soulignés.
Page 525
Couleur souris sans effet
: ici, vous pouvez choisir la couleur des liens dans le texte. Vous pouvez soit sélectionner une couleur
thématique nommée dans la liste déroulante (s'il y en a dans votre document en cours) ou cliquer sur le
bouton Editer pour ouvrir l'Editeur de couleurs, pour choisir une autre couleur.
Couleur souris avec effet
: les liens dans le texte changeront de couleur lorsqu'un visiteur passera le curseur de la souris dessus.
Couleur lien visité
: les liens du texte sur lesquels le visiteur a déjà cliqué seront affichés de cette couleur à la place de la
Couleur souris sans effet.
Page 526
Couleurs de liens de sites Internet
Cette section de l'ongle site Internet vous permet de contrôler la façon dont le texte des liens doit
apparaître sur votre site Internet.
Liens texte soulignés
: il est habituel d'utiliser le soulignement pour faire resortir les liens cliquables d'un texte, et cette option
est donc sélectionnée par défaut. Décochez-la si vous ne souhaitez pas que vos les liens soient soulignés.
Couleur souris sans effet
: ici, vous pouvez choisir la couleur des liens dans le texte. Vous pouvez soit sélectionner une couleur
thématique nommée dans la liste déroulante (s'il y en a dans votre document en cours) ou cliquer sur le
bouton Editer pour ouvrir l'Editeur de couleurs, pour choisir une autre couleur.
Couleur souris avec effet
: les liens dans le texte changeront de couleur lorsqu'un visiteur passera le curseur de la souris dessus.
Couleur lien visité
: les liens du texte sur lesquels le visiteur a déjà cliqué seront affichés de cette couleur à la place de la
Couleur souris sans effet.
Page 527
Onglet Passage de la souris
Les options de cet onglet vous permettent de commander ce qui doit se passer lorsqu'un visiteur déplace
le curseur de la souris sur les objets sélectionnés. Par exemple, vous pouvez faire apparaître un texte
sous forme de popup ou un calque de contenu lorsqu'un visiteur passe le curseur de sa souris sur une
photo de votre site Internet.
Afficher texte popup (titre)
: ici, vous pouvez spécifier le texte « titre » d'un objet. Les navigateurs Internet l'afficheront sous forme
d'un petit popup lorsque le visiteur déplacera le curseur de la souris sur l'objet.
Afficher calque popup :
de la même façon que vous pouvez ajouter un calque qui s'affiche uniquement lorsque le visiteur clique
sur un objet (voir à ce propos la section Onglet Lien), vous pouvez également commander qu'un calque
soit affiché lorsque le curseur de la souris passe sur un objet. Lorsque le curseur quitte l'objet, le popup
disparaît. Sélectionnez simplement cette option puis le calque que vous voulez voir apparaître dans la liste
fournie.
Par exemple, vous pouvez utiliser cette option pour afficher un exemplaire plus grand d'une photo lorsque
le visiteur passe le curseur de la souris dessus. Notez cependant que tout le contenu du calque popup est
chargé dès qu'un visiteur entre sur la page. De ce fait, il n'est pas recommandé d'afficher de trop
nombreuses photos sous forme de popup. Pour ce faire, utilisez plutôt la fonction Photo popup
décrite dans la section Onglet Lien.
Page 528
Onglet image
De par la nature des sites Internet HTML, la plupart des objets que vous voyez et que vous pouvez
sélectionner sur les pages doivent être convertis en images bitmap lors du processus d'exportation de
votre site Internet. Cela se déroule de façon entièrement automatique lorsque vous faites un aperçu et une
exportation, mais les commandes de cet onglet vous permettent de contrôler la façon dont certaines de
ces images sont créées.
Souvenez vous que chaque groupe, forme, entête, logo, photo, etc., est exporté en tant qu'image
indépendante. Si vous regardez la façon dont les objets de votre design sont groupés, vous pouvez
contrôler le nombre d'images exportées pour construire votre site Internet. Par exemple, si vous avez
deux formes indépendantes dans votre design qui ne sont pas regroupées, elles seront exportées comme
deux images indépendantes. Vous pouvez regrouper ces deux images (Ctrl+G), et comme cela, elles
seront considérées comme une seule image lors de l'exportation.
Type d'image Internet
Cette section de l'onglet Image
vous permet de spécifier la façon dont l'objet sélectionné actuel doit être exporté en tant qu'image. Par
défaut, c'est Xtreme Web Designer 5 qui décide pour vous. Cela signifie que les photos sont
normalement exportées au format JPEG (en général le meilleur format pour les photos) et les autres
objets au format PNG (en général le format le mieux adapté aux graphiques). Les photos qui ont été
tournées dans la page ou celles auxquelles une ombre semi-transparente a été appliquée seront exportées
au format PNG car le format JPEG ne prend pas en charge la transparence.
Vous pouvez forcer le(s) objet(s) sélectionné(s) à être exportés au format JPEG ou PNG si vous
sélectionnez l'option appropriée. Lorsque l'option JPEG est sélectionnée, vous pouvez également choisir
que la qualité JPEG soit utilisée pour cette image. Une qualité plus élevée implique un fichier JPEG plus
lourd.
Description de l'image
Cela vous permet de spécifier une courte ligne de texte qui décrit la photo (ou autre objet) sélectionnée.
Si vous maîtrisez le HTML, ce texte est utilisé en tant que texte « ALT » sur l'image exportée pour l'objet
en cours de sélection. Les navigateurs Internet affichent ce texte sur la page à la place de l'image, si
l'image ne peut être obtenue pour une raison quelconque.
Au moment où nous rédigeons ce manuel, Internet Explorer utilise le texte ALT pour afficher un petit
texte popup sur l'image lorsque le visiteur passe le curseur de sa souris dessus. Les autres navigateurs ont
Page 529
tendance à ne pas le faire. Pour rendre vos pages Internet plus complètes sur d'autres navigateurs,
Xtreme Web Designer 5 fera que le texte « TITLE » sur l'objet soit le même que le texte ALT
(uniquement si vous n'avez pas défini un texte « TITLE » différent dans l'onglet Passage de la souris).
Cela signifie que tous les navigateurs afficheront le texte alt sous forme d'un popup lorsque votre page
sera vue.
Ce texte de description de l'image est aussi utilisé par la fonction « Popup photo » décrite plus haut dans
la section Onglet lien
. Si une photo popup possède une Description d'Image, elle est affichée sous forme d'un titre sous la
photo popup.
Page 530
Type d'image Internet
Cette section de l'onglet Image
vous permet de spécifier la façon dont l'objet sélectionné actuel doit être exporté en tant qu'image. Par
défaut, c'est Xtreme Web Designer 5 qui décide pour vous. Cela signifie que les photos sont
normalement exportées au format JPEG (en général le meilleur format pour les photos) et les autres
objets au format PNG (en général le format le mieux adapté aux graphiques). Les photos qui ont été
tournées dans la page ou celles auxquelles une ombre semi-transparente a été appliquée seront exportées
au format PNG car le format JPEG ne prend pas en charge la transparence.
Vous pouvez forcer le(s) objet(s) sélectionné(s) à être exportés au format JPEG ou PNG si vous
sélectionnez l'option appropriée. Lorsque l'option JPEG est sélectionnée, vous pouvez également choisir
que la qualité JPEG soit utilisée pour cette image. Une qualité plus élevée implique un fichier JPEG plus
lourd.
Description de l'image
Cela vous permet de spécifier une courte ligne de texte qui décrit la photo (ou autre objet) sélectionnée.
Si vous maîtrisez le HTML, ce texte est utilisé en tant que texte « ALT » sur l'image exportée pour l'objet
en cours de sélection. Les navigateurs Internet affichent ce texte sur la page à la place de l'image, si
l'image ne peut être obtenue pour une raison quelconque.
Au moment où nous rédigeons ce manuel, Internet Explorer utilise le texte ALT pour afficher un petit
texte popup sur l'image lorsque le visiteur passe le curseur de sa souris dessus. Les autres navigateurs ont
tendance à ne pas le faire. Pour rendre vos pages Internet plus complètes sur d'autres navigateurs,
Xtreme Web Designer 5 fera que le texte « TITLE » sur l'objet soit le même que le texte ALT
(uniquement si vous n'avez pas défini un texte « TITLE » différent dans l'onglet Passage de la souris).
Cela signifie que tous les navigateurs afficheront le texte alt sous forme d'un popup lorsque votre page
sera vue.
Ce texte de description de l'image est aussi utilisé par la fonction « Popup photo » décrite plus haut dans
la section Onglet lien
. Si une photo popup possède une Description d'Image, elle est affichée sous forme d'un titre sous la
photo popup.
Page 531
Description de l'image
Cela vous permet de spécifier une courte ligne de texte qui décrit la photo (ou autre objet) sélectionnée.
Si vous maîtrisez le HTML, ce texte est utilisé en tant que texte « ALT » sur l'image exportée pour l'objet
en cours de sélection. Les navigateurs Internet affichent ce texte sur la page à la place de l'image, si
l'image ne peut être obtenue pour une raison quelconque.
Au moment où nous rédigeons ce manuel, Internet Explorer utilise le texte ALT pour afficher un petit
texte popup sur l'image lorsque le visiteur passe le curseur de sa souris dessus. Les autres navigateurs ont
tendance à ne pas le faire. Pour rendre vos pages Internet plus complètes sur d'autres navigateurs,
Xtreme Web Designer 5 fera que le texte « TITLE » sur l'objet soit le même que le texte ALT
(uniquement si vous n'avez pas défini un texte « TITLE » différent dans l'onglet Passage de la souris).
Cela signifie que tous les navigateurs afficheront le texte alt sous forme d'un popup lorsque votre page
sera vue.
Ce texte de description de l'image est aussi utilisé par la fonction « Popup photo » décrite plus haut dans
la section Onglet lien
. Si une photo popup possède une Description d'Image, elle est affichée sous forme d'un titre sous la
photo popup.
Page 532
Onglet objets fictifs
Les commandes de cet onglet servent à ajouter des fichiers Flash ou graphiques externes dans votre
page, ou à insérer du code HTML que vous avez obtenu autre part.
Créez tout d'abord un objet (en général un rectangle en utilisant l'Outil rectangle
) sur votre page qui ait les mêmes dimensions que le contenu que vous souhaitez ajouter, puis
positionnez-le à l'endroit où vous souhaitez voir apparaître le contenu. Ceci est donc votre objet « fictif »,
car il sera remplacé par le contenu que vous aurez spécifié dans cet onglet dans votre site exporté.
Sélectionnez l'objet fictif puis ouvrez cet onglet de la boîte de dialogue des Propriétés Internet. Puis
sélectionnez l'une des options suivantes.
Remplacer par Flash
Sélectionnez cette option pour remplacer l'objet fictif par une animation Flash. Utilisez le bouton
Parcourir pour localiser le fichier Flash (.swf) que vous voulez utiliser.
Le fichier sélectionné est automatiquement copié vers le dossier de support pour le design en cours, de
façon à ce que, lors de l'exportation de votre site Internet, le fichier soit inclus dans le dossier _htm_files
avec les images générées pour votre site. Pour en savoir plus sur les dossiers de support, veuillez vous
reporter au chapitre Utilisation des documents.
Remplacer par un fichier graphique
Sélectionnez cette option si vous voulez insérer un graphique ou une image dans votre site Internet à la
place de l'objet fictif (par exemple un fichier image PNG, GIF ou autre fichier image compatible avec
Internet). Utilisez le bouton Parcourir pour sélectionner le fichier.
Le fichier sélectionné est automatiquement copié vers le dossier de support pour le design en cours, de
façon à ce que, lors de l'exportation de votre site Internet, le fichier soit inclus dans le dossier _htm_files
avec les images générées pour votre site. Pour en savoir plus sur les dossiers de support, veuillez vous
reporter au chapitre Utilisation des documents.
Page 533
Remplacer par du code HTML
Cette option vous permet de coller du code HTML que vous avez obtenu autre part. Par exemple, de
nombreux sites proposent des widgets que vous pouvez ajouter à votre page en collant le code HTML.
Suivez les instructions données sur ces sites.
Cliquez ici
pour obtenir une liste des widgets recommandés et des conseils sur le site de Xara.
ATTENTION : tout comme avec le code tracker vous devez faire attention à n'insérer que du code dont
vous êtes sûr qu'il est sans danger et provient d'une source fiable. Du code invalide ou interrompu
affectera votre site Internet car Xtreme Web Designer 5 insère le code dans votre page lors de
l'exportation tel que vous le donnez, sans le modifier ni le contrôler.
Si vous utilisez les modules Xara (www.xaraoline.com
), vous pouvez coller un snippet de module dans ce champ pour ajouter votre module à la page Internet.
Si le code HTML que vous entrez fait référence à d'autres fichiers externes qu'on s'attend à trouver sur
votre site, alors vous devez copier ces fichiers externes dans le fichier de support de votre design. Pour
en savoir plus sur les dossiers de support, veuillez vous reporter au chapitre Utilisation des documents.
Une fois qu'ils se trouvent dans le fichier de support, les fichiers seront automatiquement copiés vers le
dossier _htm_files de votre site Internet lors de l'exportation. C'est pourquoi vous devez également vous
assurer que toute référence à ces fichiers dans le code HTML les référence au bon endroit.
Prenons un exemple simple pour expliquer cela clairement. Supposons que je veuille insérer une petite
portion de code HTML servant à ajouter une image à mon site. Le code HTML que j'ajoute devra
référencer le fichier image quelque part. Je copie tout d'abord le fichier image, appelons-le
« myLogo.gif », dans le dossier de support de mon document. Si le document est « mySite.web », le
dossier de supprto sera « mySite_web_files ». Je sais que lors de l'exportation de ce site Internet, je
l'exporterai sous le nom de « mysite.htm ». Cela siginifie que toutes les images créées pour mon site, et
une copie de « myLogo.gif » que j'ai placée dans le dossier de support, seront exportées vers le dossier
« mysite_htm_files ». C'est pourquoi je dois faire du code HTML que j'insère la référence du fichier
image à cet endroit. Donc je peux insérer :
<img src="mysite_htm_files/myLogo.gif" />
Veuillez noter que ceci fait référence au dossier image à l'emplacement du dossier image exporté
(_htm_files),, et NON directement dans à l'emplacement du dossier de support (_web_files), car seul le
dossier image exporté est copié sur le serveur Internet en même temps que ma page Internet lors de la
publication du site.
Si je ne voulais importer qu'une image dans mon site Internet, il serait bien sûr plus facile d'importer
seulement l'image dans Xtreme Web Designer 5 directement ! Mais cela est juste un exemple pour
montrer comment ajouter du code HTML qui se réfère à un fichier externe.
Pour plus d'exemples, allez voir Incrustation YouTube, Flash et autres widgets
dans le chapitre « Pour bien démarrer » !
Objets fictifs
Les objets fictifs sont vraiment inclus dans votre site Internet et peuvent être montrés au visteur dans
certains cas. Par exemple, si vous avez ajouté une animation Flash, et que le visiteur qui se rend sur votre
page n'a pas Flash installé dans son navigateur ou qu'il l'a désactivé, le navigateur affichera à la place les
objets fictifs.
Par conséquent, il est recommandé de ne pas laisser vos objets fictifs sous forme de rectangles noirs !
Vous pouvez par exemple placer une image statique qui ressemble au contenu Flash. Ou bien utiliser un
groupe pour votre objet fictif, incluant un message texte demandant au visiteur d'installer Flash pour
pouvoir voir le votre animation.
Page 534
Remplacer par Flash
Sélectionnez cette option pour remplacer l'objet fictif par une animation Flash. Utilisez le bouton
Parcourir pour localiser le fichier Flash (.swf) que vous voulez utiliser.
Le fichier sélectionné est automatiquement copié vers le dossier de support pour le design en cours, de
façon à ce que, lors de l'exportation de votre site Internet, le fichier soit inclus dans le dossier _htm_files
avec les images générées pour votre site. Pour en savoir plus sur les dossiers de support, veuillez vous
reporter au chapitre Utilisation des documents.
Remplacer par un fichier graphique
Sélectionnez cette option si vous voulez insérer un graphique ou une image dans votre site Internet à la
place de l'objet fictif (par exemple un fichier image PNG, GIF ou autre fichier image compatible avec
Internet). Utilisez le bouton Parcourir pour sélectionner le fichier.
Le fichier sélectionné est automatiquement copié vers le dossier de support pour le design en cours, de
façon à ce que, lors de l'exportation de votre site Internet, le fichier soit inclus dans le dossier _htm_files
avec les images générées pour votre site. Pour en savoir plus sur les dossiers de support, veuillez vous
reporter au chapitre Utilisation des documents.
Remplacer par du code HTML
Cette option vous permet de coller du code HTML que vous avez obtenu autre part. Par exemple, de
nombreux sites proposent des widgets que vous pouvez ajouter à votre page en collant le code HTML.
Suivez les instructions données sur ces sites.
Cliquez ici
pour obtenir une liste des widgets recommandés et des conseils sur le site de Xara.
ATTENTION : tout comme avec le code tracker vous devez faire attention à n'insérer que du code dont
vous êtes sûr qu'il est sans danger et provient d'une source fiable. Du code invalide ou interrompu
affectera votre site Internet car Xtreme Web Designer 5 insère le code dans votre page lors de
l'exportation tel que vous le donnez, sans le modifier ni le contrôler.
Si vous utilisez les modules Xara (www.xaraoline.com
), vous pouvez coller un snippet de module dans ce champ pour ajouter votre module à la page Internet.
Si le code HTML que vous entrez fait référence à d'autres fichiers externes qu'on s'attend à trouver sur
votre site, alors vous devez copier ces fichiers externes dans le fichier de support de votre design. Pour
en savoir plus sur les dossiers de support, veuillez vous reporter au chapitre Utilisation des documents.
Une fois qu'ils se trouvent dans le fichier de support, les fichiers seront automatiquement copiés vers le
dossier _htm_files de votre site Internet lors de l'exportation. C'est pourquoi vous devez également vous
assurer que toute référence à ces fichiers dans le code HTML les référence au bon endroit.
Prenons un exemple simple pour expliquer cela clairement. Supposons que je veuille insérer une petite
portion de code HTML servant à ajouter une image à mon site. Le code HTML que j'ajoute devra
référencer le fichier image quelque part. Je copie tout d'abord le fichier image, appelons-le
« myLogo.gif », dans le dossier de support de mon document. Si le document est « mySite.web », le
dossier de supprto sera « mySite_web_files ». Je sais que lors de l'exportation de ce site Internet, je
l'exporterai sous le nom de « mysite.htm ». Cela siginifie que toutes les images créées pour mon site, et
une copie de « myLogo.gif » que j'ai placée dans le dossier de support, seront exportées vers le dossier
« mysite_htm_files ». C'est pourquoi je dois faire du code HTML que j'insère la référence du fichier
image à cet endroit. Donc je peux insérer :
<img src="mysite_htm_files/myLogo.gif" />
Veuillez noter que ceci fait référence au dossier image à l'emplacement du dossier image exporté
(_htm_files),, et NON directement dans à l'emplacement du dossier de support (_web_files), car seul le
dossier image exporté est copié sur le serveur Internet en même temps que ma page Internet lors de la
publication du site.
Page 535
Si je ne voulais importer qu'une image dans mon site Internet, il serait bien sûr plus facile d'importer
seulement l'image dans Xtreme Web Designer 5 directement ! Mais cela est juste un exemple pour
montrer comment ajouter du code HTML qui se réfère à un fichier externe.
Pour plus d'exemples, allez voir Incrustation YouTube, Flash et autres widgets
dans le chapitre « Pour bien démarrer » !
Objets fictifs
Les objets fictifs sont vraiment inclus dans votre site Internet et peuvent être montrés au visteur dans
certains cas. Par exemple, si vous avez ajouté une animation Flash, et que le visiteur qui se rend sur votre
page n'a pas Flash installé dans son navigateur ou qu'il l'a désactivé, le navigateur affichera à la place les
objets fictifs.
Par conséquent, il est recommandé de ne pas laisser vos objets fictifs sous forme de rectangles noirs !
Vous pouvez par exemple placer une image statique qui ressemble au contenu Flash. Ou bien utiliser un
groupe pour votre objet fictif, incluant un message texte demandant au visiteur d'installer Flash pour
pouvoir voir le votre animation.
Page 536
Remplacer par un fichier graphique
Sélectionnez cette option si vous voulez insérer un graphique ou une image dans votre site Internet à la
place de l'objet fictif (par exemple un fichier image PNG, GIF ou autre fichier image compatible avec
Internet). Utilisez le bouton Parcourir pour sélectionner le fichier.
Le fichier sélectionné est automatiquement copié vers le dossier de support pour le design en cours, de
façon à ce que, lors de l'exportation de votre site Internet, le fichier soit inclus dans le dossier _htm_files
avec les images générées pour votre site. Pour en savoir plus sur les dossiers de support, veuillez vous
reporter au chapitre Utilisation des documents.
Remplacer par du code HTML
Cette option vous permet de coller du code HTML que vous avez obtenu autre part. Par exemple, de
nombreux sites proposent des widgets que vous pouvez ajouter à votre page en collant le code HTML.
Suivez les instructions données sur ces sites.
Cliquez ici
pour obtenir une liste des widgets recommandés et des conseils sur le site de Xara.
ATTENTION : tout comme avec le code tracker vous devez faire attention à n'insérer que du code dont
vous êtes sûr qu'il est sans danger et provient d'une source fiable. Du code invalide ou interrompu
affectera votre site Internet car Xtreme Web Designer 5 insère le code dans votre page lors de
l'exportation tel que vous le donnez, sans le modifier ni le contrôler.
Si vous utilisez les modules Xara (www.xaraoline.com
), vous pouvez coller un snippet de module dans ce champ pour ajouter votre module à la page Internet.
Si le code HTML que vous entrez fait référence à d'autres fichiers externes qu'on s'attend à trouver sur
votre site, alors vous devez copier ces fichiers externes dans le fichier de support de votre design. Pour
en savoir plus sur les dossiers de support, veuillez vous reporter au chapitre Utilisation des documents.
Une fois qu'ils se trouvent dans le fichier de support, les fichiers seront automatiquement copiés vers le
dossier _htm_files de votre site Internet lors de l'exportation. C'est pourquoi vous devez également vous
assurer que toute référence à ces fichiers dans le code HTML les référence au bon endroit.
Prenons un exemple simple pour expliquer cela clairement. Supposons que je veuille insérer une petite
portion de code HTML servant à ajouter une image à mon site. Le code HTML que j'ajoute devra
référencer le fichier image quelque part. Je copie tout d'abord le fichier image, appelons-le
« myLogo.gif », dans le dossier de support de mon document. Si le document est « mySite.web », le
dossier de supprto sera « mySite_web_files ». Je sais que lors de l'exportation de ce site Internet, je
l'exporterai sous le nom de « mysite.htm ». Cela siginifie que toutes les images créées pour mon site, et
une copie de « myLogo.gif » que j'ai placée dans le dossier de support, seront exportées vers le dossier
« mysite_htm_files ». C'est pourquoi je dois faire du code HTML que j'insère la référence du fichier
image à cet endroit. Donc je peux insérer :
<img src="mysite_htm_files/myLogo.gif" />
Veuillez noter que ceci fait référence au dossier image à l'emplacement du dossier image exporté
(_htm_files),, et NON directement dans à l'emplacement du dossier de support (_web_files), car seul le
dossier image exporté est copié sur le serveur Internet en même temps que ma page Internet lors de la
publication du site.
Si je ne voulais importer qu'une image dans mon site Internet, il serait bien sûr plus facile d'importer
seulement l'image dans Xtreme Web Designer 5 directement ! Mais cela est juste un exemple pour
montrer comment ajouter du code HTML qui se réfère à un fichier externe.
Pour plus d'exemples, allez voir Incrustation YouTube, Flash et autres widgets
dans le chapitre « Pour bien démarrer » !
Objets fictifs
Les objets fictifs sont vraiment inclus dans votre site Internet et peuvent être montrés au visteur dans
Page 537
certains cas. Par exemple, si vous avez ajouté une animation Flash, et que le visiteur qui se rend sur votre
page n'a pas Flash installé dans son navigateur ou qu'il l'a désactivé, le navigateur affichera à la place les
objets fictifs.
Par conséquent, il est recommandé de ne pas laisser vos objets fictifs sous forme de rectangles noirs !
Vous pouvez par exemple placer une image statique qui ressemble au contenu Flash. Ou bien utiliser un
groupe pour votre objet fictif, incluant un message texte demandant au visiteur d'installer Flash pour
pouvoir voir le votre animation.
Page 538
Remplacer par du code HTML
Cette option vous permet de coller du code HTML que vous avez obtenu autre part. Par exemple, de
nombreux sites proposent des widgets que vous pouvez ajouter à votre page en collant le code HTML.
Suivez les instructions données sur ces sites.
Cliquez ici
pour obtenir une liste des widgets recommandés et des conseils sur le site de Xara.
ATTENTION : tout comme avec le code tracker vous devez faire attention à n'insérer que du code dont
vous êtes sûr qu'il est sans danger et provient d'une source fiable. Du code invalide ou interrompu
affectera votre site Internet car Xtreme Web Designer 5 insère le code dans votre page lors de
l'exportation tel que vous le donnez, sans le modifier ni le contrôler.
Si vous utilisez les modules Xara (www.xaraoline.com
), vous pouvez coller un snippet de module dans ce champ pour ajouter votre module à la page Internet.
Si le code HTML que vous entrez fait référence à d'autres fichiers externes qu'on s'attend à trouver sur
votre site, alors vous devez copier ces fichiers externes dans le fichier de support de votre design. Pour
en savoir plus sur les dossiers de support, veuillez vous reporter au chapitre Utilisation des documents.
Une fois qu'ils se trouvent dans le fichier de support, les fichiers seront automatiquement copiés vers le
dossier _htm_files de votre site Internet lors de l'exportation. C'est pourquoi vous devez également vous
assurer que toute référence à ces fichiers dans le code HTML les référence au bon endroit.
Prenons un exemple simple pour expliquer cela clairement. Supposons que je veuille insérer une petite
portion de code HTML servant à ajouter une image à mon site. Le code HTML que j'ajoute devra
référencer le fichier image quelque part. Je copie tout d'abord le fichier image, appelons-le
« myLogo.gif », dans le dossier de support de mon document. Si le document est « mySite.web », le
dossier de supprto sera « mySite_web_files ». Je sais que lors de l'exportation de ce site Internet, je
l'exporterai sous le nom de « mysite.htm ». Cela siginifie que toutes les images créées pour mon site, et
une copie de « myLogo.gif » que j'ai placée dans le dossier de support, seront exportées vers le dossier
« mysite_htm_files ». C'est pourquoi je dois faire du code HTML que j'insère la référence du fichier
image à cet endroit. Donc je peux insérer :
<img src="mysite_htm_files/myLogo.gif" />
Veuillez noter que ceci fait référence au dossier image à l'emplacement du dossier image exporté
(_htm_files),, et NON directement dans à l'emplacement du dossier de support (_web_files), car seul le
dossier image exporté est copié sur le serveur Internet en même temps que ma page Internet lors de la
publication du site.
Si je ne voulais importer qu'une image dans mon site Internet, il serait bien sûr plus facile d'importer
seulement l'image dans Xtreme Web Designer 5 directement ! Mais cela est juste un exemple pour
montrer comment ajouter du code HTML qui se réfère à un fichier externe.
Pour plus d'exemples, allez voir Incrustation YouTube, Flash et autres widgets
dans le chapitre « Pour bien démarrer » !
Objets fictifs
Les objets fictifs sont vraiment inclus dans votre site Internet et peuvent être montrés au visteur dans
certains cas. Par exemple, si vous avez ajouté une animation Flash, et que le visiteur qui se rend sur votre
page n'a pas Flash installé dans son navigateur ou qu'il l'a désactivé, le navigateur affichera à la place les
objets fictifs.
Par conséquent, il est recommandé de ne pas laisser vos objets fictifs sous forme de rectangles noirs !
Vous pouvez par exemple placer une image statique qui ressemble au contenu Flash. Ou bien utiliser un
groupe pour votre objet fictif, incluant un message texte demandant au visiteur d'installer Flash pour
pouvoir voir le votre animation.
Page 539
Objets fictifs
Les objets fictifs sont vraiment inclus dans votre site Internet et peuvent être montrés au visteur dans
certains cas. Par exemple, si vous avez ajouté une animation Flash, et que le visiteur qui se rend sur votre
page n'a pas Flash installé dans son navigateur ou qu'il l'a désactivé, le navigateur affichera à la place les
objets fictifs.
Par conséquent, il est recommandé de ne pas laisser vos objets fictifs sous forme de rectangles noirs !
Vous pouvez par exemple placer une image statique qui ressemble au contenu Flash. Ou bien utiliser un
groupe pour votre objet fictif, incluant un message texte demandant au visiteur d'installer Flash pour
pouvoir voir le votre animation.
Page 540
Onglet Publication
Si vous voulez que Xtreme Web Designer 5 publie votre site Internet une fois terminé, de façon à ce
qu'il se retrouve sur Internet, vous devez saisir les détails d'accès à votre espace Internet dans cet onglet.
Ces paramètres de publications sont globaux : ils ne s'appliquent pas à la sélection ni à la page en cours,
ni même au document en cours. Vous devez donc les modifier à chaque fois que vous voulez publier des
sites à des emplacements différents.
Vous aurez besoin d'un hébergeur Internet pour votre site. Il en existe de nombreux, et souvent, votre
fournisseur d'accès à Internet (FAI) fournit aussi un « espace Internet » qui fait partie de votre
abonnement.
Vous avez besoin des trois informations suivantes de la part de votre hébergeur pour pouvoir publier
votre site Internet :
1. l'adresse FTP. Si vous avez un nom de domaine, cette adresse est souvent la même que votre
nom de domaine.
2. Votre nom d'utilisateur FTP
3. Votre mot de passe FTP
Entrez ces informations dans les champs correspondants de l'onglet Publication. Vous n'avez pas besoin
d'entrer le mot de passe si vous ne souhaitez pas l'enregistrer sur votre ordinateur pour des raisons de
sécurité. Si celui-ci manque, on vous demandera de le saisir à chaque fois que vous voudrez publier un
site.
Le sous-dossier optionnel vous permet de publier votre site Internet dans un sous-dossier. Par exemple,
si vous publiiez vers le domaine xara.com (ce qui est bien entendu impossible) et vouliez que l'adresse
Internet soit :
xara.com/products/web_designer
Alors vous pourriez créer un sous-dossier « produits » et un nom de page « web_designer ». Si vous
définissez un sous-dossier de cette façon, alors toutes les pages de votre site Internet seront publiées vers
ce dossier.
Une fois que vous avez défini les informations de Publication, vous
pouvez cliquer sur l'icone Publier situé sur la barre du haut ou utiliser le
menu « Ficher » > « Publier site Internet
». Votre site Internet sera alors publié.
Page 541
Manipulation des photos
Dans ce chapitre
Introduction
Objets photo
Importer des photos
Résolution photo
Copies zéro mémoire
La Galerie bitmap
Fichiers JPEG incrusté
Avec ou sans perte
Effet de fondu et fusionnement de photos
Qualité d'affichage des photos
Enregistrer et exporter des photos
Attributs de l'édition photo
Editer le contour de photos
Recouper des photos
Découper des objets dans des photos
Captures d'écran
Colorer des photos
Redimensionner, faire tourner et positionner une photo dans son cadre
Redresser l'horizon
Optimisation de photos et bitmaps
Documents photo
Page 542
Introduction
De nos jours, les photos constituent la majeure partie de tous les travaux créatifs, des sites Internet, en
passant par les prospectus, les brochures, les travaux de PAO, etc.
La manipulation des photos avec Xtreme Web Designer 5 est complètement différente de ce que vous
avez pu voir avec les autres logiciels de graphisme.
Avec Xtreme Web Designer 5, vous pouvez colorer, recouper, copier, mélanger, masquer ou encore
estomper les bords de vos photos tant que vous voulez. La nature orientée vers l'objet et non
destructrice de l'édition photo signifie que, par exemple, lorsque vous redimensionnez une photo, vous ne
touchez pas à la photo originale, vous redimensionnez seulement une copie visuelle de cette photo.
L'image originale en pleine résolution est sauvegardée dans le fichier web, pour vous permettre par la
suite d'éditer, de redimensionner ou d'appliquer des options de l'Outil Photo, sans aucune perte de
qualité. Vous pouvez même annuler la découpe de photos redécoupées.
La manipulation photo est incroyablement rapide. Vous pouvez ouvrir une photo de 50 mégapixels et
procéder à l'une des opérations d'optimisation, et faire tourner l'image en pleine résolution en temps réel.
Ce chapitre expose les principes de base de la manipulation des photos et des images bitmap avec
Xtreme Web Designer 5. Le fonctionnement de l'Outil Photo est exposé dans le chapitre Outil Photo
.
*Critères basés sur des compositions photo créées à l'aide de diverses photos numériques au format
JPEG
Page 543
Objets photo
Dans Web Designer, les photos (ou bitmaps) sont tout simplement considérées comme un objet sur la
page. Vous pouvez déplacer des photos sur la page par glisser-déposer depuis l'explorateur, puis les
calibrer, les tourner, les copier et les positionner comme n'importe quel autre objet. Vous avez également
la possibilité de régler la transparence, même la transparence graduée, de biseauter les coins et d'ajouter
ou supprimer des formes dans les photos très simplement. La fonction transparence permet de réaliser
des fondus, de fusionner et ou de créer des compositions à partir de vos photos.
Page 544
Importer des photos
Xtreme Web Designer 5 prend en charge un grand nombre de types de photos ou de bitmap, y compris
les images d'appareils photos numériques au format JPEG, PN, TIFF et RAW, ainsi que nombre
d'autres types. Le terme « bitmap » est le terme général désignant tous ces types, mais on peut aussi le
remplacer par le mot « photo ».
La façon la plus simple d'ouvrir une image est de faire glisser le fichier photo ou bitmap depuis votre
explorateur de fichiers Windows vers la fenêtre de Web Designer. Vous pouvez aussi sélectionner les
options du menu Fichier > Ouvrir ou Importation
.
Si vous faites glisser puis déposez une photo sur une autre déjà existante, celle-ce sera remplacée. Pour
importer une photo seule, déposez-la à l'arrière-plan.
Remplacer des photos
Si vous faites glisser et déposez un fichier bitmap sur une photo existante, celui-ci remplacera la photo,
mais conservera la même taille de cadre. Cela permet de remplacer très facilement des photos dans des
modèles de conception. Pour ajuster la taille, la position et l'angle de la photo à l'intérieur de son contour,
vous pouvez utiliser l'Outil de remplissage
. Ceci n'est pas valable pour les documents photos, où le fait de déposer une photo sur la page va
toujours l'importer comme un nouveau document.
Lorsque vous remplacez une photo ou un bitmap de cette manière, il ou elle est redimensionné(e) pour
pouvoir se loger au mieux dans le contour existant de l'image. Si vous maintenez la touche Maj enfoncée
lorsque vous remplacez une photo, la nouvelle photo aura exactement les mêmes dimensions et le même
degré de rotation que l'ancienne photo. Cela est utile lorsque vous avez modifié manuellement l'échelle ou
le degré de rotation d'un remplissage, et que vous voulez remplacer l'image par une autre ayant les
mêmes proportions. Si vous maintenez la touche Ctrl enfoncée lorsque vous déposez une photo, la photo
sera uniquement ajoutée au document, sans remplacer celle déjà présente.
S'il se trouvent plusieurs exemplaires d'une même photo sur une page (par exemple sous la forme d'une
miniature accompagnée d'une version plus grande de la photo sur un calque popup), tous les exemplaires
de cette photo seront remplacés par la nouvelle dans cette page.
Utiliser des photos comme remplissage
Vous pouvez également utiliser n'importe quel bitmap comme style de remplissage pour toute forme de
Page 545
dessin. Il vous suffit de déplacer le fichier sur une forme (qui peut provenir de votre système de fichiers,
ou de la galerie de bitmap ou de remplissages), et maintenir la touche Maj appuyée avant de relâcher. La
couleur de remplissage existante sera alors remplacée par un bitmap, ajusté à l'objet. À l'aide de l'Outil
de remplissage
, ajustez la taille, la position et l'angle de la photo dans ses contours si nécessaire.
Taille originale de la photo
Un JPEG a, lors de son importation, une taille initiale de 500 pixels de largeur.
Pour réduire cette taille, il vous suffit de tirer sur une des poignées d'angle en utilisant l'Outil de sélection
, ou de saisir une nouvelle largeur dans le champ de la barre d'infos de l'Outil de sélection prévu à cet
effet.
Si vous remplacez une photo en utilisant la technique du glisser-déposer, la photo sera redimensionnée de
façon à venir se loger exactement dans le cadre, ce qui signifie que sa taille et sa résolution dépendront
de la taille du cadre.
Page 546
Remplacer des photos
Si vous faites glisser et déposez un fichier bitmap sur une photo existante, celui-ci remplacera la photo,
mais conservera la même taille de cadre. Cela permet de remplacer très facilement des photos dans des
modèles de conception. Pour ajuster la taille, la position et l'angle de la photo à l'intérieur de son contour,
vous pouvez utiliser l'Outil de remplissage
. Ceci n'est pas valable pour les documents photos, où le fait de déposer une photo sur la page va
toujours l'importer comme un nouveau document.
Lorsque vous remplacez une photo ou un bitmap de cette manière, il ou elle est redimensionné(e) pour
pouvoir se loger au mieux dans le contour existant de l'image. Si vous maintenez la touche Maj enfoncée
lorsque vous remplacez une photo, la nouvelle photo aura exactement les mêmes dimensions et le même
degré de rotation que l'ancienne photo. Cela est utile lorsque vous avez modifié manuellement l'échelle ou
le degré de rotation d'un remplissage, et que vous voulez remplacer l'image par une autre ayant les
mêmes proportions. Si vous maintenez la touche Ctrl enfoncée lorsque vous déposez une photo, la photo
sera uniquement ajoutée au document, sans remplacer celle déjà présente.
S'il se trouvent plusieurs exemplaires d'une même photo sur une page (par exemple sous la forme d'une
miniature accompagnée d'une version plus grande de la photo sur un calque popup), tous les exemplaires
de cette photo seront remplacés par la nouvelle dans cette page.
Utiliser des photos comme remplissage
Vous pouvez également utiliser n'importe quel bitmap comme style de remplissage pour toute forme de
dessin. Il vous suffit de déplacer le fichier sur une forme (qui peut provenir de votre système de fichiers,
ou de la galerie de bitmap ou de remplissages), et maintenir la touche Maj appuyée avant de relâcher. La
couleur de remplissage existante sera alors remplacée par un bitmap, ajusté à l'objet. À l'aide de l'Outil
de remplissage
, ajustez la taille, la position et l'angle de la photo dans ses contours si nécessaire.
Taille originale de la photo
Un JPEG a, lors de son importation, une taille initiale de 500 pixels de largeur.
Pour réduire cette taille, il vous suffit de tirer sur une des poignées d'angle en utilisant l'Outil de sélection
, ou de saisir une nouvelle largeur dans le champ de la barre d'infos de l'Outil de sélection prévu à cet
effet.
Si vous remplacez une photo en utilisant la technique du glisser-déposer, la photo sera redimensionnée de
façon à venir se loger exactement dans le cadre, ce qui signifie que sa taille et sa résolution dépendront
de la taille du cadre.
Page 547
Utiliser des photos comme remplissage
Vous pouvez également utiliser n'importe quel bitmap comme style de remplissage pour toute forme de
dessin. Il vous suffit de déplacer le fichier sur une forme (qui peut provenir de votre système de fichiers,
ou de la galerie de bitmap ou de remplissages), et maintenir la touche Maj appuyée avant de relâcher. La
couleur de remplissage existante sera alors remplacée par un bitmap, ajusté à l'objet. À l'aide de l'Outil
de remplissage
, ajustez la taille, la position et l'angle de la photo dans ses contours si nécessaire.
Taille originale de la photo
Un JPEG a, lors de son importation, une taille initiale de 500 pixels de largeur.
Pour réduire cette taille, il vous suffit de tirer sur une des poignées d'angle en utilisant l'Outil de sélection
, ou de saisir une nouvelle largeur dans le champ de la barre d'infos de l'Outil de sélection prévu à cet
effet.
Si vous remplacez une photo en utilisant la technique du glisser-déposer, la photo sera redimensionnée de
façon à venir se loger exactement dans le cadre, ce qui signifie que sa taille et sa résolution dépendront
de la taille du cadre.
Page 548
Taille originale de la photo
Un JPEG a, lors de son importation, une taille initiale de 500 pixels de largeur.
Pour réduire cette taille, il vous suffit de tirer sur une des poignées d'angle en utilisant l'Outil de sélection
, ou de saisir une nouvelle largeur dans le champ de la barre d'infos de l'Outil de sélection prévu à cet
effet.
Si vous remplacez une photo en utilisant la technique du glisser-déposer, la photo sera redimensionnée de
façon à venir se loger exactement dans le cadre, ce qui signifie que sa taille et sa résolution dépendront
de la taille du cadre.
Page 549
Résolution photo
Une des différences fondamentales entre Xtreme Web Designer 5 et les autres outils photo est que,
lorsque vous redimensionnez une photo, celle-ci conserve sa pleine résolution. Le fait de redimensionner
une image pour la rendre plus petite ne fait qu'augmenter le dpi ou ppp (point par pouce). Autrement dit,
aucun des pixels n'est perdu, ils sont simplement rétrécis.
Lorsque l'on réduit l'image de 96 ppp sur la gauche, sa résolution double et passe à 192 ppp.
La ligne de statut montre la résolution des images que vous sélectionnez. La conservation de la pleine
résolution est importante car cela signifie que vous pouvez encore voir tous les détails quand vous
zoomez dans l'image, et que la résolution maximale est envoyée à l'imprimante quand vous imprimez.
Cela signifie aussi que vous pouvez agrandir l'image complètement ou en partie, et que Web Designer
conserve la qualité maximale originale.
Lorsque vous sauvegardez votre site Internet (en exportant le HTML), Web Designer convertit
automatiquement les photos à la résolution adaptée pour la page Internet.
Page 550
Copies zéro mémoire
L'une des nouveautés révolutionnaires de Web Designer par rapport à d'autres outils d'édition photo
réside dans le fait que lorsque vous copiez une photo sur la page, le programme n'exécute pas vraiment
une nouvelle copie complète de la photo originale mais affiche simplement une autre « vue » de cette
image. Le rendu du moteur de Web Designer est assez rapide pour afficher n'importe quel nombre de
copies de la même image « à la volée ». Cela permet d'économiser énormément d'espace mémoire et
donc de réduire grandement la taille des fichiers.
Cela n'affecte pas vos possibilités d'action sur chacune des copies, qui peuvent être traitées totalement
indépendamment les unes des autres. Chaque copie ne doit pas être identique. Vous pouvez manipuler
chaque copie comme désiré, modifier la taille, les tourner, les détourer, appliquer des couleurs, estomper
ou appliquer toute une série d'effets photo ou de transparence. Le tout sans aucune augmentation de la
taille du fichier ou de l'espace mémoire utilisé.
Vous voyez ici plusieurs copies séparées de la même image sur lesquelles différentes manipulations ont
été effectuées. Chacune conserve la résolution de l'original comme vous pouvez le voir sur l'image de
droite. L'espace mémoire utilisé (RAM ou taille du fichier) n'est pas plus important que la taille du JPEG.
Comme il s'agit de la même image, mais affichée dans plusieurs tailles différentes, la résolution,
c'est-à-dire le nombre de dpi ou ppi, varie. Dans l'exemple ci-dessus, l'oeil a une résolution de 115 dpi
(car l'image a été agrandie), alors que l'image sur la gauche a une résolution de plus de 1200 dpi.
Page 551
La Galerie bitmap
Le chapitre Utilisation des documents présente des informations générales sur les galeries.
La Galerie bitmap
affiche tous les bitmap ou photos utilisés dans chaque document, ainsi que les informations sur la taille en
pixels et la taille du fichier.
Vous pouvez l'ouvrir en cliquant sur l'icone
correspondant dans la partie supérieure de la
barre, ou bien depuis le menu Services ->
Galeries
, ou encore via « F11 ».
Cela affiche la Galerie bitmap pour le document du haut, et montre l'image JPEG originale d'une fille,
incrustée dans le fichier propriétaire .web. Comme nous l'avons indiqué plus haut, tous les exemplaires de
cette image sont affichés directement depuis une image maîtresse, et donc seule l'image unique est
affichée (et non les quatre variantes qui apparaissent sur la page).
Vous trouverez les informations pratiques suivantes à propos de l'image :
 Nom de fichier du JPEG original
 Le type de fichier, dans ce cas un JPEG, et la taille du fichier, ici de 1006K (ceci est la taille
originale du fichier, ainsi que la place qui sera occupée par cette image dans le fichier .web).
 Les dimensions de l'original en pixels, la taille en mégapixels (dans le cas présent, un peu moins
de 2 MP)
 La profondeur colorimétrique, ici de « 24 bit », appelée parfois aussi « true color ». L'image
Xara est une image de 4 bit.
 La résolution originale de l'image, ici 96 ppp
La Galerie bitmap
contient toujours un bitmap par défaut, l'image Xara grise. Ce bitmap est utilisé par défaut pour les
remplissages bitmap et dans les cas où d'autres bitmap manquent. Il est également pratique à utiliser en
tant qu'objet fictif par exemple.
Comme avec toutes les galeries, vous pouvez tirer les objets depuis la galerie et les déposer sur une page
pour créer un nouvel exemplaire. Ou bien vous pouvez sélectionner une image dans la galerie et cliquer
sur l'un des boutons situés en face de la partie supérieure. La section suivante présente en détails le
fonctionnement des commandes de la galerie bitmap, dont la plupart sont réservées aux utilisateurs plus
avancés.
Page 552
Remplissage de formes à l'aide d'un bitmap
Sélectionner la forme sur la page, puis sélectionner le bitmap dans la galerie et cliquer sur le bouton de
remplissage. Vous pouvez également tirer l'image depuis la galerie de bitmap et la déposer dans
n'importe quelle forme tout en maintenant la touche Maj appuyée. À l'aide de l'Outil de remplissage
, ajustez la taille, la position et l'angle si nécessaire.
Paramétrer une transparence bitmap
Cette fonction s'adresse aux utilisateurs avancés. Vous pouvez utiliser n'importe quel bitmap comme un
masque de transparence sur n'importe quelle forme remplie ou bitmap. La clarté du bitmap affecte la
transparence de l'objet sélectionné. La dimension de transparence du bitmap, la rotation et la
segmentation peut être contrôlée à l'aide de l'Outil de transparence
.
Supprimer des images dans la galerie
Lorsque vous supprimez un bitmap de la page, il reste dans la Galerie de bitmap. Tous les bitmaps non
utilisés seront supprimés du fichier lors de la sauvegarde et à la réouverture. Néanmoins, vous pouvez
supprimer tout bitmap en le sélectionnant puis en cliquant sur Supprimer
. Si le bitmap est utilisé dans le document, il sera remplacé par le bitmap standard de Xara.
Configurer l'arrière plan d'une page comme bitmap
Sélectionnez le bitmap dans la galerie et cliquez sur Arrière-plan
. L'image sera alors segmentée. Lorsque vous exportez la page au format HTML, l'image est segmentée
sur tout l'arrière-plan visible du navigateur.
Enregistrer
Sélectionnez le bitmap et cliquez sur Sauvegarder
pour enregistrer l'image d'origine. Dans le cas d'un JPEG intégré, le fichier JPEG d'origine sera
sauvegardé. Nous recommandons de sauvegarder les autres types de bitmap au format PNG.
Propriétés bitmap
Le bouton Propriétés
affiche des informations sur le bitmap sélectionné dans la galerie. Il sert aussi à arrêter le lissage d'une
image lorsque des bitmap sont agrandis. Les bitmap sont généralement lissés à l'écran quand on les
agrandit ou qu'on zoom dedans. Vous trouverez une option à cocher dans la boîte de dialogue des
Propriétés pour désactiver cette fonction, de façon à ce que les pixels soient visibles lorsque vous ferez
un zoom avant.
Vous trouverez également des informations à propos des propriétés d'Animation du bitmap. Ceci n'est
applicable qu'aux images GIF animées
Animation GIF :
 Délai (temps pendant lequel ce cadre est affiché à l'écran)
 Rétablir : les paramètres Rétablir des GIF animés définissent ce qui se passent entre chaque
frame dans un GIF animé. Quand il ne se passe rien, cela signifie qu'aucune action n'a été
entreprise. De nombreux navigateurs considèrent cela comme ayant la même signification que
l'option « Laisser tel quel ». « Laisser tel quel » montre les frames les uns au-dessus des autres,
ce qui rend beaucoup de frames visibles dans une pile si certains sont transparents. Certains
navigateurs suppriment l'animation avant qu'elle ne repasse en boucle, et d'autres pas.
L'arrière-plan redonne à la surface occupée par le graphique la couleur du GIF (généralement
blanc). Rétablir Précédent permet de redonner à la surface occupée par le frame l'aspect qu'elle
Page 553
avait avant l'affichage du frame. Ceci est interprété par certains navigateurs comme le fait que le
frame doit être effacé de l'arrrière-plan avant que chaque frame ne soit affiché ; d'autres
navigateurs le comprennent comme le fait que le frame doitêtre montré au-dessus du frame
précédent. Comme les navigateurs interprètent ces valeurs différemment, nous vous conseillons
de procéder à des tests pour obtenir le résultat que vous souhaitez.
Page 554
Remplissage de formes à l'aide d'un bitmap
Sélectionner la forme sur la page, puis sélectionner le bitmap dans la galerie et cliquer sur le bouton de
remplissage. Vous pouvez également tirer l'image depuis la galerie de bitmap et la déposer dans
n'importe quelle forme tout en maintenant la touche Maj appuyée. À l'aide de l'Outil de remplissage
, ajustez la taille, la position et l'angle si nécessaire.
Paramétrer une transparence bitmap
Cette fonction s'adresse aux utilisateurs avancés. Vous pouvez utiliser n'importe quel bitmap comme un
masque de transparence sur n'importe quelle forme remplie ou bitmap. La clarté du bitmap affecte la
transparence de l'objet sélectionné. La dimension de transparence du bitmap, la rotation et la
segmentation peut être contrôlée à l'aide de l'Outil de transparence
.
Supprimer des images dans la galerie
Lorsque vous supprimez un bitmap de la page, il reste dans la Galerie de bitmap. Tous les bitmaps non
utilisés seront supprimés du fichier lors de la sauvegarde et à la réouverture. Néanmoins, vous pouvez
supprimer tout bitmap en le sélectionnant puis en cliquant sur Supprimer
. Si le bitmap est utilisé dans le document, il sera remplacé par le bitmap standard de Xara.
Configurer l'arrière plan d'une page comme bitmap
Sélectionnez le bitmap dans la galerie et cliquez sur Arrière-plan
. L'image sera alors segmentée. Lorsque vous exportez la page au format HTML, l'image est segmentée
sur tout l'arrière-plan visible du navigateur.
Enregistrer
Sélectionnez le bitmap et cliquez sur Sauvegarder
pour enregistrer l'image d'origine. Dans le cas d'un JPEG intégré, le fichier JPEG d'origine sera
sauvegardé. Nous recommandons de sauvegarder les autres types de bitmap au format PNG.
Propriétés bitmap
Le bouton Propriétés
affiche des informations sur le bitmap sélectionné dans la galerie. Il sert aussi à arrêter le lissage d'une
image lorsque des bitmap sont agrandis. Les bitmap sont généralement lissés à l'écran quand on les
agrandit ou qu'on zoom dedans. Vous trouverez une option à cocher dans la boîte de dialogue des
Propriétés pour désactiver cette fonction, de façon à ce que les pixels soient visibles lorsque vous ferez
un zoom avant.
Vous trouverez également des informations à propos des propriétés d'Animation du bitmap. Ceci n'est
applicable qu'aux images GIF animées
Animation GIF :
 Délai (temps pendant lequel ce cadre est affiché à l'écran)
 Rétablir : les paramètres Rétablir des GIF animés définissent ce qui se passent entre chaque
frame dans un GIF animé. Quand il ne se passe rien, cela signifie qu'aucune action n'a été
entreprise. De nombreux navigateurs considèrent cela comme ayant la même signification que
l'option « Laisser tel quel ». « Laisser tel quel » montre les frames les uns au-dessus des autres,
ce qui rend beaucoup de frames visibles dans une pile si certains sont transparents. Certains
navigateurs suppriment l'animation avant qu'elle ne repasse en boucle, et d'autres pas.
L'arrière-plan redonne à la surface occupée par le graphique la couleur du GIF (généralement
Page 555
blanc). Rétablir Précédent permet de redonner à la surface occupée par le frame l'aspect qu'elle
avait avant l'affichage du frame. Ceci est interprété par certains navigateurs comme le fait que le
frame doit être effacé de l'arrrière-plan avant que chaque frame ne soit affiché ; d'autres
navigateurs le comprennent comme le fait que le frame doitêtre montré au-dessus du frame
précédent. Comme les navigateurs interprètent ces valeurs différemment, nous vous conseillons
de procéder à des tests pour obtenir le résultat que vous souhaitez.
Page 556
Paramétrer une transparence bitmap
Cette fonction s'adresse aux utilisateurs avancés. Vous pouvez utiliser n'importe quel bitmap comme un
masque de transparence sur n'importe quelle forme remplie ou bitmap. La clarté du bitmap affecte la
transparence de l'objet sélectionné. La dimension de transparence du bitmap, la rotation et la
segmentation peut être contrôlée à l'aide de l'Outil de transparence
.
Supprimer des images dans la galerie
Lorsque vous supprimez un bitmap de la page, il reste dans la Galerie de bitmap. Tous les bitmaps non
utilisés seront supprimés du fichier lors de la sauvegarde et à la réouverture. Néanmoins, vous pouvez
supprimer tout bitmap en le sélectionnant puis en cliquant sur Supprimer
. Si le bitmap est utilisé dans le document, il sera remplacé par le bitmap standard de Xara.
Configurer l'arrière plan d'une page comme bitmap
Sélectionnez le bitmap dans la galerie et cliquez sur Arrière-plan
. L'image sera alors segmentée. Lorsque vous exportez la page au format HTML, l'image est segmentée
sur tout l'arrière-plan visible du navigateur.
Enregistrer
Sélectionnez le bitmap et cliquez sur Sauvegarder
pour enregistrer l'image d'origine. Dans le cas d'un JPEG intégré, le fichier JPEG d'origine sera
sauvegardé. Nous recommandons de sauvegarder les autres types de bitmap au format PNG.
Propriétés bitmap
Le bouton Propriétés
affiche des informations sur le bitmap sélectionné dans la galerie. Il sert aussi à arrêter le lissage d'une
image lorsque des bitmap sont agrandis. Les bitmap sont généralement lissés à l'écran quand on les
agrandit ou qu'on zoom dedans. Vous trouverez une option à cocher dans la boîte de dialogue des
Propriétés pour désactiver cette fonction, de façon à ce que les pixels soient visibles lorsque vous ferez
un zoom avant.
Vous trouverez également des informations à propos des propriétés d'Animation du bitmap. Ceci n'est
applicable qu'aux images GIF animées
Animation GIF :
 Délai (temps pendant lequel ce cadre est affiché à l'écran)
 Rétablir : les paramètres Rétablir des GIF animés définissent ce qui se passent entre chaque
frame dans un GIF animé. Quand il ne se passe rien, cela signifie qu'aucune action n'a été
entreprise. De nombreux navigateurs considèrent cela comme ayant la même signification que
l'option « Laisser tel quel ». « Laisser tel quel » montre les frames les uns au-dessus des autres,
ce qui rend beaucoup de frames visibles dans une pile si certains sont transparents. Certains
navigateurs suppriment l'animation avant qu'elle ne repasse en boucle, et d'autres pas.
L'arrière-plan redonne à la surface occupée par le graphique la couleur du GIF (généralement
blanc). Rétablir Précédent permet de redonner à la surface occupée par le frame l'aspect qu'elle
avait avant l'affichage du frame. Ceci est interprété par certains navigateurs comme le fait que le
frame doit être effacé de l'arrrière-plan avant que chaque frame ne soit affiché ; d'autres
navigateurs le comprennent comme le fait que le frame doitêtre montré au-dessus du frame
précédent. Comme les navigateurs interprètent ces valeurs différemment, nous vous conseillons
de procéder à des tests pour obtenir le résultat que vous souhaitez.
Page 557
Supprimer des images dans la galerie
Lorsque vous supprimez un bitmap de la page, il reste dans la Galerie de bitmap. Tous les bitmaps non
utilisés seront supprimés du fichier lors de la sauvegarde et à la réouverture. Néanmoins, vous pouvez
supprimer tout bitmap en le sélectionnant puis en cliquant sur Supprimer
. Si le bitmap est utilisé dans le document, il sera remplacé par le bitmap standard de Xara.
Configurer l'arrière plan d'une page comme bitmap
Sélectionnez le bitmap dans la galerie et cliquez sur Arrière-plan
. L'image sera alors segmentée. Lorsque vous exportez la page au format HTML, l'image est segmentée
sur tout l'arrière-plan visible du navigateur.
Enregistrer
Sélectionnez le bitmap et cliquez sur Sauvegarder
pour enregistrer l'image d'origine. Dans le cas d'un JPEG intégré, le fichier JPEG d'origine sera
sauvegardé. Nous recommandons de sauvegarder les autres types de bitmap au format PNG.
Propriétés bitmap
Le bouton Propriétés
affiche des informations sur le bitmap sélectionné dans la galerie. Il sert aussi à arrêter le lissage d'une
image lorsque des bitmap sont agrandis. Les bitmap sont généralement lissés à l'écran quand on les
agrandit ou qu'on zoom dedans. Vous trouverez une option à cocher dans la boîte de dialogue des
Propriétés pour désactiver cette fonction, de façon à ce que les pixels soient visibles lorsque vous ferez
un zoom avant.
Vous trouverez également des informations à propos des propriétés d'Animation du bitmap. Ceci n'est
applicable qu'aux images GIF animées
Animation GIF :
 Délai (temps pendant lequel ce cadre est affiché à l'écran)
 Rétablir : les paramètres Rétablir des GIF animés définissent ce qui se passent entre chaque
frame dans un GIF animé. Quand il ne se passe rien, cela signifie qu'aucune action n'a été
entreprise. De nombreux navigateurs considèrent cela comme ayant la même signification que
l'option « Laisser tel quel ». « Laisser tel quel » montre les frames les uns au-dessus des autres,
ce qui rend beaucoup de frames visibles dans une pile si certains sont transparents. Certains
navigateurs suppriment l'animation avant qu'elle ne repasse en boucle, et d'autres pas.
L'arrière-plan redonne à la surface occupée par le graphique la couleur du GIF (généralement
blanc). Rétablir Précédent permet de redonner à la surface occupée par le frame l'aspect qu'elle
avait avant l'affichage du frame. Ceci est interprété par certains navigateurs comme le fait que le
frame doit être effacé de l'arrrière-plan avant que chaque frame ne soit affiché ; d'autres
navigateurs le comprennent comme le fait que le frame doitêtre montré au-dessus du frame
précédent. Comme les navigateurs interprètent ces valeurs différemment, nous vous conseillons
de procéder à des tests pour obtenir le résultat que vous souhaitez.
Page 558
Configurer l'arrière plan d'une page comme bitmap
Sélectionnez le bitmap dans la galerie et cliquez sur Arrière-plan
. L'image sera alors segmentée. Lorsque vous exportez la page au format HTML, l'image est segmentée
sur tout l'arrière-plan visible du navigateur.
Enregistrer
Sélectionnez le bitmap et cliquez sur Sauvegarder
pour enregistrer l'image d'origine. Dans le cas d'un JPEG intégré, le fichier JPEG d'origine sera
sauvegardé. Nous recommandons de sauvegarder les autres types de bitmap au format PNG.
Propriétés bitmap
Le bouton Propriétés
affiche des informations sur le bitmap sélectionné dans la galerie. Il sert aussi à arrêter le lissage d'une
image lorsque des bitmap sont agrandis. Les bitmap sont généralement lissés à l'écran quand on les
agrandit ou qu'on zoom dedans. Vous trouverez une option à cocher dans la boîte de dialogue des
Propriétés pour désactiver cette fonction, de façon à ce que les pixels soient visibles lorsque vous ferez
un zoom avant.
Vous trouverez également des informations à propos des propriétés d'Animation du bitmap. Ceci n'est
applicable qu'aux images GIF animées
Animation GIF :
 Délai (temps pendant lequel ce cadre est affiché à l'écran)
 Rétablir : les paramètres Rétablir des GIF animés définissent ce qui se passent entre chaque
frame dans un GIF animé. Quand il ne se passe rien, cela signifie qu'aucune action n'a été
entreprise. De nombreux navigateurs considèrent cela comme ayant la même signification que
l'option « Laisser tel quel ». « Laisser tel quel » montre les frames les uns au-dessus des autres,
ce qui rend beaucoup de frames visibles dans une pile si certains sont transparents. Certains
navigateurs suppriment l'animation avant qu'elle ne repasse en boucle, et d'autres pas.
L'arrière-plan redonne à la surface occupée par le graphique la couleur du GIF (généralement
blanc). Rétablir Précédent permet de redonner à la surface occupée par le frame l'aspect qu'elle
avait avant l'affichage du frame. Ceci est interprété par certains navigateurs comme le fait que le
frame doit être effacé de l'arrrière-plan avant que chaque frame ne soit affiché ; d'autres
navigateurs le comprennent comme le fait que le frame doitêtre montré au-dessus du frame
précédent. Comme les navigateurs interprètent ces valeurs différemment, nous vous conseillons
de procéder à des tests pour obtenir le résultat que vous souhaitez.
Page 559
Enregistrer
Sélectionnez le bitmap et cliquez sur Sauvegarder
pour enregistrer l'image d'origine. Dans le cas d'un JPEG intégré, le fichier JPEG d'origine sera
sauvegardé. Nous recommandons de sauvegarder les autres types de bitmap au format PNG.
Propriétés bitmap
Le bouton Propriétés
affiche des informations sur le bitmap sélectionné dans la galerie. Il sert aussi à arrêter le lissage d'une
image lorsque des bitmap sont agrandis. Les bitmap sont généralement lissés à l'écran quand on les
agrandit ou qu'on zoom dedans. Vous trouverez une option à cocher dans la boîte de dialogue des
Propriétés pour désactiver cette fonction, de façon à ce que les pixels soient visibles lorsque vous ferez
un zoom avant.
Vous trouverez également des informations à propos des propriétés d'Animation du bitmap. Ceci n'est
applicable qu'aux images GIF animées
Animation GIF :
 Délai (temps pendant lequel ce cadre est affiché à l'écran)
 Rétablir : les paramètres Rétablir des GIF animés définissent ce qui se passent entre chaque
frame dans un GIF animé. Quand il ne se passe rien, cela signifie qu'aucune action n'a été
entreprise. De nombreux navigateurs considèrent cela comme ayant la même signification que
l'option « Laisser tel quel ». « Laisser tel quel » montre les frames les uns au-dessus des autres,
ce qui rend beaucoup de frames visibles dans une pile si certains sont transparents. Certains
navigateurs suppriment l'animation avant qu'elle ne repasse en boucle, et d'autres pas.
L'arrière-plan redonne à la surface occupée par le graphique la couleur du GIF (généralement
blanc). Rétablir Précédent permet de redonner à la surface occupée par le frame l'aspect qu'elle
avait avant l'affichage du frame. Ceci est interprété par certains navigateurs comme le fait que le
frame doit être effacé de l'arrrière-plan avant que chaque frame ne soit affiché ; d'autres
navigateurs le comprennent comme le fait que le frame doitêtre montré au-dessus du frame
précédent. Comme les navigateurs interprètent ces valeurs différemment, nous vous conseillons
de procéder à des tests pour obtenir le résultat que vous souhaitez.
Page 560
Propriétés bitmap
Le bouton Propriétés
affiche des informations sur le bitmap sélectionné dans la galerie. Il sert aussi à arrêter le lissage d'une
image lorsque des bitmap sont agrandis. Les bitmap sont généralement lissés à l'écran quand on les
agrandit ou qu'on zoom dedans. Vous trouverez une option à cocher dans la boîte de dialogue des
Propriétés pour désactiver cette fonction, de façon à ce que les pixels soient visibles lorsque vous ferez
un zoom avant.
Vous trouverez également des informations à propos des propriétés d'Animation du bitmap. Ceci n'est
applicable qu'aux images GIF animées
Animation GIF :
 Délai (temps pendant lequel ce cadre est affiché à l'écran)
 Rétablir : les paramètres Rétablir des GIF animés définissent ce qui se passent entre chaque
frame dans un GIF animé. Quand il ne se passe rien, cela signifie qu'aucune action n'a été
entreprise. De nombreux navigateurs considèrent cela comme ayant la même signification que
l'option « Laisser tel quel ». « Laisser tel quel » montre les frames les uns au-dessus des autres,
ce qui rend beaucoup de frames visibles dans une pile si certains sont transparents. Certains
navigateurs suppriment l'animation avant qu'elle ne repasse en boucle, et d'autres pas.
L'arrière-plan redonne à la surface occupée par le graphique la couleur du GIF (généralement
blanc). Rétablir Précédent permet de redonner à la surface occupée par le frame l'aspect qu'elle
avait avant l'affichage du frame. Ceci est interprété par certains navigateurs comme le fait que le
frame doit être effacé de l'arrrière-plan avant que chaque frame ne soit affiché ; d'autres
navigateurs le comprennent comme le fait que le frame doitêtre montré au-dessus du frame
précédent. Comme les navigateurs interprètent ces valeurs différemment, nous vous conseillons
de procéder à des tests pour obtenir le résultat que vous souhaitez.
Page 561
Fichiers JPEG incrusté
Les fichiers JPEG sont hautement compressés pour produire un fichier jusqu'à 10 fois plus petit que
l'image originale. Dans l'exemple ci-dessus, l'image d'origine non compressée requiert plus de 7 Mo de
mémoire, mais comme on peut le voir dans la Galerie de bitmap
, le fichier JPEG requiert seulement 1 Mo. Une réduction conséquente. C'est la raison pour laquelle le
format JPEG est utilisé comme format standard pour la photographie numérique et le Web.
Lorsque vous déplacez un fichier JPEG par glisser-déposer (ou que vous utilisez les options de menu
« Ouvrir » ou « Importation »), le JPEG original est rangé dans le document, et c'est dans cet état que le
fichier .xar est sauvegardé.
Il est important de comprendre de quelle manière cet outil diffère des autres outils graphiques, qu'il
s'agisse de logiciels de dessin vectoriel et de programmes d'édition photo. Certains programmes
décompressent l'image et enregistrent cette image « brute » dans la mémoire ainsi que le fichier original
lorsque vous effectuez une sauvegarde sur disque. Ce qui signifie que chaque copie réalisée est
typiquement une copie complète de l'image originale brute comme mentionné plus haut. Réalisez quatre
copies de votre photo et enregistrez votre fichier ; il sera alors quatre fois plus grand. Dans Xtreme Web
Designer 5, la taille du fichier n'est pas modifiée, peu importe le nombre de copies.
Ainsi si vous incrustez le fichier JPEG original au lieu de sauvegarder l'image décompressée, vous réalisez
un énorme gain d'espace mémoire en comparaison à d'autres éditeurs graphiques. Le fait qu'il existe
quatre copies complètes de l'image signifie que dans ce cas particulier, on fait appel près de 30 fois
moins à la mémoire. Cela représente donc une énorme économie sur la taille des fichiers (et un gain de
temps) par rapport à d'autres outils graphiques.
Extraction du JPEG d'origine
Effectuez un clic droit sur n'importe quelle image de la Galerie de bitmap et sélectionnez l'option de
menu Enregistrer
pour enregistrer le JPEG d'origine dans votre système de fichiers.
Page 562
Extraction du JPEG d'origine
Effectuez un clic droit sur n'importe quelle image de la Galerie de bitmap et sélectionnez l'option de
menu Enregistrer
pour enregistrer le JPEG d'origine dans votre système de fichiers.
Page 563
Avec ou sans perte
Comme Web Designer travaille uniquement à partir de l'image d'origine, qui reste intacte dans votre
fichier, on parle de travail sans perte. Les images ne sont pas re-compressées lors de la sauvegarde du
fichier d'origine .xar.
Vous pouvez naturellement sauvegarder ou exporter votre image comme fichier JPEG compressée, à la
taille désirée, et dans ce cas, la qualité de l'image et les détails seront réduits de manière destructive. Cela
signifie que les données d'origine ou les détails ne pourront pas être rétablis. Xara est un éditeur qui
travail en mode non destructif car les données et détails de l'image d'origine ne sont jamais perdus.
Page 564
Effet de fondu et fusionnement de photos
En copiant des photos l'une sur l'autre, et en appliquent différents effets aux copies, combiné avec les
contrôles avancés de transparence de Web Designer, vous pouvez créer très facilement des
compositions avec fondus. Par exemple, il suffit de quelques secondes pour flouer des zones déterminées
d'une photo.
En plaçant la copie floue avec le « trou » créé par l'effet de transparence sur la photo originale, on obtient
un résultat de fondu qui permet de voir la zone non flouée.
Vous pouvez copier des objets en un simple clic (et tirer avec le bouton droit de la souris). Pour ajouter
un flou à une photo, il suffit de déplacer la réglette de flou dans l'outil photo, et appliquer une
transparence graduée est possible en un simple clic également dans l'outil de transparence. Enfin
positionnez les photos l'une sur l'autre en une seconde. L'opération nécessite alors seulement quelques
clics et quelques secondes dans Xtreme Web Designer 5.
Naturellement, vous n'êtes pas limité aux effets de flou, vous pouvez également ajuster les couleurs, la
clarté et le contraste, ou appliquer toute une série d'effets en direct pour des créations à l'infini.
Page 565
Qualité d'affichage des photos
Xtreme Web Designer 5 peut afficher des photos en trois niveaux différents de qualité. Le paramétrage
normal anti-alias va lisser les pixels de l'écran pour arrondir les angles et rendre l'image plus
harmonieuse.
Il existe un paramètre de qualité inférieur qui ne comporte pas de fonction anti-alias et qui affiche donc
les pixels individuels. Cela peut être très utile lorsque vous zoomez et qu'il est nécessaire de visionner
tous les pixels de l'image. L'inconvénient est que les images paraissent souvent de moindre qualité lorsque
vous les réduisez ou agrandissez, affichant tous les pixels et des effets d'escalier dans les angles,
spécialement si vous tournez l'image.
Enfin, il existe un mode haute qualité qui affiche les images à l'aide d'une fonction d'échantillonnage
bicubique. Les images sont affichées dans la meilleure qualité possible, particulièrement les images haute
résolution qui sont réduites.
La réglette de qualité
d'affichage située sur le
dessus de la barre d'outil
contrôle la qualité
d'affichage et propose cinq
étapes. Les deux premiers
paramètres sont utiles
uniquement pour les
graphiques vectoriels.
Une commande supplémentaire vous permet de stopper tout lissage ou la fonction anti-alias pour toutes
les images agrandies ou affichées avec zoom. Autrement dit, lorsque vous zoomez, vous voyez bien tous
les pixels et non une image lissée. Ouvrez la Galerie de bitmap
et effectuez un clic droit sur l'image puis sélectionnez « Propriétés ». Dans la boîte de dialogue, décochez
l'option « Égaliser lors de l'agrandissement ». Ensuite, peu importe la qualité d'affichage sélectionnée,
l'image (et toutes ses copies) sera toujours affichée non lissée lorsqu'elle est agrandit ou vue avec zoom.
Remarque
: si vous utilisez l'outil photo Netteté / Flou, vous devez affichez les images en qualité maximum. Si donc
vous avez l'impression que la qualité d'affichage ne fonctionne plus, c'est certainement car la photo a été
éditée avec la fonction Netteté / Flou dans l'outil photo auparavant.
Page 566
Enregistrer et exporter des photos
Lorsque vous sélectionnez l'option Enregistrer, c'est toujours un fichier propriétaire .web qui sera
sauvegardé. Pour enregistrer une photo au format JPEG, PNG ou tout autre format d'image, vous devez
utiliser l'option Exporter
, ou le raccourci « Ctrl + Maj + E ».
Vous avez le choix entre un grand nombre de types de fichiers, tels que JPEG, PNG, GIF, TIFF, PDF,
PSD, Flash (.swf), BMP, ainsi que d'autres moins courants.
Vous trouverez deux icones en haut de la barre, qui sont des
raccourcis et servent à enregistrer votre sélection aux formats JPEG
ou PNG.
Nous vous recommandons d'enregistrer les photos au format JPEG (parfois appelé JPG) car ce format
offre la plus grande compatibilité et le meilleur compromis taille/qualité.
Lorsque vous exportez un JPEG ou un PNG, vous trouver une option Paramètres
dans la boîte de dialogue d'enregistrement. Vous y trouverez de nombreuses options avancées
d'exportation, ainsi que des paramètres vous permettant de faire des comparaisons côte à côte ou même
des types de fichiers alternatifs tels que PNG.
Lorsque vous exportez un JPEG, une boîte de dialogue d'aperçu s'ouvre ; vous pouvez y ajuster de
nombreuses options d'exportation, vous permettant de faire des comparaisons côte à côte ou même des
types de fichiers alternatifs tels que PNG.
La boîte de dialogue d'aperçu de l'exportation vous permet d'ajuster la taille, la résolution, la qulité JPEG
et même de choisir entre 3 types de fichiers d'exportation alternatifs. La valeur définie par défaut est
normalement appropriée à tous les travaux courants et il vous suffit de cliauer sur le bouton d'exportation
pour sauvegarder votre photo.
Ne pas oublier lors de l'exportation :
 Sélectionnez tout d'abord le ou les objet(s) à exporter
 La taille de l'image par défaut pour l'exportation est la taille que vous verrez à l'écran en zoom
100%.
La boîte de dialogue d'aperçu de l'exportation
est décrite plus en détails ici.
Conseil
: vous pouvez contrôler la qualité JPEG dans la boîte de dialogue des paramètres d'exportation dans
l'onglet Options. La valeur par défaut et celle qui est recommandée est de 75%
Le système JPEG est conçu de telle
sorte qu'un paramètre de 75 est la
valeur optimale. Nous vous
recommandons de ne pas
enregistrer un JPEG à 100% de sa
qualité, puisque le résultat est
visuellement identique à une qualité
de 75%, et que la taille du fichier et
la mémoire utilisée sont
énormément augmentées.
Lorsque vous enregistrez pour une utilisation Internet, vous pouvez encore réduire la qualité sous 75%
pour accélérer la vitesse de visualisation de la page. La fenêtre d'aperçu montre la qualité des valeurs que
vous sélectionnez.
Conseil
: si vous pensez faire d'autres opérations d'édition sur votre image exportée (par exemple pour recréer
l'image avec une autre taille), nous vous recommandons de sauvegarder le fichier aussi en .web. Cela
Page 567
vous permet de préserver l'image maîtresse sans pertes en même temps que toutes les éditions et
modifications.
Exemple : redimensionner et enregistrer une photo en tant
que nouveau JPEG
Cette procédure est très rapide et très simple :
 Déposez votre photo dans Xara Xtreme (soit sur une page blanche, soit sur une barre de titre
pour créer un nouveau document)
 Dans l'outil de sélection, tirez soit sur une poignée d'angle pour redimensionner l'image, ou bien
saisissez la largeur ou la hauteur de votre choix dans les champs « W » ou « H » de la barre
d'infos. Vérifiez que la taille de l'image est correcte à 100%
Cliquez sur le bouton « Exporter la sélection au format JPEG », situé sur la barre supérieure.
Saisissez un nom de fichier, cliquez sur le bouton Paramètres si vous souhaitez contrôler la
compression, ou cliquez simplement sur Enregistrer
Pour enregistrer une image au format PNG, répétez la même opération, mais sélectionnez le type de
fichier PNG.


Page 568
Exemple : redimensionner et enregistrer une photo en tant
que nouveau JPEG
Cette procédure est très rapide et très simple :
 Déposez votre photo dans Xara Xtreme (soit sur une page blanche, soit sur une barre de titre
pour créer un nouveau document)
 Dans l'outil de sélection, tirez soit sur une poignée d'angle pour redimensionner l'image, ou bien
saisissez la largeur ou la hauteur de votre choix dans les champs « W » ou « H » de la barre
d'infos. Vérifiez que la taille de l'image est correcte à 100%
Cliquez sur le bouton « Exporter la sélection au format JPEG », situé sur la barre supérieure.
Saisissez un nom de fichier, cliquez sur le bouton Paramètres si vous souhaitez contrôler la
compression, ou cliquez simplement sur Enregistrer
Pour enregistrer une image au format PNG, répétez la même opération, mais sélectionnez le type de
fichier PNG.


Page 569
Attributs de l'édition photo
Toutes les opérations d'édition faites avec l'Outil photo
, telles que des modifications des valeurs de luminosité, de contraste, de couleur, de flou ou de netteté,
sont toutes enregistrées dans la photo en tant qu'attributs de Web Designer.
Tout comme vous pouvez modifier la couleur d'une forme ou le contour sans modifier la forme qui se
trouve en-dessous, les attributs de l'Outil photo modifient l'apparence visible de la photo sans affecter
l'image originale (ceci est appelé édition non destructrice). Une autre manière de voir cela est que Xtreme
Web Designer 5 enregistre une liste d'éditions appliquées à votre photo, et vous pouvez modifier,
supprimer ou ajouter de nouvelles éditions. Vous pouvez toujours retrouver la photo originale intacte.
Les attributs peuvent être copiés et collés entre les objets. Cela ne s'applique pas qu'aux attributs
traditionnels tels que la couleur et l'épaisseur du contour, mais cela fonctionne avec tous les attributs de l'
Outils photo
. Cela signifie donc que vous pouvez facilement copier toutes les optimisations faites sur une photo vers
une autre en utilisant la fonction copier/coller.
Cela s'applique également à tous les attributs de la photo comme la largeur et la couleur du contour, la
coloration de la photo, les ombres, etc. ; tout cela peut être copié à partir d'une photo vers une autre en
utilisant la même technique.
Page 570
Editer le contour de photos
Vous pouvez utiliser l'Outil Editeur de forme
pour ajuster directement la forme du contour d'une photo. De la même façon, vous pouvez appliquer
des contours pour toute forme, ombre, etc.
Avec l'Outil Editeur de forme, vous pouvez
tirer ou pousser sur les côtés. Cet exemple
possède aussi un contour noir et une ombre
douce. Pour rétablir l'image à sa forme
rectangulaire originale, sélectionnez
« De-clip » dans le mode clip de la barre
d'infos de l'Outil photo
.
Lorsque vous éditez des photos de cette
façon, celles-ci seront traitées comme une
forme vectorielle normale contenant un
remplissage bitmap. C'est pour cette raison
que vous pouvez utiliser les fonctions
normales d'édition de forme et de ligne, ainsi
que l'Outil de remplissage
pour régler la taille, l'angle et la position du
« remplissage » photo à l'intérieur de la
forme.
Page 571
Recouper des photos
Le procédé le plus simple pour recouper des
photos est de faire glisser celle-ci dans l'Outil
photo
, ou de vous servir des 8 poignées de
contrôle situées autour de l'objet pour régler
les coins des photos sélectionnées.
Dans l'Outil photo, il vous suffit de cliquer sur
une photo pour la sélectionner, et les
poignées de recoupe apparaîtront.
Pour obtenir plus de commandes avancées de recoupe,
sélectionnez le Bouton clip
de la barre d'info de l'Outil photo ; cela vous permettra de
commander les proportions et le clipping numérique.
Vous trouverez également un bouton De-clip qui supprimera les rectangles de clips et rétablira l'image
originale.
La fonction de redécoupe est un clip dynamique, c'est-à-dire qu'il s'agit d'une redécoupe non
destructrice, et vous pouvez toujours ajuster les limites de la recoupe ultérieurement pour remettre à jour
des parties cachées de la photo. Si vous voulez vraiment faire une découpe réelle (c'est-à-dire faire une
recoupe destructrice, qui supprimera définitivement les parties invisibles de la photo, alors veuillez utiliser
la fonction Optimisation photo
.
Page 572
Découper des objets dans des photos
Grâce aux outils de dessin, vous pouvez dessiner simplement autour des formes et les détourer. Vous
pouvez utiliser n'importe quel outil de dessin pour cela. La manière la plus simple est peut être encore
d'utiliser l'outil d'édition des formes
et de dessiner une ligne autour de la forme que vous souhaitez extraire. Réalisez un zoom avant dans la
photo puis :
 L'outil d'édition des formes utilise une technique de « connexion des points » en séquences de
clics autour de la forme, plus spécialement détaillé dans certaines zones et avec moins de clics
pour les lignes droites ou les légères courbes.
 Lorsque vous avez fait le tour complet de l'objet, fermez la ligne pour créer une forme solide en
joignant le dernier segment au premier. Vous allez ainsi obtenir une forme remplie typique noire.
 Vous avez la possibilité de découper cette forme en sélectionnant la nouvelle forme masque et la
photo (Maj+clic sur la photo dans l'outil de sélection) puis en choisissant Édition > Arranger
les formes > Croiser des formes.
 Estompez le résultat pour fusionner légèrement les angles en déplaçant la réglette d'estompage
d'un ou deux pixels.
Vous pouvez opérer d'autres ajustements sur la forme à l'aide des outils d'édition des lignes comme la
photo reste à l'intérieur de la forme qui agit comme un masque de découpe.
Dans cet exemple, on a appliqué une ombre horizontale à la vache à l'aide de l'outil ombres.
Page 573
Captures d'écran
Grâce à la fonction de capture d'écran intégrée, il est très facile de réaliser des captures d'écran.
 Cliquez sur le bouton « Impr écran » de votre clavier. Une capture d'écran de l'affichage actuel
de l'écran est alors enregistrée dans le presse-papier. Vous pouvez également sélectionner
Alt+Impr écran pour réaliser une capture d'écran de la fenêtre actuelle uniquement.
 Dans Xtreme Web Designer 5, sélectionnez « Ctrl+V » pour coller puis « Bitmap » pour coller
les résultats sur la page.
Vous pouvez maintenant détourer, ajouter des commentaires, modifier la taille comme désiré et
sauvegarder les résultats. Il est judicieux de sauvegarder ce type d'images au format PNG. Tous les
écrans avec commentaire de ce fichier d'aide ont été créés de cette manière.
Page 574
Colorer des photos
Après avoir sélectionné une photo, cliquez sur la ligne de couleur que vous souhaitez appliquer à votre
photo. Si vous cliquez sur la zone de couleur blanche et que vous sélectionnez Définir couleur Contone
claire
, toutes les photos deviendront noires et blanches. Cela porte le nom de « contone » car il s'agit d'un ton
continu allant du noir au blanc.
Pour créer une image en tons de jaunes continus, cliquez tout simplement sur une couleur jaune pale de la
ligne des couleurs.
Ou bien faites un clic droit sur la ligne de couleurs qui affichera un menu contextuel pour vous permettre
d'appliquer la couleur sélectionnée soit comme une couleur claire, soit comme une couleur foncée.
Lorsque vous cliquez sur
la ligne de couleurs
, vous pouvez
sélectionner n'importe
quelle couleur, et choisir
entre une couleur soit
claire, soit foncée. Vous
pouvez aussi utiliser
l'Editeur de couleurs
(Ctrl+E) et choisir une
couleur. Le menu
déroulant situé dans la
partie supérieure de
l'Editeur de couleurs
vous permet de
commander l'édition soit
de la couleur claire, soit
de la couleur foncée.
Vous pouvez rétablir la couleur d'origine d'une photo en cliquant sur la zone hachurée « pas de couleur »,
située à gauche de la ligne de couleurs, ou bien en faisant un clic droit dessus et en sélectionnant l'option
« Rétablir couleur ».
Page 575
Redimensionner, faire tourner et positionner
une photo dans son cadre
Les photos sont considérées comme des rectangles « avec un remplissage bitmap ». La forme de votre
photo est un contour qu'il est possible d'éditer à part entière. Lorsque vous faites une découpe ou que
vous éditez la forme du contour, vous ne touchez pas au remplissage, qui est clippé à l'intérieur de la
forme.
Les photos et les bitmap de la page sont toujours contenus dans une forme de contour extérieure. Vous
pouvez non seulement modifier la forme du contour, mais aussi régler la taille, l'angle et la position de la
photo dans son cadre en utilisant l'Outil de remplissage. Sélectionnez la photo, allez dans l'Outil de
remplissage
et vous verrez des flèches de remplissage partant du centre et allant vers les angles droits (ou bien vous
pouvez aller dans l'Outil de remplissage et cliquer sur la photo à sélectionner).
Par exemple, pour agrandir et faire tourner une photo vers la gauche dans son cadre, sélectionnez l'Outil
de remplissage et faites glisser la pointe d'une des flèches.
 Pour redimensionner, tirez sur la pointe d'une des flèches en partant du centre. Vous pouvez
maintenir la touche Ctrl enfoncée pour contraindre l'angle.
 Pour faire tourner l'image, tirez sur la pointe d'une des flèches autour du centre.
 Pour repositionner l'image, tirez n'importe où sur celle-ci.
Sur la barre d'info de l'Outil de remplissage, vous
pouvez sélectionner l'option « répétition de
carreaux » qui fait de l'image un remplissage
bitmap en forme de carreaux. En tirant sur les
poignées du remplissage, vous pouvez à présent
redimensionner et faire tourner la dimension des
carreaux de l'image. Vous pourrez constater à quel
point Xtreme Web Designer 5 est rapide en
exécutant cette opération avec une image
contenant beaucoup de pixels.
Page 576
Redresser l'horizon
Utiliser l'outil de remplissage comme décrit précédemment, signifie qu'il est très simple de redresser
l'horizon d'une photo.
 Sélectionnez l'Outil de remplissage puis cliquez sur la photo. Les poignées de remplissage seront
alors affichées sous la forme de flèches indiquant l'étendue du remplissage dans la forme.
 Tirez sur l'une des flèches de remplissage pour modifier la taille et faire tourner comme vous le
désirez.
Vous voyez ici un paysage (créé avec la fonctionnalité d'assemblage panoramique) dont l'horizon est
incliné.
Tirez sur l'une des flèches de remplissage pour modifier la taille et faire tourner comme vous le désirez.
Vous pouvez repositionner la photo en tirant sur les poignées centrales des flèches de remplissage ou en
maintenant la touche Maj enfoncée tout en déplaçant l'image à la position désirée.
Page 577
Optimisation de photos et bitmaps
La résolution et la taille des fichiers JPEG d'appareils photo numériques ne cessant d'augmenter, la taille
de votre fichier peut très vite prendre d'énormes proportions s'il contient de nombreuses images. Par
exemple, un document multi-pages comprenant 20 fichiers JPEG à résolution maximum de chacun 5 Mo
produirait un fichier .xar de plus de 100 Mo*.
En outre, ces photos ont souvent une résolution beaucoup trop élevée. Réduire une photo de 8
mégapixels à une image de 2 pouces (5 cm) de large sur la page va produire un fichier de 1500 dpi
environ. Alors qu'une résolution élevée fournit de bien meilleurs résultats pour l'impression (vous pouvez
faire des zoom avant ou élargir certaines parties de la photo), elle est bien trop élevée même pour les
meilleurs standard de qualité des impressions commerciales, et encore plus pour les graphiques destinés à
Internet ou les productions HTML.
Si vous détourez seulement une petite partie de votre image ou découpez un petit bout de la photo, de
grands morceaux de l'image cachée peuvent se trouver en dehors de la zone visible. À des fins d'édition,
cette fonction de détourage en direct est très utile dans la mesure où vous pouvez annuler chaque
opération, modifier la taille, positionner et calibrer chaque élément tout en conservant une grande netteté.
Mais vous désirerez peut-être supprimer les parties invisibles du document final.
La photo du papillon découpée est encore affichée complète. À l'aide de l'outil de remplissage, vous
pouvez visualiser cela encore mieux en modifiant la taille du remplissage dans les contours. Ainsi les
parties se trouvant en dehors du papillon seront superflues dans votre document final.
L'option de menu très utile Services -> Optimiser photo...
propose trois fonctions importantes :
 Suppression des parties invisibles de photos
 Réduction de la résolution de photos
 Conversion de PNG ou bitmaps en JPEG intégrés pour optimiser la taille des fichiers
Lorsque vous sélectionnez cette option de menu pour n'importe quel fichier bitmap, une boîte de dialogue
semblable à la boîte de dialogue d'exportation
va s'afficher. Voici ce qui s'affiche lorsque l'image papillon assemblée est sélectionnée.
Page 578
Un JPEG sera alors créé, en laissant des parties de l'image à l'extérieur de la zone d'assemblage, et
intégré à votre document pour remplacer l'ancienne image. La résolution est également réduite à 96 dpi,
celle que vous voyez lorsque l'affichage est à 100 %, mais vous pouvez la modifier dans l'onglet de la
taille de bitmap de cette boîte de dialogue :
Vous pouvez sélectionner n'importe quelle valeur dpi dans le menu déroulant, pour entrer les valeurs de
largeur et hauteur du bitmap. Pour un affichage sur écran (web ou HTML), il n'est pas nécessaire
d'utiliser une résolution supérieure à 96 dpi. Pour l'impression, une résolution de 300 dpi entraîne une
meilleure qualité des impressions à usage commercial.
Vous pouvez ajuster la
qualité des JPEG de même
que vous pouvez les
exporter en utilisant l'onglet
options.
Important : la fonction « Optimiser photo » est une opération destructive. Lorsque vous sauvegardez le
fichier, les parties de l'image que vous avez supprimées seront perdues et la résolution est modifiée de
manière permanente (vous pouvez naturellement annuler les modifications lorsque le fichier est encore
ouvert en mode édition).
(*Comme mentionné précédemment, avec d'autres logiciels graphiques, le fichier atteindrait facilement 5
ou 10 fois cette taille)
Vous pouvez optimiser plusieurs photos à la fois si vous souhaitez leur attribuer le même dpi.
Sélectionnez les photos que vous souhaitez optimiser puis choisissez l'opération Optimiser comme décrit
plus haut. La boîte de dialogue Optimisation affiche les paramètres et un aperçu de l'une des photos
sélectionnées, mais lorsque vous cliquez sur Optimisation
, la même configuration est appliquée à toutes les photos sélectionnées.
Page 579
Documents photo
Il est parfois utile de travailler sur une photo seule que sur des « Objets dans une page ». On appelle
cela un document photo ou le « mode photo » dans Web Designer, qui se comporte dans ce cas plutôt
comme un outil d'édition photo ordinaire. Vous pouvez créer un docment photo de plusieurs façons :
 Faites glisser le fichier photo de votre explorateur de fichiers vers la barre de titre ou la barre
d'outils Web Designer
 Allez dans Fichiers -> Ouvrir puis sélectionnez un fichier photo
 Créez un document photo vide en allant dans Fichier -> Nouveau -> Photo vide
On reconnaît les documents photo aux caractéristiques suivantes par rapport aux autres documents de
Web Designer :
 Aucune page blanche n'est visible. En fait, les dimensions de la page sont définies
automatiquement pour correspondre à la photo et aux autres objets que vous avez ajoutés.
 Les documents photo ont une grille d'un pixel par défaut et vous pouvez faire s'afficher cette grille
très rapidement. Cela facilite les opérations de découpe.
 Le Pasteboard (la zone autour de la photo) est de couleur sombre. Cela permet de distinguer les
documents photo des documents dessin au premier coup d'oeil.
 Le zoom est défini de sorte que la photo remplisse l'aperçu et l'Outil photo est sélectionné
automatiquement comme outil en cours.
 Si vous tirez d'autres fichiers photo en haut d'une photo existante, cela a pour effet d'ajouter une
nouvelle photo au document au lieu de simplement remplacer la photo dans son cadre. Un zoom
arrière se produira, de façon à ce que vous puissiez voir toute l'image.
 Les images ne sont pas redimensionnées pour faire 500 pixels (comme normalement pour des
documents web), mais sont importées à la même taille de sorte qu'avec un zoom de 100%, vous
puissiez voir l'image en taille entière.
 Les options de lissage des pixels sont modifiées. Le mode d'affichage « Très haute qualité » est
sélectionné par défaut, ce qui est le mieux pour des images réduites ou sur lesquelles un zoom
arrière a été effectué. Le lissage des pixels est désactivé lorsqu'un zoom avant est fait de sorte
que vous pouvez voir que les pixels sont de très grands éléments de zoom.
A tous les autres niveaux, les documents photo se comportent de la même façon que des documents
normaux de Xtreme Web Designer 5. Vous pouvez utiliser tous les outils de dessin et de texte comme
d'habitude. Si vous voulez créer un document photo d'une taille précise, vous pouvez changer la « toile »
ou la taille de la page en sélectionnant Services -> Options et l'onglet Page
, puis entrer les dimensions de votre choix.
Dans documents photo, trois options peuvent à présent être sélectionnées. Les boutons Précédent et
Suivant
vous permettent de vous déplacer vers les pages précédentes ou suivantes du dossier à partir duquel
l'image a été ouverte. L'image en cours sera fermée et on vous demandera donc de sauvegarder le
fichier.
Le zoom 1:1
permet d'ajuster le zoom de façon à ce que l'image sélectionnée soit affichée à sa taille entière,
c'est-à-dire que chaque pixel de l'image correspond à chaque pixel de l'écran.
Page 580
L'outil photo
Dans ce chapitre
Introduction
Utilisation de l'Outil Photo
Optimisation
Recouper ou clipper des images
Comparer et rétablir l'original
Notes à propos de l'Outil photo
Correction des yeux rouges
Assemblage de panoramas
Commandes de rotation à 90°
Page 581
Introduction
L'Outil photo est un moyen direct et très rapide de recouper, d'ajuster les niveaux de luminosité et la
netteté des photos, même pour des images en ultra haute résolution. Cet outil dispose des fonctions
suivantes :
 Optimisation automatique en un clic de vos photos ; particulièrement pratique pour les photos
sous-exposées ou ternes.
 Réglage manuel de la luminosité, du contraste, de la saturation des couleurs, de la température
des couleurs de la photo ainsi que du flou ou de la netteté.
 Recoupe des images. Il s'agit d'une recoupe « en direct », vous pouvez donc annuler des étapes
et régler votre découpe à tout moment.
 Comparaison en un clic, pour observer rapidement les changements effectués.
 Copier/coller facile des éditions d'optimisation entre différentes photos.
Toutes ces opérations sont interactives et sont mises à jour en direct. Quand vous régler les valeurs,
l'image est mise à jour immédiatement. Les opérations sont également non destructrices, c'est-à_dire que
votre original n'est pas modifié et que vous pouvez toujours faire de nouveaux réglages ou les annuler.
De plus, vous trouverez un raccourci pour la fonction anti yeux rouges, et une option automatique de
montage panoramique.
Avantages de l'Outil Photo
Cet outil a trois avantages principaux :
1. Il fonctionne de façon non destructrice
2. Il est très rapide, même pour les énormes images
3. Les étapes d'édition ne requièrent aucune mémoire.
Les avantages expliqués en détail
Le terme Non destructif
signifie que toutes les opérations d'édition n'affectent pas l'image originale. Vous pouvez ajuster ou
supprimer les éditions et l'image d'origine demeure intacte. Le programme diffère en cela de la plupart
des éditeurs photo dans lesquels les modifications sont permanentes. Dans Web Designer vous avez la
possibilité d'ajuster les paramètres autant de fois que vous le souhaitez tout en sachant que vous ne
modifiez pas les données de l'original.
Même la fonction de détourage, appelée ici extraction, est non destructive. Vous pouvez rétablir les
zones découpées et ajuster ou élargir la sélection à tout moment, même après avoir enregistré le fichier.
La vitesse
est un point évident, mais une démonstration intéressante consiste à faire tourner une photo à très haute
résolution. Dans les autres outils, il est normalement nécessaire d'entrer une valeur de degrés et attendre
que le processus soit exécuté. Xtreme Web Designer 5 fonctionne différemment : vous pouvez faire
tourner une photo haute résolution en tirant dessus et en temps réel (ou entrer n'importe quelle valeur de
rotation). Le programme utilise alors un échantillon d'image bi-cubique de grande qualité pour assurer
des résultats dans la meilleure qualité possible.
Le terme aucune mémoire
réfère au fait que la plupart des éditeurs photo doivent garder une copie du bitmap dans la mémoire afin
de pouvoir annuler les modifications et réalisent habituellement une copie pour chaque modification ou
ajustement entrepris. Pour les photos de grande taille et à haute résolution, cela sous-entend qu'un grand
espace mémoire est requis pour l'édition des photos (une photo de 8 Mo requiert par exemple un espace
mémoire de 32 Mo, si vous réalisez 10 manipulations, cela devient 320 Mo d'espace mémoire). Xtreme
Web Designer 5 requiert zéro espace mémoire. Cela signifie que vous pouvez réaliser autant d'édition
que vous le souhaitez, de même que le nombre de copies, sans que ces manipulations requièrent un
Page 582
espace mémoire supplémentaire.
Enfin, les images JPEG sont insérées dans le fichier natif .xar et non étendues en images brutes comme
c'est le cas dans d'autres outils graphiques. Cela signifie que la taille du fichier natif est 10 fois plus petite.
Combinez cela aux copies mémoire zéro, les fonctionnalités d'optimisation en temps réel décrites plus
haut et il est possible d'obtenir des fichiers dont la taille est jusqu'à 30 fois inférieure à celle de fichiers
traités dans d'autres programmes graphiques. Cela signifie également que leur manipulation est beaucoup
plus rapide.
Page 583
Avantages de l'Outil Photo
Cet outil a trois avantages principaux :
1. Il fonctionne de façon non destructrice
2. Il est très rapide, même pour les énormes images
3. Les étapes d'édition ne requièrent aucune mémoire.
Les avantages expliqués en détail
Le terme Non destructif
signifie que toutes les opérations d'édition n'affectent pas l'image originale. Vous pouvez ajuster ou
supprimer les éditions et l'image d'origine demeure intacte. Le programme diffère en cela de la plupart
des éditeurs photo dans lesquels les modifications sont permanentes. Dans Web Designer vous avez la
possibilité d'ajuster les paramètres autant de fois que vous le souhaitez tout en sachant que vous ne
modifiez pas les données de l'original.
Même la fonction de détourage, appelée ici extraction, est non destructive. Vous pouvez rétablir les
zones découpées et ajuster ou élargir la sélection à tout moment, même après avoir enregistré le fichier.
La vitesse
est un point évident, mais une démonstration intéressante consiste à faire tourner une photo à très haute
résolution. Dans les autres outils, il est normalement nécessaire d'entrer une valeur de degrés et attendre
que le processus soit exécuté. Xtreme Web Designer 5 fonctionne différemment : vous pouvez faire
tourner une photo haute résolution en tirant dessus et en temps réel (ou entrer n'importe quelle valeur de
rotation). Le programme utilise alors un échantillon d'image bi-cubique de grande qualité pour assurer
des résultats dans la meilleure qualité possible.
Le terme aucune mémoire
réfère au fait que la plupart des éditeurs photo doivent garder une copie du bitmap dans la mémoire afin
de pouvoir annuler les modifications et réalisent habituellement une copie pour chaque modification ou
ajustement entrepris. Pour les photos de grande taille et à haute résolution, cela sous-entend qu'un grand
espace mémoire est requis pour l'édition des photos (une photo de 8 Mo requiert par exemple un espace
mémoire de 32 Mo, si vous réalisez 10 manipulations, cela devient 320 Mo d'espace mémoire). Xtreme
Web Designer 5 requiert zéro espace mémoire. Cela signifie que vous pouvez réaliser autant d'édition
que vous le souhaitez, de même que le nombre de copies, sans que ces manipulations requièrent un
espace mémoire supplémentaire.
Enfin, les images JPEG sont insérées dans le fichier natif .xar et non étendues en images brutes comme
c'est le cas dans d'autres outils graphiques. Cela signifie que la taille du fichier natif est 10 fois plus petite.
Combinez cela aux copies mémoire zéro, les fonctionnalités d'optimisation en temps réel décrites plus
haut et il est possible d'obtenir des fichiers dont la taille est jusqu'à 30 fois inférieure à celle de fichiers
traités dans d'autres programmes graphiques. Cela signifie également que leur manipulation est beaucoup
plus rapide.
Page 584
Les avantages expliqués en détail
Le terme Non destructif
signifie que toutes les opérations d'édition n'affectent pas l'image originale. Vous pouvez ajuster ou
supprimer les éditions et l'image d'origine demeure intacte. Le programme diffère en cela de la plupart
des éditeurs photo dans lesquels les modifications sont permanentes. Dans Web Designer vous avez la
possibilité d'ajuster les paramètres autant de fois que vous le souhaitez tout en sachant que vous ne
modifiez pas les données de l'original.
Même la fonction de détourage, appelée ici extraction, est non destructive. Vous pouvez rétablir les
zones découpées et ajuster ou élargir la sélection à tout moment, même après avoir enregistré le fichier.
La vitesse
est un point évident, mais une démonstration intéressante consiste à faire tourner une photo à très haute
résolution. Dans les autres outils, il est normalement nécessaire d'entrer une valeur de degrés et attendre
que le processus soit exécuté. Xtreme Web Designer 5 fonctionne différemment : vous pouvez faire
tourner une photo haute résolution en tirant dessus et en temps réel (ou entrer n'importe quelle valeur de
rotation). Le programme utilise alors un échantillon d'image bi-cubique de grande qualité pour assurer
des résultats dans la meilleure qualité possible.
Le terme aucune mémoire
réfère au fait que la plupart des éditeurs photo doivent garder une copie du bitmap dans la mémoire afin
de pouvoir annuler les modifications et réalisent habituellement une copie pour chaque modification ou
ajustement entrepris. Pour les photos de grande taille et à haute résolution, cela sous-entend qu'un grand
espace mémoire est requis pour l'édition des photos (une photo de 8 Mo requiert par exemple un espace
mémoire de 32 Mo, si vous réalisez 10 manipulations, cela devient 320 Mo d'espace mémoire). Xtreme
Web Designer 5 requiert zéro espace mémoire. Cela signifie que vous pouvez réaliser autant d'édition
que vous le souhaitez, de même que le nombre de copies, sans que ces manipulations requièrent un
espace mémoire supplémentaire.
Enfin, les images JPEG sont insérées dans le fichier natif .xar et non étendues en images brutes comme
c'est le cas dans d'autres outils graphiques. Cela signifie que la taille du fichier natif est 10 fois plus petite.
Combinez cela aux copies mémoire zéro, les fonctionnalités d'optimisation en temps réel décrites plus
haut et il est possible d'obtenir des fichiers dont la taille est jusqu'à 30 fois inférieure à celle de fichiers
traités dans d'autres programmes graphiques. Cela signifie également que leur manipulation est beaucoup
plus rapide.
Page 585
Utilisation de l'Outil Photo
Sélectionnez l'Outil photo dans la barre d'outils principale pour entrer
dans l'Outil photo. Si vous vous trouvez dans l'Outil de sélection
, faites un double clic sur une photo pour basculer vers l'Outil photo.
La barre d'information de l'outil photo s'affiche.
L'outil photo dispose de deux modes :
Le Mode optimisation
, dans lequel un ensemble de commandes vous permet de régler la
luminosité, le contraste, la saturation, la température de la couleur ainsi
que le flou ou la netteté (montré ci-dessus).
Un deuxième mode, que vous sélectionnez grâce au deuxième icone sur
le côté gauche de la barre d'info, active l'Outil de recoupe interactif.
En mode recoupe, la barre d'info change d'apparence :
Sept icones restent communs aux deux modes et vous donnent accès aux fonctions anti yeux rouges,
montage de panorama, rotation de 90°, image suivante/précédente et zoom. Ces fonctions sont décrite
ci-dessus.
Page 586
Optimisation
Ajustement manuel de la luminosité, du contraste, de la saturation des couleurs et de la netteté des
photos.
Lorsque vous sélectionnez l'outil Photo pour la première fois, il se trouve en mode optimisation, ce qui
signifie que les commandes permettent d'ajuster la luminosité, le contraste, la saturation et le flou/la
netteté. Vous pouvez au choix entrer des valeurs directement dans les champs de texte ou utiliser une
petite réglette du menu contextuel pour ajuster les valeurs.
Réglette du menu contextuel
Vous pouvez utiliser les réglettes de deux manières différentes :
1. Cliquez et relâchez la flèche du menu. La réglette de contrôle reste alors sur l'écran et vous
pouvez ajuster les valeurs aussi souvent que vous le souhaitez en déplaçant la réglette. Vous
pouvez également, lorsque la souris est placée sur la commande, utiliser la molette de la souris
pour réaliser de petits ajustements vers le haut ou le bas. La réglette disparaîtra de l'écran lorsque
vous cliquez sur n'importe quel autre endroit du document.
2. Vous pouvez également maintenir le bouton de souris appuyé et déplacer la réglette pour ajuster
la valeur. Lorsque vous relâchez la souris, le menu contextuel disparaît. Ce procédé est
légèrement plus rapide puisqu'il ne requiert qu'un clic et relâcher pour modifier les valeurs.
Optimisation automatique
La fonction Optimiser analyse la luminosité et le contraste de l'image et les ajuste automatiquement pour
obtenir la meilleure image possible. Cette fonction est particulièrement efficace sur les photos
sous-exposées (foncées). Après avoir appliqué l'optimisation automatique à une photo, vous pouvez
ajuster les valeurs sélectionnées, en utilisant les commandes sur la droite du bouton d'optimisation. En
cliquant sur Comparer
, vous pourrez rétablir l'original, en cliquant à nouveau, la version optimisée est à nouveau affichée.
Luminosité/Contraste/Température de la couleur/Saturation
Luminosit
Contrast
Saturation
Température de la
é
e
couleur
L'image change lorsque vous modifiez ces valeurs. La saturation modifie l'intensité de la couleur. A -100,
le minimum, votre image devient noire et blanche. Le contrôle de température de la couleur rend une
image « chaude » ou « froide ».
Flou / Netteté
Cette commande permet de flouer l'image lorsqu'elle se trouve en-dessous
de zéro et de rendre l'image plus nette lorsqu'elle est supérieure à zéro.
Nous recommandons d'utiliser uniquement des valeurs faibles pour la
netteté et uniquement sur des photos dont la taille a été réduite de manière
importante.
Page 587
Réglette du menu contextuel
Vous pouvez utiliser les réglettes de deux manières différentes :
1. Cliquez et relâchez la flèche du menu. La réglette de contrôle reste alors sur l'écran et vous
pouvez ajuster les valeurs aussi souvent que vous le souhaitez en déplaçant la réglette. Vous
pouvez également, lorsque la souris est placée sur la commande, utiliser la molette de la souris
pour réaliser de petits ajustements vers le haut ou le bas. La réglette disparaîtra de l'écran lorsque
vous cliquez sur n'importe quel autre endroit du document.
2. Vous pouvez également maintenir le bouton de souris appuyé et déplacer la réglette pour ajuster
la valeur. Lorsque vous relâchez la souris, le menu contextuel disparaît. Ce procédé est
légèrement plus rapide puisqu'il ne requiert qu'un clic et relâcher pour modifier les valeurs.
Optimisation automatique
La fonction Optimiser analyse la luminosité et le contraste de l'image et les ajuste automatiquement pour
obtenir la meilleure image possible. Cette fonction est particulièrement efficace sur les photos
sous-exposées (foncées). Après avoir appliqué l'optimisation automatique à une photo, vous pouvez
ajuster les valeurs sélectionnées, en utilisant les commandes sur la droite du bouton d'optimisation. En
cliquant sur Comparer
, vous pourrez rétablir l'original, en cliquant à nouveau, la version optimisée est à nouveau affichée.
Luminosité/Contraste/Température de la couleur/Saturation
Luminosit
Contrast
Saturation
Température de la
é
e
couleur
L'image change lorsque vous modifiez ces valeurs. La saturation modifie l'intensité de la couleur. A -100,
le minimum, votre image devient noire et blanche. Le contrôle de température de la couleur rend une
image « chaude » ou « froide ».
Flou / Netteté
Cette commande permet de flouer l'image lorsqu'elle se trouve en-dessous
de zéro et de rendre l'image plus nette lorsqu'elle est supérieure à zéro.
Nous recommandons d'utiliser uniquement des valeurs faibles pour la
netteté et uniquement sur des photos dont la taille a été réduite de manière
importante.
Page 588
Optimisation automatique
La fonction Optimiser analyse la luminosité et le contraste de l'image et les ajuste automatiquement pour
obtenir la meilleure image possible. Cette fonction est particulièrement efficace sur les photos
sous-exposées (foncées). Après avoir appliqué l'optimisation automatique à une photo, vous pouvez
ajuster les valeurs sélectionnées, en utilisant les commandes sur la droite du bouton d'optimisation. En
cliquant sur Comparer
, vous pourrez rétablir l'original, en cliquant à nouveau, la version optimisée est à nouveau affichée.
Luminosité/Contraste/Température de la couleur/Saturation
Luminosit
Contrast
Saturation
Température de la
é
e
couleur
L'image change lorsque vous modifiez ces valeurs. La saturation modifie l'intensité de la couleur. A -100,
le minimum, votre image devient noire et blanche. Le contrôle de température de la couleur rend une
image « chaude » ou « froide ».
Flou / Netteté
Cette commande permet de flouer l'image lorsqu'elle se trouve en-dessous
de zéro et de rendre l'image plus nette lorsqu'elle est supérieure à zéro.
Nous recommandons d'utiliser uniquement des valeurs faibles pour la
netteté et uniquement sur des photos dont la taille a été réduite de manière
importante.
Page 589
Luminosité/Contraste/Température de la couleur/Saturation
Luminosit
Contrast
Saturation
Température de la
é
e
couleur
L'image change lorsque vous modifiez ces valeurs. La saturation modifie l'intensité de la couleur. A -100,
le minimum, votre image devient noire et blanche. Le contrôle de température de la couleur rend une
image « chaude » ou « froide ».
Flou / Netteté
Cette commande permet de flouer l'image lorsqu'elle se trouve en-dessous
de zéro et de rendre l'image plus nette lorsqu'elle est supérieure à zéro.
Nous recommandons d'utiliser uniquement des valeurs faibles pour la
netteté et uniquement sur des photos dont la taille a été réduite de manière
importante.
Page 590
Flou / Netteté
Cette commande permet de flouer l'image lorsqu'elle se trouve en-dessous
de zéro et de rendre l'image plus nette lorsqu'elle est supérieure à zéro.
Nous recommandons d'utiliser uniquement des valeurs faibles pour la
netteté et uniquement sur des photos dont la taille a été réduite de manière
importante.
Page 591
Recouper ou clipper des images
Le moyen le plus simple de clipper une photo est de commencer à tirer sur ou en travers de la photo
après avoir sélectionné l'Outil photo. Le clipping se fait immédiatement, une fois que vous avez relâché le
bouton de la souris. La photo clippée qui en résulte possède maintenant des poignées qui vous serviront
à régler les bordures du clip.
Ceci est une opération non destructrice ; vous pouvez donc ajuster la zone du clip une fois que vous avez
recoupé l'image et même annuler l'opération pour récupérer l'image en entier. En fait, on peut dire que
seuls les contours sont modifiés, et que l'image reste clippée à l'intérieur du contour rectangulaire. C'est
pourquoi on l'appelle un clip, et non une découpe, bien que le bt soit le même que celui d'un outil de
découpe traditionnel.
Vous pouvez sinon entrer en mode Clip
via l'icone de la barre d'info de l'Outil photo. Vous trouverez ici tout un choix d'autres options de
recoupe. Vous pouvez saisir des valeurs exactes en pixels et faire votre choix parmi différentes
proportions de recoupe.
Pour découvrir le clipping interactif ainsi que d'autres options
supplémentaires relatives aux proportions, basculez en mode Clip avec
le bouton Outil clip
.
La barre d'info est modifiée de la façon suivante :
Lorsque vous faites glisser la photo, le rectangle du clip est mis en surbrillance.
 Vous pouvez régler la zone en tirant sur les coins ou les poignées de côté
 Vous pouvez déplacer la zone simplement en faisant glisser l'intérieur de la zone du clip
 Choisissez le bouton clip ou faites simplement un double clic à l'intérieur de la zone du clip pour
effectuer l'opération de clip.
Vous pouvez voir si une photo a ou non été clippée en regardant la barre de statut qui indiquera par
exemple « photo clippée ».
Effacer
Page 592
Cliquez sur Effacer
ou en dehors de la région d'extraction sélectionné pour effacer le rectangle d'extrait actuel.
Règle des trois tiers
Il existe une règle de composition des photographies appelée la règle des trois tiers. Cela consiste à
placer des objets clés dans vos photos aux tiers de vos photos. Par exemple, il est souvent plus indiqué
de placer l'horizon à un tiers de la photo plutôt qu'au centre. Lorsque vous déplacez un extrait d'image
sur l'une de vos photos, des lignes placées aux tiers de l'image s'affichent pour vous aider à positionner
les objets suivant ces règles de composition.
Astuce : pour en savoir plus, cherchez
dans Google « Règle des trois tiers »
Annuler extrait
Cliquez sur Annuler
extrait pour rétablir la photo originale. Le rectangle d'extraction est alors rétabli et vous pouvez l'ajuster
ou le supprimer en cliquant en-dehors.
Ajuster la région extrait
Comme le bouton Annuler
extrait permet de rétablir le rectangle d'extraction (la zone autour est grisée), il est très simple de
procéder à des ajustements détaillés. Il suffit de sélectionner la photo, de cliquer sur Annuler extrait et
d'ajuster les côtés du rectangle. Effectuez un double clic dans la photo pour réaliser l'extrait à nouveau.
Largeur / hauteur
Après avoir dessiné un rectangle d'extraction, vous pouvez entrer les valeurs directement dans les
champs de largeur et hauteur dans la barre d'infos pour définir les dimensions exactes du rectangle.
Verrouiller ratio
Cochez la case Vérouiller ratio pour maintenir le rectangle de détourage à un ratio spécifique lorsque
vous tirez en déplaçant dans le document. Les boutons de ratio sur la droite de la case à cocher
déterminent le ratio utilisé. Sélectionnez Actuel
pour conserver le ratio d'aspect de la photo avant détourage. Veuillez noter que le rectangle passe
automatiquement du format paysage au format portrait lorsque vous tirez sur l'un des angles. Ainsi, si
vous tirez vers un côté, il aura tendance à prendre la forme du format paysage. Si vous tirez plutôt vers le
bas, le rectangle prendra la forme portrait.
Les ratios d'aspect de détourage ou extraction communs disponibles sont 4:3 (la plupart des appareils
photo numériques et les téléviseurs et écrans anciens), 3:2 (les caméscopes traditionnels et les appareils
photo numériques SLR haute qualité) et enfin 16:9 (le ratio d'aspect des téléviseurs écran large).
Vous pouvez redéfinir l'option d'aspect de ratio en utilisant la touche Ctrl lorsque vous tirez. Ainsi, si vous
tirez sur le rectangle (ou que vous l'ajustez) sans avoir verrouillé le ratio, vous pouvez quand même
vérouiller le ratio comme le dernier ratio sélectionné en maintenant la touche Ctrl enfoncée. De la même
manière, si l'option Vérouiller ratio est activée, vous pouvez temporairement débloquer le ratio en
maintenant la touche Ctrl appuyée.
Rognage dans les documents photo
En mode photo, il existe une grille un pixel appliquée à la photo (lorsqu'il se trouve à 96 dpi, la résolution
standard) et que le rectangle de détourage est accroché à la grille. Cela simplifie énormément une
extraction très précise. Pour réaliser des ajustements très précis au pixel près, il est recommandé
Page 593
d'opérer en mode photo et de zoomer afin de voir les pixels clairement.
Pour obtenir de plus amples informations, consultez le paragraphe Documents photo.
Page 594
Effacer
Cliquez sur Effacer
ou en dehors de la région d'extraction sélectionné pour effacer le rectangle d'extrait actuel.
Règle des trois tiers
Il existe une règle de composition des photographies appelée la règle des trois tiers. Cela consiste à
placer des objets clés dans vos photos aux tiers de vos photos. Par exemple, il est souvent plus indiqué
de placer l'horizon à un tiers de la photo plutôt qu'au centre. Lorsque vous déplacez un extrait d'image
sur l'une de vos photos, des lignes placées aux tiers de l'image s'affichent pour vous aider à positionner
les objets suivant ces règles de composition.
Astuce : pour en savoir plus, cherchez
dans Google « Règle des trois tiers »
Annuler extrait
Cliquez sur Annuler
extrait pour rétablir la photo originale. Le rectangle d'extraction est alors rétabli et vous pouvez l'ajuster
ou le supprimer en cliquant en-dehors.
Ajuster la région extrait
Comme le bouton Annuler
extrait permet de rétablir le rectangle d'extraction (la zone autour est grisée), il est très simple de
procéder à des ajustements détaillés. Il suffit de sélectionner la photo, de cliquer sur Annuler extrait et
d'ajuster les côtés du rectangle. Effectuez un double clic dans la photo pour réaliser l'extrait à nouveau.
Largeur / hauteur
Après avoir dessiné un rectangle d'extraction, vous pouvez entrer les valeurs directement dans les
champs de largeur et hauteur dans la barre d'infos pour définir les dimensions exactes du rectangle.
Verrouiller ratio
Cochez la case Vérouiller ratio pour maintenir le rectangle de détourage à un ratio spécifique lorsque
vous tirez en déplaçant dans le document. Les boutons de ratio sur la droite de la case à cocher
déterminent le ratio utilisé. Sélectionnez Actuel
pour conserver le ratio d'aspect de la photo avant détourage. Veuillez noter que le rectangle passe
automatiquement du format paysage au format portrait lorsque vous tirez sur l'un des angles. Ainsi, si
vous tirez vers un côté, il aura tendance à prendre la forme du format paysage. Si vous tirez plutôt vers le
bas, le rectangle prendra la forme portrait.
Les ratios d'aspect de détourage ou extraction communs disponibles sont 4:3 (la plupart des appareils
photo numériques et les téléviseurs et écrans anciens), 3:2 (les caméscopes traditionnels et les appareils
photo numériques SLR haute qualité) et enfin 16:9 (le ratio d'aspect des téléviseurs écran large).
Vous pouvez redéfinir l'option d'aspect de ratio en utilisant la touche Ctrl lorsque vous tirez. Ainsi, si vous
tirez sur le rectangle (ou que vous l'ajustez) sans avoir verrouillé le ratio, vous pouvez quand même
vérouiller le ratio comme le dernier ratio sélectionné en maintenant la touche Ctrl enfoncée. De la même
manière, si l'option Vérouiller ratio est activée, vous pouvez temporairement débloquer le ratio en
maintenant la touche Ctrl appuyée.
Rognage dans les documents photo
En mode photo, il existe une grille un pixel appliquée à la photo (lorsqu'il se trouve à 96 dpi, la résolution
Page 595
standard) et que le rectangle de détourage est accroché à la grille. Cela simplifie énormément une
extraction très précise. Pour réaliser des ajustements très précis au pixel près, il est recommandé
d'opérer en mode photo et de zoomer afin de voir les pixels clairement.
Pour obtenir de plus amples informations, consultez le paragraphe Documents photo.
Page 596
Règle des trois tiers
Il existe une règle de composition des photographies appelée la règle des trois tiers. Cela consiste à
placer des objets clés dans vos photos aux tiers de vos photos. Par exemple, il est souvent plus indiqué
de placer l'horizon à un tiers de la photo plutôt qu'au centre. Lorsque vous déplacez un extrait d'image
sur l'une de vos photos, des lignes placées aux tiers de l'image s'affichent pour vous aider à positionner
les objets suivant ces règles de composition.
Astuce : pour en savoir plus, cherchez
dans Google « Règle des trois tiers »
Annuler extrait
Cliquez sur Annuler
extrait pour rétablir la photo originale. Le rectangle d'extraction est alors rétabli et vous pouvez l'ajuster
ou le supprimer en cliquant en-dehors.
Ajuster la région extrait
Comme le bouton Annuler
extrait permet de rétablir le rectangle d'extraction (la zone autour est grisée), il est très simple de
procéder à des ajustements détaillés. Il suffit de sélectionner la photo, de cliquer sur Annuler extrait et
d'ajuster les côtés du rectangle. Effectuez un double clic dans la photo pour réaliser l'extrait à nouveau.
Largeur / hauteur
Après avoir dessiné un rectangle d'extraction, vous pouvez entrer les valeurs directement dans les
champs de largeur et hauteur dans la barre d'infos pour définir les dimensions exactes du rectangle.
Verrouiller ratio
Cochez la case Vérouiller ratio pour maintenir le rectangle de détourage à un ratio spécifique lorsque
vous tirez en déplaçant dans le document. Les boutons de ratio sur la droite de la case à cocher
déterminent le ratio utilisé. Sélectionnez Actuel
pour conserver le ratio d'aspect de la photo avant détourage. Veuillez noter que le rectangle passe
automatiquement du format paysage au format portrait lorsque vous tirez sur l'un des angles. Ainsi, si
vous tirez vers un côté, il aura tendance à prendre la forme du format paysage. Si vous tirez plutôt vers le
bas, le rectangle prendra la forme portrait.
Les ratios d'aspect de détourage ou extraction communs disponibles sont 4:3 (la plupart des appareils
photo numériques et les téléviseurs et écrans anciens), 3:2 (les caméscopes traditionnels et les appareils
photo numériques SLR haute qualité) et enfin 16:9 (le ratio d'aspect des téléviseurs écran large).
Vous pouvez redéfinir l'option d'aspect de ratio en utilisant la touche Ctrl lorsque vous tirez. Ainsi, si vous
tirez sur le rectangle (ou que vous l'ajustez) sans avoir verrouillé le ratio, vous pouvez quand même
vérouiller le ratio comme le dernier ratio sélectionné en maintenant la touche Ctrl enfoncée. De la même
manière, si l'option Vérouiller ratio est activée, vous pouvez temporairement débloquer le ratio en
maintenant la touche Ctrl appuyée.
Rognage dans les documents photo
En mode photo, il existe une grille un pixel appliquée à la photo (lorsqu'il se trouve à 96 dpi, la résolution
standard) et que le rectangle de détourage est accroché à la grille. Cela simplifie énormément une
extraction très précise. Pour réaliser des ajustements très précis au pixel près, il est recommandé
d'opérer en mode photo et de zoomer afin de voir les pixels clairement.
Pour obtenir de plus amples informations, consultez le paragraphe Documents photo.
Page 597
Annuler extrait
Cliquez sur Annuler
extrait pour rétablir la photo originale. Le rectangle d'extraction est alors rétabli et vous pouvez l'ajuster
ou le supprimer en cliquant en-dehors.
Ajuster la région extrait
Comme le bouton Annuler
extrait permet de rétablir le rectangle d'extraction (la zone autour est grisée), il est très simple de
procéder à des ajustements détaillés. Il suffit de sélectionner la photo, de cliquer sur Annuler extrait et
d'ajuster les côtés du rectangle. Effectuez un double clic dans la photo pour réaliser l'extrait à nouveau.
Largeur / hauteur
Après avoir dessiné un rectangle d'extraction, vous pouvez entrer les valeurs directement dans les
champs de largeur et hauteur dans la barre d'infos pour définir les dimensions exactes du rectangle.
Verrouiller ratio
Cochez la case Vérouiller ratio pour maintenir le rectangle de détourage à un ratio spécifique lorsque
vous tirez en déplaçant dans le document. Les boutons de ratio sur la droite de la case à cocher
déterminent le ratio utilisé. Sélectionnez Actuel
pour conserver le ratio d'aspect de la photo avant détourage. Veuillez noter que le rectangle passe
automatiquement du format paysage au format portrait lorsque vous tirez sur l'un des angles. Ainsi, si
vous tirez vers un côté, il aura tendance à prendre la forme du format paysage. Si vous tirez plutôt vers le
bas, le rectangle prendra la forme portrait.
Les ratios d'aspect de détourage ou extraction communs disponibles sont 4:3 (la plupart des appareils
photo numériques et les téléviseurs et écrans anciens), 3:2 (les caméscopes traditionnels et les appareils
photo numériques SLR haute qualité) et enfin 16:9 (le ratio d'aspect des téléviseurs écran large).
Vous pouvez redéfinir l'option d'aspect de ratio en utilisant la touche Ctrl lorsque vous tirez. Ainsi, si vous
tirez sur le rectangle (ou que vous l'ajustez) sans avoir verrouillé le ratio, vous pouvez quand même
vérouiller le ratio comme le dernier ratio sélectionné en maintenant la touche Ctrl enfoncée. De la même
manière, si l'option Vérouiller ratio est activée, vous pouvez temporairement débloquer le ratio en
maintenant la touche Ctrl appuyée.
Rognage dans les documents photo
En mode photo, il existe une grille un pixel appliquée à la photo (lorsqu'il se trouve à 96 dpi, la résolution
standard) et que le rectangle de détourage est accroché à la grille. Cela simplifie énormément une
extraction très précise. Pour réaliser des ajustements très précis au pixel près, il est recommandé
d'opérer en mode photo et de zoomer afin de voir les pixels clairement.
Pour obtenir de plus amples informations, consultez le paragraphe Documents photo.
Page 598
Ajuster la région extrait
Comme le bouton Annuler
extrait permet de rétablir le rectangle d'extraction (la zone autour est grisée), il est très simple de
procéder à des ajustements détaillés. Il suffit de sélectionner la photo, de cliquer sur Annuler extrait et
d'ajuster les côtés du rectangle. Effectuez un double clic dans la photo pour réaliser l'extrait à nouveau.
Largeur / hauteur
Après avoir dessiné un rectangle d'extraction, vous pouvez entrer les valeurs directement dans les
champs de largeur et hauteur dans la barre d'infos pour définir les dimensions exactes du rectangle.
Verrouiller ratio
Cochez la case Vérouiller ratio pour maintenir le rectangle de détourage à un ratio spécifique lorsque
vous tirez en déplaçant dans le document. Les boutons de ratio sur la droite de la case à cocher
déterminent le ratio utilisé. Sélectionnez Actuel
pour conserver le ratio d'aspect de la photo avant détourage. Veuillez noter que le rectangle passe
automatiquement du format paysage au format portrait lorsque vous tirez sur l'un des angles. Ainsi, si
vous tirez vers un côté, il aura tendance à prendre la forme du format paysage. Si vous tirez plutôt vers le
bas, le rectangle prendra la forme portrait.
Les ratios d'aspect de détourage ou extraction communs disponibles sont 4:3 (la plupart des appareils
photo numériques et les téléviseurs et écrans anciens), 3:2 (les caméscopes traditionnels et les appareils
photo numériques SLR haute qualité) et enfin 16:9 (le ratio d'aspect des téléviseurs écran large).
Vous pouvez redéfinir l'option d'aspect de ratio en utilisant la touche Ctrl lorsque vous tirez. Ainsi, si vous
tirez sur le rectangle (ou que vous l'ajustez) sans avoir verrouillé le ratio, vous pouvez quand même
vérouiller le ratio comme le dernier ratio sélectionné en maintenant la touche Ctrl enfoncée. De la même
manière, si l'option Vérouiller ratio est activée, vous pouvez temporairement débloquer le ratio en
maintenant la touche Ctrl appuyée.
Rognage dans les documents photo
En mode photo, il existe une grille un pixel appliquée à la photo (lorsqu'il se trouve à 96 dpi, la résolution
standard) et que le rectangle de détourage est accroché à la grille. Cela simplifie énormément une
extraction très précise. Pour réaliser des ajustements très précis au pixel près, il est recommandé
d'opérer en mode photo et de zoomer afin de voir les pixels clairement.
Pour obtenir de plus amples informations, consultez le paragraphe Documents photo.
Page 599
Largeur / hauteur
Après avoir dessiné un rectangle d'extraction, vous pouvez entrer les valeurs directement dans les
champs de largeur et hauteur dans la barre d'infos pour définir les dimensions exactes du rectangle.
Verrouiller ratio
Cochez la case Vérouiller ratio pour maintenir le rectangle de détourage à un ratio spécifique lorsque
vous tirez en déplaçant dans le document. Les boutons de ratio sur la droite de la case à cocher
déterminent le ratio utilisé. Sélectionnez Actuel
pour conserver le ratio d'aspect de la photo avant détourage. Veuillez noter que le rectangle passe
automatiquement du format paysage au format portrait lorsque vous tirez sur l'un des angles. Ainsi, si
vous tirez vers un côté, il aura tendance à prendre la forme du format paysage. Si vous tirez plutôt vers le
bas, le rectangle prendra la forme portrait.
Les ratios d'aspect de détourage ou extraction communs disponibles sont 4:3 (la plupart des appareils
photo numériques et les téléviseurs et écrans anciens), 3:2 (les caméscopes traditionnels et les appareils
photo numériques SLR haute qualité) et enfin 16:9 (le ratio d'aspect des téléviseurs écran large).
Vous pouvez redéfinir l'option d'aspect de ratio en utilisant la touche Ctrl lorsque vous tirez. Ainsi, si vous
tirez sur le rectangle (ou que vous l'ajustez) sans avoir verrouillé le ratio, vous pouvez quand même
vérouiller le ratio comme le dernier ratio sélectionné en maintenant la touche Ctrl enfoncée. De la même
manière, si l'option Vérouiller ratio est activée, vous pouvez temporairement débloquer le ratio en
maintenant la touche Ctrl appuyée.
Rognage dans les documents photo
En mode photo, il existe une grille un pixel appliquée à la photo (lorsqu'il se trouve à 96 dpi, la résolution
standard) et que le rectangle de détourage est accroché à la grille. Cela simplifie énormément une
extraction très précise. Pour réaliser des ajustements très précis au pixel près, il est recommandé
d'opérer en mode photo et de zoomer afin de voir les pixels clairement.
Pour obtenir de plus amples informations, consultez le paragraphe Documents photo.
Page 600
Verrouiller ratio
Cochez la case Vérouiller ratio pour maintenir le rectangle de détourage à un ratio spécifique lorsque
vous tirez en déplaçant dans le document. Les boutons de ratio sur la droite de la case à cocher
déterminent le ratio utilisé. Sélectionnez Actuel
pour conserver le ratio d'aspect de la photo avant détourage. Veuillez noter que le rectangle passe
automatiquement du format paysage au format portrait lorsque vous tirez sur l'un des angles. Ainsi, si
vous tirez vers un côté, il aura tendance à prendre la forme du format paysage. Si vous tirez plutôt vers le
bas, le rectangle prendra la forme portrait.
Les ratios d'aspect de détourage ou extraction communs disponibles sont 4:3 (la plupart des appareils
photo numériques et les téléviseurs et écrans anciens), 3:2 (les caméscopes traditionnels et les appareils
photo numériques SLR haute qualité) et enfin 16:9 (le ratio d'aspect des téléviseurs écran large).
Vous pouvez redéfinir l'option d'aspect de ratio en utilisant la touche Ctrl lorsque vous tirez. Ainsi, si vous
tirez sur le rectangle (ou que vous l'ajustez) sans avoir verrouillé le ratio, vous pouvez quand même
vérouiller le ratio comme le dernier ratio sélectionné en maintenant la touche Ctrl enfoncée. De la même
manière, si l'option Vérouiller ratio est activée, vous pouvez temporairement débloquer le ratio en
maintenant la touche Ctrl appuyée.
Rognage dans les documents photo
En mode photo, il existe une grille un pixel appliquée à la photo (lorsqu'il se trouve à 96 dpi, la résolution
standard) et que le rectangle de détourage est accroché à la grille. Cela simplifie énormément une
extraction très précise. Pour réaliser des ajustements très précis au pixel près, il est recommandé
d'opérer en mode photo et de zoomer afin de voir les pixels clairement.
Pour obtenir de plus amples informations, consultez le paragraphe Documents photo.
Page 601
Rognage dans les documents photo
En mode photo, il existe une grille un pixel appliquée à la photo (lorsqu'il se trouve à 96 dpi, la résolution
standard) et que le rectangle de détourage est accroché à la grille. Cela simplifie énormément une
extraction très précise. Pour réaliser des ajustements très précis au pixel près, il est recommandé
d'opérer en mode photo et de zoomer afin de voir les pixels clairement.
Pour obtenir de plus amples informations, consultez le paragraphe Documents photo.
Page 602
Comparer et rétablir l'original
Le bouton Comparer peut être utilisé pour réinitialiser toutes les valeurs des Outils d'optimisation
à leur valeur par défaut, ce qui fera revenir votre photo à son état original. Si vous appuyez une
deuxième fois sur le bouton de comparaison, les valeurs seront rétablies. Vous pouvez donc utilisez le
bouton de comparaison pour basculer rapidement entre votre photo éditée et votre photo originale, afin
de pouvoir observer les effets des changements que vous avez effectués.
Etant donné que toutes les modifications sont non destructrices, le fait d'appuyer sur le bouton de
comparaison ne fait qu'enlever les éléments faisant partie des améliorations, rétablissant ainsi l'image à
son état original. Le bouton de comparaison peut être utilisé à tout moment après que des modifications
ont été apportées à une image.
Page 603
Notes à propos de l'Outil photo
1. Vous pouvez sélectionner différentes photos simplement en cliquant dessus lorsque vous utilisez
l'Outil photo. Cela fonctionne aussi pour des photos se trouvant dans des groupes.
2. Si vous cliquez et tirez sur une photo, tout en étant dans l'outil photo, une recoupe commence à
s'effectuer sur la photo sur laquelle vous commencez à tirer. Ou bien, si vous commencez à tirer
sur l'arrière-plan, la recoupe s'appliquera à la première photo que vous toucherez pendant que
vous tirez.
3. Le bouton De-clip sert à modifier le contour de n'importe quelle photo clippée, ainsi que les
formes créées arbitrairement contenant un remplissage bitmap, en un contour rectangulaire autour
de la photo ou du bitmap de remplissage entiers. On vous demandera peut-être de sélectionner
le bouton Supprimer pour effacer le rectangle de recoupe (ou de cliquer en dehors du rectangle).
4. Vous pouvez complètement annuler toutes les opérations effectuées sur les photos. La photo
originale n'est jamais modifiée, contrairement à ce qui se passe lors de l'utilisation d'autres outils
d'édition photo ou de pixels. Vous pouvez donc faire tous les changements que vous voulez,
aussi souvent que vous voulez, et enregistrer et charger des fichiers .xar aussi souvent que vous
voulez, votre image ne sera jamais détériorée (toutes les opérations sont non destructrices et se
font sans pertes). De plus, la taille du fichier n'augmente pas.
5. Toutes les options de l'Outil photo, y compris la commande de niveaux, agissent sur des objets
au remplissage bitmap, ainsi que sur des photos seules.
6. Pour enregistrer une photo, utilisez l'option Exporter et non Enregistrer (car celle-ci ne
sauvegarde que des fichiers au format propriétaire .web). Vous trouverez un raccourci de
sauvegarde au format JPEG dans la barre du haut.
Page 604
Correction des yeux rouges
La barre d'info de l'Outil photo possède un raccourci qui vous permet d'arriver dans un outil
indépendant de correction des yeux rouges. Cela lance l'Outil Xara Picture Editor (XPE).
Correction des yeux rouges dans XPE (Xara Picture Editor)




Sélectionnez la photo et cliquez sur le bouton yeux rouges
dans la barre d'outil photo. L'éditeur photo XPE est alors
démarré.
Réalisez un zoom avant sur le visage afin de voir clairement les yeux. Le plus simple est encore
de sélectionner l'icône magnifier et de tirer sur le visage pour zoomer.
Sélectionnez l'icône de l'outil yeux rouges et cliquez dans le centre de l'oeil puis tirez vers
l'extérieur.
Sélectionnez l'icône large de contrôle pour sauvegarder les modifications en retournant dans
Xtreme.
Page 605
Correction des yeux rouges dans XPE (Xara Picture Editor)




Sélectionnez la photo et cliquez sur le bouton yeux rouges
dans la barre d'outil photo. L'éditeur photo XPE est alors
démarré.
Réalisez un zoom avant sur le visage afin de voir clairement les yeux. Le plus simple est encore
de sélectionner l'icône magnifier et de tirer sur le visage pour zoomer.
Sélectionnez l'icône de l'outil yeux rouges et cliquez dans le centre de l'oeil puis tirez vers
l'extérieur.
Sélectionnez l'icône large de contrôle pour sauvegarder les modifications en retournant dans
Xtreme.
Page 606
Assemblage de panoramas
Si vous avez installé un Panorama Studio indépendant, Xtreme Web
Designer 5 peut le lancer pour inclure un outil qui assemble
automatiquement les photos afin de créer un panorama en haute
résolution (avec jusqu'à 6 photos).
Cliquez sur le lien En savoir plus dans la boîte de dialogue pour savoir comment mettre cela en place.
Nous avons ici trois photos d'un paysage. Elles se superposent.
La mise à niveau vers le Panorama Studio peut les assembler, sans qu'aucun raccord ne soit visible.
Page 607
Commandes de rotation à 90°
Les deux icônes de rotation permettent de tourner la ou les photo(s) sélectionnée(s) de 90° dans le sens
des aiguilles d'une montre ou dans le sens contraire.
Page 608
Calques
Les calques se comportent exactement comme leur nom le suggère. C'est comme si vous aviez dessiné
sur une série de feuilles transparentes empilées les unes sur les autres.
Les objets opaques d'un calque
obscurcissent ce qui se trouve sur
les calques inférieurs :
Fonctions des calques
Les calques vous permettent de :
 Autoriser l'édition de tous les calques ou la restreindre au calque en cours. (Le calque en cours
est celui qui est sélectionné. Tous les objets que vous créez apparaissent sur le calque en cours).
 Afficher le nombre de calques que vous voulez.
 Changer l'ordre des calques, de l'avant à l'arrière.
 Nommer les calques pour un référencement simplifié.
Principales utilisations des calques :
 En webdesign, on utilise un calque séparé pour placer les boutons d'état au passage de la souris.
Normalement, le calque « MouseOff » contient l'état normal du bouton et le calque
« MouseOver », celui du bouton lorsqu'il apparaît en surbrillance (c'est-à-dire la façon dont le
bouton apparaît lorsqu'il est exporté et vu dans un navigateur Internet et que le visiteur place le
curseur de sa souris sur le bouton). Les calques sont aussi utilisés pour contenir des objets
apparaissant dans un navigateur Internet sous forme de popups lors du passage de la souris ou
suite à un clic. Reportez-vous à la section Classement des calques dans des documents Internet
ci-dessous pour plus de renseignements.
 Rôle de superposition. Vous pouvez par exemple créer le plan d'un étage d'un immeuble. Les
calques séparés peuvent servir à montrer les emplacements téléphone, ceux des alarmes, etc.
 Les calques sont utiles à la création de designs complexes. Lorsque vous désactivez les calques
et que vous restreignez l'édition au calque en cours, vous évitez de modifier accidentellement des
objets sur les autres calques.
Nous vous recommandons, pour les designs complexes, de créer différentes sections sur différents
calques. Par exemple, lorsque vous créez un fond sur un calque, vous pouvez facilement le verrouiller ou
le cacher pendant que vous travaillez sur les objets du premier plan.
Il existe trois types de calques :
 Premier plan
 Guide Il ne peut y avoir qu'un seul calque guide dans un document. Ce calque contient des lignes
et des objets utilisés pour aligner d'autres objets. Le calque guide ne peut pas être imprimé. Seuls
les contours des objets sur le guide sont affichés.
 Arrière-plan. Les calques d'arrière-plan ne peuvent être imprimés et se trouvent toujours
derrière les calques de premier plan.
Pour en savoir plus sur les guides, veuillez vous reporter à la section « Guides et indications » dans
Utilisation des objets
.
Page 609
Fonctions des calques
Les calques vous permettent de :
 Autoriser l'édition de tous les calques ou la restreindre au calque en cours. (Le calque en cours
est celui qui est sélectionné. Tous les objets que vous créez apparaissent sur le calque en cours).
 Afficher le nombre de calques que vous voulez.
 Changer l'ordre des calques, de l'avant à l'arrière.
 Nommer les calques pour un référencement simplifié.
Principales utilisations des calques :
 En webdesign, on utilise un calque séparé pour placer les boutons d'état au passage de la souris.
Normalement, le calque « MouseOff » contient l'état normal du bouton et le calque
« MouseOver », celui du bouton lorsqu'il apparaît en surbrillance (c'est-à-dire la façon dont le
bouton apparaît lorsqu'il est exporté et vu dans un navigateur Internet et que le visiteur place le
curseur de sa souris sur le bouton). Les calques sont aussi utilisés pour contenir des objets
apparaissant dans un navigateur Internet sous forme de popups lors du passage de la souris ou
suite à un clic. Reportez-vous à la section Classement des calques dans des documents Internet
ci-dessous pour plus de renseignements.
 Rôle de superposition. Vous pouvez par exemple créer le plan d'un étage d'un immeuble. Les
calques séparés peuvent servir à montrer les emplacements téléphone, ceux des alarmes, etc.
 Les calques sont utiles à la création de designs complexes. Lorsque vous désactivez les calques
et que vous restreignez l'édition au calque en cours, vous évitez de modifier accidentellement des
objets sur les autres calques.
Nous vous recommandons, pour les designs complexes, de créer différentes sections sur différents
calques. Par exemple, lorsque vous créez un fond sur un calque, vous pouvez facilement le verrouiller ou
le cacher pendant que vous travaillez sur les objets du premier plan.
Il existe trois types de calques :
 Premier plan
 Guide Il ne peut y avoir qu'un seul calque guide dans un document. Ce calque contient des lignes
et des objets utilisés pour aligner d'autres objets. Le calque guide ne peut pas être imprimé. Seuls
les contours des objets sur le guide sont affichés.
 Arrière-plan. Les calques d'arrière-plan ne peuvent être imprimés et se trouvent toujours
derrière les calques de premier plan.
Pour en savoir plus sur les guides, veuillez vous reporter à la section « Guides et indications » dans
Utilisation des objets
.
Page 610
La Galerie de calques
Pour afficher une liste des calques pour le document :
 Sélectionnez Services -> Galeries -> Galerie (F10)
 Ou bien cliquez sur le bouton Galerie de calques dans la barre de contrôle des Galeries.
Les calques sont listés dans l'ordre ; le calque situé au début de la liste est le calque de devant.
Si vous faites un clic droit dans la liste des calques, un menu popup s'ouvre qui copie les boutons en haut
de la galerie, ainsi qu'une option Créer calque guide
.
Le bouton Propriétés
Ceci ouvre une boîte de dialogue à onglets où vous pourrez créer des calques nouvellement nommés et
des lignes de repère avec des valeurs numériques précises. Vous pouvez aussi utiliser cette option pour
modifier la couleur d'objets du calque de lignes.
Voir la section Objets de ligne& lignes de repère dans le chapitre Utilisation des objets
pour plus d'informations.
Modifier le calque actif
Cliquer sur le nom du calque que vous choisissez comme calque actif. Tous les nouveaux objets seront
créés dans ce calque.
Modifier le nom d'un calque
Les noms de calque servent
uniquement à les identifier dans la
galerie des Calques. Ils n'ont pas
d'effet sur le document. Sélectionner
le calque dans la liste puis cliquer sur
le bouton Propriétés. Si nécessaire,
cliquer sur l'onglet Calque. Saisir le
nouveau nom dans le champ de texte
et cliquer sur OK
Page 611
.
Afficher et masquer les calques
Pour rendre un calque visible ou non, cocher ou décocher la coche Visible adjacente au nom du calque.
Lorsque le bouton Tout visible est sélectionné, tous les calques sont visibles. Une fois Tout visible
désélectionné, seuls les calques cochés seront visibles.
Vous pouvez afficher ou masquer un bloc de calques. Maj+cliquer sur une case à cocher pour afficher
ou masquer tous les calques entre le calque sur lequel vous avez cliqué et le dernier calque que vous avez
sélectionné.
Notez que Arranger > Déplacer vers le calque du premier plan et Arranger > Déplacer vers le
calque d'arrière-plan
évite les calques masqués et les calques de lignes.
Rendre le calque en cours visible
Dans l'onglet Général de la boîte de dialogue des options
(Services -> Options), vous pouvez sélectionner l'option « Calque en cours visible et modifiable», qui
signifie que lorsque vous sélectionnerez un calque, tous les objets qu'il contient seront visibles et
modifiables.
Verrouiller les calques
Vous ne pouvez ni sélectionner ni créer des objets sur un calque verrouillé. Verrouillez un calque si vous
ne souhaitez plus y apporter de modifications ou si vous voulez éviter de faire des changements
accidentels.
lorsque le bouton Tous modifiables est sélectionné, tous les calques sont déverrouillés et modifiables.
Pour verrouiller ou déverrouiller un calque, cochez la case Modifiable
près du nom du calque pour changer son état.
Vous pouvez aussi verrouiller ou déverrouiller des groupes de calques. Maj + clic sur une case à cocher
verrouille ou déverrouille tous les calques situés entre le premier et le dernier calque que vous aurez
sélectionnés.
Créer un nouveau calque
Cliquer sur Nouveau
. Ceci ouvre un champ de texte permettant de nommer le nouveau calque :
Saisissez un nom qui donne une indication sur
l'utilisation du calque. Cliquez sur OK
pour créer le calque.
Le nouveau calque est créé comme calque
de premier plan et devient le calque actif.
Pour créer un calque de lignes, cliquer droit sur la galerie des calques et sélectionner Créer un calque
de lignes
. Si l'option est grisée, vous disposez déjà d'un calque de lignes.
Copier un calque
Vous pouvez créer une copie du calque actif (comportant tous les objets de ce calque). Cliquer sur le
bouton Copier
pour afficher un champ de texte et nommer le nouveau calque.
Page 612
La copie devient le calque de premier plan
et le calque actif.
Supprimer un calque
Cliquer sur Supprimer
pour supprimer le calque actif et tous les objets s'y trouvant. Si le calque contient des objets vous devrez
confirmer si vous voulez vraiment les supprimer.
Changer l'ordre des calques
Pour changer l'ordre des
calques :
1. Sélectionner le
calque que vous
souhaitez
déplacer en
cliquant sur son
nom.
2. Faire glisser le
nom du calque
vers la position
souhaitée.
Ceci permet de déplacer le calque 2 dans la section Ceci déplace tous les
des calques d'arrière-plan.
nouveaux objets de ce
calque vers la nouvelle
position.
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
bouton Déplacer
 ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 613
Le bouton Propriétés
Ceci ouvre une boîte de dialogue à onglets où vous pourrez créer des calques nouvellement nommés et
des lignes de repère avec des valeurs numériques précises. Vous pouvez aussi utiliser cette option pour
modifier la couleur d'objets du calque de lignes.
Voir la section Objets de ligne& lignes de repère dans le chapitre Utilisation des objets
pour plus d'informations.
Modifier le calque actif
Cliquer sur le nom du calque que vous choisissez comme calque actif. Tous les nouveaux objets seront
créés dans ce calque.
Modifier le nom d'un calque
Les noms de calque servent
uniquement à les identifier dans la
galerie des Calques. Ils n'ont pas
d'effet sur le document. Sélectionner
le calque dans la liste puis cliquer sur
le bouton Propriétés. Si nécessaire,
cliquer sur l'onglet Calque. Saisir le
nouveau nom dans le champ de texte
et cliquer sur OK
.
Afficher et masquer les calques
Pour rendre un calque visible ou non, cocher ou décocher la coche Visible adjacente au nom du calque.
Lorsque le bouton Tout visible est sélectionné, tous les calques sont visibles. Une fois Tout visible
désélectionné, seuls les calques cochés seront visibles.
Vous pouvez afficher ou masquer un bloc de calques. Maj+cliquer sur une case à cocher pour afficher
ou masquer tous les calques entre le calque sur lequel vous avez cliqué et le dernier calque que vous avez
sélectionné.
Notez que Arranger > Déplacer vers le calque du premier plan et Arranger > Déplacer vers le
calque d'arrière-plan
évite les calques masqués et les calques de lignes.
Rendre le calque en cours visible
Dans l'onglet Général de la boîte de dialogue des options
(Services -> Options), vous pouvez sélectionner l'option « Calque en cours visible et modifiable», qui
signifie que lorsque vous sélectionnerez un calque, tous les objets qu'il contient seront visibles et
modifiables.
Verrouiller les calques
Vous ne pouvez ni sélectionner ni créer des objets sur un calque verrouillé. Verrouillez un calque si vous
ne souhaitez plus y apporter de modifications ou si vous voulez éviter de faire des changements
accidentels.
lorsque le bouton Tous modifiables est sélectionné, tous les calques sont déverrouillés et modifiables.
Pour verrouiller ou déverrouiller un calque, cochez la case Modifiable
près du nom du calque pour changer son état.
Page 614
Vous pouvez aussi verrouiller ou déverrouiller des groupes de calques. Maj + clic sur une case à cocher
verrouille ou déverrouille tous les calques situés entre le premier et le dernier calque que vous aurez
sélectionnés.
Créer un nouveau calque
Cliquer sur Nouveau
. Ceci ouvre un champ de texte permettant de nommer le nouveau calque :
Saisissez un nom qui donne une indication sur
l'utilisation du calque. Cliquez sur OK
pour créer le calque.
Le nouveau calque est créé comme calque
de premier plan et devient le calque actif.
Pour créer un calque de lignes, cliquer droit sur la galerie des calques et sélectionner Créer un calque
de lignes
. Si l'option est grisée, vous disposez déjà d'un calque de lignes.
Copier un calque
Vous pouvez créer une copie du calque actif (comportant tous les objets de ce calque). Cliquer sur le
bouton Copier
pour afficher un champ de texte et nommer le nouveau calque.
La copie devient le calque de premier plan
et le calque actif.
Supprimer un calque
Cliquer sur Supprimer
pour supprimer le calque actif et tous les objets s'y trouvant. Si le calque contient des objets vous devrez
confirmer si vous voulez vraiment les supprimer.
Changer l'ordre des calques
Pour changer l'ordre des
calques :
1. Sélectionner le
calque que vous
souhaitez
déplacer en
cliquant sur son
nom.
2. Faire glisser le
nom du calque
vers la position
souhaitée.
Ceci permet de déplacer le calque 2 dans la section Ceci déplace tous les
des calques d'arrière-plan.
nouveaux objets de ce
calque vers la nouvelle
position.
Page 615
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
bouton Déplacer
 ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 616
Modifier le calque actif
Cliquer sur le nom du calque que vous choisissez comme calque actif. Tous les nouveaux objets seront
créés dans ce calque.
Modifier le nom d'un calque
Les noms de calque servent
uniquement à les identifier dans la
galerie des Calques. Ils n'ont pas
d'effet sur le document. Sélectionner
le calque dans la liste puis cliquer sur
le bouton Propriétés. Si nécessaire,
cliquer sur l'onglet Calque. Saisir le
nouveau nom dans le champ de texte
et cliquer sur OK
.
Afficher et masquer les calques
Pour rendre un calque visible ou non, cocher ou décocher la coche Visible adjacente au nom du calque.
Lorsque le bouton Tout visible est sélectionné, tous les calques sont visibles. Une fois Tout visible
désélectionné, seuls les calques cochés seront visibles.
Vous pouvez afficher ou masquer un bloc de calques. Maj+cliquer sur une case à cocher pour afficher
ou masquer tous les calques entre le calque sur lequel vous avez cliqué et le dernier calque que vous avez
sélectionné.
Notez que Arranger > Déplacer vers le calque du premier plan et Arranger > Déplacer vers le
calque d'arrière-plan
évite les calques masqués et les calques de lignes.
Rendre le calque en cours visible
Dans l'onglet Général de la boîte de dialogue des options
(Services -> Options), vous pouvez sélectionner l'option « Calque en cours visible et modifiable», qui
signifie que lorsque vous sélectionnerez un calque, tous les objets qu'il contient seront visibles et
modifiables.
Verrouiller les calques
Vous ne pouvez ni sélectionner ni créer des objets sur un calque verrouillé. Verrouillez un calque si vous
ne souhaitez plus y apporter de modifications ou si vous voulez éviter de faire des changements
accidentels.
lorsque le bouton Tous modifiables est sélectionné, tous les calques sont déverrouillés et modifiables.
Pour verrouiller ou déverrouiller un calque, cochez la case Modifiable
près du nom du calque pour changer son état.
Vous pouvez aussi verrouiller ou déverrouiller des groupes de calques. Maj + clic sur une case à cocher
verrouille ou déverrouille tous les calques situés entre le premier et le dernier calque que vous aurez
sélectionnés.
Créer un nouveau calque
Cliquer sur Nouveau
. Ceci ouvre un champ de texte permettant de nommer le nouveau calque :
Page 617
Saisissez un nom qui donne une indication sur
l'utilisation du calque. Cliquez sur OK
pour créer le calque.
Le nouveau calque est créé comme calque
de premier plan et devient le calque actif.
Pour créer un calque de lignes, cliquer droit sur la galerie des calques et sélectionner Créer un calque
de lignes
. Si l'option est grisée, vous disposez déjà d'un calque de lignes.
Copier un calque
Vous pouvez créer une copie du calque actif (comportant tous les objets de ce calque). Cliquer sur le
bouton Copier
pour afficher un champ de texte et nommer le nouveau calque.
La copie devient le calque de premier plan
et le calque actif.
Supprimer un calque
Cliquer sur Supprimer
pour supprimer le calque actif et tous les objets s'y trouvant. Si le calque contient des objets vous devrez
confirmer si vous voulez vraiment les supprimer.
Changer l'ordre des calques
Pour changer l'ordre des
calques :
1. Sélectionner le
calque que vous
souhaitez
déplacer en
cliquant sur son
nom.
2. Faire glisser le
nom du calque
vers la position
souhaitée.
Ceci permet de déplacer le calque 2 dans la section Ceci déplace tous les
des calques d'arrière-plan.
nouveaux objets de ce
calque vers la nouvelle
position.
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
bouton Déplacer
 ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 618
Modifier le nom d'un calque
Les noms de calque servent
uniquement à les identifier dans la
galerie des Calques. Ils n'ont pas
d'effet sur le document. Sélectionner
le calque dans la liste puis cliquer sur
le bouton Propriétés. Si nécessaire,
cliquer sur l'onglet Calque. Saisir le
nouveau nom dans le champ de texte
et cliquer sur OK
.
Afficher et masquer les calques
Pour rendre un calque visible ou non, cocher ou décocher la coche Visible adjacente au nom du calque.
Lorsque le bouton Tout visible est sélectionné, tous les calques sont visibles. Une fois Tout visible
désélectionné, seuls les calques cochés seront visibles.
Vous pouvez afficher ou masquer un bloc de calques. Maj+cliquer sur une case à cocher pour afficher
ou masquer tous les calques entre le calque sur lequel vous avez cliqué et le dernier calque que vous avez
sélectionné.
Notez que Arranger > Déplacer vers le calque du premier plan et Arranger > Déplacer vers le
calque d'arrière-plan
évite les calques masqués et les calques de lignes.
Rendre le calque en cours visible
Dans l'onglet Général de la boîte de dialogue des options
(Services -> Options), vous pouvez sélectionner l'option « Calque en cours visible et modifiable», qui
signifie que lorsque vous sélectionnerez un calque, tous les objets qu'il contient seront visibles et
modifiables.
Verrouiller les calques
Vous ne pouvez ni sélectionner ni créer des objets sur un calque verrouillé. Verrouillez un calque si vous
ne souhaitez plus y apporter de modifications ou si vous voulez éviter de faire des changements
accidentels.
lorsque le bouton Tous modifiables est sélectionné, tous les calques sont déverrouillés et modifiables.
Pour verrouiller ou déverrouiller un calque, cochez la case Modifiable
près du nom du calque pour changer son état.
Vous pouvez aussi verrouiller ou déverrouiller des groupes de calques. Maj + clic sur une case à cocher
verrouille ou déverrouille tous les calques situés entre le premier et le dernier calque que vous aurez
sélectionnés.
Créer un nouveau calque
Cliquer sur Nouveau
. Ceci ouvre un champ de texte permettant de nommer le nouveau calque :
Saisissez un nom qui donne une indication sur
l'utilisation du calque. Cliquez sur OK
pour créer le calque.
Le nouveau calque est créé comme calque
Page 619
de premier plan et devient le calque actif.
Pour créer un calque de lignes, cliquer droit sur la galerie des calques et sélectionner Créer un calque
de lignes
. Si l'option est grisée, vous disposez déjà d'un calque de lignes.
Copier un calque
Vous pouvez créer une copie du calque actif (comportant tous les objets de ce calque). Cliquer sur le
bouton Copier
pour afficher un champ de texte et nommer le nouveau calque.
La copie devient le calque de premier plan
et le calque actif.
Supprimer un calque
Cliquer sur Supprimer
pour supprimer le calque actif et tous les objets s'y trouvant. Si le calque contient des objets vous devrez
confirmer si vous voulez vraiment les supprimer.
Changer l'ordre des calques
Pour changer l'ordre des
calques :
1. Sélectionner le
calque que vous
souhaitez
déplacer en
cliquant sur son
nom.
2. Faire glisser le
nom du calque
vers la position
souhaitée.
Ceci permet de déplacer le calque 2 dans la section Ceci déplace tous les
des calques d'arrière-plan.
nouveaux objets de ce
calque vers la nouvelle
position.
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
bouton Déplacer
 ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 620
Afficher et masquer les calques
Pour rendre un calque visible ou non, cocher ou décocher la coche Visible adjacente au nom du calque.
Lorsque le bouton Tout visible est sélectionné, tous les calques sont visibles. Une fois Tout visible
désélectionné, seuls les calques cochés seront visibles.
Vous pouvez afficher ou masquer un bloc de calques. Maj+cliquer sur une case à cocher pour afficher
ou masquer tous les calques entre le calque sur lequel vous avez cliqué et le dernier calque que vous avez
sélectionné.
Notez que Arranger > Déplacer vers le calque du premier plan et Arranger > Déplacer vers le
calque d'arrière-plan
évite les calques masqués et les calques de lignes.
Rendre le calque en cours visible
Dans l'onglet Général de la boîte de dialogue des options
(Services -> Options), vous pouvez sélectionner l'option « Calque en cours visible et modifiable», qui
signifie que lorsque vous sélectionnerez un calque, tous les objets qu'il contient seront visibles et
modifiables.
Verrouiller les calques
Vous ne pouvez ni sélectionner ni créer des objets sur un calque verrouillé. Verrouillez un calque si vous
ne souhaitez plus y apporter de modifications ou si vous voulez éviter de faire des changements
accidentels.
lorsque le bouton Tous modifiables est sélectionné, tous les calques sont déverrouillés et modifiables.
Pour verrouiller ou déverrouiller un calque, cochez la case Modifiable
près du nom du calque pour changer son état.
Vous pouvez aussi verrouiller ou déverrouiller des groupes de calques. Maj + clic sur une case à cocher
verrouille ou déverrouille tous les calques situés entre le premier et le dernier calque que vous aurez
sélectionnés.
Créer un nouveau calque
Cliquer sur Nouveau
. Ceci ouvre un champ de texte permettant de nommer le nouveau calque :
Saisissez un nom qui donne une indication sur
l'utilisation du calque. Cliquez sur OK
pour créer le calque.
Le nouveau calque est créé comme calque
de premier plan et devient le calque actif.
Pour créer un calque de lignes, cliquer droit sur la galerie des calques et sélectionner Créer un calque
de lignes
. Si l'option est grisée, vous disposez déjà d'un calque de lignes.
Copier un calque
Vous pouvez créer une copie du calque actif (comportant tous les objets de ce calque). Cliquer sur le
bouton Copier
pour afficher un champ de texte et nommer le nouveau calque.
Page 621
La copie devient le calque de premier plan
et le calque actif.
Supprimer un calque
Cliquer sur Supprimer
pour supprimer le calque actif et tous les objets s'y trouvant. Si le calque contient des objets vous devrez
confirmer si vous voulez vraiment les supprimer.
Changer l'ordre des calques
Pour changer l'ordre des
calques :
1. Sélectionner le
calque que vous
souhaitez
déplacer en
cliquant sur son
nom.
2. Faire glisser le
nom du calque
vers la position
souhaitée.
Ceci permet de déplacer le calque 2 dans la section Ceci déplace tous les
des calques d'arrière-plan.
nouveaux objets de ce
calque vers la nouvelle
position.
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
bouton Déplacer
 ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 622
Rendre le calque en cours visible
Dans l'onglet Général de la boîte de dialogue des options
(Services -> Options), vous pouvez sélectionner l'option « Calque en cours visible et modifiable», qui
signifie que lorsque vous sélectionnerez un calque, tous les objets qu'il contient seront visibles et
modifiables.
Verrouiller les calques
Vous ne pouvez ni sélectionner ni créer des objets sur un calque verrouillé. Verrouillez un calque si vous
ne souhaitez plus y apporter de modifications ou si vous voulez éviter de faire des changements
accidentels.
lorsque le bouton Tous modifiables est sélectionné, tous les calques sont déverrouillés et modifiables.
Pour verrouiller ou déverrouiller un calque, cochez la case Modifiable
près du nom du calque pour changer son état.
Vous pouvez aussi verrouiller ou déverrouiller des groupes de calques. Maj + clic sur une case à cocher
verrouille ou déverrouille tous les calques situés entre le premier et le dernier calque que vous aurez
sélectionnés.
Créer un nouveau calque
Cliquer sur Nouveau
. Ceci ouvre un champ de texte permettant de nommer le nouveau calque :
Saisissez un nom qui donne une indication sur
l'utilisation du calque. Cliquez sur OK
pour créer le calque.
Le nouveau calque est créé comme calque
de premier plan et devient le calque actif.
Pour créer un calque de lignes, cliquer droit sur la galerie des calques et sélectionner Créer un calque
de lignes
. Si l'option est grisée, vous disposez déjà d'un calque de lignes.
Copier un calque
Vous pouvez créer une copie du calque actif (comportant tous les objets de ce calque). Cliquer sur le
bouton Copier
pour afficher un champ de texte et nommer le nouveau calque.
La copie devient le calque de premier plan
et le calque actif.
Supprimer un calque
Cliquer sur Supprimer
pour supprimer le calque actif et tous les objets s'y trouvant. Si le calque contient des objets vous devrez
confirmer si vous voulez vraiment les supprimer.
Changer l'ordre des calques
Page 623
Pour changer l'ordre des
calques :
1. Sélectionner le
calque que vous
souhaitez
déplacer en
cliquant sur son
nom.
2. Faire glisser le
nom du calque
vers la position
souhaitée.
Ceci permet de déplacer le calque 2 dans la section Ceci déplace tous les
des calques d'arrière-plan.
nouveaux objets de ce
calque vers la nouvelle
position.
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
bouton Déplacer
 ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 624
Verrouiller les calques
Vous ne pouvez ni sélectionner ni créer des objets sur un calque verrouillé. Verrouillez un calque si vous
ne souhaitez plus y apporter de modifications ou si vous voulez éviter de faire des changements
accidentels.
lorsque le bouton Tous modifiables est sélectionné, tous les calques sont déverrouillés et modifiables.
Pour verrouiller ou déverrouiller un calque, cochez la case Modifiable
près du nom du calque pour changer son état.
Vous pouvez aussi verrouiller ou déverrouiller des groupes de calques. Maj + clic sur une case à cocher
verrouille ou déverrouille tous les calques situés entre le premier et le dernier calque que vous aurez
sélectionnés.
Créer un nouveau calque
Cliquer sur Nouveau
. Ceci ouvre un champ de texte permettant de nommer le nouveau calque :
Saisissez un nom qui donne une indication sur
l'utilisation du calque. Cliquez sur OK
pour créer le calque.
Le nouveau calque est créé comme calque
de premier plan et devient le calque actif.
Pour créer un calque de lignes, cliquer droit sur la galerie des calques et sélectionner Créer un calque
de lignes
. Si l'option est grisée, vous disposez déjà d'un calque de lignes.
Copier un calque
Vous pouvez créer une copie du calque actif (comportant tous les objets de ce calque). Cliquer sur le
bouton Copier
pour afficher un champ de texte et nommer le nouveau calque.
La copie devient le calque de premier plan
et le calque actif.
Supprimer un calque
Cliquer sur Supprimer
pour supprimer le calque actif et tous les objets s'y trouvant. Si le calque contient des objets vous devrez
confirmer si vous voulez vraiment les supprimer.
Changer l'ordre des calques
Page 625
Pour changer l'ordre des
calques :
1. Sélectionner le
calque que vous
souhaitez
déplacer en
cliquant sur son
nom.
2. Faire glisser le
nom du calque
vers la position
souhaitée.
Ceci permet de déplacer le calque 2 dans la section Ceci déplace tous les
des calques d'arrière-plan.
nouveaux objets de ce
calque vers la nouvelle
position.
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
bouton Déplacer
 ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 626
Créer un nouveau calque
Cliquer sur Nouveau
. Ceci ouvre un champ de texte permettant de nommer le nouveau calque :
Saisissez un nom qui donne une indication sur
l'utilisation du calque. Cliquez sur OK
pour créer le calque.
Le nouveau calque est créé comme calque
de premier plan et devient le calque actif.
Pour créer un calque de lignes, cliquer droit sur la galerie des calques et sélectionner Créer un calque
de lignes
. Si l'option est grisée, vous disposez déjà d'un calque de lignes.
Copier un calque
Vous pouvez créer une copie du calque actif (comportant tous les objets de ce calque). Cliquer sur le
bouton Copier
pour afficher un champ de texte et nommer le nouveau calque.
La copie devient le calque de premier plan
et le calque actif.
Supprimer un calque
Cliquer sur Supprimer
pour supprimer le calque actif et tous les objets s'y trouvant. Si le calque contient des objets vous devrez
confirmer si vous voulez vraiment les supprimer.
Changer l'ordre des calques
Pour changer l'ordre des
calques :
1. Sélectionner le
calque que vous
souhaitez
déplacer en
cliquant sur son
nom.
2. Faire glisser le
nom du calque
vers la position
souhaitée.
Ceci permet de déplacer le calque 2 dans la section Ceci déplace tous les
des calques d'arrière-plan.
nouveaux objets de ce
calque vers la nouvelle
position.
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
Page 627

bouton Déplacer
ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 628
Copier un calque
Vous pouvez créer une copie du calque actif (comportant tous les objets de ce calque). Cliquer sur le
bouton Copier
pour afficher un champ de texte et nommer le nouveau calque.
La copie devient le calque de premier plan
et le calque actif.
Supprimer un calque
Cliquer sur Supprimer
pour supprimer le calque actif et tous les objets s'y trouvant. Si le calque contient des objets vous devrez
confirmer si vous voulez vraiment les supprimer.
Changer l'ordre des calques
Pour changer l'ordre des
calques :
1. Sélectionner le
calque que vous
souhaitez
déplacer en
cliquant sur son
nom.
2. Faire glisser le
nom du calque
vers la position
souhaitée.
Ceci permet de déplacer le calque 2 dans la section Ceci déplace tous les
des calques d'arrière-plan.
nouveaux objets de ce
calque vers la nouvelle
position.
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
bouton Déplacer
 ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 629
Supprimer un calque
Cliquer sur Supprimer
pour supprimer le calque actif et tous les objets s'y trouvant. Si le calque contient des objets vous devrez
confirmer si vous voulez vraiment les supprimer.
Changer l'ordre des calques
Pour changer l'ordre des
calques :
1. Sélectionner le
calque que vous
souhaitez
déplacer en
cliquant sur son
nom.
2. Faire glisser le
nom du calque
vers la position
souhaitée.
Ceci permet de déplacer le calque 2 dans la section Ceci déplace tous les
des calques d'arrière-plan.
nouveaux objets de ce
calque vers la nouvelle
position.
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
bouton Déplacer
 ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 630
Changer l'ordre des calques
Pour changer l'ordre des
calques :
1. Sélectionner le
calque que vous
souhaitez
déplacer en
cliquant sur son
nom.
2. Faire glisser le
nom du calque
vers la position
souhaitée.
Ceci permet de déplacer le calque 2 dans la section Ceci déplace tous les
des calques d'arrière-plan.
nouveaux objets de ce
calque vers la nouvelle
position.
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
bouton Déplacer
 ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 631
Déplacer les objets entre les calques
Pour déplacer des objets entre les calques :
 sélectionnez les objets, puis le calque de votre choix dans la galerie de calque et cliquez sur le
bouton Déplacer
 ou servez-vous des éléments Déplacer vers le calque du premier plan / Déplacez vers le
calque du fond du menu Arranger pour déplacer les objets d'un niveau vers le haut ou vers le
bas.
Page 632
Classer les calques dans les documents de sites
Internet
Si un document de votre site Internet contient des effets au passage de la souris, des calques popup et
peut-être même des effets au passage de la souris sur ces calques popup, faites attention à suivre
certaines règles de classement des calques dans votre document. Si vous ne les suivez pas, certains effets
pourraient ne pas fonctionner dans votre site.
Les calques vont de l'arrière-plan au premier plan (ce qui fonctionne vers le haut dans la Galerie de
calques) et vous devez donc trouver les calques statiques en premier. Ce sont des calques qui sont
toujours visibles et ne sont pas utilisés en tant que popups. Dans la plupart des designs, on trouvera un
calque « MouseOff
». Mais certains designs en contiennent plus d'un, au quel cas ils doivent se trouver dans les premiers
calques dans la pile de calques.
Ensuite, vient le calque MouseOver, si des effets au passage de la souris se trouvent sur le(s) calque(s)
statique(s). Il contient les états au passage de la souris pour tous les boutons qui apparaissent au passage
de la souris. Il doit être suivi par le calque MouseDown
, si vous avez inclus des effets de souris enfoncée sur le(s) calque(s) statique(s).
Ensuite vous pouvez avoir un calque popup. Si les objets de ce calque popup ont des effets au passage
de la souris, le calque suivant le popup doit être le calque contenant ces effets. Il doit porter un nom
commençant par MouseOver, par ex. « MouseOverPopup1 ». Puis, si le calque popup possède
également de effets de souris enfoncée, un calque dont le nom commence par « MouseDown » doit
suivre et contenir ces objets.
Vousp ouvez ensuite avoir un autre calque popup, suivi encore par tous les calques MouseOver et
MouseDown lui appartenant. Et ainsi de suite ; vous pouvez créer autant de calques que vous voulez.
Pour résumer, le classement des calques doit en général être effectué comme indiqué dans la liste
suivante, affichée dans le même ordre que dans la Galerie de calques
(du premier plan à l'arrière-plan). Tous les calques sont optionnels et vous pouvez choisir librement leurs
noms, sauf pour les caractères en gras, qui représentent les calques de MouseOver et MouseDown.
Popup MouseDown n
Popup MouseOver n
Calque popup n
...
Popup MouseDown 1
Popup MouseOver 1
Calque popup 1
MouseDown
MouseOver
Calque statique n
...
Calque statique 2
MouseOff
Notez que ces règles de classement ne s'appliquent que si vous construisez des pages complexes avec de
nombreux effets de popup ! Si vous ne faites qu'utiliser les modèles de conception disponibles dans la
Galerie de designs, vous n'aurez pas ces problèmes de classement.
Page 633
Animations Flash
Dans ce chapitre
Introduction
Principes de base
Votre première animation
Exporter un fichier Flash
La galerie de frames (images)
Photos
Fréquence des frames d'animation et étapes de tweening
Recouper ou clipper des images
Vitesse de l'animation
Fluidité de l'animation
Rotation
Groupes
Quelles fonctions de Xtreme Web Designer 5 sont prises en charge par Flash ?
Transformation des couleurs - Animer des changements de couleur
Transparence
URL dans les animations Flash
Commandes Flash avancées
Résumé : l'animation Flash dans Xtreme Web Designer 5
Créer des GIF animés
Propriétés de l'animation GIF
Page 634
Introduction
L'approche d'animateur de Xtreme Web Designer 5 envers les animations Flash est traditionnelle. Vous
créez des keyrfames de votre animations au cours du temps et Xtreme Web Designer 5 crée
automatiquement tous les frames intermédiaires pour vous ; on appelle ce procédé le « tweening ».
Exemple d'un frame de départ
On voit sur le frame suivant que la forme de l'étoile a été déplacée, un peu tournée, que sa taille a été
réduite, et qu'elle a maintenant une autre couleur.
Xtreme Web Designer 5 crée un fichier Flash animé fluide qui crée automatiquement les frames
intermédiaires. C#est le procédé du « tweening ».
Ce que Flash peut et ne peut pas faire
Le format Flash ne prend pas en charge certains effets avancés proposés par Xtreme Web Designer 5,
par exemple la transparence progressive, l'estompage ni la plupart des types de remplissage de couleurs
avancés.
Cependant, il prend en charge un grand nombre d'effets incluant une transparence simple. Ainsi, par
exemple, si vous appliquez une transparence à l'étoile sur le 2ème keyframe pour qu'il soit transparent à
100 %, vous obtiendrez une animation dans laquelle les étoiles se déplacent, qui deviennent plus petites
puis qui disparaissent.
Le même exemple, montrant des frames intermédiaires, mais avec un changement de transparence.
Tout comme Xtreme Web Designer 5, Flash est basé sur les graphiques vectoriels, ce qui signifie que
vous pouvez agrandir vos objets sans aucune perte de détails. Cela signifie aussi que les fichiers Flash
sont très compacts, un atout essentiel pour le Web !
Pour illustrer à quel point les animations Flash de Xtreme Web Designer 5 sont petits et compacts,
l'exemple précédant animé d'une seconde contient 24 frames (le film a donc 24 frames par seconde, ce
qui le rend fluide) crée un fichier Flash de seulement 700 octets.
Les 6 types principaux d'animations
Afin d'obtenir des fichiers flash les plus compacts possibles, les types de tweening de formes pris en
charge par Flash sont limités à six types d'animation de base. Elles sont parfois appelées les 6
transformations principales, car elles représentent le seul moyen de transformer un objet d'un keyframe à
l'autre.
1. Déplacer : déplacer des objets d'une position à l'autre.
2. Redimensionner : agrandir ou réduire la taille des objets.
Page 635
3. Ecraser ou déformer : écraser ou déformer des objets.
4. Rotation : faire tourner des objets.
5. Transparence : ajuster la transparence (plate) des objets.
6. Modification des couleurs : modifier la couleur (plate) de remplissage des objets.
Le dernier élément (le changement de couleurs) peut être appliqué à des photos (aux couleurs) continues.
Vous ne pouvez transformer une photo aux couleurs pleines en une photo avec des couleurs continues,
mais vous pouvez transformer une photo contenant une couleur continue en une autre couleur.
Remarque
: les six types de transformations ci-dessus sont très importantes dans toutes les animations Flash.
Aucun autre type de transformation n'est possible pour les frames tweenés.
Si vous regardez des exemples d'animations Flash sur Internet, vous verrez que la plupart d'entre elles
consistent seulement en ces effets. Les objets apparaissent et disparaissent ; ils passent d'une position à
une autre. Parfois ils font des pirouettes, ils deviennent plus gros ou diminuent de taille. Ceci est la base
de presque toutes les animations flash, et il est tres simple de produire des animations comme celles-ci
dans Xtreme Web Designer 5.
Il est par contre impossible de modifier la forme d'un objet entre des keyframes.
Il est impossible de modifier la forme entre des keyframes.
Parce que la forme change (c'est-à-dire qu'elle se transforme d'une forme en une autre), ceci est
impossible dans les animations Flash de Xtreme Web Designer 5.
Ce qu'il est possible de faire avec les animations Flash de
Xtreme Web Designer 5
Xtreme Web Designer 5 est avant tout un logiciel d'illustration vectorielle et non un outil Flash à part
entière. Ceci constitue par contre une approche nouvelle, innovante et très simple à comprendre des
animations Flash. En combinaison avec les outils de dessin graphique de Xtreme Web Designer 5, vous
pouvez créer des animations Flash plus facilement qu'avec tout autre outil.
L'approche ayant été simplifiée, Xtreme Web Designer 5 ne peut pas prendre en charge les
caractéristiques plus complexes de Flash telles que le scripting (programmation), l'audio ou les vidéos
incrustées.
De plus, étant donné que le rendu vectoriel Flash est relativement peu complexe par rapport à celui de
Xara Xtreme, certains effets avancés de Xtreme ne peuvent être utilisés avec Flash. Ils sont détaillés dans
le paragraphe « Quelles caractéristiques de Xtreme Web Designer 5 sont prises en compte par Flash ? »
vers la fin de ce chapitre.
Page 636
Ce que Flash peut et ne peut pas faire
Le format Flash ne prend pas en charge certains effets avancés proposés par Xtreme Web Designer 5,
par exemple la transparence progressive, l'estompage ni la plupart des types de remplissage de couleurs
avancés.
Cependant, il prend en charge un grand nombre d'effets incluant une transparence simple. Ainsi, par
exemple, si vous appliquez une transparence à l'étoile sur le 2ème keyframe pour qu'il soit transparent à
100 %, vous obtiendrez une animation dans laquelle les étoiles se déplacent, qui deviennent plus petites
puis qui disparaissent.
Le même exemple, montrant des frames intermédiaires, mais avec un changement de transparence.
Tout comme Xtreme Web Designer 5, Flash est basé sur les graphiques vectoriels, ce qui signifie que
vous pouvez agrandir vos objets sans aucune perte de détails. Cela signifie aussi que les fichiers Flash
sont très compacts, un atout essentiel pour le Web !
Pour illustrer à quel point les animations Flash de Xtreme Web Designer 5 sont petits et compacts,
l'exemple précédant animé d'une seconde contient 24 frames (le film a donc 24 frames par seconde, ce
qui le rend fluide) crée un fichier Flash de seulement 700 octets.
Les 6 types principaux d'animations
Afin d'obtenir des fichiers flash les plus compacts possibles, les types de tweening de formes pris en
charge par Flash sont limités à six types d'animation de base. Elles sont parfois appelées les 6
transformations principales, car elles représentent le seul moyen de transformer un objet d'un keyframe à
l'autre.
1. Déplacer : déplacer des objets d'une position à l'autre.
2. Redimensionner : agrandir ou réduire la taille des objets.
3. Ecraser ou déformer : écraser ou déformer des objets.
4. Rotation : faire tourner des objets.
5. Transparence : ajuster la transparence (plate) des objets.
6. Modification des couleurs : modifier la couleur (plate) de remplissage des objets.
Le dernier élément (le changement de couleurs) peut être appliqué à des photos (aux couleurs) continues.
Vous ne pouvez transformer une photo aux couleurs pleines en une photo avec des couleurs continues,
mais vous pouvez transformer une photo contenant une couleur continue en une autre couleur.
Remarque
: les six types de transformations ci-dessus sont très importantes dans toutes les animations Flash.
Aucun autre type de transformation n'est possible pour les frames tweenés.
Si vous regardez des exemples d'animations Flash sur Internet, vous verrez que la plupart d'entre elles
consistent seulement en ces effets. Les objets apparaissent et disparaissent ; ils passent d'une position à
une autre. Parfois ils font des pirouettes, ils deviennent plus gros ou diminuent de taille. Ceci est la base
de presque toutes les animations flash, et il est tres simple de produire des animations comme celles-ci
dans Xtreme Web Designer 5.
Il est par contre impossible de modifier la forme d'un objet entre des keyframes.
Page 637
Il est impossible de modifier la forme entre des keyframes.
Parce que la forme change (c'est-à-dire qu'elle se transforme d'une forme en une autre), ceci est
impossible dans les animations Flash de Xtreme Web Designer 5.
Ce qu'il est possible de faire avec les animations Flash de
Xtreme Web Designer 5
Xtreme Web Designer 5 est avant tout un logiciel d'illustration vectorielle et non un outil Flash à part
entière. Ceci constitue par contre une approche nouvelle, innovante et très simple à comprendre des
animations Flash. En combinaison avec les outils de dessin graphique de Xtreme Web Designer 5, vous
pouvez créer des animations Flash plus facilement qu'avec tout autre outil.
L'approche ayant été simplifiée, Xtreme Web Designer 5 ne peut pas prendre en charge les
caractéristiques plus complexes de Flash telles que le scripting (programmation), l'audio ou les vidéos
incrustées.
De plus, étant donné que le rendu vectoriel Flash est relativement peu complexe par rapport à celui de
Xara Xtreme, certains effets avancés de Xtreme ne peuvent être utilisés avec Flash. Ils sont détaillés dans
le paragraphe « Quelles caractéristiques de Xtreme Web Designer 5 sont prises en compte par Flash ? »
vers la fin de ce chapitre.
Page 638
Les 6 types principaux d'animations
Afin d'obtenir des fichiers flash les plus compacts possibles, les types de tweening de formes pris en
charge par Flash sont limités à six types d'animation de base. Elles sont parfois appelées les 6
transformations principales, car elles représentent le seul moyen de transformer un objet d'un keyframe à
l'autre.
1. Déplacer : déplacer des objets d'une position à l'autre.
2. Redimensionner : agrandir ou réduire la taille des objets.
3. Ecraser ou déformer : écraser ou déformer des objets.
4. Rotation : faire tourner des objets.
5. Transparence : ajuster la transparence (plate) des objets.
6. Modification des couleurs : modifier la couleur (plate) de remplissage des objets.
Le dernier élément (le changement de couleurs) peut être appliqué à des photos (aux couleurs) continues.
Vous ne pouvez transformer une photo aux couleurs pleines en une photo avec des couleurs continues,
mais vous pouvez transformer une photo contenant une couleur continue en une autre couleur.
Remarque
: les six types de transformations ci-dessus sont très importantes dans toutes les animations Flash.
Aucun autre type de transformation n'est possible pour les frames tweenés.
Si vous regardez des exemples d'animations Flash sur Internet, vous verrez que la plupart d'entre elles
consistent seulement en ces effets. Les objets apparaissent et disparaissent ; ils passent d'une position à
une autre. Parfois ils font des pirouettes, ils deviennent plus gros ou diminuent de taille. Ceci est la base
de presque toutes les animations flash, et il est tres simple de produire des animations comme celles-ci
dans Xtreme Web Designer 5.
Il est par contre impossible de modifier la forme d'un objet entre des keyframes.
Il est impossible de modifier la forme entre des keyframes.
Parce que la forme change (c'est-à-dire qu'elle se transforme d'une forme en une autre), ceci est
impossible dans les animations Flash de Xtreme Web Designer 5.
Ce qu'il est possible de faire avec les animations Flash de
Xtreme Web Designer 5
Xtreme Web Designer 5 est avant tout un logiciel d'illustration vectorielle et non un outil Flash à part
entière. Ceci constitue par contre une approche nouvelle, innovante et très simple à comprendre des
animations Flash. En combinaison avec les outils de dessin graphique de Xtreme Web Designer 5, vous
pouvez créer des animations Flash plus facilement qu'avec tout autre outil.
L'approche ayant été simplifiée, Xtreme Web Designer 5 ne peut pas prendre en charge les
caractéristiques plus complexes de Flash telles que le scripting (programmation), l'audio ou les vidéos
incrustées.
De plus, étant donné que le rendu vectoriel Flash est relativement peu complexe par rapport à celui de
Xara Xtreme, certains effets avancés de Xtreme ne peuvent être utilisés avec Flash. Ils sont détaillés dans
le paragraphe « Quelles caractéristiques de Xtreme Web Designer 5 sont prises en compte par Flash ? »
vers la fin de ce chapitre.
Page 639
Ce qu'il est possible de faire avec les animations Flash de
Xtreme Web Designer 5
Xtreme Web Designer 5 est avant tout un logiciel d'illustration vectorielle et non un outil Flash à part
entière. Ceci constitue par contre une approche nouvelle, innovante et très simple à comprendre des
animations Flash. En combinaison avec les outils de dessin graphique de Xtreme Web Designer 5, vous
pouvez créer des animations Flash plus facilement qu'avec tout autre outil.
L'approche ayant été simplifiée, Xtreme Web Designer 5 ne peut pas prendre en charge les
caractéristiques plus complexes de Flash telles que le scripting (programmation), l'audio ou les vidéos
incrustées.
De plus, étant donné que le rendu vectoriel Flash est relativement peu complexe par rapport à celui de
Xara Xtreme, certains effets avancés de Xtreme ne peuvent être utilisés avec Flash. Ils sont détaillés dans
le paragraphe « Quelles caractéristiques de Xtreme Web Designer 5 sont prises en compte par Flash ? »
vers la fin de ce chapitre.
Page 640
Principes de base
Dans votre animation, il est possible que des objets restent statiques entre les keyframes (c'est-à-dire
que le tweening n'est pas nécessaire) et que d'autres soient animés.
Pour indiquer à Xtreme Web Designer 5 quels objets doivent être
animés il est nécessaire de nommer chaque objet, et ce en cliquant sur le
bouton Créer de nouveaux noms de la barre de l'outil de Sélection
.
Pour plus d'informations sur le procédé pour nommer les objets, référez-vous à la section « Nommer les
objets » dans le chapitre « Utilisation du document ».
1. Un aperçu de la méthode pour créer une nouvelle animation à partir d'effets, que vous allez
découvrir à travers ce chapitre, est la suivante :
2. Dessinez votre première frame. Nommez les objets que vous souhaitez animer.
3. Créez une nouvelle keyframe. Généralement, il suffit de copier la première.
4. Déplacez et transformez les objets comme vous le souhaitez.
5. Prévisualisez les résultats.
6. Répétez les étapes 2 à 4.
Vous pouvez ainsi créer votre propre animation.
Ou cliquez sur le bouton Copier image dans la barre d'outil Animation
.
Xtreme Web Designer 5 dispose d'une fonction en un clic pour créer de nouvelles frames qui sont la
copie d'une frame précédente. La Galerie de Frames vous permet de visionner n'importe quelle
keyframe et vous pouvez ainsi organiser l'ordre des frames et afficher une durée pour chacune d'elle.
Vous trouverez une description précise de la Galerie de Frames
plus loin dans ce chapitre.
Pour ceux d'entre vous qui êtes déjà familiarisés avec les fonctions des GIF animés de Xtreme Web
Designer 5 (ou des versions précédentes), la méthode va vous paraître simple. La différence est qu'avec
des fichiers Flash, Xtreme Web Designer 5 peut créer automatiquement toutes les étapes du tween, afin
de créer des animations plus fluides et plus compactes que celles des GIF animés.
Note :
les objets que vous souhaitez animer d'une frame à l'autre doivent être nommés. Tous les autres objets
resteront visibles mais seront statiques, et ce pour la durée de la frame jusqu'à la prochaine keyframe.
Ainsi, pour supprimer un objet de l'animation, il vous suffit de le supprimer de la première keyframe sur
laquelle vous souhaitez ne plus le voir apparaître.
Page 641
Votre première animation
Comment créer une nouvelle animation :
Créez un nouveau document d'animation comme suit :
 Sélectionnez Fichier -> Nouveau -> Animation
 Ou bien cliquez sur le bouton Nouvelle animation de la barre de boutons Standard.
Un nouveau document s'ouvre, et vous verrez la barre de
bouton d'animation apparaître, qui contient des boutons
intéressants.
Un
nouvea
u
docum
ent
s'ouvre
, et
vous
verrez
la barre
de
bouton
d'anima
tion
apparaî
tre, qui
contien
t des
bouton
s
intéress
ants.
1. Dessinez une forme simple, comme un rectangle aux bords
arrondis grâce à l'Outil rectangle (ou tout autre forme).
2. Cliquez sur l'icone Appliquer nom de la barre d'info du
Sélecteur et nommez la forme « forme ».
3. Cliquez sur le bouton Copier frame afin de créer votre
2ème keyframe.
3. Transformez les forme comme vous voulez. Vous pouvez
l'ajuster enn utilisant un des six types d'animations décrits
plus haut.
4. Appuyez sur bouton Aperçu Flash pour voir l'animation.
La période d'affichage par défaut est d'une demie seconde pur chaque keyframe. Pour produire une
animation plus longue, reportez-vous à la section « Taux de frame et étapes tween pour les films » plus
loin dans ce chapitre.
Vous n'êtes pas limité à un seul objet animé ; vous pouvez en mettre autant que vous voulez sur chaque
keyframe. Tant que vous les faites apparaître transformés (et que vous leur donnez un nom unique à
chacun), ils seront animés sur le keyframe suivant.
Ici un autre exemple.
Page 642
Le premier keyframe contient du texte simple et une forme simple à l'intérieur d'un rectangle statique.
Sur le keyframe suivant, le texte a été agrandi et assombri, le rectangle bleu a été tourné de 90 degrés et
la transparence modifiée.
Voici comment l'animation est construite.
Keyframe 1
Etapes intermédiaires de
tween produites par Xtreme
Web Designer 5
Keyframe 2
Dans cette animation, l'objet texte devient plus grand, et en même temps, le rectangle aux bords ronds
tourne et disparaît.
Page 643
Exporter un fichier Flash
Pour exporter votre animation comme fichier Flash :
Sélectionnez Fichier > Exportation puis sélectionnez le format Flash sous Sauvegarder sous
.
Ou cliquez sur le bouton Exportation d'animation Flash
.
Vous sauvegardez ainsi le fichier SWF à l'emplacement choisi.
Insérer un objet Flash dans Xtreme Web Designer 5
Pour voir votre animation telle qu'elle apparaîtra dans sur une page
Internet, cliquez sur le bouton Aperçu Flash
.
Sur l'image d'aperçu vous voyez votre animation terminée ainsi que des informations utiles telles que les
dimensions de l'animation, la taille du fichier, etc.
Il y a deux façons d'incruster ce fichier Flash dans votre site Internet. Les utilisateurs avancés ou ceux qui
créent directement du HTML ou utilisent un outil tiers de création web, peuvent insérer une section de
HTML.
Pour ceux qui utilisent Xtreme Web Designer 5, vous pouvez utiliser un objet fictif
sur votre page Internet.
Insérer un objet Flash dans Xtreme Web Designer 5
Dans votre page Internet, créez un objet fictif, qui peut être par ex. un simple rectangle ou une image.
Positionnez et donnez les dimensions de votre choix à l'objet fictif à l'endroit où vous voulez voir
apparaître votre animation Flash.
Puis, dans la boîte de dialogue des propriétés Internet (Ctrl+Maj+W), sélectionnez l'onglet objets
fictifs et Remplacer par Flash dans Parcourir pour localiser le fichier .SWF de votre choix. Cliquez
sur Appliquer
.
Maintenant, lorsque vous faites un aperçu de votre site Internet, l'objet fictif est remplacé par l'animation
Flash.
Utilisateurs HTML avancés
pour placer votre animation SWF dans votre HTML, cliquez sur le lien Aperçu HTML
de l'écran d'aperçu Flash pour obtenir le code que vous pourrez coller dans votre page Internet en
utilisant votre éditeur HTML préféré.
Remarque : vous devez modifier le nom du fichier SWF dans le code pour le faire correspondre au nom
actuel de votre fichier SWF exporté. Vous devez aussi placer votre fichier SWF dans le même répertoire
que celui de votre page Internet pour que le code puisse fonctionner. Si vous placez le fichier SWF dans
un autre répertoire, vous devrez modifier le code HTML en conséquence.
Page 644
Insérer un objet Flash dans Xtreme Web Designer 5
Pour voir votre animation telle qu'elle apparaîtra dans sur une page
Internet, cliquez sur le bouton Aperçu Flash
.
Sur l'image d'aperçu vous voyez votre animation terminée ainsi que des informations utiles telles que les
dimensions de l'animation, la taille du fichier, etc.
Il y a deux façons d'incruster ce fichier Flash dans votre site Internet. Les utilisateurs avancés ou ceux qui
créent directement du HTML ou utilisent un outil tiers de création web, peuvent insérer une section de
HTML.
Pour ceux qui utilisent Xtreme Web Designer 5, vous pouvez utiliser un objet fictif
sur votre page Internet.
Insérer un objet Flash dans Xtreme Web Designer 5
Dans votre page Internet, créez un objet fictif, qui peut être par ex. un simple rectangle ou une image.
Positionnez et donnez les dimensions de votre choix à l'objet fictif à l'endroit où vous voulez voir
apparaître votre animation Flash.
Puis, dans la boîte de dialogue des propriétés Internet (Ctrl+Maj+W), sélectionnez l'onglet objets
fictifs et Remplacer par Flash dans Parcourir pour localiser le fichier .SWF de votre choix. Cliquez
sur Appliquer
.
Maintenant, lorsque vous faites un aperçu de votre site Internet, l'objet fictif est remplacé par l'animation
Flash.
Utilisateurs HTML avancés
pour placer votre animation SWF dans votre HTML, cliquez sur le lien Aperçu HTML
de l'écran d'aperçu Flash pour obtenir le code que vous pourrez coller dans votre page Internet en
utilisant votre éditeur HTML préféré.
Remarque : vous devez modifier le nom du fichier SWF dans le code pour le faire correspondre au nom
actuel de votre fichier SWF exporté. Vous devez aussi placer votre fichier SWF dans le même répertoire
que celui de votre page Internet pour que le code puisse fonctionner. Si vous placez le fichier SWF dans
un autre répertoire, vous devrez modifier le code HTML en conséquence.
Page 645
La galerie de frames (images)
Pour ouvrir la galerie de frames, sélectionnez Services > Galeries >
Galerie de frames ou cliquez sur l'icône de la galerie de frames dans la
barre d'outils Galeries
.
Vous voyez ensuite une liste des key frames (images clés) dans votre document. Cliquez sur une image
pour l'afficher.
Une galerie de frames typique. L'image/Frame 2 est sélectionnée et donc visible.
La Galerie de Frames
affiche les frames du haut vers le bas, c'est-à-dire que la première frame est située sur le dessus et
chaque nouvelle frame que vous ajoutez se retrouve placée au début de la liste. Vous pouvez modifier
l'ordre des frames en les faisant glisser. Vous pouvez supprimer des frames, copier une frame
sélectionnée (elle se retrouvera alors ajoutée à la fin) ou encore créer des frames vierges à l'aide de
boutons prévus à cet effet.
L'ordre des frames est inversé par rapport aux versions précédentes de Xara Xtreme.
Le bouton Propriétés est très important dans la mesure où il ouvre la boîte de dialogue des Propriétés
des animations
qui contrôle les aspects non seulement de l'image sélectionnée mais également de l'animation dans son
ensemble.
Page 646
La boîte de dialogue des propriétés des animations
Il existe un raccourci pour afficher la boîte de dialogue des Propriétés des animations : il suffit de
double-cliquer sur le nom d'une image (frame) dans la Galerie des frames.
Les boutons Tous les frames visibles (oeil) et Éditer tous les
frames
(flèche) dans la Galerie des frames vous permettent de voir ou
éditer tous les frames à la fois, l'une après l'autre.
Cela est particulièrement utile si vous souhaitez sélectionner des objets situés sur plusieurs frames.
Remarque : lorsque vous copiez un frame, la copie du frame sélectionné est automatiquement placé à la
fin. Pour insérer un nouveau frame, entre les frames 4 et 5 par exemple, il suffit de sélectionner le frame
4, de cliquer sur Copier
, puis de faire glisser la nouvelle copie à l'emplacement désiré entre les frames 4 et 5.
Remarque
: les noms de frames importent peu et peuvent être choisis librement. Ils ne doivent pas nécessairement
être frame 1, frame 2, etc. Les animations jouent toujours les frames du haut vers le bas, quels que soient
les noms respectifs.
Copier des objets
Vous pouvez copier des objets d'une frame vers une autre avec la méthode habituelle (c'est-à-dire en
copier le contenu, créer une nouvelle frame puis coller dans la nouvelle frame). L'option Édition >
Copier à l'identique
(Ctrl+M+V) est particulièrement utile pour réaliser cela, car elle copiera toujours les objets à l'endroit où
ils se trouvaient dans le document d'origine, cette fois dans la nouvelle frame.
Lorsque vous copiez un objet, il conserve le même nom. Veillez à ne pas avoir plusieurs objets portant le
même nom sur un même frame. Cela peut générer des erreurs.
Page 647
Copier des objets
Vous pouvez copier des objets d'une frame vers une autre avec la méthode habituelle (c'est-à-dire en
copier le contenu, créer une nouvelle frame puis coller dans la nouvelle frame). L'option Édition >
Copier à l'identique
(Ctrl+M+V) est particulièrement utile pour réaliser cela, car elle copiera toujours les objets à l'endroit où
ils se trouvaient dans le document d'origine, cette fois dans la nouvelle frame.
Lorsque vous copiez un objet, il conserve le même nom. Veillez à ne pas avoir plusieurs objets portant le
même nom sur un même frame. Cela peut générer des erreurs.
Page 648
Photos
Parce que les fichiers Flash sont généralement constitués de formes vectorielles, et que les
transformations sont relativement simples, ces fichiers peuvent être de très petite taille. Les photos et les
bitmaps peuvent être incrustés dans des animations Flash, mais à moins que vous ne fassiez attention,
vous obtiendrez des fichiers très lourds. Il est possible d'effectuer toutes les transformations en Flash sur
des bitmap ou des photos (c'est-à-dire que vous pouvez déplacer, redimensionner, écraser, faire tourner,
produire ou recolorer des transitions).
Les fichiers Flash peuvent contenir des images PNG et JPEG tout comme les fichiers .xar, et Web
Designer crée automatiquement des photos à la bonne résolution lorsque le fichier Flash est créé. Ainsi
par exemple, vous pouvez charger une image numérique en haute résolution, la réduire à, disons, 200
pixels, ce qui veut dire qu'une image de 200 pixels sera incluse, et non le JPEG en pleine résolution.
Lorsque des photos ayant une résolution plus haute sont converties et réduites pour pouvoir être incluses
dans des fichiers Flash, les paramètres de compression JPEG (boîte de dialogue des propriétés de
l'animation, onglet Options Flash) peuvent être utilisés pour contrôler le niveau de compression de vos
images JPEG. Veuillez vous reporter plus bas.
Lors du tweening de bitmaps ou de photos, une seule copie du bitmap est sauvegardée dans le fichier
Flash : cela vous permet d'effectuer des transformations sur le bitmap avec peu de temps de traitement.
En d'autres termes, ce n'est pas parce que le bitmap apparaît sur les frames 1, 2 et 3 de votre animation
que trois copies du bitmap sont incrustées dans le fichier Flash.
Bitmaps non JPEG
Les autres types de bitmaps, par exemple les bitmaps BMP, TIFF ou PNG, sont généralement
beaucoup plus lourds et ainsi moins appropriés pour une utilisation dans les animations Flash (la
compression JPEG est bien meilleure que le format PNG pour les photos). Cependant, si vous insérez
une image PNG basse résolution (96 ppp ou moins - vous verrez la ´taille de la résolution dans la barre
de statut) alors celle-ci est conservé en tant qu'image PNG dans le fichier Flash. Les images avec une
résolution plus élevée (>96 ppp) seront converties au format JPEG (JPEG transparent si besoin).
Vous pouvez contrôler la compression utilisée pou cette conversion JPEG automatique en utilisation la
réglette dans l'onglet des Options Flash de la boîte de dialogue des Propriétés de l'animation
. La valeur habituelle de compression est de 75 mais vous pouvez faire varier la qualité, prévisualiser
l'animation et voir rapidement les économies de qualité et de taille réalisées.
Page 649
Les bitmaps 256 couleurs ou moins (comme les GIF) ne sont pas encodés en tant que JPEG et seront
incrustés au moyen de la compression JPEG, qui est généralement le type de compression le mieux
approprié à ce genre d'images.
Qualité Bitmap
Flash Player 8 et les versions suivantes possèdent une qualité d'affichage bitmap supérieure. On le
constate principalement lors de la rotation ou du redimensionnement des bitmaps et des photos tandis
que les autres versions du Player ont tendance à produire des mouvements pixélisés et plutôt saccadés.
Vous pouvez indiquer la version de Player que vous possédez en faisant un clic droit sur votre animation
Flash dans votre navigateur Internet, puis en regardant dans le menu « À propos de ».
Il est toutefois recommandé d'exporter votre animation Flash dans la version 8 si vous travaillez avec des
bitmaps ou des photos. Vous pouvez paramétrer cela depuis l'onglet Options Flash de la boîte de
dialogue Propriétés de l'animation
.
Page 650
Bitmaps non JPEG
Les autres types de bitmaps, par exemple les bitmaps BMP, TIFF ou PNG, sont généralement
beaucoup plus lourds et ainsi moins appropriés pour une utilisation dans les animations Flash (la
compression JPEG est bien meilleure que le format PNG pour les photos). Cependant, si vous insérez
une image PNG basse résolution (96 ppp ou moins - vous verrez la ´taille de la résolution dans la barre
de statut) alors celle-ci est conservé en tant qu'image PNG dans le fichier Flash. Les images avec une
résolution plus élevée (>96 ppp) seront converties au format JPEG (JPEG transparent si besoin).
Vous pouvez contrôler la compression utilisée pou cette conversion JPEG automatique en utilisation la
réglette dans l'onglet des Options Flash de la boîte de dialogue des Propriétés de l'animation
. La valeur habituelle de compression est de 75 mais vous pouvez faire varier la qualité, prévisualiser
l'animation et voir rapidement les économies de qualité et de taille réalisées.
Les bitmaps 256 couleurs ou moins (comme les GIF) ne sont pas encodés en tant que JPEG et seront
incrustés au moyen de la compression JPEG, qui est généralement le type de compression le mieux
approprié à ce genre d'images.
Qualité Bitmap
Flash Player 8 et les versions suivantes possèdent une qualité d'affichage bitmap supérieure. On le
constate principalement lors de la rotation ou du redimensionnement des bitmaps et des photos tandis
que les autres versions du Player ont tendance à produire des mouvements pixélisés et plutôt saccadés.
Vous pouvez indiquer la version de Player que vous possédez en faisant un clic droit sur votre animation
Flash dans votre navigateur Internet, puis en regardant dans le menu « À propos de ».
Il est toutefois recommandé d'exporter votre animation Flash dans la version 8 si vous travaillez avec des
bitmaps ou des photos. Vous pouvez paramétrer cela depuis l'onglet Options Flash de la boîte de
dialogue Propriétés de l'animation
.
Page 651
Qualité Bitmap
Flash Player 8 et les versions suivantes possèdent une qualité d'affichage bitmap supérieure. On le
constate principalement lors de la rotation ou du redimensionnement des bitmaps et des photos tandis
que les autres versions du Player ont tendance à produire des mouvements pixélisés et plutôt saccadés.
Vous pouvez indiquer la version de Player que vous possédez en faisant un clic droit sur votre animation
Flash dans votre navigateur Internet, puis en regardant dans le menu « À propos de ».
Il est toutefois recommandé d'exporter votre animation Flash dans la version 8 si vous travaillez avec des
bitmaps ou des photos. Vous pouvez paramétrer cela depuis l'onglet Options Flash de la boîte de
dialogue Propriétés de l'animation
.
Page 652
Fréquence des frames d'animation et étapes
de tweening
Les animations Flash défilent selon une fréquence d'animation fixe. Plus la fréquence de l'animation est
élevée, plus le résultat obtenu sera fluide, et plus le fichier Flash sera lourd. Le réglage par défaut de
Xtreme Web Designer 5 est de 24 images par seconde, mais vous pouvez modifier ce taux.
Lorsque vous créez une keyframe, vous devez déterminer la durée de l'intervalle jusqu'à la keyframe
suivante. Cela signifie que si une keyframe dure une demie-seconde, la durée de l'animation entre cette
keyframe et la suivante sera d'une demie-seconde. Les étapes intermédiaires ne sont pas affichées et
engendrées seulement lors de la création du fichier Flash.
Avec un taux de 24 keyframes par seconde, 11 étapes intermédiaires seront générées par Xtreme Web
Designer 5 dans l'animation Flash, soit 12 frames en tout. (On ne voit pas ces frames intermédiaires dans
Xtreme Web Designer 5, elles sont simplement générées lorsque vous créez le fichier Flash.)
La Galerie des Frames vous montre toujours la durée d'affichage de chaque keyframe. Dans cet
exemple, trois frames ont chacune une durée d'affichage de 0,5 seconde, ce qui fait un temps total
d'animation de 1,5 seconde avant que l'animation ne se répète.
Afin de créer des tweens plus longs, c'est-à-dire afin de ralentir la vitesse de l'animation, réduisez la
durée de l'affichage à l'aide de la boîte de dialogue des Propriétés des Animations
.
La façon la plus simple de modifier la durée d'affichage d'une frame est de faire un double clic sur le nom
de la frame que vous souhaitez modifier, ce qui fait apparaître la boîte de dialogue, de saisir la nouvelle
durée en secondes et de cliquer sur OK ou Appliquer
.
Page 653
Recouper ou clipper des images
Dans peu de temps, vous allez commencer à créer des animations Flash comme celles que vous voyez
sur Internet, par exemple avec des titres ou des photos qui arrivent par les côtés.
Pour créer une animation comme celle-ci, tout ce dont vous avez besoin est de définir la taille de la page
dans Xtreme Web Designer 5 pour lui donner la taille que vous souhaitez donner à votre animation Flash.
Donc par exemple, si vous souhaitez que votre bannière Flash fasse 468 pixles de large et 60 de haut,
définissez la taille de la page dans votre document d'animation à 468x60. Pour définir la taille de la page,
allez dans l'onglet Page de la boîte de dialogue des options (ou choisissez Fichier -> Options pages
) et définissez les champs Largeur et Hauteur.
Lorsque vous exportez ou prévisualisez l'animation Flash, celle-ci est automatiquement clippée sur la taille
de la page que vous avez définie. Ainsi, il est facile d'arranger votre animation de sorte que les objets
glissent vers l'intérieur et l'extérieur de l'animation visible. Par exemple, si vous placez un objet animé à
gauche de la page sur un keyframe puis à droite de la page sur le keyframe suivant, dans l'animation on
aura l'impression que l'objet arrive en glissant par la gauche du design et qu'il disparaît sur le côté droit.
Remarque : lorsque vous ouvrez des documents créés avec des versions précédentes de Xara Xtreme,
ceux-là ne seront pas clippés sur la page (la taille de la page était énorme) ; au lieu de cela, ils sont
clippés sur la taille du dessin. Vous pouvez paramétrer cela dans la boîte de dialogue des propriétés des
animations.
Si vous définissez la zone à enregistrer en tant que Drawing, cela créera une animation Flash qui ne sera
pas plus grande que nécessaire - c'est-à-dire de la même taille que les bords extérieurs de l'animation.
Ceci peut être utile si vous n'avez pas besoin d'une taille de page spécifique.
Page 654
Vitesse de l'animation
Lorsque vous créez un nouveau keyframe, il dure une demie seconde par défaut. Et donc l'animation
partant de ce keyframe et allant jusqu'au keyframe suivant durera une seconde. Plus la durée que vous
définissez est longue, et plus l'animation sera lente. Pour définir la durée des frames, sélectionnez tout
d'abord le frame de votre choix dans la Galerie de frames (en cliquant dessus), puis cliquez sur le
bouton des propriétés de l'animation
(ou faites un double clic sur le nom du frame).
Si vous définissez l'affichage du frame à 2 secondes, cela signifie que l'animation mettra 2 secondes à
tweener de ce frame au frame suivant.
Remarque : la boîte de dialogue des propriétés des animations ne dépend pas d'un mode particulier
et vous pouvez la garder constamment à l'écran. Si vous cliquez sur le bouton Appliquer
, la boîte de dialogue restera à l'écran. Ses contenus sont mis à jour lorsque vous sélectionnez un nouveau
frame, et pour chacun d'eux, vous pouvez définir la durée d'affichage de votre choix.
Page 655
Fluidité de l'animation
Les vidéos Flash sont jouées à un taux de frame constant. Plus le taux de frame est rapide, plus
l'animation est fluide. Par défaut, Xtreme Web Designer 5 affiche 24 frames par seconde. Pour changer
ce taux, sélectionnez l'onglet des Options Flash de la boîte de dialogue des Propriétés de l'animation
.
L'onglet des options Flash, dans lequel vous pouvez modifier la vitesse du film ainsi que la version
d'exportation Flash.
Remarque :
plus le taux de frame est rapide, et plus le fichier Flash qui en résulte est lourd. Vous constaterez cela si
votre animation est composée essentiellement d'objets apparaissant et disparaissant avec une animation
relativement lente, et vousp ourrez réduire le taux de frame à moins de 24 frames par secondes. Si vous
avez beaucoup d'action rapide, il sera peut-être nécessaire d'augmenter le taux de frame, mais il est
cependant rarement nécessaire d'avoir un taux supérieur à 50 frames par seconde.
Page 656
Rotation
Xtreme Web Designer 5 calcule et génère automatiquement les tween frames en calculant la façon de
transformer les formes d'une keyframe à l'autre. Cependant il est parfois impossible de savoir exactement
quel type de rotation est souhaité.
Prenez cet exemple. Supposez que vous fassiez un tweening du premier cadran vers le second :
vous vous attendez à ce qu'il tourne dans le sens des aiguilles d'une montre, mais bien sûr il pourrait aussi
tourner dans le sens contraire des aiguilles d'une montre :
en fait il y a encore d'autres façons dont il pourrait tourner. Dans les exemples ci-dessus, on suppose
que l'aiguille tourne autour d'une de ses extrémités ; cependant vous pouvez tout aussi bien faire un
tweening d'un état à l'autre en procédant à une rotation en ligne droite à partir du centre de l'objet, ce qui
vous donnerait ceci :
Si vous regardez de plus près, vous constaterez que l'aiguille tourne autour de son centre et non autour
d'une de ses extrémités et que le point central se déplace selon une ligne droite d'une keyframe à une
autre. Par défaut, Xtreme Web Designer 5 fait tourner les objets de cette façon.
La commande Rotation
Pour forcer la rotation à se produire autour de tout autre point, vous pouvez utiliser un mot clé spécial
« rotation » joint au nom de l'objet. (Voir la Galerie de Noms plus bas). Ou bien vous pouvez utiliser «
rotation+ » pour forcer la rotation à s'effectuer dans le sens des aiguilles d'une montre, ou « rotation- »
pour une rotation dans le sens contraire des aiguilles d'une montre.
Pour prendre l'exemple simple d'animation des deux keyframes exposé à la page précédente, où l'aiguille
des heures doit aller de 12 heures à 8 heures. Si vous nommez l'objet aiguille « rotation+ aiguille » vous
obtiendrez une animation dans laquelle les aiguilles tournent dans le sens habituel des aiguilles d'une
montre. Si vous le nommez « rotation- aiguille », l'aiguille tournera alors dans le sens contraire des
aiguilles d'une montre.
Si vous n'indiquez aucune commande de rotation, le tween prendra le chemin le plus court entre les
objets d'une keyframe à l'autre, en tournant autour de son centre. Avec une commande de rotation jointe
au nom de l'objet, le point de rotation réel est calculé, qui, dans l'exemple, est la « base élargie » de
l'aiguille.
Note :
Page 657
il n'est pas possible de faire tourner un objet à 360° entre les keyframes si le point de rotation n'est pas le
centre. Par exemple, pour faire faire un tour complet aux aiguilles de la montre, vous devrez créer une
keyframe intermédiaire.
Page 658
La commande Rotation
Pour forcer la rotation à se produire autour de tout autre point, vous pouvez utiliser un mot clé spécial
« rotation » joint au nom de l'objet. (Voir la Galerie de Noms plus bas). Ou bien vous pouvez utiliser «
rotation+ » pour forcer la rotation à s'effectuer dans le sens des aiguilles d'une montre, ou « rotation- »
pour une rotation dans le sens contraire des aiguilles d'une montre.
Pour prendre l'exemple simple d'animation des deux keyframes exposé à la page précédente, où l'aiguille
des heures doit aller de 12 heures à 8 heures. Si vous nommez l'objet aiguille « rotation+ aiguille » vous
obtiendrez une animation dans laquelle les aiguilles tournent dans le sens habituel des aiguilles d'une
montre. Si vous le nommez « rotation- aiguille », l'aiguille tournera alors dans le sens contraire des
aiguilles d'une montre.
Si vous n'indiquez aucune commande de rotation, le tween prendra le chemin le plus court entre les
objets d'une keyframe à l'autre, en tournant autour de son centre. Avec une commande de rotation jointe
au nom de l'objet, le point de rotation réel est calculé, qui, dans l'exemple, est la « base élargie » de
l'aiguille.
Note :
il n'est pas possible de faire tourner un objet à 360° entre les keyframes si le point de rotation n'est pas le
centre. Par exemple, pour faire faire un tour complet aux aiguilles de la montre, vous devrez créer une
keyframe intermédiaire.
Page 659
Groupes
Les groupes sont traités de façon particulière lors de la création d'animations. Au lieu de sauvegarder les
dénominations individuelles de chaque partie d'un groupe, vous pouvez à la place donner un nom au
groupe entier puis copier le groupe sur la keyframe suivante. Xtreme Web Designer 5 se chargera
d'animer la totalité du groupe d'une keyframe à l'autre. Vous pouvez bien sûr appliquer les
transformations habituelles à groupe (modifier la taille, faire tourner, mais pas appliquer de transparence à
tout le groupe - voir la page suivante).
Si vous souhaitez animer certaines parties du groupe d'une autre façon que le reste du groupe, vous
devez alors nommer ces parties séparément (Ctrl+clic pour sélectionner un objet à l'intérieur d'un groupe,
puis nommez-le comme à votre habitude).
Remarque :
si vous dégroupez, que vous effectuez des changements sur certaines parties du groupe puis que vous
regroupez les objets :
 vous devez alors appliquer à nouveau le nom au nouveau groupe (sélectionnez le groupe puis
faites un double clic sur le nom dans la galerie de Noms).
 Vous ne devez pas modifier l'ordre d'apparition des objets dans le groupe.
 Vous ne devez ni ajouter ni supprimer des éléments dans le groupe.
Transparence dans le groupe
Si vous souhaitez rendre un groupe transparent, vous devez appliquer la transparence à chacun des
objets du groupe. Il y a deux façons d'arriver à ce résultat :
 Sélectionnez chaque objet du groupe tour à tour et appliquez-leur une transparence.
 Ou bien décochez l'option Rendre les groupes transparents dans la boîte de dialogue des
Options (Services > Options puis onglet Général).
 Si vous faites cela, lorsque vous appliquez la transparence à tout le groupe, Xtreme Web
Designer 5 l'applique à en fait individuellement à chaque élément du groupe, et non au groupe
lui-même.
Page 660
Transparence dans le groupe
Si vous souhaitez rendre un groupe transparent, vous devez appliquer la transparence à chacun des
objets du groupe. Il y a deux façons d'arriver à ce résultat :
 Sélectionnez chaque objet du groupe tour à tour et appliquez-leur une transparence.
 Ou bien décochez l'option Rendre les groupes transparents dans la boîte de dialogue des
Options (Services > Options puis onglet Général).
 Si vous faites cela, lorsque vous appliquez la transparence à tout le groupe, Xtreme Web
Designer 5 l'applique à en fait individuellement à chaque élément du groupe, et non au groupe
lui-même.
Page 661
Quelles fonctions de Xtreme Web Designer 5
sont prises en charge par Flash ?
Le rendu vectoriel de Flash est vraiment primitif à côté de celui de Xtreme Web Designer 5, et il y a
donc un grand nombre de fonctions avancées de Xtreme Web Designer 5 que vous ne pouvez utiliser,
telles que l'estompage, les transparences et types de remplissage complexes ou les ombres douces. Les
lignes (les traits) ne peuvent avoir qu'une épaisseur constante, et se terminer de façon arrondie. Les
pointillés ne sont pas pris en charge. L'épaisseur minimale de ligne est un pixel, et donc les lignes plus
fines de Xtreme Web Designer 5 seront affichées avec une épaisseur de un pixel dans Flash.
Il y a deux aspects lorsque vous produisez des dessins compatibles avec Flash. Le premier est que vous
vous limitez aux fonctions prises en charge directement par le lecteur Flash. Le deuxième est que, lorsque
vous produisez des animations, le nombre de caractéristiques pouvant être tweenées ou animées est
encore plus restreint.
Les fonctions de dessin de Xtreme Web Designer 5 prises en charge par Flash :
 Tous les dessins normaux de lignes et de formes (bien que Flash soit beaucoup moins précis que
Xtreme Web Designer 5, ce qui fait que vous constaterez parfois des inexactitudes dans les
lignes et les formes).
 Les remplissages de couleur dégradées plats, circulaires et elliptiques.
 Les remplissages de couleurs dégradées à plusieurs étapes, y compris les remplissages linéaires
et elliptiques. Huit couleurs maximum.
 Transparence plate. Type mélange uniquement.
 La transparence dégradée est prise en charge pour les objets avec un remplissage de couleur plat
(non gradué). Vous pouvez donc avoir des objets avec des couleurs dégradées avec une
transparence plate ou des objets aux couleurs plates avec une transparence dégradée, mais pas
les deux ensemble.
 Les contours à épaisseur constante et aux bouts arrondis et les raccords de lignes (la version 8
des fichiers Flash prend en charge les autres types de raccords et de bouts).
 Texte, y compris le crénage. Vous pouvez utiliser toutes les polices de caractère de votre choix.
Les contours de caractères de toute police utilisée sont incrustés dans le fichier Flash. Cela est
beaucoup plus efficace que, par exemple, l'incrustation dans les documents PDF.
 Texte sur une courbe. Remarque : la ligne utilisée pour la courbe doit être rendue invisible pour
que l'animation fonctionne.
 Bitmap et remplissages bitmap.
 Bitmap et remplissages bitmap continus (colorés).
 Saturation photo, température de la couleur et flou (mais pas la luminosité / changement de
contraste).
 Le nuage fractal et les remplissages plasma fonctionnent, mais sont convertis en bitmaps, donc
ceci n'est pas très efficace.
Tandis que certains effets de Xtreme Web Designer 5, comme les ombres douces, fonctionnent dans des
fichiers statiques, ceux-là sont exportés en tant que bitmaps dans le fichier Flash et ne sont donc pas très
efficaces et non adaptés pour les animations.
Ce qui peut être animé :
Comme énoncé au début de ce chapitre, voici les règles d'or des modifications pouvant être effectuées
d'un keyframe à l'autre :
 Déplacer : déplacer des objets d'une position à l'autre.
 Redimensionner : agrandir ou réduire la taille des objets.
 Ecraser ou déformer : écraser ou déformer des objets.
 Rotation : faire tourner des objets.
 Transparence : ajuster la transparence (plate) des objets.
Page 662
 Modification des couleurs : modifier la couleur (plate) de remplissage des objets.
 Ou toute combinaison des éléments ci-dessus.
De plus, il existe quelques cas spéciaux de transformation des couleurs d'une photo qui sont pris en
charge par Flash. Vous pouvez modifier la saturation (de manière à pouvoir tweener une photo en pleine
couleur en une photo en noir et blanc) ; vous pouvez aussi ajuster la commande de température de
couleur (chaud / froid), ainsi que la valeur de flou. Cette dernière vous permet de tweener une photo
floue pour la rendre nette. Mais notez bien que cela ne fonctionne qu'avec les valeurs de flou et non de
netteté. Il y a aussi une légère différence dans la manière dont Flash rend les photos floues. Flash rend
toute la photo floue, bords compris, tandis que le flou de Xtreme Web Designer 5 ne rend que l'intérieur
de la photo flou et conserve les bords nets.
Deuxièmement, un autre cas spécial : vous pouvez animer du texte le long d'une courbe. Ceci est spécial
car vous pouvez vous en servir pour transformer un texte se trouvant le long d'une courbe en un texte se
trouvant le long d'une courbe complètement différente. Ce qui se passe en fait est un tweening à partir de
la position du caractère dans un keyframe vers la position du caractère correspondante dans le keyframe
suivant. Cela peut produire des effets intéressants.
Remarque :
la ligne utilisée pour la courbe doit être rendue invisible pour que l'animation fonctionne.
Objets statiques
Vous pouvez ajouter de nouveaux objets simplement en les faisant glisser sur la keyframe de votre
choix. Ils apparaîtront dans l'animation au début de la frame et disparaîtront à la keyframe suivante à
moins qu'ils n'apparaissent également sur cette keyframe. Donc le moyen le plus simple de voir apparaître
un objet de façon statique sur toutes les frames est de vous assurer qu'il est copié sur toutes les frames.
L'optimisation pour Flash de Xtreme Web Designer 5 est très efficace et vous remarquerez qu'avoir plus
d'une copie prend à peine plus de place dans le fichier (ceci est valable pour les copies multiples d'objets
à n'importe quel endroit).
Page 663
Objets statiques
Vous pouvez ajouter de nouveaux objets simplement en les faisant glisser sur la keyframe de votre
choix. Ils apparaîtront dans l'animation au début de la frame et disparaîtront à la keyframe suivante à
moins qu'ils n'apparaissent également sur cette keyframe. Donc le moyen le plus simple de voir apparaître
un objet de façon statique sur toutes les frames est de vous assurer qu'il est copié sur toutes les frames.
L'optimisation pour Flash de Xtreme Web Designer 5 est très efficace et vous remarquerez qu'avoir plus
d'une copie prend à peine plus de place dans le fichier (ceci est valable pour les copies multiples d'objets
à n'importe quel endroit).
Page 664
Transformation des couleurs - Animer des
changements de couleur
Voici ce qu'il est possible de faire ou non avec les transformations de couleurs dans le Flash Xtreme
Web Designer 5 :
 Vous pouvez animer des changement de couleurs simples et plates d'objets d'un keyframe à
l'autre.
 Vous pouvez modifier la couleur du contour indépendamment de celle du remplissage.
 Vous pouvez modifier les couleurs continues d'une photo.
 Vous ne pouvez pas régler la position des remplissages en dégradé.
Page 665
Transparence
Comme mentionné plus haut, vous pouvez régler la transparence régulière des objets (pas de
transparence de groupe) et Flash prend en charge cela (p