Guide d'utilisation Annuler

Ajout d’une marge intérieure dans les blocs de contenu et composants dans Adobe Captivate

  1. Guide de l’utilisateur de Captivate
  2. Présentation de Captivate 
    1. Nouveautés d’Adobe Captivate
    2. Configuration requise d’Adobe Captivate
    3. Mises à jour d’Adobe Captivate
      1. Notes de mise à jour d’Adobe Captivate (mise à jour 12.4)
      2. Notes de mise à jour d’Adobe Captivate (mise à jour 12.3)
      3. Notes de mise à jour d’Adobe Captivate (mise à jour 12.2)
      4. Notes de mise à jour d’Adobe Captivate (mise à jour 12.1)
    4. Télécharger Adobe Captivate
    5. Foire aux questions
  3. Ajout d’une diapositive
    1. Navigateur de diapositives dans Adobe Captivate
    2. Ajout d’une diapositive de conversation
    3. Ajout de personnages à votre projet Adobe Captivate
    4. Modification de l’image d’arrière-plan d’une diapositive
    5. Ajout d’une marge intérieure dans les blocs de contenu et composants
    6. Création d’un projet à défilement long
  4. Ajouter des blocs de texte
    1. Ajout de texte dans un projet
  5. Ajouter des blocs de média
    1. Ajout d’images dans un projet
    2. Ajout de vidéos dans un projet
    3. Ajout de citations
    4. Ajout de fichiers SVG dans un projet
  6. Composants interactifs
    1. Ajout d’un bouton
    2. Ajouter un champ de saisie
    3. Ajouter un groupe de boutons radio
    4. Ajout d’une liste déroulante
    5. Ajout d’une case à cocher
  7. Widgets
    1. Ajout d’une carte
    2. Ajout d’onglets
    3. Ajout d’un certificat
    4. Ajout d’une liste
    5. Ajout d’une zone réactive
    6. Ajout d’un élément de glisser-déposer
    7. Ajout d’un montage chronologique
    8. Ajout d’un élément Cliquer pour afficher
  8. Création de questionnaires
    1. Ajout d’une question à choix multiples
    2. Ajout d’une question de type vrai ou faux
    3. Ajout d’une question d’association de la colonne
    4. Ajout d’une question à réponse courte
    5. Ajout d’une question de séquence
    6. Ajout de groupes de questions et de diapositives de questions aléatoires
    7. Importation de questions au format CSV
  9. Ajout de l’audio à un projet
    1. Ajout d’audio
  10. Interactions
    1. Ajout d’interactions dans un projet
    2. Création d’une vidéo interactive avec incrustation
    3. Création d’une interaction au niveau de la diapositive
    4. Création d’une interaction au niveau de l’objet
  11. Animations
    1. Ajout d’animations dans un projet
  12. Accessibilité
    1. Rendre un projet accessible
  13. Personnalisation du montage chronologique
    1. Montage chronologique dans Adobe Captivate
  14. Personnalisation de la table des matières et de la barre de lecture
    1. Table des matières dans Adobe Captivate
  15. Modification des propriétés d’un projet
    1. Variables dans Adobe Captivate
    2. Préférences
    3. Dimensions du projet
    4. Thèmes
  16. Création d’un projet de simulation
    1. Simulation
  17. Prévisualisation d'un projet
    1. Aperçu
  18. Partage d’un projet pour révision
    1. Partage pour révision   
  19. Publication d’un projet
    1. Publication de votre projet
  20. Mise à niveau de projets dans Adobe Captivate
    1. Passez à la dernière version pour vos projets

Présentation

La marge intérieure permet d’ajouter un espace entre le contenu et sa bordure, ce qui améliore la disposition visuelle et l’alignement de votre projet. Elle peut être appliquée au niveau des blocs de contenu ou au sein des composants afin d’aider à améliorer l’alignement et l’espacement, contribuant ainsi à une meilleure expérience de visionnage.

Avantages de la marge intérieure

  • Crée un espace uniforme autour des éléments, pour un aspect net et professionnel. 
  • Augmente l’espace autour des éléments interactifs, ce qui facilite la sélection et améliore ainsi l’expérience utilisateur.

