EverWeb Widgets HTML5


Web Safe Fonts

Web safe fonts are those that are available on all computers so that your fonts will remain the same universally. There very few of them as can be seen in the screenshot to the left. One font this isn't really safe is Impact. This font is not web safe on iOS devices like the iPad and iPhone.
In general, fonts should be kept constant throughout a site using variations in size, color and typeface to draw attention to important text.
Most fonts are available in Regular, Italic, Bold and Bold Italic and that should be enough for most situations.
If you do decide to use non-web safe fonts, they will work if your visitor is on a Mac but the chances are that Windows users will see something completely different.
When a browser loads a substitute font your layout will be effected and this can turn your web page design into a mess - be warned!

Web Safe

web safe fonts
Mac & Windows

Google Hosted Fonts

Google hosted fonts may seem like the answer to a web designer's prayers but, before using them, consider the downside.
These fonts need to be downloaded from the Google server every time a visitor opens a page of the website where the font is requested. Font files can be quite large and this extra request from another server can slow page download time quite noticeably.
NEVER use Google hosted fonts on the mobile version of the website!
When using a Google hosted font, a web safe fallback and generic group MUST be specified in the styles. Anyone who doesn't know what these are and how to use them should forget about using hosted fonts.

Self Hosted Fonts

If non web safe fonts are essential to a website design they must be self hosted on the same server and in the same root folder as the other website files.
Ideally, all the fonts - and their various file types - would be uploaded together in a folder with a suitable name like Fonts!
Those publishing to the EverWeb server, at the time of writing, can't do this.
For more info about all this see "Self Hosted Fonts Using The EverWeb Server" on THIS page.

Fallback Fonts

Non web safe fonts can be used but it is essential to know how to choose a suitable fallback font and generic group so that the browser knows what to load when the chosen font is not available.
When using a fallback font, always test your layout in the various browsers with this font to see what effect the substituted font will have on your website layout.
Read more about fallback fonts and generic groups on THIS page.