/    Sign up×
Community /Pin to ProfileBookmark

Typeface Hell!

Copy linkTweet thisAlerts:
Mar 15.2003

I recently put together a web page using a typeface (Showcard Gothic) that I thought would be on everybody’s machine, but of course it turned out it wasn’t when I looked at the page on a friend’s machine.

Has anybody got a list of the typefaces that come as standard with Windows 95, 98 etc – oh and the Mac too.

Or alternatively is there some trick to make a webpage load a typeface with itself?

The Shirt Bloke

[url]www.shirtbloke.com[/url][URL=http://shirtbloke.com]www.shirtbloke.com[/URL]

to post a comment
HTML

12 Comments(s) ↴

Copy linkTweet thisAlerts:
@khalidali63Mar 15.2003 — These are the font family values supported by CSS for all paltforms

serif

sans-serif

cursive

fantasy

monospace

If thats what you wanted..

?

Khalid
Copy linkTweet thisAlerts:
@shirtblokeauthorMar 15.2003 — I'm not really sure if that's it.

I've just looked at all the typefaces on my machine(in Front Page) and none of those were listed.

I really meant what faces come installed on (almost ) everybody's computer as standard when you install windows?

The shirt bloke
Copy linkTweet thisAlerts:
@AdamGundryMar 15.2003 — There are somewhat complete lists available on Microsoft's website:

http://www.microsoft.com/typography/fonts/default.asp

Remember, however, there are so many different operating systems available (in different versions and so supplied with different fonts) there are not many you can rely on being present.

You should always use one of the CSS font family values already mentioned as the last in your list, so that will act as the default.

Adam
Copy linkTweet thisAlerts:
@shirtblokeauthorMar 15.2003 — Thanks for that - it's useful reading.

I needed a big bold font, and it's good to see that Arial Black is one of the core fonts (IE 3.0 onwards).

I shall use it more.

The Shirt Bloke[URL=http://www.shirtbloke.com]http://www.shirtbloke.com[/URL]
Copy linkTweet thisAlerts:
@JerryWMacMar 17.2003 — Not certain if this helps, and I am also not certain how to do it, but I believe I saw reference awhile back that you can embed fonts with your web page, so that when the page is loaded, regardles of machine or OS, or browser the proper font is also loaded with it...

Possibly with linked files, or CSS, I honestly do not remember how it is done, only read it briefly...

Simple browser search for embedding fonts should give results for this...
Copy linkTweet thisAlerts:
@shirtblokeauthorMar 17.2003 — Thanks -

I,ve just done a search on Google and come up with this....

http://hotwired.lycos.com/webmonkey/design/fonts/tutorials/tutorial2.html

It looks a little bit complicated, and unlikely to work on everybody's computer, so we seem to be back where we started.

The Shirt Bloke
Copy linkTweet thisAlerts:
@DaveSWMar 17.2003 — Someone else I know tried doing this, and said it was simple, just upload the font file somewhere, and edit the code below. Crossbrowser compatibility I don't know about however.


WEFT Font Download

<HEAD>

<STYLE>@font-face {font-family:comic;0 src:url(http://abc.domain.com/fonts/comicbold.eot);}

</STYLE>

</HEAD>

<BODY>

<p style="font-family:comic;font-size:18pt">this line uses the @font-face style element to display this text using the Comic Sans MS font in 18-point size and bold.

<p>

</BODY>

You could use a CSS style sheet, select this font first, and then the font families Khalidali mentioned afterwards as a backup.

Dave


PS the font categories Khalid mentioned are for CSS sheets - it will find fonts on your PC that are listed in those categories, though they are a backup technique - try specifying a few fonts first.

If you want an easy way to learn CSS let me know and I'll post the code you need to put in your document and the CSS file. I learned CSS basics this way and it makes life easier.
Copy linkTweet thisAlerts:
@shirtblokeauthorMar 17.2003 — I'd have to say that CSS are a bit of a mystery to me - I kinda know what they're for, but not how to do it. I'm using Front P:age, and as usual, the Microsoft help files are oblique to say the least - I've worked out how to specify them, but can't work out how to implement them.
Copy linkTweet thisAlerts:
@DaveSWMar 17.2003 — Ok.

Easy way to learn the use of CSS. ?

Put this in the head section of your document in Source view, next to the title tag.

<LINK HREF="styles/modernist.css" TYPE="text/css" REL="stylesheet" TITLE="W3C Core Styles: modernist" ID="sqstylesheet">

Then put the file from the link below in a folder called styles, in the same overall folder as the one you're working in, and bob's your uncle. well perhaps anyway. You can then open the attached file in notepad or wordpad and change the colours of each item. It's quite simple once you get the hang of it, you just need to know your websafe colours in hexidecimal, or alternatively you could just dabble and change the numbers.



Try it!

Dave


[URL=http://www.emdevelopments.co.uk/styles/modernist.css]css file[/URL]
Copy linkTweet thisAlerts:
@DaveSWMar 18.2003 — Forgot to say, save it as a .css file. doh! I can email it to you if thats easier - the forum attachment feature doesn't allow .css files!
Copy linkTweet thisAlerts:
@shirtblokeauthorMar 18.2003 — If you could Email it, it would be a help.

Goto my site[URL=http://www.shirtbloe.com]http://www.shirtbloke.com[/URL]

and use the contact link at the top of the page.

Many thanks
Copy linkTweet thisAlerts:
@DaveSWMar 18.2003 — I sent it to the enquiries address 'cos I wasn't sure which one to use. Is that OK?

Dave
×

Success!

Help @shirtbloke spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...