Various Fonts

**james438** · 03-16-2010, 03:18 AM

I am exploring different font styles with doctype strict.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

I don't how important doctype is though.

It seems that most of the doctypes that I try simply are not working in any browser. For example the following all look the same in Opera:

Code:

<style type="text/CSS">
.a13
{font-family: Westminster, Helvetica, sans-serif;font-size:24px;color:orange;
}
.a14
{font-family: Tristan, Helvetica, sans-serif;font-size:24px;color:orange;
}
.a15
{font-family: "News Gothic MT", Helvetica, sans-serif;font-size:24px;color:orange;
}
.a17
{font-family: Tahoma, Helvetica, sans-serif;font-size:24px;color:orange;
}
</style>
<span class='a15'>test</span>

Am I writing them out wrong? Do they need to be installed manually? Does anyone happen to know where I can find a list of fonts that Opera recognizes or maybe how to test them? I ask, because I am becoming unsure that I am testing them correctly.

**jscheuer1** · 03-16-2010, 04:07 AM

They are all the same, almost. The size and color are all the same. The way the font-family property declaration works is that if you list two or more fonts, the first one listed that is installed and supported by the browser/OS combo viewing the page is the one that will be used. Most likely that's generic sans-serif for those you've listed, with the probable exception of tahoma, which is a sans-serif font. It differs from the generic sans-serif font (usually arial, configurable in the browser from available fonts) only (as far as I can tell) in the way certain letters are moved closer together. With a word like 'test' you probably won't notice the difference. Try the word 'wall'. In tahoma, at least generally, the two L's will be closer together than in generic sans-serif/arial.

All those other fonts aren't supported in a typical modern Windows/Opera install, so they will all default to arial (or whatever your configured generic sans-serif font is in Opera) in most cases.

**james438** · 03-16-2010, 04:42 AM

Thanks. I'll look into installing those fonts. Other people most likely will not be able to see them, but I will. I was a little vague on how the font-family property worked. I was thinking (mistakenly) that possibly if the three I listed were not compatible they would not work at all.

**BLiZZaRD** · 03-16-2010, 07:18 PM

There is always a default and it is based on what the end user has installed on their computer. If no font is described, the browser displays what is set as system default, usually it is Ariel or Times NR.

To help answer your original Q though, it is probably because you do not have those first on the list installed, but almost every computer (newer the better) has Helvetica installed. Even if they don't you most likely do, and since it is second on the lists, that is what you are seeing.

And no, Doc Type has nothing to do with the fonts seen by the browser.

**james438** · 03-16-2010, 07:23 PM

What about meta stuff?

Code:

<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">

I say this because of the charset part of it.

**BLiZZaRD** · 03-16-2010, 07:52 PM

The meta content for character encoding is just that. It's purpose is to convert characters from bytes. It has no actual bearing on the font choices.

That is to say though that if you choose to use an Arabic font, for example, and have meta encoding for Western languages, then instead of Arabic display you will see question marks. However, the question marks will be in the font you have set in the CSS.

**jscheuer1** · 03-17-2010, 02:06 AM

That's all to say pretty much what I was saying. But well put BLiZZaRD, clears up just about any lingering doubts, thanks. I would only take exception to the bit about Helvetica. Once common, the Helvetica font is no longer (As Far As I Know) found on common installations. Because it once proliferated though, it's still around a lot. This is because many folks brought it forward with upgrades and updates, even with new computers, and it may often creep in from other commonly used programs that install it. It is not however (AFAIK) common on new installs of Windows or any of the most commonly used browsers. This is not to say that's good, just that it (again AFAIK) is. Helvetica may or may not be common on other OS's.*

All that to one side (mostly, as I now stand on my soapbox), I think for the most part it's a good idea to design just with generic fonts:

serif
sans-serif
monospace

Though not ideal, if you have the most common generic fonts for these installed, as do the vast majority of folks, this will give you (respectively):

Times New Roman
Arial
Courier New

Anything beyond that (barring schemes that let you enforce fonts, even on systems that don't have them) is speculative. The obvious drawbacks are that some folks will not have these latter three as the defaults for the former three generic fonts, and that it's limiting. But, think about it. If you specify a font you have that others may not, even if you specify a fall back, it probably will not lay out the same. So it's a trade off. By adhering to the lowest common denominator you get fairly consistent layout for like 99% of viewers, and less decisions to make about fonts. You lose fancy text effects, but still have adequate variety for most situations.

That said, a really talented designer (at least as far as text layout goes) will be able to specify any font because they have laid out the text portions of their page in such a way as that differences in the size and/or aspect ratio of the font won't disrupt the rest of the layout.

*This bit about Helvetica is wrong.

**BLiZZaRD** · 03-17-2010, 02:25 AM

Or we could all just use Flash and embed the fonts in the application shown on the page

this blog post does show (among others that I have read about this subject) that Helvetica is still the #1 font used and requested. I try not to use it, it is just a little too "boxy" for me. But it is very very popular. Odd since it is so hard to say and spell. LOL

**jscheuer1** · 03-17-2010, 03:08 AM

Originally Posted by BLiZZaRD

Or we could all just use Flash and embed the fonts in the application shown on the page

Funny you should mention that, I was thinking about it because of the association in my mind between you and Flash. That's one of the schemes I was referring to for enforcing fonts. Obviously though, most folks wouldn't want their entire site dependent upon Flash.

Originally Posted by BLiZZaRD

this blog post does show (among others that I have read about this subject) that Helvetica is still the #1 font used and requested. I try not to use it, it is just a little too "boxy" for me. But it is very very popular. Odd since it is so hard to say and spell. LOL

Ooops, I thought I had tested that, but upon reexamination, I see that my test was faulty. Helvetica is widely supported, but looks (in most cases) just like Arial. So this doesn't really change the overall thrust of either of our remarks, just all that stuff I said specifically about Helvetica.

**BLiZZaRD** · 03-17-2010, 06:44 PM

Awww! John was thinking about me!

What is this test you speak of? Did you write a reach script for fonts?

That would be an interesting stat to add to my massive stat tracker... the default font used by a visitor... hmmm... may have to work on that. Think that is information we could capture by a visit? Like the browser and OS are?

Thread: Various Fonts

Thread Tools

Search Thread

Various Fonts

The Following User Says Thank You to jscheuer1 For This Useful Post:

Bookmarks

Bookmarks

Posting Permissions