Solved

how to make it so users view a website font that is  not installed on their computer

Posted on 2003-11-05
13
460 Views
Last Modified: 2013-12-03
Hey all,

Suppose I have a website with the font "Kels", how would the user be able to view the kels font (face) on the website, if the user does not have this font installed ?

Is it possible ?

HTML btw.

Any input would be greatfully appreciated,

Thanks,
Shawn
0
Comment
Question by:stoon
  • 4
  • 3
  • 2
  • +2
13 Comments
 
LVL 19

Accepted Solution

by:
Dexstar earned 28 total points
ID: 9690909
stoon:

> Suppose I have a website with the font "Kels", how would the user be able to
> view the kels font (face) on the website, if the user does not have this font
> installed ?

> Is it possible ?

Here is how to do it:
http://www.spoono.com/html/tutorials/tutorial.php?url=embeddingfonts

Hope that helps,
Dex*
0
 
LVL 11

Assisted Solution

by:Zontar
Zontar earned 26 total points
ID: 9691949
Please don't do this. Font files are not small, and you'll add tons of bulk to your pages.

There are other issues:

It's done differently in different browsers.

You may encounter lisencing issues as well.

Either use a text gif (not really good idea) or specify a list of fonts in your CSS. You can always link to the font file and let users download it if they want to -- just make sure it's legal for you to do so. Some folks are VERY touchy about having their fonts redistributed without their permission (and a wad of cash).
0
 
LVL 19

Expert Comment

by:Dexstar
ID: 9695118
On that sample site, they use a sample font and the size of the font file is 25KB.  If you intend to use that font heavily on your site, then using embedded fonts my actually REDUCE the size of your site because you reduce the number of graphics that you would need if you didn't use embedded fonts.

Zontar is right about the licensing though.  Make sure you have permissions to use the font on your web site.

Dex*
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Assisted Solution

by:temporo
temporo earned 26 total points
ID: 9704742
The easy way would be to create the text that you want in a picture and put that up on the screen then the user will see the font what ever fonts they have installed.
0
 

Expert Comment

by:icepricessa
ID: 9785698
yup i agree with temporo that would be an easier more efiicient way :P
0
 
LVL 11

Expert Comment

by:Zontar
ID: 9785882
Using a font list lets the user have control. The user might not like your font, or might find it difficult to read.

The Web is not print -- don't try to treat it as though it were.
0
 
LVL 19

Expert Comment

by:Dexstar
ID: 9788885
How is using images more efficient?  Images have to be downloaded for each word you want.  A font you just download it one time, and then the rest is text.  Also, I noticed this the other day trying to translate a page into English using Google:  If you use Images, those translators can't translate the text.  If you use fonts, then they can (or try to, at least... :P).  :)

There are pros and cons to each, really.  But the Asker wanted to know HOW to do it, not whether or not it is a good idea...  :/

Dex*
0
 
LVL 11

Expert Comment

by:Zontar
ID: 9789580
And if someone asks how to jump off a cliff, you'll tell him how without advising that perhaps it's not the best thing to do? Okayyy...
0
 
LVL 19

Expert Comment

by:Dexstar
ID: 9789900
If they asked me via this site, I would tell them how to jump off a cliff, sure... What subject area would that be in?  :P

But seriously, it's good to get different types of answers and advice.  I wasn't trying to disparage your comment at all.

Dex*
0
 
LVL 2

Expert Comment

by:Shattuc
ID: 11746516
how do you jump off of a cliff?

Sorry way off topic, ok, Solutions to your problem...
Put a small section on your page that plainly states, to view this page as the author intended please install this font to your font directory in windows.  supply the font file, and have it accessible from your server using the <a href="myfont.ttf">click here</a>
using this instance however, make sure the font file is in the same directory as the page linking to it. make sure you use the <font face="x, y, z, 1"> see bottom for better description.

Second, if you only use this font for headers and such, design a button using the font and then they won't need to worry about installing the font.

Third...
try to find a font that is commonly available in most browsers and looks like your font.

"The FACE attribute gives a comma-separated list of font faces in which to
display text. The fonts are listed in order of preference, so that if the
browser does not have the first font listed, it will try the second, then the
third, and so on."

so by using <font face="myfont, Comic Sans, Arial, webdings"> if the user has the font installed, they can view it as you intended it, if not, they will see it in ComicSans, or arial, etc...
0
 
LVL 2

Expert Comment

by:Shattuc
ID: 12479189
I think I should be on that split list. My response is detailed, and covers multiple options for a solution to thier situation. That is my only objection.
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Article by: Matthew
I am a very big proponent of technology compliance standards and strive to meet such criteria in all of my work. That includes my site, which is 100% XHTML 1.0 compliant as determined by the World Wide Web Consortium. https://www.matthewstevenkel…
There are two main kinds of selectors in CSS: One is base selector like h1, h2, body, table or any existing HTML tags.  For instance, the following rule sets all paragraphs (<p> elements) to red: (CODE) CSS also allows us to define our own custom …
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question