I'm making a website template at the moment, and I'm not too keen on the 'times new roman font'. Anyone got any suggestions as to some nice fonts I could use that come as standard with both windows and linux? Atm all I can think of is sans.
Cheers.
Printable View
I'm making a website template at the moment, and I'm not too keen on the 'times new roman font'. Anyone got any suggestions as to some nice fonts I could use that come as standard with both windows and linux? Atm all I can think of is sans.
Cheers.
Arial Narrow, Tahoma, and Verdana are some nice sans-serif fonts of varying widths. If linux does not have them, they're likely to be installed with Star Office. So there you go.
Yeah Verdana is one of my favorites, but it seems I don't have it on my Linux pc. I got open office too. I dont know maybe I'll add a javascript to check the OS and then load a stylesheet dependent on whats being run.
Cheers.
Mhm, Star Office isn't open office. Style sheets already have the capability to degrade gracefully or whatever, so there's no need for any scripting magic. Just use the font-family property in your rules.
Arial Narrow looks nice in my opinion. You might want to adjust the letter spacing in your style sheet.
See if your distro has a "corefonts" package, it ought to contain Verdana, Tahoma, Courier New, Times New Roman, Arial and a few more.
As far as my experience goes, the default browser font is chosen on each platform to actually look good. Why second-guess it? Just make the basic decision whether you want it to be serifed or not and let the browser pick the font.Quote:
Originally Posted by mike_g
CornedBee: thanks, I'll have a look for it.
Brewbuck: I'm a bit of a weird one when it comes to laying out web pages, I don't use standard p, or h tags; I generally make custom id's and chuck everything in divs. And if I leave it up to Firefox it seems to like to picking yucky serif fonts for me.
You can use the appropriate paragraph/heading elements with custom ids too.Quote:
I don't use standard p, or h tags; I generally make custom id's and chuck everything in divs.
Yeah I know its just for some reason I never bothered using them.
Anyone know of any Monospace fonts with serifs?
Courier new.
...I'm so used to it I forget they have them.
*continues to fail*
You can use something like this CSS (copied from my web site):
It tries Verdana, then Geneva, etc, and failing all else, whatever sans-serif font the user has selected to be the default "sans-serif font".Code:font-family: Verdana, Geneva, Helvetica, Arial, sans-serif;
It should be noted that I've never actually seen Geneva, I just got it somewhere; someone said it was a nice sans serif font for UNIX or Mac or something. :)
Here's what I use for monospace, because I don't care so much what it looks like:
Anyway, just a thought . . . .Code:font-family: 'Courier New', Courier, monospace;
Oh cool, I'll do that then. I think remember seeing that used before actually.
Actually, I have to discourage you from doing that. Unless you actually test every single of these fonts, making sure that they fit into the layout and look good, you should leave the choice to the user's browser, using the generic font names. After all, if you haven't actually made sure that your font choice looks better than otherwise, who are you to dictate font choices? Perhaps I have my own special, beautiful serif font that I want to be used whenever the website author couldn't think of anything better. Should I be forced back to Times New Roman just because the author was too lazy to think about what he's doing?
Typography is important.
For example, I can compare four sans-serif fonts on my Linux box: Arial, Bitstream Vera, DejaVu and Verdana. I do this at three font sizes.
Generally speaking, Bitstream and DejaVu are extremely similar. DejaVu has slightly thinner lines, making it easier to read at small sizes (9pt). Bitstream has an odd bug where an r followed by an e leads to a huge gap. Could be OpenOffice, though. The fonts have pretty much the same metrics otherwise.
Verdana is also very similar. It was designed to be readable at small sizes, and it shows. It's a little wider than the other two at 12pt. It's definitely more readable at 9pt. It's butt ugly at 32pt.
Arial looks completely different. It's very narrow, with strong strokes, making it look very compact, but hard to read at small sizes. On the other hand, it looks better than the others at 32pt.
Typography is hard.
But as a simple guideline, I can say this: never put Verdana and Arial in the same font chain. They serve different purposes and look nothing alike. Claiming that one can replace the other is simple ignorance.
I know Arial and Verdana are quite different, but I like both of them and so I put both of them in. :) I didn't design my layout strigently enough that one looks better or worse than the other.
You're probably right that I shouldn't have those other fonts that I've never or rarely seen. I can't remember why I put them in there, though it might have been because my HTML book recommended it. Of course, HTML is different from CSS.
I think I might be changing it to
once I next upload my website. (Courier New is nice, because the default monospace font on many Windows web browsers is Courier, which doesn't look very nice at all, not being a truetype font.)Code:font-family: Verdana, sans-serif;
font-family: 'Courier New', monospace;
[edit] Might want to have a look at this page. http://www.webdevelopersnotes.com/de...ble_fonts.php3
Not only does it use "Arial, Verdana, Sans-serif", it also recommends the following fonts:
Don't ask me why, I'm not a font expert . . . I expect that's the kind of thing I read in the first place when I made the initial version of my website.Code:The Sans-serif family
Arial, Verdana, Geneva, Helvetica, sans-serif
The Serif family
Georgia, Times New Roman, Times, serif
The Monospace family
Courier New, Courier, monospace
Any other thoughts? Perhaps some browsers ignore "sans-serif", so you have to specify a specific name for them? . . . . [/edit]
> Perhaps some browsers ignore "sans-serif", so you have to specify a specific name for them?
I really doubt that is the case. font-family: sans-serif is a complete rule if the browser has complete css1 support.
I normally don't spend to much time on fonts. In my experience, if the idea is to design or artistically create, only a few fonts are going to work for a specific design. I think the reason some "experts" will tell you to include helvetica and geneva is to promote cross-platform support and design. Which might be a fallacy. I haven't seen a Mac machine without arial in a while.
Yeah, this Linux box has Verdana and Arial too. :)
Besides: we're talking about CSS here. That web page was talking about HTML. I can see old web browsers not supporting "sans-serif".
I think you're right that when using CSS, you can just use "sans-serif" to grab a sans-serif font on different platforms.
I mostly take my guidance on fonts from Jon Hicks.
http://www.hicksdesign.co.uk/tag/typography/