A propos des tranches

Les pages web peuvent contenir de nombreux éléments (texte HTML, images bitmap et images vectorielles, par exemple). Dans Illustrator, vous pouvez utiliser des tranches pour définir les limites de différents éléments web dans votre illustration. Par exemple, si votre illustration contient une image bitmap à optimiser au format JPEG, tandis que le reste de l’image doit être optimisé au format GIF, vous pouvez isoler l’image bitmap à l’aide d’une tranche. Lorsque vous enregistrez votre illustration en tant que page web à l’aide de la commande Enregistrer pour le web et les périphériques, vous pouvez enregistrer chaque tranche comme un fichier indépendant avec ses propres format, paramètres et table de couleurs.

Les tranches d’un document Illustrator correspondent aux cellules d’un tableau dans la page web produite. Par défaut, chaque tranche est exportée en tant que fichier image qui est ensuite englobé dans une cellule de tableau. Si vous souhaitez qu’une cellule de tableau contienne du texte HTML et une couleur d’arrière-plan à la place d’un fichier image, choisissez l’option Pas d’image comme type de tranche. Si vous souhaitez convertir du texte Illustrator en texte HTML, choisissez l’option Texte HTML comme type de tranche.

Illustration découpée à l’aide de différents types de tranches
Illustration découpée à l’aide de différents types de tranches

A. Tranche Pas d’image B. Tranche Image C. Tranche Texte HTML 

Vous pouvez afficher les tranches sur le plan de travail et dans la boîte de dialogue Enregistrer pour le web et les périphériques. Illustrator numérote les tranches de gauche à droite et de haut en bas, à partir du coin supérieur gauche de l’illustration. Si vous modifiez la disposition ou le nombre total de tranches, les numéros sont mis à jour pour refléter le nouvel ordre.

Lorsque vous créez une tranche, Illustrator découpe également l’illustration environnante en tranches automatiques afin de conserver la mise en page à l’aide d’une table d’équivalences basée sur le web. Il existe deux types de tranches automatiques : les tranches auto et les sous-tranches. Les tranches auto correspondent aux zones de l’illustration non définies comme tranches. Illustrator régénère les tranches automatiques chaque fois que vous ajoutez ou modifiez des tranches. Les sous-tranches indiquent la manière dont seront divisées les tranches définies par l’utilisateur et qui se chevauchent. Bien que les sous-tranches soient numérotées et affichent un symbole de tranche, vous ne pouvez pas les sélectionner séparément de la tranche sous-jacente. Illustrator régénère les sous-tranches et les tranches automatiques au fur et à mesure que vous effectuez des modifications.

Création de tranches

  1. Utilisez l’une des méthodes suivantes :
    • Sélectionnez un ou plusieurs objets sur le plan de travail, puis choisissez la commande Objet > Tranche > Créer.

    • Sélectionnez l’outil Tranche  et faites glisser la souris sur la zone où vous souhaitez créer une tranche. Maintenez la touche Maj enfoncée tout en faisant glisser la souris pour créer une tranche de forme rectangulaire. Maintenez la touche Alt (Windows) ou Option (Mac OS) enfoncée tout en faisant glisser la souris pour partir du centre.

    • Sélectionnez un ou plusieurs objets sur le plan de travail, puis choisissez la commande Objet > Tranche > Créer d’après la sélection.

    • Positionnez des repères là où vous souhaitez découper l’illustration, puis choisissez la commande Objet > Tranche > Créer d’après les repères.

    • Sélectionnez une tranche existante et choisissez la commande Objet > Tranche > Dupliquer la tranche.

      Conseil : utilisez la commande Objet > Tranche > Créer pour que les dimensions de la tranche correspondent à la limite d’un élément de votre illustration. Si vous déplacez ou modifiez l’élément, la zone de la tranche s’adapte automatiquement pour englober la nouvelle illustration. Utilisez également cette commande pour créer une tranche qui adopte les caractéristiques de texte et de mise en forme de base d’un objet texte.

      Conseil : utilisez l’outil Tranche ou la commande Créer d’après la sélection ou Créer d’après les repères pour que les dimensions de tranche soient indépendantes de l’illustration sous-jacente. Les tranches créées à l’aide de l’une de ces méthodes apparaissent comme des éléments dans le panneau Calques, et vous pouvez les déplacer, les redimensionner et les supprimer de la même manière que d’autres objets vectoriels.

Sélection des tranches

