Typeface for web and print

YvesPeeters's picture

I was wondering if someone could suggest me a good typeface that does well in print and also in webdesign. I'm planning on using Sifr for webpage headings (flashfile that replaces fonts). I want the type to be as easy on the eyes as possible.

From what I found on the net, webfaces should have lots of white in the characters. That's why my first thought was the Nexus family. But I'm not sure yet.

Anybody got some better suggestions plz?

many thnx

Yves Peeters

ps. I'm bored of seeing Din and Meta so they are no option ^_^

Lex Kominek's picture

Some more information might be helpful. What is the website? Who is the intended audience?

- Lex

Jan's picture

Yves Peeters? Sorry, I was confused for a second. Never mind.

YvesPeeters's picture

I want to write about usability, webdesign,... also would like to use it on some of my blogs and printouts, maybe in autogenerated pdf files of my webpages.

If possible it should also have Serif, sans-serif, nice ligatures, medieval numbers.

The less the user notices that I'm using a special font the better.
Something like a verdana, but one that would work well in webdesign and print.

I also noticed that it's rather hard to find a good guide on what webtype should look like. If anyone could point me to one, I would be really happy.

YvesPeeters's picture

There are many Yves Peeters where I come from :)

SuperUltraFabulous's picture

right....

illicium's picture

I also noticed that it’s rather hard to find a good guide on what webtype should look like. If anyone could point me to one, I would be really happy.

The Elements of Typographic Style Applied to the Web

This is more of a technical guide on how to make type look good with CSS, though.

YvesPeeters's picture

Thnx Illicium.
Currently thinking about FF quadraat (Fred Smeijers)
Like the italic and the Sans but I hate the "B" in the regular :)
Imo it just looks odd. But then again, I'm not much of a designer.

hrant's picture

From the archives of the inimitable Roy Preston:
http://gmunch.home.pipeline.com/typo-L/cart/mini38b.gif

I love Quadraat, but I'd be shocked if it looks good onscreen.

There's a little secret about Rotis: the Sans Bold looks
amazingly clear at very small sizes (but track it looser).

hhp

YvesPeeters's picture

I was thinking Quadraat Sans would be good bcuz:
I have the impression it has a high X-height, much white in the lower "a" and "e". Please correct me if I look at it totally wrong

hrant's picture

But a big factor in screen rendering is "rigidity":
fonts that have very "expressive" outlines tend to
cause too much blur. And Quadraat is like that.

BTW, how could I forget! A really great font for screen use
(I used to rely on it heavily until I made Mana) is Laudatio.

You might also try Legato.

hhp

aluminum's picture

"I want to write about usability, webdesign"

Then rethink using sIFR. ;o)

Also, use whatever typeface hrant suggests. I think his tolerance threshold for on-screen type is pegged extremely low, so if it pleases him, it should please the masses. ;o)

YvesPeeters's picture

:) what's wrong with sIFR? it does degrade nicely. I was gonna use it for headlines, so I don't see any harm done to usability/webdesign. ^_^

hrant's picture

Darrel, that's the nicest thing anybody's said about me in weeks! ;-)

BTW, I wanted to make a small edit to my first
post but the "edit" is missing... Wassupwidat?

hhp

aluminum's picture

"what’s wrong with sIFR? it does degrade nicely."

Well for starters, it doesn't work sometimes. Look at this site, for example...I can't view most of the topic titles. Now, maybe that's typophile's fault and not sIFR's. ;o)

But, that said, at home I use FlashBlock a lot. As I dislike most flash (or rather, the way most flash is implemented) so sIFR doesn't work for me.

It's not BAD, but it's just yet-another-variable to go wrong in getting the information to your end users.

hrant's picture

> at home I use FlashBlock a lot

And some people don't use computers - sIFR doesn't work for them either.

hhp

aluminum's picture

"And some people don’t use computers - sIFR doesn’t work for them either."

Slopes are slippery, aren't they?

YvesPeeters's picture

hehe. true it doenst work with flashblock but you can still read the content.(if no javascript or flash is found it uses the css) Same goes for sites that are made for IE6. If done right people with internet explorer 5 can still read the content.

That's what internet is all about imo. People with a state of the art computer get the content they payed for + some extras. People with a lower system just get the content. That's a nice way of designing imo ^_^

ps I dislike most use of flash also, since it's in many designs not even needed and hides content from google. ( I wish macromedia director had won the plugin-wars )

aluminum's picture

"hehe. true it doenst work with flashblock but you can still read the content.(if no javascript or flash is found it uses the css)"

Actually, with flashblock, no, you can't see either. Same with typophile. I don't use flashblock here, but for some reason 9 out of 10 sIFR titles just don't show up for me.

"eople with a lower system just get the content. That’s a nice way of designing imo"

I completely agree. Progressive enhancement is a great model for web design. And sIFR is a neat idea. Works most of the time but has a few major flaws for some folks.

YvesPeeters's picture

Strange. This is what the sIFR site has to say about Flashblock:

We've worked with the developers of the Firefox FlashBlock extension to make sure sIFR text is automatically degraded to (X)HTML for users of recent versions of FlashBlock. When users install FlashBlock, they are demonstrating a bias against Flash (most likely because of the incredible amount of obnoxious and invasive advertising on the web these days) and we want to respect this bias.

lunyboy's picture

I think, I am not sure, the swf extension stands for "Shockwave Flash" and you can export from Director to a flash file that is readable by the flash plugin. This does not include the fun 3d stuff, as for other things, I am not sure.

BTW if you are only using it for headlines, then small readability will not be an issue... what body face(s) do you plan on specifing(respectively)?

litera's picture

I'd go with one of these:
http://www.adobe.com/type/browser/U/U_web-pages.html

Since you'll be talking about usability I'd combine Minion and Myriad.

aluminum's picture

Yves...good news from the sIFR folks...looks like I should upgrade my Flashblock plug-in.

SuperUltraFabulous's picture

I wonder if there any print differences in the Adobe Web Pro fonts and their regular cousins.

Does hinting affect printing? Or is it a combination of modified forms and hinting that make a "proper" screen type family?

Mike

missgiggles's picture

Sorry I am not so knowledgable as everyone on here but all I know is that usually the typefaces with less contrast of thin and thick strokes are used on web and TV etc due to the fact that they work on screen and do not lose their quality of their strokes etc.

hrant's picture

Is nobody going to address Mike's line of questioning?

hhp

SuperUltraFabulous's picture

Perhaps Mr. Phinney can chime in on my questions.

Also read this last sentence on this FontShop webpage:

http://www.fontshop.com/services/logo.php

In addition, laser-printing a logo in font format at small sizes is generally superior to printing an EPS image due to the font’s hinting.

Mikey

mike_duggan's picture

>Does hinting affect printing? Or is it a combination of modified forms and hinting that make a “proper” screen type family?

Hinting can affect higher resolution output, especially for controlling undershoots and overshoots for instance. The effects of hinting however, if done well should not be noticable on the printer, but will have a noticalbe effect when the font is displayed on lower resolution screens, to control consistency of x-heights, stem weights, Cap Heights, middle bars etc. As far as I know the fonts you are referring to are TrueType hinted fonts, and will be different from their Type 1 cousins on screen as well as in print, however subtely.

Mike

YvesPeeters's picture

A list apart has an article about online type.
http://www.alistapart.com/articles/cssatten

Syndicate content Syndicate content