FOIT vs. FOUT

This demo was created to show the functional differences between FOIT and FOUT. It’s using Open Sans loaded from Google Web Fonts. (Not sure what FOIT and FOUT are?) Decide for yourself—which feels faster? Which feels more stable? Take note of the difference in page stability when you group your repaints.

Created by @zachleat. Read more at FOIT vs. FOUT (the blog post) or the Comprehensive Guide to Font Loading Strategies. You can always return to zachleat.com.

Sorry—this page requires both JavaScript and support for the CSS Font Loading API.

Web fonts:

FOIT with 3s Timeout  

Mitt Romney is not running for president.

This is a paragraph. This is heavier text. This is emphasized text. This is heavier and emphasized text.

FOUT  

Mitt Romney is not running for president.

This is a paragraph. This is heavier text. This is emphasized text. This is heavier and emphasized text.