Though it's not always easy to understand why, fonts cause a lot of problems. Any computer application will have no trouble understanding letters and numbers, but they also need to be told exactly how to display those letters and numbers on the screen. This has consequences for people who make a website, and meant that up until recently the choice of fonts used for a website has been limited to a mere handful.
Whenever a computer displays characters on a screen, it uses information contained in a font file that defines exactly how each character should look on-screen. This display rendering information contained in these font files needs to be accessible for a computer to use it.
Unfortunately, each computer has its own collection of installed font files and because there are literally thousands of different fonts, there is no way of knowing beforehand exactly which fonts are installed for use on any given computer.
This isn't ordinarily a problem, as most of the time content is created, displayed and used locally, on the one computer. Websites, on the other hand, are designed for external viewing by anything with a web browser: from computers to phones, and everything in between.
To make sure websites look exactly the same on all these devices and web browsers, website designers have traditionally been limited to using fonts that are commonly found on pretty much any device with a web browser. The use of these fonts helps ensure a webpage will look the same from browser to browser, but it also limits the choice of fonts for website designers.
But there are absolutely no guarantees that any given font - even those common, supposedly "web-safe" ones like Arial, Times or Courier - will be installed on every browser-enabled device. And if a required font isn't installed on the device used to view a site, it will be substituted with a different one.
Instead of relying on fonts installed locally on the computer, smartphone or tablet used to view a website, web fonts are all about telling browsers to use a font file located somewhere online instead. The widespread use of rapid Internet connections these days means that having to access online font information to display a page won't adversely affect site usability for most visitors, as the information is downloaded quickly and transparently.
Using a web font instead of a regular font means that site visitors will view your site exactly the way you intended it to look, every time.
To use a web font, it just needs to be linked from the site code, so web browsers know where to find relevant font display information. Applying the linked font to the site design is then just a matter of adding it to the site's CSS, just like a regular font. It's that simple.
To use a font, it needs to be licensed for third-party use (as in by you, on your site). People make fonts, so understandably you'll need to purchase a license to use most of them (it helps font designers pay rent and buy food, after all).
But there are also "free" fonts, made available for use by others via open (free) licenses. Google Web Fonts is one such one-stop-shop free font service, and includes everything you'll need to browse and link chosen fonts.
Putting web fonts to use to create a truly unique and personalized website design is really not that hard, and it only takes a few minutes to create a site (or modify an existing one) using them. Need proof? This site uses a personalized Google Web Font, added site-wide in about 2 minutes flat (see this web font tutorial for an idea of just how easy it really is).
A few things to understand about fonts
Whenever a computer displays characters on a screen, it uses information contained in a font file that defines exactly how each character should look on-screen. This display rendering information contained in these font files needs to be accessible for a computer to use it.
Unfortunately, each computer has its own collection of installed font files and because there are literally thousands of different fonts, there is no way of knowing beforehand exactly which fonts are installed for use on any given computer.
This isn't ordinarily a problem, as most of the time content is created, displayed and used locally, on the one computer. Websites, on the other hand, are designed for external viewing by anything with a web browser: from computers to phones, and everything in between.
To make sure websites look exactly the same on all these devices and web browsers, website designers have traditionally been limited to using fonts that are commonly found on pretty much any device with a web browser. The use of these fonts helps ensure a webpage will look the same from browser to browser, but it also limits the choice of fonts for website designers.
But there are absolutely no guarantees that any given font - even those common, supposedly "web-safe" ones like Arial, Times or Courier - will be installed on every browser-enabled device. And if a required font isn't installed on the device used to view a site, it will be substituted with a different one.
How web fonts suddenly change everything
Instead of relying on fonts installed locally on the computer, smartphone or tablet used to view a website, web fonts are all about telling browsers to use a font file located somewhere online instead. The widespread use of rapid Internet connections these days means that having to access online font information to display a page won't adversely affect site usability for most visitors, as the information is downloaded quickly and transparently.
Using a web font instead of a regular font means that site visitors will view your site exactly the way you intended it to look, every time.
To use a web font, it just needs to be linked from the site code, so web browsers know where to find relevant font display information. Applying the linked font to the site design is then just a matter of adding it to the site's CSS, just like a regular font. It's that simple.
Font licensing issues
To use a font, it needs to be licensed for third-party use (as in by you, on your site). People make fonts, so understandably you'll need to purchase a license to use most of them (it helps font designers pay rent and buy food, after all).
But there are also "free" fonts, made available for use by others via open (free) licenses. Google Web Fonts is one such one-stop-shop free font service, and includes everything you'll need to browse and link chosen fonts.
Putting web fonts to use to create a truly unique and personalized website design is really not that hard, and it only takes a few minutes to create a site (or modify an existing one) using them. Need proof? This site uses a personalized Google Web Font, added site-wide in about 2 minutes flat (see this web font tutorial for an idea of just how easy it really is).