Lisez cet article pour découvrir comment utiliser la typographie et les polices dans Adobe Muse.

Remarque :

Aucune nouvelle fonctionnalité n’est plus ajoutée à Adobe Muse et le support prendra fin le 26 mars 2020. Pour plus d’informations et pour obtenir de l’aide, reportez-vous à la page de fin de service Adobe Muse.

Remarque :

  Typekit s’appelle désormais Adobe Fonts et est inclus avec Creative Cloud et d’autres abonnements. En savoir plus.

Lorsque vous utilisez Adobe Muse pour créer des pages web, vous pouvez choisir entre trois types de polices différents à appliquer sur du texte. Lorsque vous publiez ou exportez des pages, le type de police appliqué détermine le rendu du contenu du texte. Les trois différents types de police affectent également le comportement et les performances du site à divers degrés. Il est donc important de bien comprendre les conséquences du choix de chaque type.

Pour ajouter du texte à une page web, vous pouvez :

  • Utiliser l’outil Texte pour saisir directement un texte sur la page.
  • Choisir Fichier > Importer et choisir un fichier TXT externe pour en importer le contenu.
  • Copier du texte provenant d’une autre source externe, puis le coller sur la page.

Après avoir créé un bloc de texte contenant du texte, vous pouvez utiliser les options du panneau Texte ou du panneau de configuration pour définir la couleur, la taille, le style, l’alignement de la police ainsi que d’autres options de formatage. Vous pouvez également utiliser le menu Police pour choisir une police (telle qu’Arial ou Helvetica) qui corresponde à la conception de la page.

Le présent article offre un aperçu des trois différents types de police que vous pouvez appliquer à l’aide du menu Police. Vous allez découvrir les avantages et les problèmes éventuels associés à chaque type de police, ainsi que les stratégies permettant de contrôler le texte et de modifier les blocs de texte.

Comprendre la différence entre les polices web, les polices standard et les polices système

Lorsque vous appliquez une police pour mettre en forme le contenu textuel, trois choix de police s’offrent à vous :

  • Polices web
  • Polices standard
  • Polices système

Voici une brève description de chaque option :

Les polices web dans Adobe Muse se composent des polices Typekit, des polices web Edge et des polices web auto-hébergées. Elles vous permettent d’accéder à une grande bibliothèque (contenant des centaines de types de polices) que vous pouvez appliquer à vos pages dans Adobe Muse. Lorsque vous appliquez des polices web au contenu textuel, Adobe Muse ajoute automatiquement le code dans la page qui va créer des liens vers la famille de polices. Lorsqu’un navigateur visite la page, il télécharge les polices web nécessaires pour effectuer le rendu de la page et afficher le contenu sous forme de texte. Cette méthode a de nombreux avantages, car vous pouvez concevoir des en-têtes et tout autre texte important à l’aide d’un grand nombre de polices et les pages publiées ou exportées afficheront le texte sous forme de texte sélectionnable. Veillez toutefois à ne pas utiliser un trop grand nombre de polices web sur la même page. Tout comme les conceptions contenant un grand nombre d’images, le navigateur peut prendre plus de temps pour charger une page si elle contient trop de fichiers liés. Il est préférable de limiter l’utilisation de polices web à trois par page dans les conceptions, et de conserver une taille de police relativement grande pour vous assurer que le texte sera facile à lire. Pour plus d’informations, voir Polices Typekit et autres polices web.

Les polices standard (avec sauvegardes) sont des polices qui sont probablement installées sur toutes les machines qui visitent votre site. Ces polices incluent les familles de police standard, telles qu’Arial, Georgia et Times New Roman. Vous pouvez choisir parmi un petit ensemble de polices standard couramment utilisées, qui s’affichent sur le site réel sous forme de texte. Les polices standard se chargent rapidement mais ne sont pas particulièrement esthétiques. Les polices standard constituent le meilleur choix lorsque vous définissez la mise en forme de longs paragraphes au contenu textuel car elles sont optimisées pour offrir une bonne lisibilité sur le web. Utilisez ce type de police autant que possible pour vous assurer que votre site fonctionne correctement et qu’il ne met pas trop de temps à se charger.

Les polices système vous permettent d’utiliser une typographie plus singulière, reposant sur des polices spécifiques que vous (le concepteur) avez installé sur votre machine. Par exemple, si vous êtes en train de concevoir un site avec un thème spécifique, tel qu’un site de jardinage, vous pouvez installer une police fleurie inhabituelle qui n’est pas disponible dans la bibliothèque de polices web de Typekit. Le recours aux polices système doit se faire avec parcimonie car le contenu textuel est exporté sous forme d’images. Cela signifie que la page va prendre plus de temps pour se charger et que les visiteurs ne seront pas en mesure de sélectionner, de copier ou de coller le texte sur la page. Les polices système sont également plus adaptées aux petits blocs de texte, comme les en-têtes. Afin de rendre le site facile à utiliser, évitez d’utiliser des polices système pour les adresses, les numéros de téléphone et tout contenu que les visiteurs peuvent vouloir copier et coller dans un calendrier ou un message électronique. Gardez à l’esprit que certains visiteurs ont des difficultés à lire un texte de plus petite taille et peuvent définir le navigateur pour augmenter la taille de la police ; cette stratégie ne les aidera pas à lire un texte qui a été exporté sous forme de fichiers d’image. Souvenez-vous aussi que les sites d’index des moteurs de recherche recherchent un contenu textuel pour définir le classement d’un site dans les résultats de recherche. Pour toutes ces raisons, il est préférable d’appliquer uniquement des polices du système lorsque vous avez réellement besoin de créer un effet dans la conception. S’il existe une police web ou une police standard comparable, appliquez-la à la place.

Pour appliquer chacun de ces trois types de polices, sélectionnez le texte à l’aide de l’outil Texte, puis sélectionnez l’option souhaitée dans le menu des polices.

Menu Polices
Choisissez la police à utiliser dans le menu de polices.

Dans la partie supérieure du menu Police vous verrez la liste des polices que vous avez récemment utilisées. Il est ainsi facile de les appliquer à nouveau lorsque vous êtes en train de concevoir des pages. Si, par la suite, vous décidez que vous ne souhaitez pas voir ces nombreuses polices ou que vous souhaitez effacer toutes les polices récemment utilisées, vous pouvez mettre à jour les paramètres définis dans les préférences d’Adobe Muse.

Polices utilisées récemment
Définissez le nombre de polices récentes ou effacez le contenu de la liste des polices récemment utilisées dans le menu des polices.

Dans les sections suivantes, vous trouverez une description plus détaillée de chaque type de police, ainsi que des informations sur la manière dont chaque type affecte le rendu du contenu de texte sur un site web publié.

Application de polices à un texte sélectionné

Pour obtenir les meilleurs résultats de rendu de police, choisissez une police adaptée à l’usage que vous voulez en faire. Par exemple, lorsque vous appliquez une police à des paragraphes (grandes quantités de texte continu affichées avec des polices de petite taille), évitez de choisir des polices décoratives, très ornées (qui sont généralement destinées aux en-têtes affichés avec des polices de plus grande taille).

L’un des points les plus importants à prendre en compte pour le texte des sites web est de s’assurer de sa lisibilité. Les polices ornées n’offrent pas un bon rendu à de petites tailles, car la résolution web est insuffisante pour rendre la multitude de détails visuels qu’elles contiennent.

En outre, une police de paragraphe doit pouvoir disposer des différents styles (normal, italique, gras et italique gras), pour vous permettre d’accentuer ou de souligner un texte afin de mettre en évidence le nom de personnes, le titre d’un livre ou d’un film et d’autres contenus particuliers au sein d’un paragraphe. De nombreuses familles de polices décoratives et hautement stylisées n’incluent pas ces options de style.

Les polices peuvent également être techniquement optimisées pour des usages particuliers. Une police peut utiliser un format de contour qui offre un meilleur rendu pour les grandes tailles, ou contenir un lissage, qui offre un rendu optimal pour les petites tailles sur toutes les plates-formes. Comme mentionné précédemment, lorsque vous accédez aux polices web dans Adobe Muse, la bibliothèque de polices web permet de filtrer les polices pour afficher la liste des polices recommandées pour les paragraphes ou les en-têtes. Si vous n’êtes pas sûr qu’une police donnée fonctionne correctement pour le texte d’en-têtes ou de paragraphes de votre conception, choisissez les polices en fonction de ces recommandations. Vous serez alors certain que les pages créées seront faciles à lire.

Vous pouvez mettre en forme un texte avec des polices web à l’aide du processus qui est utilisé pour appliquer des polices standard et les polices système. Pour styliser le texte à l’aide des polices web, procédez comme suit :

  1. Utilisez l’outil Texte pour sélectionner du texte dans un bloc de texte.

  2. Sélectionnez la police que vous souhaitez appliquer dans le menu Police. Pour ce faire, choisissez Polices web, puis sélectionnez le nom de la famille de police dans la liste.

    Choix des polices web
    Appliquez une police web au contenu de texte sélectionné en choisissant le nom de la police.

    Après avoir appliqué une police, vous pouvez utiliser le panneau Texte ou les options du panneau de configuration pour définir la taille, la couleur et d’autres attributs de la police comme vous le souhaitez.

    Remarque :

    les polices web se comportent exactement comme n’importe quel autre type de police lors de la conception des pages. Vous pouvez modifier la mise en forme du texte, modifier et redimensionner le bloc de texte, puis le positionner sur la page dans laquelle vous souhaitez le voir apparaître.

  3. Une fois la conception du site terminée, cliquez sur Aperçu pour voir comment la conception s’affiche dans Adobe Muse. Ou choisissez Fichier > Prévisualiser la page dans le navigateur pour voir comment la conception s’affiche dans une fenêtre de navigateur.

    Comme mentionné ci-dessus, les polices web sont particulièrement utiles pour la création de pages attractives car vous pouvez choisir parmi des centaines de polices et (contrairement aux polices système) la typographie unique de la page est exportée sous forme de texte, et non en tant que fichiers d’image.

  4. Notez que lorsque vous prévisualisez la page dans un navigateur, le texte auquel la police web a été appliquée est rendu en tant que contenu de texte. Essayez de le sélectionner et de le copier pour voir comment il se comporte.

    Texte en police web sélectionnable
    Le texte en police web est sélectionnable dans un navigateur web, car il est exporté sous forme de texte.

Il est préférable d’exporter le contenu du texte sous forme de texte, plutôt que sous forme d’images. Lorsque vous choisissez des polices système, le contenu de texte est exporté en tant qu’images, ce qui rallonge la durée de chargement des pages.

Les polices web permettent aux visiteurs de copier et de coller le contenu de texte à partir des pages du site, directement. Ils peuvent ainsi consulter et enregistrer des adresses, des numéros de téléphone et d’autres informations importantes qu’ils souhaitent partager avec quelqu’un ou enregistrer hors ligne dans leur carnet d’adresses.

Le rendu des polices web sous forme de texte contribue également à améliorer le classement d’un site dans les résultats de recherche car, lorsque les moteurs de recherche indexent le contenu des sites web, ils analysent plus facilement un contenu de texte que des fichiers d’image. Ainsi, l’utilisation de polices web permet aux sites d’attirer davantage de trafic et permet un chargement plus efficace des pages au niveau des visiteurs.

Enfin, le contenu de texte est beaucoup plus facile à parcourir pour les visiteurs utilisant des lecteurs de texte. Le rendu de zones importantes, comme les en-têtes de page, sous forme de texte assure une meilleure accessibilité de votre site pour tout un chacun.

Utilisation des polices standard

Le menu Police contient une section qui répertorie les polices standard. Vous pouvez appliquer librement les polices standard lors de la conception de vos pages, car elles sont déjà installées sur tous les ordinateurs modernes. Il n’est pas nécessaire d’installer d’autre module sur votre machine et les visiteurs disposent déjà des polices sur leurs ordinateurs pour rendre correctement le texte des pages.

Les polices standard constituent un petit jeu de polices couramment utilisées, dont tous les ordinateurs disposent pour afficher le contenu d’un texte. Un texte utilisant des polices standard s’affiche en tant que texte sur le site publié.

Comme les polices web, les polices standard bénéficient de tous les avantages qu’il y a à afficher du texte en tant que texte, notamment :

  • Les visiteurs peuvent sélectionner, copier et coller le contenu d’une page web.
  • Les pages avec un contenu de texte se chargent plus rapidement par rapport aux pages volumineuses contenant des images.
  • Le classement obtenu dans les résultats de recherche est meilleur car les moteurs de recherche peuvent indexer le contenu textuel.
  • Les visiteurs utilisant des lecteurs d’écran peuvent accéder plus facilement à du texte qu’à un contenu comportant une image.

L’utilisation de polices standard présente toutefois un inconvénient : vous êtes limité à un petit nombre de polices lors de la conception de vos pages.

Lorsque vous utilisez le menu Police pour choisir des polices standard, la liste complète s’affiche.

Liste complète des polices standard
Choisissez Standard Fonts dans le menu Police pour consulter la liste complète.

Les polices standard sont limitées à :

  • Arial
  • Comic Sans
  • Courier New
  • Geneva
  • Georgia
  • Helvetica
  • Lucida Sans
  • Palatino
  • Times
  • Trebuchet
  • Verdana

Notez que si vous placez le pointeur de la souris sur une option, une info-bulle affiche une liste de polices alternatives.

Cette info-bulle indique que, si le visiteur ne dispose pas de la police choisie sur son ordinateur, une police similaire est automatiquement appliquée à la place. L’apparence de la page reste semblable à la celle de la conception d’origine et l’absence de la police manquante n’est pas remarquée par le visiteur. Le contenu de la page se charge sans qu’aucun message d’erreur ne soit affiché. Le texte s’affiche simplement en utilisant une police similaire installée sur la machine du visiteur.

En règle générale, les polices standard sont un bon choix pour le contenu d’une page qui doit être lisible et facile à parcourir par les visiteurs. Cependant, leur nombre étant limité, il est plus difficile de trouver une police de caractères qui reflète l’esthétique du site.

Utilisation des polices système

Les polices système sont les polices que vous avez installées sur votre ordinateur individuel. Vous pouvez les installer en vue de les utiliser pour un grand nombre de programmes divers, notamment les programmes de retouche d’images. Et ces mêmes polices sont également disponibles pour être appliquées lors de la conception de pages dans Adobe Muse.

Par exemple, si vous êtes en train de concevoir un site web sur un tremblement de terre, vous pouvez installer une police avec un aspect tremblant ou craquelé, de sorte que les en-têtes de la page correspondent au thème de la conception. Toutes les polices que vous installez peuvent être utilisées dans Adobe Muse. Ainsi, vous n’êtes pas limité dans la mise en forme des pages que vous pouvez entièrement personnaliser (ou vous pouvez utiliser la police personnalisée d’un client sur son site). Les polices système vous permettent d’utiliser une grande variété de polices uniques, ce qui vous permet de donner réellement vie aux pages.

Les visiteurs verront le texte avec des polices système appliquées exactement comme vous l’avez défini, même s’ils ne disposent pas des polices installées sur leurs ordinateurs. Pour ce faire, Adobe Muse exporte automatiquement tous les textes utilisant des polices système sous forme de fichiers d’image. Il s’agit d’une opération transparente qui se déroule en arrière-plan. Ainsi, lorsque vous êtes en train de concevoir les pages, le texte de la police système reste modifiable. Vous pouvez donc continuer à y apporter des modifications.

Si vous choisissez des polices système dans le menu Police, vous verrez la liste des polices que vous avez installées sur votre machine.

Liste des polices système
La section Polices système affiche la liste des polices que vous avez installées.

L’application de polices système à un texte présente un inconvénient : le texte s’affiche sous forme d’images sur le site publié, ce qui prend beaucoup plus de temps à charger qu’un contenu de texte.

L’utilisation de polices système est un compromis, car vous pouvez utiliser une typographie unique, en fonction des polices spécifiques que vous (le concepteur) avez installées sur votre machine. Mais, une fois ces familles de police appliquées, les pages deviennent des images lourdes dont le chargement prend plus de temps. Et ceci peut avoir un impact sur les performances du site.

Par conséquent, n’appliquez de polices système à un texte dans vos conceptions qu’avec parcimonie.

Il est également recommandé de sélectionner un texte utilisant des polices système, même si le texte n’est pas lié, et de saisir un titre descriptif dans le champ Titre du menu Hyperlien.

Lorsque vous prévisualisez la page dans un navigateur, le titre apparaît sous la forme d’une info-bulle lorsque vous placez le pointeur de la souris sur le texte.

Le titre s’affiche sous forme d’info-bulle
Le titre que vous avez saisi apparaît sous forme d’info-bulle.

La balise de titre est utile pour les visiteurs qui utilisent des lecteurs d’écran, qui écoutent le contenu de votre site plutôt que de le lire visuellement. L’ajout de titres est également très important car les moteurs de recherche qui indexent un site web utiliseront le titre de l’image afin de mieux classer le contenu du site, en particulier si le texte de l’image contient des informations importantes, comme les en-têtes de page.

Dans la mesure du possible, recherchez les polices standard qui sont comparables aux polices système que vous avez installées, et utilisez-les à la place.

Application et réinitialisation des polices récemment utilisées

Une fois que vous avez appliqué des polices au texte dans Adobe Muse, la première partie du menu Police affiche le nom de ces polices. Cette fonctionnalité facilite la ré-application de ces mêmes polices à un autre texte dans la conception de votre site, dans la mesure où les polices sont faciles à localiser. Il n’est pas nécessaire de savoir quelles sont les polices web, les polices standard et les polices système. Les trois types de polices sont répertoriés dans la partie supérieure, si vous les avez précédemment appliqués.

D’une manière générale, l’une des meilleures pratiques appliquées au web consiste à limiter le nombre de polices utilisées sur une page. Si vous utilisez 4 types de police au maximum sur une page, le contenu textuel tend à être plus lisible pour les visiteurs lorsqu’il s’affiche à l’écran. Généralement, la section Polices récemment utilisées n’affiche qu’un petit nombre de noms de police, afin de faciliter la navigation.

Toutefois, vous avez peut-être expérimenté différentes polices dans une conception, ou conçu plusieurs sections différentes du site, et vous constatez que la liste Polices récemment utilisées du menu Police est beaucoup plus longue. Si la liste devient trop longue, choisir le type de police devient plus difficile.

Vous pouvez contrôler l’affichage des polices répertoriées dans la liste Polices récemment utilisées. Procédez comme suit :

  1. Choisissez Adobe Muse > Préférences pour ouvrir la boîte de dialogue Préférences.

  2. Dans la section Type, entrez une valeur numérique ou utilisez les flèches vers le haut et vers le bas pour réinitialiser le nombre de polices récentes (voir la figure).

    Réinitialiser le nombre de polices récentes
    Définissez le nombre de polices récentes à afficher.

    Si vous cliquez sur le bouton Effacer les polices récentes, vous effacerez toutes les polices récentes de la liste.

  3. Cliquez sur OK pour enregistrer vos modifications et fermer la boîte de dialogue Préférences.

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