Forum Moderators: not2easy
Does anyone have a technique of finding out what fonts a specific website uses?
Tips to tweak fonts for that ultimate clean look?
What is your favourite style <h1>?
What is the style of your most commonly used <p>?
What attributes do you give your fonts or do you just assign a site?
Any answers to any of the above questions could help ease my spinning world of fonts and print so please don't hold back ;-)
Cheers,
First of all, I don't know if you are using this or not (I think you are already), but use font CSS styles, and not the HTML tag. Here's A good reference for doing so:
[w3.org...]
blurriness is a strange complaint, Since there should be nothing (unintentional) which would cause blurring. Only the OS has a bit of variety in rendering fonts, such as smoothing edges of screen fonts, and using cleartype (which I forgot if they are the same thing or not). If you are comparing your webpage with the other webpages on the same computer though, thenit doesn't make much sense why yours is blurry. make sure you have the font that's being tested of course. When it comes to presentation to others, most users have very limited font sets. If you use font other than like Arial or Courrier, you already loose 1-10% or something of users who will view it correctly. Stick with the "web safe" fonts, some noteworthy ones I think are Georgia, Verdana, and impact, but I'm not certain about georgia; it looks nice though (I don'tlike impact but it's a very distinct font).
When it comes to telling what fonts others are using, you can check their CSS code. Sometimes it can be tricky though, in large complicated pages, so you oculd use a tool such as CSSViewer (a firefox add-on) which will let you see all styles applied to whatever object your mouse is hovered over. It can be quite useful, but is a little lacking due to the following:
1. it just tells you what font families were designated for the element, it doesn't say which one the browser is actually using
2. It doesn't specify sizes of elements (including text) in percentage , em, or anything else, it converts them all to pixels. Means you'll have to look in the CSS for the original value.
I think those are the only two caveats.
Now lastly, instead of using small, medium, etc. sizing, I recommend you just set stuff using ems. This is pretty much universally compatible, and offers much more precision into the different sizes you want to use, such as 60% normal size, 120% normal size, etc. You aren't bound to just the preset 7 sizes.
The bulk of your text you will not need to specify the size at all, since that will be the default browser size, which is equivalent to 1 em.
To answer some of the sort of unanswerable questions:
-Paragraph elements don't need to be styled at all! if you can you can give them a background color or something, or all sorts of things, it's all up to you, and there's nothing special you need to do, especially when it comes to the font.
-Fonts don't tweak. Not unless you count letter spacing, font weight (just a variable bold), and stuff like italics. Maybe you do count those things. There's also text-indent and line-height, if you're interested in those. You could in theory modify visually what a font looks like using crazy activex and/or javascript stuff, but don't even consider it.
-H1 styles, just like the P tag, is totally up to you. some people may underline or bold them, some may change background color, etc.. The size should be pretty big though. Probably at least 1.5 times the size of the normal text. More likely 1.8x or more, considering 1.5 might be used for a short summary after the header. It's really up to you though, and don't take my advice for anything.
-I don't even fully understand that last question, but just do whateer styling you, the designer want to do; whatever you think would look nice. you could copy parts of what some other site had too if you wanted.
One thing I would like to know is what exactly is em a measure of?
By font tweaking I did mean letter spacing, line height, text indents etc - I was just curious as to what people use IF any.
Sifredi I think you touched on a great point there - my designs can become a bit hectic - I will keep this in mind for next time.
Browsers don't do a great job with letter-spacing, justification and other tweaks that you may be used to in Quark or InDesign. Much less typographic sophistication.
Cheers.