Utilisation de la marge intérieure :

  • Ajustement de la taille : si vous devez ajouter plus d’espace autour d’un élément, vous pouvez ajouter ou augmenter la marge intérieure. Ceci est particulièrement utile pour les éléments interactifs, car l’espace supplémentaire permet d’améliorer l’accessibilité. 
  • Marge intérieure des bordures : la marge intérieure accroît l’espace entre le contenu et la bordure. Elle contribue à assurer un meilleur alignement avec les autres éléments de la page.

Sujets de cette page :

Marge intérieure des blocs de contenu

Ajoutez une marge intérieure dans un bloc de contenu complet à partir des bordures et affichez le comportement dans différentes fenêtres d’affichage. 

  1. Sélectionnez Propriétés visuelles dans la barre d’outils de droite et développez la section Alignement et espacement pour afficher les valeurs de la marge intérieure.

    Cette image illustre l’ajout d’une marge intérieure dans un bloc de contenu
    Marge intérieure des blocs de contenu

  2. Utilisez le curseur Largeur du contenu pour modifier l’espacement horizontal de tout bloc de contenu à gauche ou à droite. Définissez le pourcentage d’espacement de votre choix à l’aide du curseur. Lorsque vous ajustez la largeur, les valeurs de la marge intérieure sont automatiquement mises à jour pour refléter les modifications.

  3. Activez la mise en page automatique pour ajuster la largeur du contenu de manière proportionnelle dans toutes les fenêtres d’affichage de l’appareil ou désactivez-la pour ajuster les valeurs manuellement. En savoir plus sur les dispositions automatiques pour les différentes fenêtres d’affichage. 

    Si la mise en page automatique est désactivée, vous pouvez définir des valeurs de marge intérieure pour chaque côté. La largeur du contenu de chaque fenêtre d’affichage peut être ajustée individuellement. Cela signifie que vous pouvez ajouter une largeur de contenu pour une fenêtre d’affichage sans affecter les autres. 

    Cette image illustre la marge intérieure des blocs de contenu pour la vue Tablette avec mise en page automatique désactivée.
    Marge intérieure des blocs de contenu pour la vue Tablette avec mise en page automatique désactivée

    Remarque :

    La marge intérieure horizontale des blocs de contenu est définie en pourcentage, car la largeur du projet est fixe. La marge intérieure verticale est définie en pixels pour s’adapter en cas de contenu à défilement long.

Marge intérieure au niveau du composant

Inclure une marge intérieure dans chaque élément au sein d’un bloc de contenu, notamment les images, le texte, les éléments interactifs, les cartes et les objets de widget. La marge intérieure des composants au sein d’un bloc de contenu peut être ajoutée de deux manières :

Marge intérieure uniforme : ajoutez simultanément une marge intérieure aux quatre côtés.

Marge intérieure non uniforme : ajoutez une marge intérieure à chaque côté individuellement. Cette option est sélectionnée par défaut.

Ceci est une image

Voici un exemple de marge intérieure uniforme définie sur 50 px pour les quatre côtés du bloc de texte.

Ceci est une image

Lorsque l’utilisateur survole les bords d’un composant, des poignées roses s’affichent permettant d’ajuster l’espacement en les faisant glisser. Pour un remplissage uniforme de chaque côté, maintenez la touche Maj enfoncée en faisant glisser les poignées.

Ceci est une image

Exemples de marge intérieure pour différents composants

Voici quelques exemples de marge intérieure de divers composants dans un projet de dimension 1366 x 768 px :

Ajoutez une marge intérieure au bloc de texte de votre choix pour créer un espace entre le contenu et sa bordure. Pour chaque composant de texte (titre, sous-titre ou corps de texte), utilisez les poignées roses pour faire glisser et définir la marge intérieure directement dans la zone de travail. Vous pouvez également sélectionner le composant de texte et saisir les valeurs de marge intérieure dans la section Alignement et espacement des Propriétés visuelles.

Cet exemple illustre l’ajout d’une marge intérieure dans un bloc de texte à plusieurs colonnes au sein du composant du corps de texte avec définition d’une marge intérieure inférieure de 100 px.

Ceci est une image

