What Fonts Work for Web Sites and Blogs?

If someone reading your Web site or Blog does not have the font installed that you used to build the HTML in your site, then, they will not be able to see it as you designed it.
For example: if you use a font like Franklin Gothic in your site and your visitor does not have it installed they will see the default Sans-serif font that is installed on their system, which is usually Arial.
If you used a Serif font like Century Schoolbook and your customer does not have it installed they will see the default Serif font that is installed on their system, which is usually Times Roman.
1) Web Safe Fonts that work on all platforms:
• Arial / Helvetica
• Courier New / Courier
• Times New Roman / Times
2) Fonts that work on Windows and the Apple Mac OS but not Unix/Linux and *nix variants are:
• Arial Black
• Comic Sans MS
• Georgia
• Impact
• Trebuchet MS
• Verdana
3) Other fonts that usually are cross-platform compatible:
• Avant Garde
• Bookman
• Garamond
• Palatino
4) If you need to use a font that is not on the list above you can make a .gif or .jpg image with the desired font . The easiest solution is to simply insert the picture in your Web. This text will not be seen by search engines so make sure to use an “alt” attribute (tag) on the image and repeat the text if it is an important keyword or keyphrase in the body of your text. If you want a cleaner, more sophisticated solution, you can use CSS to display the image behind the text, then hide the text by giving it a negative indent. (For specifics, search Google using the keywords “image replacement”.) This technique has the benefit of allowing you to still use standard markup for optimal search engine friendliness.
To learn more about Web typography, please see: http://web.mit.edu/jmorzins/www/fonts.html
Another great resource for Web Font and Typeface Information is here: http://www.efuse.com/Design/web_fonts_basics.html

Filed Under

Related

Do you need to build a custom search-driven component for your #digitalworkspace while saving thousands of hours of development time?

Join us on as we lift the hood of #PnP Modern Search v4, show you how it's built, & take you on a live coding adventure.

http://ow.ly/MTnL50EpN5J

#Hybridwork is more than just a buzzword to latch onto; it’s the future for many organizations for the unforeseeable future. So, how can you use #Microsoft365 for #hybridwork? Let's breaks it down…

http://ow.ly/ay2e50EmNhg

It's that time again! Join the #PixelMillWebinars on 4/29 where @EricOverfield lifts the hood of #PnP Modern Search v4, shows how it's built, & takes you on a live coding adventure to customizing your own web part using the power of the existing codebase.

http://ow.ly/EI5h50EmNqj

What? Anchor links now work in #SharePoint site navigation! This fix snuck in and I completely missed it. Use them to create a TOC for long pages or cross link between pages. They work in text or quick links web parts & nav too! https://support.microsoft.com/en-us/office/create-and-use-modern-pages-on-a-sharepoint-site-b3d46deb-27a6-4b1e-87b8-df851e503dec#bkmk_pageanchors

A big thank you to David Leveille and @CrushNetworks for having our President + Co-Founder @EricOverfield on this episode of #TheVirtualWaterCooler!

Subscribe to PixelMill's
E-news

* indicates required

Let's Talk Digital
Workspaces Today

Get In Touch