Utilisez l’outil Sélection de tranche  pour sélectionner une tranche dans la fenêtre d’illustration ou dans la boîte de dialogue Enregistrer pour le web et les périphériques.

  • Cliquez sur une tranche pour la sélectionner.
  • Cliquez en maintenant la touche Maj enfoncée pour sélectionner plusieurs tranches. Dans la boîte de dialogue Enregistrer pour le web et les périphériques, vous pouvez également faire glisser la souris en maintenant la touche Maj enfoncée.
  • Pour sélectionner une tranche sous-jacente lors de la manipulation de tranches qui se chevauchent, cliquez sur sa partie visible.

    Vous pouvez également sélectionner des tranches dans la fenêtre d’illustration en utilisant l’une des méthodes suivantes :

  • Pour sélectionner une tranche créée à l’aide de la commande Objet > Tranche > Créer, sélectionnez l’illustration correspondante sur le plan de travail. Si la tranche est liée à un groupe ou un calque, sélectionnez l’icône cible adjacente au groupe ou calque dans le panneau Calques.
  • Pour sélectionner une tranche créée à l’aide de l’outil Tranche, de la commande Créer d’après la sélection ou de la commande Créer d’après les repères, utilisez le panneau Calques.
  • Cliquez sur le tracé de la tranche à l’aide de l’outil Sélection .
  • Pour sélectionner un segment de tracé ou un point d’ancrage de tranche, cliquez sur cet élément avec l’outil Sélection directe.

    Remarque : vous ne pouvez pas sélectionner des tranches automatiques. Ces tranches sont grisées.

Définition des options de tranche

Les options d’une tranche déterminent la manière dont son contenu apparaît et fonctionne sur la page web résultante.

  1. Utilisez l’une des méthodes suivantes avec l’outil Sélection de tranche.
    • Sélectionnez une tranche dans la fenêtre d’illustration, puis choisissez la commande Objet > Tranche > Options de tranche.

    • Cliquez deux fois sur une tranche dans la boîte de dialogue Enregistrer pour le web et les périphériques à l’aide de l’outil Sélection de tranche.

  2. Sélectionnez un type de tranche et définissez les options appropriées :

    Image

    Sélectionnez ce type de tranche si vous souhaitez que la zone de tranche corresponde à un fichier image dans la page web finale. Si vous souhaitez qu’un lien hypertexte soit associé à cette image, indiquez une URL et un cadre cible. Vous pouvez également inclure un message qui apparaîtra dans la barre d’état du navigateur lorsque le pointeur de la souris se trouve sur l’image, le texte de remplacement qui apparaîtra lorsque l’image n’est pas visible, ainsi que la couleur d’arrière-plan des cellules du tableau.

    Pas d’image

    Sélectionnez ce type de tranche si vous souhaitez que la zone de tranche contienne du texte HTML et une couleur d’arrière-plan dans la page web finale. Entrez le texte dans la zone de texte Texte affiché dans la cellule, puis appliquez une mise en forme à l’aide de balises HTML standard. Veillez à ne pas entrer plus de texte que ne peut en contenir la zone de la tranche. (Si vous entrez trop de texte, il débordera sur les tranches adjacentes, ce qui modifiera la disposition de votre page web. Cependant, comme le texte n’est pas visible sur le plan de travail, cela ne sera apparent que lorsque vous afficherez la page dans un navigateur web.) Définissez les options dans les menus déroulants pour spécifier l’alignement horizontal et vertical du texte dans la cellule du tableau.

    Texte HTML

    Ce type de tranche n’est disponible que lorsque vous créez une tranche en sélectionnant un objet de texte et que vous choisissez la commande Objet > Tranche > Créer. Le texte Illustrator est converti en texte HTML présentant des attributs de mise en forme standard dans la page web finale. Pour modifier le texte des tranches, vous devez le mettre à jour dans l’illustration. Définissez les options dans les menus déroulants correspondants pour spécifier l’alignement horizontal et vertical du texte dans la cellule du tableau. Vous pouvez également sélectionner une couleur d’arrière-plan pour la cellule du tableau.

    Conseil : pour modifier le texte des tranches de type Texte HTML dans la boîte de dialogue Options de tranche, choisissez l’option Pas d’image comme type de tranche. Cela rompt le lien avec l’objet texte sur le plan de travail. Pour annuler la mise en forme du texte, entrez <non formaté> comme premier mot dans l’objet texte.

Verrouillage des tranches

Le verrouillage des tranches empêche toute modification accidentelle, comme le redimensionnement ou le déplacement.

  • Pour verrouiller toutes les tranches, choisissez la commande Affichage > Verrouiller les tranches.
  • Pour verrouiller les tranches de manière individuelle, cliquez sur la colonne d’édition des tranches dans le panneau Calques.

Ajustement des limites de tranches

Si vous avez créé une tranche à l’aide de la commande Objet > Tranche > Créer, la position et la taille de la tranche sont liées à l’illustration qu’elle contient. Par conséquent, si vous déplacez ou modifiez la taille de votre illustration, les limites de la tranche seront ajustées automatiquement.

Si vous avez créé une tranche à l’aide de l’outil Tranche, de la commande Créer d’après la sélection ou de la commande Créer d’après les repères, vous pouvez ajuster les tranches manuellement de l’une des façons suivantes :

  • Pour déplacer une tranche, faites-la glisser vers un nouvel emplacement à l’aide de l’outil Sélection de tranche . Maintenez la touche Maj enfoncée pour restreindre le déplacement sur un plan vertical, horizontal ou sur une diagonale de 45°.
  • Pour modifier la taille d’une tranche, sélectionnez-la à l’aide de l’outil Sélection de tranche, puis faites glisser l’un des angles ou des côtés de la tranche. Vous pouvez également utiliser l’outil Sélection et le panneau Transformation pour redimensionner les tranches.
  • Pour aligner ou répartir des tranches, utilisez le panneau Alignement. L’alignement de tranches permet d’éliminer les tranches auto inutiles et de générer un fichier HTML plus petit et optimisé.
  • Pour modifier l’ordre de superposition des tranches, faites glisser une tranche vers un nouvel emplacement dans le panneau Calques ou sélectionnez une commande dans le menu Objet > Disposition.
  • Pour diviser une tranche, sélectionnez-la et choisissez la commande Objet > Tranche > Diviser les tranches.

    Vous pouvez combiner des tranches quelle que soit leur méthode de création. Sélectionnez les tranches, puis choisissez la commande Objet > Tranche > Combiner les tranches. Les dimensions et l’emplacement de la tranche obtenue sont ceux du rectangle créé par l’union des contours extérieurs des tranches combinées. Si les tranches combinées ne sont pas adjacentes ou si leurs proportions ou leur alignement sont différents, la nouvelle tranche peut en chevaucher d’autres.

    Pour redimensionner toutes les tranches en fonction des limites du plan de travail, choisissez la commande Objet > Tranche > Ecrêter selon le plan de travail. Les tranches qui s’étendent au-delà du plan de travail sont tronquées en conséquence et les tranches auto s’inscrivant dans le plan de travail sont étendues à ses limites. Toute l’illustration reste identique.

Suppression des tranches

Vous pouvez retirer des tranches en les supprimant ou en les annulant de l’illustration correspondante.

  • Pour supprimer une tranche, sélectionnez-la, puis appuyez sur la touche Suppr. Si la tranche a été créée à l’aide de la commande Objet > Tranche > Créer, l’illustration correspondante est également supprimée. Pour conserver l’illustration correspondante, annulez la tranche au lieu de la supprimer.
  • Pour supprimer toutes les tranches, choisissez la commande Objet > Tranche > Tout supprimer. Les tranches créées avec la commande Objet > Tranche > Créer sont annulées, mais ne sont pas supprimées.
  • Pour annuler une tranche, sélectionnez-la, puis choisissez la commande Objet > Tranche > Annuler.

Affichage ou masquage des tranches

  • Pour masquer les tranches dans la fenêtre d’illustration, choisissez la commande Affichage > Masquer les tranches.
  • Pour masquer les tranches dans la boîte de dialogue Enregistrer pour le web et les périphériques, cliquez sur le bouton Afficher/Masquer les tranches .
  • Pour masquer les numéros de tranches et modifier la couleur des traits de tranche, choisissez la commande Edition > Préférences > Repères commentés et tranches (Windows) ou Illustrator > Préférences > Repères commentés et tranches (Mac OS).

Création de cartes-images

Les cartes-images permettent de lier une ou plusieurs zones d’une image (appelées zones sensibles) à une URL. Lorsqu’un utilisateur clique sur une zone sensible, le navigateur web charge le fichier lié.

La principale différence entre l’utilisation de cartes-images et de tranches pour créer des liens réside dans le mode d’exportation de l’illustration en tant que page web. Les cartes-images permettent de conserver l’illustration intacte en un seul fichier, tandis que les tranches imposent sa division en fichiers distincts. Une autre différence entre les cartes-images et les tranches est que les premières permettent de lier des zones polygonales ou rectangulaires d’une illustration, tandis que les secondes ne fonctionnent que sur des zones rectangulaires. Si vous n’avez besoin que de zones rectangulaires, il peut être préférable d’utiliser les tranches plutôt qu’une carte-image.

Remarque :

Pour éviter des résultats inattendus, ne créez pas de zones sensibles de carte-image dans des tranches contenant des liens URL, les liens de carte-image ou de tranche pouvant être ignorés dans certains navigateurs.

  1. Sélectionnez l’objet à lier à une URL.
  2. Dans le panneau Options d’objet, sélectionnez une forme de carte-image dans le menu déroulant Image réactive.
  3. Indiquez une adresse URL relative ou complète dans la zone de texte URL ou choisissez-en une dans la liste proposée. Pour vérifier l’emplacement de l’URL, cliquez sur le bouton Navigateur.

    Remarque :

    Pour augmenter le nombre d’entrés visibles dans le menu déroulant URL, sélectionnez la commande Options de panneau dans le menu du panneau Options d’objet. Entrez une valeur comprise entre 1 et 30 pour préciser le nombre d’entrées à afficher dans la liste des URL.

Ce produit est distribué sous licence Creative Commons Attribution - Pas d’utilisation commerciale - Partage à l’identique 3.0 non transposé  Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.

Mentions légales   |   Politique de confidentialité en ligne