Sélectionnez l’image et faites glisser les poignées roses situées près des bordures de l’image. Vous pouvez également saisir des valeurs de marge intérieure dans la section Alignement et espacement du menu Propriétés visuelles.

L’exemple illustre une marge intérieure inférieure définie sur 60 pixels à partir de la bordure d’un conteneur d’image :

Ceci est une image

Ajoutez une marge intérieure aux images présentes dans une grille d’image, dans les widgets, les cartes, les personnages et les images des diapositives de questions. Toutefois, il n’est pas possible d’ajouter de marge intérieure aux images d’arrière-plan.

Voici un exemple d’ajout de marge intérieure dans un composant de bouton interactif. Ajoutez un composant de bouton et sélectionnez le bouton au sein du bloc de contenu. Utilisez les poignées rose pour faire glisser et ajouter un espacement ou saisissez les valeurs de marge intérieure dans la section Alignement et espacement

Ceci est une image

Remarque :

Les composants interactifs de bouton radio et de liste déroulante ne prennent pas en charge le paramètre de marge intérieure.

Ajoutez une marge intérieure au composant de votre choix au sein d’un widget, comme le texte pour les titres, les sous-titres, les images, les cartes et les icônes. Dans cet exemple de widget de carte, vous pouvez sélectionner le composant du widget de votre choix et ajuster la marge intérieure à l’aide des poignées roses.

Vous pouvez également sélectionner un composant et ajouter une marge intérieure dans la section Alignement et espacement des Propriétés visuelles. Dans cet exemple, une marge intérieure de 30 px est ajoutée à l’icône de pivotement au sein de la carte. De même, vous pouvez sélectionner le texte ou l’image de votre choix dans chaque carte et ajouter une marge intérieure aux bordures.

Ceci est une image

Incluez une marge intérieure dans chaque composant des diapositives de questions, notamment le texte, les images et les boutons interactifs. L’espace supplémentaire entre les options des diapositives de questions facilite la sélection et améliore l’esthétique globale de la question. Voici un exemple de question à choix multiples avec marge intérieure au sein des options d’image.

Ceci est une image

Mises en page automatiques

Lorsque la mise en page automatique est activée, la marge intérieure est ajustée proportionnellement dans les différentes fenêtres d’affichage des appareils pour les blocs de contenu et les composants en appliquant des valeurs réactives aux ordinateurs de bureau, tablettes et appareils mobiles selon les dimensions du projet. En savoir plus sur la procédure de modification des dimensions du projet dans Adobe Captivate.

Comportement de mise en page automatique lorsque l’option est activée

Lorsque la mise en page automatique est activée, la marge intérieure est ajustée proportionnellement sur les différents appareils et les valeurs sont modifiées automatiquement pour chaque fenêtre d’affichage. Dans un projet d’une résolution de 1366 x 768 px, un remplissage de 50 px pour l’affichage Bureau est redimensionné à 28 px pour l’affichage Tablette et à 16 px pour l’affichage Mobile conservant les proportions.

Cette image illustre la vue Bureau lorsque la mise en page automatique est activée
Vue Bureau lorsque la mise en page automatique est activée

Ceci est une image
Vue Tablette lorsque la mise en page automatique est activée

Ceci est une image
Vue Mobile (portrait) lorsque la mise en page automatique est activée

Comportement de mise en page automatique lorsque l’option est désactivée

Voici un exemple de projet avec la fonctionnalité de mise en page automatique désactivée pour une taille de projet de 1366 x 768 px. Dans ce cas, l’utilisateur peut ajouter manuellement les valeurs de marge intérieure pour chaque fenêtre d’affichage afin d’offrir une expérience d’affichage optimale.

Vue Bureau (marge intérieure de 50 px) : 

Mise en page automatique désactivée pour la vue Bureau (marge intérieure : 50 px)

Vue Tablette (marge intérieure modifiée manuellement et définie sur 10 px avec mise en page automatique désactivée) : 

Ceci est une image

Vue Mobile (marge intérieure modifiée manuellement et définie sur 20 px) : 

Ceci est une image

Recevez de l’aide plus rapidement et plus facilement

Nouvel utilisateur ?