Découpage en tranches des pages web

Les tranches divisent une image en plusieurs petites images qui sont ensuite reconstituées sur une page web à l’aide d’un tableau HTML ou de calques CSS. Le fait de diviser l’image vous permet d’affecter des liens URL pour créer une navigation de page ou d’optimiser chaque partie d’une image à l’aide de ses paramètres d’optimisation.

Vous exportez et optimisez une image découpée en tranches à l’aide de la commande Enregistrer pour le web et les appareils. Photoshop enregistre chaque tranche dans un fichier séparé et génère le code HTML ou CSS nécessaire à l’affichage de l’image découpée en tranches.

Gardez à l’esprit les notions de base suivantes lorsque vous travaillez avec les tranches :

• Vous pouvez créer une tranche avec l’outil Tranche ou d’après des calques.

• Une fois que vous avez créé une tranche, vous pouvez la sélectionner avec l’outil Sélection de tranche , puis la déplacer, la redimensionner ou l’aligner avec les autres tranches.

• Vous pouvez définir les options de chaque tranche, notamment le type de tranche, son nom et l’URL, dans la boîte de dialogue Options de tranche.

• Vous pouvez optimiser chaque tranche selon différents paramètres d’optimisation dans la boîte de dialogue Enregistrer pour le web et les appareils.

Les tranches sont classées en fonction de leur type de contenu (tableau, image, sans image) et de la façon dont elles ont été créées (par l’utilisateur, d’après un calque, automatiquement).

Les tranches créées à l’aide de l’outil Tranche sont appelées des tranches utilisateur ; celles créées à partir d’un calque sont appelées des tranches créées d’après un calque. Lorsque vous créez une nouvelle tranche utilisateur ou une tranche d’après un calque, des tranches auto supplémentaires sont générées pour prendre en charge les zones restantes de l’image. En d’autres termes, les tranches auto remplissent l’espace de l’image qui n’est pas défini par des tranches utilisateur ou des tranches créées d’après un calque. Les tranches auto sont régénérées chaque fois que vous ajoutez ou modifiez des tranches utilisateur ou des tranches créées d’après un calque. Vous pouvez convertir les tranches auto en tranches utilisateur.

Les tranches utilisateur, les tranches créées d’après un calque et les tranches auto présentent un aspect différent : les tranches utilisateur et les tranches créées d’après un calque sont définies par un trait plein, tandis que les tranches auto sont délimitées par une ligne en pointillé. En outre, les tranches utilisateur et les tranches créées d’après un calque se distinguent par une icône différente. Vous pouvez afficher ou masquer les tranches auto, ce qui facilite la visualisation de votre travail avec des tranches utilisateur et celles créées d’après des calques.

Une sous-tranche est une tranche auto générée lorsque les tranches créées se chevauchent. Les sous-tranches déterminent la division de l’image lors de l’enregistrement du fichier optimisé. Bien que les sous-tranches soient numérotées et affichent un symbole de tranche, vous ne pouvez ni les sélectionner ni les éditer séparément à partir de la tranche sous-jacente. Les sous-tranches sont régénérées chaque fois que vous réorganisez l’ordre d’empilement des tranches.

Les tranches sont créées selon différentes méthodes :

• Les tranches auto sont générées automatiquement.

• Les tranches utilisateur sont créées à l’aide de l’outil Tranche.

• Les tranches créées d’après un calque sont créées à l’aide du panneau Calques.

L’outil Tranche vous permet de tracer des traits de tranche directement sur une image ou de concevoir votre image à l’aide de calques et créer des tranches d’après des calques.

Une tranche créée d’après un calque englobe toutes les données de pixel dans le calque. Si vous déplacez le calque ou modifiez son contenu, la zone de la tranche s’adapte automatiquement pour inclure les nouveaux pixels.

Les tranches créées d’après un calque sont moins souples ; vous pouvez cependant convertir une tranche de ce type en tranche utilisateur. Reportez-vous à la section Conversion d’une tranche auto ou d’une tranche créée d’après un calque en tranche utilisateur.

Une tranche créée d’après un calque étant liée au contenu en pixels du calque, la seule façon de la déplacer, la combiner, la diviser, la redimensionner et l’aligner est de modifier le calque, sauf si vous la convertissez en tranche utilisateur.

Toutes les tranches auto d’une image sont reliées et partagent les mêmes paramètres d’optimisation. Si vous souhaitez définir différents paramètres d’optimisation pour une tranche auto, vous devez la convertir en tranche utilisateur.

Vous pouvez afficher les tranches dans Photoshop et dans la boîte de dialogue Enregistrer pour le web et les appareils. Les caractéristiques suivantes permettent d’identifier et de différencier les tranches :