homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / Site Graphics and Multimedia Design
Forum Library, Charter, Moderators: not2easy

Site Graphics and Multimedia Design Forum

Help with fonts in firefox
small fonts

10+ Year Member

Msg#: 2303 posted 3:58 pm on Feb 2, 2006 (gmt 0)

I need help with creating small tabs in firefox with a small font, ive created the tabs but cant create the small fonts within the tab, i overlay another layer but the font just gets blurred can anyone help me with this?




10+ Year Member

Msg#: 2303 posted 7:32 pm on Feb 2, 2006 (gmt 0)

what are you trying to do exactly? create images for tabs? css styled tabs?


5+ Year Member

Msg#: 2303 posted 7:50 pm on Feb 3, 2006 (gmt 0)

Humpingdan... sorry, had to regain my composure there for a second...

It sounds like perhaps you are talking about the effects of anti-aliasing fonts in small sizes.

In many image/graphics editors (Photoshop, etc), the default setting for fonts is to have anti-aliasing. This reduces the jaggedness that occurs when your monitor tries to render shapes that aren't very well-suited to its grid of pixels. This is a great effect when you have larger font sizes, as the difference between an anti-aliased piece of type and one with "steps", or rough, jagged edges, is astounding, and IMO is a big reason why the web has become so commercial: anti-aliasing turned computer text from cheesy garbage into professional quality.

But, when you hit smaller font sizes... 10pt, 8pt... the effect starts to cause problems. The way to avoid this is to turn off anti-aliasing, which in Photoshop is done in an area called the "anti-aliasing method" when you have the text tool selected. There you would select Crisp, Strong, Smooth... all of them being of B.S. terms for fonts, but creating the intended effect through anti-aliasing. The setting you want for small fonts is "None", which turns off anti-aliasing. This will allow the pixels to go where they want to go without any blurriness. As you go back and forth between large fonts and small ones, you'll find that you'll be switching this option back and forth constantly.

Incidentally, you'll find that most fonts that were designed for print do not look too good in this case (again, because they weren't designed to be laid out on a grid system)... fortunately, there are plenty of fonts out there that were made for such a purpose, and are referred to as "pixel fonts" or "bitmap fonts". Have yourself a google for those terms, and you'll find some fonts that should help you make great looking tiny buttons. Tiny, tiny buttons.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / Site Graphics and Multimedia Design
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved