title | description | ms.date | ms.topic | author | ms.author | search.audienceType | |||
---|---|---|---|---|---|---|---|---|---|
Use custom fonts in emails |
Learn how to use custom fonts in emails in Dynamics 365 Customer Insights - Journeys. |
12/12/2023 |
article |
alfergus |
alfergus |
|
In the fast-changing field of marketing, it's important to combine design, beauty, and accessibility. Typography, especially the use of web fonts, is crucial for achieving this harmony. This article shows you how to use web fonts in your Customer Insights - Journeys marketing channels, making sure they're both attractive and accessible.
Note
Channels include emails, forms, and event management.
The main difference between web-safe fonts and web fonts is where they're loaded from.
- Web-safe fonts: Drawing from local font directories, web-safe fonts offer reliability. Common choices like Arial, Helvetica, and Times New Roman are preinstalled on most computers.
- Web fonts: Pulled from servers like Google or Adobe, web fonts broaden your options but pose challenges in terms of email client, system, and browser font support, a crucial consideration within Customer Insights - Journeys.
The code within the message you send on a Customer Insights - Journeys channel declares fonts using the font-family CSS property, either as a single font or a stack of multiple fonts for fallback. This distinction lays the foundation for comprehending web fonts and web safe fonts.
Navigating the dynamics of fonts support is imperative for successful web font integration. Here's a snapshot of web font support across key email clients:
Client | Support |
---|---|
Outlook 2013-2021 | ✘ No |
Apple mail | ✓ Yes |
Gmail app | ✘ No |
Windows 11 | ✘ No |
Outlook for Mac | ✓ Yes |
Outlook Office 365 (Win & Mac) | ✘ No |
iOS | ✓ Yes |
Samsung mail | ✘ No |
AOL mail | ✘ No |
Outlook app | ✘ No |
Samsung mail | ✘ No |
AOL mail | ✘ No |
Gmail | ✘ No |
Office 365 | ✘ No |
Outlook.com | ✘ No |
Yahoo! mail | ✘ No |
For Customer Insights - Journeys, the quest for the perfect web font involves exploring diverse sources:
- Web font services: Paid services like Type Network and Fontspring offer extensive options. Ensure proper licensing for Customer Insights - Journeys.
- Google Fonts: Free and downloadable for design mock-ups.
- Adobe Fonts: Included in Creative Cloud subscriptions.
You can embed fonts for use by going to the Theme tab in the email or form designers, or in Theme tab in a brand profile.
To embed a new font, scroll down to the Add custom font dropdown and select one of the following options:
-
Browse library: Upload the font files from the library.
-
Upload font files: Import font files saved on your system.
- Step 1: Select upload font files from the Add custom font dropdown.
- Step 2: Select the respective font file from the system.
-
Add font using URL: You can import fonts by obtaining the font file URL.
[!NOTE] When you use online web font services, you usually have five file formats to pick from: .eot, .woff, .woff2, .svg, and .ttf. The .woff and .woff2 formats are the most compatible with email, so we recommend using one or both of these formats when possible.
Here’s a common @font-face declaration for importing a web font into an email using Google Fonts as a web font service:
-
Paste the following HTML into a browser tab:
https://fonts.googleapis.com/css?family="fontName"
. For example, for the Noto Sans font, you'd paste:https://fonts.googleapis.com/css?family=Noto+Sans
.[!NOTE] This information is available in the side navigation of the Google Fonts page.
-
Copy the URL for the Latin version of the @font-face.
-
Paste it into the Add font using URL dialogue box.
When creating campaigns, it's crucial to respect licensing requirements for web fonts. While most providers permit use, adherence to individual licensing agreements is paramount. Reach out to font providers for precise details on licensing within Customer Insights - Journeys.
Integrating web fonts into Customer Insights - Journeys can elevate your brand. However, meticulous testing is paramount. Utilize Customer Insights - Journeys testing tools and validate across environments to ensure flawless fallbacks.
[!INCLUDE footer-include]