Enter your Sign on user name and password.

Forgot password?
Sign In | Subscribe
Start learning today, and be successful in your academic & professional career. Start Today!
Loading video...
This is a quick preview of the lesson. For full access, please Log In or Sign up.
For more information, please see full course syllabus of Adobe Dreamweaver CS6
  • Discussion

  • Study Guides

  • Download Lecture Slides

  • Table of Contents

  • Transcription

  • Related Books

Start Learning Now

Our free lessons will get you started (Adobe Flash® required).
Get immediate access to our entire library.

Sign up for Educator.com

Membership Overview

  • Unlimited access to our entire library of courses.
  • Search and jump to exactly what you want to learn.
  • *Ask questions and get answers from the community and our teachers!
  • Practice questions with step-by-step solutions.
  • Download lesson files for programming and software training practice.
  • Track your course viewing progress.
  • Download lecture slides for taking notes.
  • Learn at your own pace... anytime, anywhere!

Working with Web Fonts

  • There are now many ways to add fancy fonts for your designs but you have to be careful of the licensing issues
  • All fonts are licensed in one way or another, you cannot assume you can use them freely even if you can download them
  • Many paid services sell fonts to use, you are purchasing the license to use the font
  • Various fonts available for free on the web
  • This does not mean you can use them for commercial purposes
  • Be careful of the licensing for fonts
  • Fonts are available at the following links:
    • Typekit.com
    • Fonts.google.com
    • Fontsquirrel
  • Most fonts require you to pay to use them which includes a license to use them

Working with Web Fonts

Lecture Slides are screen-captured images of important points in the lecture. Students can download and print out these lecture slide images to do practice problems as well as take notes while watching the lecture.

  • Intro 0:00
  • Fonts Overview 0:07
  • Adobe Type Service 1:52
  • Google Fonts 2:40
  • Font Squirrel 3:26
  • Font Licensing 3:34
  • Summary 4:49

Transcription: Working with Web Fonts

We are now going to talk about fonts and working with fonts on the Web and for your website.0000

Fonts have always been a bit of an issue when you are working on the Web, because you have to make sure that the user has the fonts that you want to use on your website on their system.0007

Even way back when the Web was first starting, it was possible to try and embed fonts into web pages, and I did go through that process for a client when I was first working on the Web.0020

It was a lot of work: it required a couple of different programs for the different operating systems, and by the time I went through all of that, the web pages were very big, and we didn't have fast Internet back then.0033

But the main issue with embedding fonts on a page was always that the fonts would end up a little bit fuzzy.0047

I was able to get, for the client, their specific font onto their web pages, but they weren't crisp and clear, and that was the major issue.0055

So, we ended up coming up with different fonts for the website than for their print work.0065

We have come a little ways since then with regards to fonts, but it is still a bit of an issue.0073

I have the Adobe Type website open, only because I want to show you--notice, there is a Find Fonts button.0079

And fonts are listed alphabetically, by style, by theme--there are all kinds of fonts available for you.0087

But, do you want to use those fonts?--#1, because they will add to your page size; #2, they may be unable to be licensed for the Web.0096

Licensing of fonts is a big issue.0109

Now, this Adobe Type service is a service, and you pay for it; along with that payment comes part of licensing the fonts for your own use.0113

Another area where you can get fonts is one the Adobe website, based on the Font Finder.0125

This looks like, "Oh, cool! I can go out and get a brush font, and I select the category here, and it shows me all kinds of different options."0132

"I can do handwritten, and here are a few more options."0142

The issue is not "Can you find the font?"; the issue is "How much is it going to cost you to use it or license that font, and is it licensable at all?"0147

Now, there are a couple of ways you can deal with those types of issues; but licensing is still a concern.0160

Any time you are going to use a font, you go out and find a free font on the Web...just because you can download it doesn't give you the right to use it, especially if it's a commercial website.0168

You must make sure to look over the proper licensing, and in that licensing, it will determine if you have access to using it, and where.0183

Maybe you can only use it for print--you can't use it out on the Web.0194

So, here is an example of some Google fonts: Google has some services, and we will take a look at that later.0199

But we also have this Font Squirrel as a website, and that has some free fonts available, as well.0206

But wherever you decide to get your fonts, it is so crucial to make sure that you have the license to use those.0214

Notice, on Font Squirrel here--just to show you an example--these little icons here on the left-hand side, underneath the name of the font.0224

What that does is tell you where it is possible to use it--not necessarily that you have the license to use it, but the type of device that it is possible to use it for.0233

And any of these with the little globe does mean the Internet.0246

But never assume, when you are working with fonts, that you have the rights to use those any way you wish, just because you can download it.0250

We are going to take a look at working with some of these different fonts, and specifically the Google fonts and Font Squirrel fonts, and how to install them.0261

There is also, in addition to the Adobe Type piece--there is a Typekit piece available that is another paid service where you can download and license fonts.0272

And there are quite a few of them in addition to those: I am just naming a few.0285

But I just want to make you aware: when you are working with fonts on the Web, you do have access to other fonts that you can store on your Web server to make sure that the user is always viewing the same font, and you are not dependent on the user system containing those fonts.0290

The font world is opening up to use on the Web side; we just have to be very careful and knowledgeable about how to use it to make sure we are not out of any licensing rights.0309

And, as long as you pay attention to that, we can have some fun with our fonts on the Web.0322

So, just a brief overview about licensing and Web fonts to use for your own web pages.0329