Using Fonts in Emails, That Can Be Read by Anyone

All email clients know about “serif”, “sans-serif” and “monospace”.

All email programs (probably going back to Netscape Navigator) have a list of fonts built-in, and have a minimal font stack that include a likely Windows font and a likely OS/X font, and falls back to serif/sans-serif/monospace.

My email program has “Courier” in the user interface, but it is put into the HTML part of the email as   font-family: "courier new", courier, monospace;

Translated to English, “If your computer has Courier New use it, if not, Courier, and if still not then use whatever font your computer uses for monospace.”

(Or, a text-only email client uses “no fonts” and displays in your terminal’s font, or browser’s font, which is almost always a monspace font.)

Your email program probably defaults to something like, “font-family: sans-serif;” and then your email client substitutes some font to use instead of sans-serif (maybe Arial).

Just specify a   monospace font   when you’re emailing code  .  I inserted two spaces before and after, in the code font, to separate them visually.

You could even change the background color to make the code really stand out:

cd /Applications/Install\ OS\ X\ El\ Capitan.app/Contents/Resources/

or 

cd "/Applications/Install OS X El Capitan.app/Contents/Resources/"

[If anyone Does Not see that in a different font, when you try it in your email program, let me know, so I can find a work-around for you in your email client. But I bet you All do…]

Should see it like in this image, including different font for “monospace font” and “code” and the two commands:

I suggest displaying an image in addition to the text, if you have doubts that it will display correctly via email. An example would be if you are a website designer asking your website client “do you prefer Lato or Poppins” font for your site? (image taken from Google Fonts, https://fonts.google.com/

Google Fonts shows you different fonts, using text you specify. You can even look at the selected fonts in different text sizes.

p.s. The full list of default ‘generic-family’ values to be used as fall-back fonts are in https://w3c.github.io/csswg-drafts/css-fonts/#generic-font-families

p.s. Chrome (and therefore Brave) has Settings, Appearance, Customize Fonts. Firefox and Safari have similar settings. I look at so many websites with HTML/CSS/PHP code that I changed my browser settings to use Fira Code for monospace. You can use any font installed on your computer, and you can install any font on Google Fonts onto your computer. 


Posted

in

by

Comments

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.