Is this the new concept of a "better-looking web"?

Miguel Sousa's picture

http://www.technologyreview.com/web/23503/?a=f

If so then I'm going back to Web 2.0...

blank's picture

It’s like trying to read Emigre. I really hope that I don’t have to go through another decade of designers thinking that to make a point their work has to look like shit run over twice. (not that I was in design back then, but I remember purposely putting ugly alt-rock magazines back on the shelves and sticking to US News and World report).

russellm's picture

ha

careful what you wish for..

-=®=-

William Berkson's picture

Oh my, Joshua, who is a Typophiler, must be distressed with what they've done to his article. "Not clear on the concept" :)

dezcom's picture

Published by MIT!!! It would be bad enough if some party-time frat house at a marginally accredited school had done this--we could just say it was do to drunken airheads. But MIT? Isn't this where the average College Board scores are 1600?

Say it isn;t so, smart geeky colleges make sßitty type choices.

Just shoot me.

ChrisL

Si_Daniels's picture

The article (non webified version) is actually pretty good. But wasn't one of the main crits of Safari the lack of a kill switch for linked fonts?

Miguel Sousa's picture

Now I'm thinking this is a publicity stunt. It must be!

k.l.'s picture

I thought the selected typefaces indicate that the sub-headline is meant ironically.

Interesting. Site crashes my FF3.5/Mac.

Jens Kutilek's picture

On Windows the rendering is even worse than in the screenshot above.

kentlew's picture

That's funny. When Joshua sent me the link to his article the other day, he gave me this one:

http://www.technologyreview.com/web/23502/?a=f

which isn't showing up with @font-face and has a more appropriate dateline.

And now I see that this page is also linked from the page Miguel posted, in the sidebar, with the label "Read the article in TR's normal font."

aluminum's picture

Someone pulled a David Carson.

Richard Fink's picture

@all
I didn't read all the reviews of Gutenberg's bible when it was first published but I'm sure the font was attacked as a bad knockoff. Some monk somewhere probably sued.
Anyway, writing as a web developer, the significance of font linking goes beyond cosmetics.
Until now, web designers have faced a problem that's almost impossible for those in the print trades to even imagine: the font has been a variable rather than a constant.
I guess the closest analogy would be leaving the choice of fonts to a service bureau. "Come as close to this as you can", would be about all you could say.
In other words, so many design decisions that normally would be based on the metrics of the font have been impossible to make because, when you don't know what font is going to be used with any level of certainty, you can't make them.
An intolerable situation for sure. And one which, because of the large files sizes involved, could not even be addressed until broadband became the norm rather than the exception.
The very beginings of web typography are where we are at now. And it effects everything - layout, the need to scroll or not, everything needs to be looked at freshly.

Anyway, right now, the uglier it is, the better I like it.

Regards,
Rich

Si_Daniels's picture

[deleted]

dezcom's picture

I am betting it is a little joke as well, Miguel. Nobody would put together such a hideous combination without having tongue firmly attached to cheek.

ChrisL

mike_duggan's picture

>>Someone pulled a David Carson.

they should have used Zapf Dingbats

joshuajfriedman's picture

Hi, all,

Please do follow the proper link to my article to read it styled normally:

http://www.technologyreview.com/web/23502/

The wild-font-enabled version was apparently created as a Web-only extra feature, no doubt with good intentions. I'll look into it.

Josh

dezcom's picture

Thanks Josh! Now I can actually read it without throwing up :-)

ChrisL

Miguel Sousa's picture

Wow, I was so blinded by the article's font that I didn't even notice the “Read the article in TR’s normal font” link on the sidebar. Thanks Kent.

The link I posted above was found via the Microsoft Typography news feed at http://www.microsoft.com/typography/links/News.aspx?NID=6416 . I see that the link on MS's page is now pointing to the URL Joshua posted above.

Sii, are you trying to makes us switch to IE? ;^)

Si_Daniels's picture

To be honest Mike Duggan passed us the link and we posted it without thinking to check the article in FF. Josh contacted us earlier today suggesting we change to the non-web-fontified version so we updated the link. This wasn't a deliberate conspiracy on our part. :-)

dezcom's picture

"...wasn’t a deliberate conspiracy on our part."

C'mon. Si, I saw you on that grassy knoll :-)

ChrisL

begsini's picture

If you didn't like the way that looked, it's probably (y)our own fault:

MIT Graphic Identity

See the:

Go to the forum where typophiles share information (requires Flash plugin)

link.

Dan Gayle's picture

"In other words, so many design decisions that normally would be based on the metrics of the font have been impossible to make because, when you don’t know what font is going to be used with any level of certainty, you can’t make them.
An intolerable situation for sure."

Actually, it has to be tolerated. The web isn't print, and designing with pixel perfect limitations imposed is an injustice to the many people who don't use a < 1680x1050 screen.

You also cannot control the size of the typeface, so measuring based on metrics is moot anyways.

Richard Fink's picture

@danGayle
"Actually, it has to be tolerated. The web isn’t print, and designing with pixel perfect limitations imposed is an injustice to the many people who don’t use a < 1680x1050 screen.

You also cannot control the size of the typeface, so measuring based on metrics is moot anyways."

Huh? Well, I've come to love injustice. It's ugly but I see so much of it. And I could've sworn rasterizers take the metrics of the font into account. Maybe I'm wrong. Maybe that's why everything looks like Arial at 12px to me. Or maybe Segoe UI.
I just don't know anymore...

alkarnur's picture

Well obviously this will lead to greater "MySpace-ification" of the web when it comes to pages generated or customized by amateurs, which is nothing new. Now the lameness no longer is restricted to themes and imagery, but also to type. Prior to this, type on the web was generic, which is arguably better than this (at least generic type such as Times and Verdana are legible). But the point is that designed pages and sites will be designed and non-designed pages will be non-designed. What @font-face does is allow the designed pages to look even better and even more geared towards the audience and message. I don't know why typographers are so appalled, if anything this *increases* the difference in quality between designed and undesigned pages and makes design that much more valuable.
Whining about @font-face is like whining about people being able to make hand-lettered posters (for a missing dog, or a party promotion) and stick them on poles, walls and columns in the offline world; and I've seen many typographers whine about that.

Too many typographers and designers tend to want to educate the masses about graphic design, but I think that's just a sign of insecurity, because the power of graphic design works whether the audience is aware of it or not. The only people that need to know why a certain alternative or approach is better than another is your clients.
Too many designers want to "cure the visual disease", they want to make everything look good, e.g. the entire web, but the only thing you have to make look good and make it communicate the right messages is your client's graphics.

Besides, suppose you're designing a social website, you can set restrictions and guidelines on what can be styled or customized in personal pages (e.g. profile page) kind of like Facebook does (unlike MySpace).

William Berkson's picture

Metrics in a digital font are given as percentage of the em, so both side bearings and kerning are not size dependent. What happens in the rendering process I don't know, and from what I read here things go wonky, but that doesn't seem to be the fault of the metrics.

Also at large sizes, the tracking should be tighter, and I suppose browsers don't do that.

k.l.'s picture

Regarding "metrics", I think that different people speak of different things here. In some cases I am not sure what "metrics" is supposed to mean at all.  :(

Richard Fink's picture

@william berkson
"Also at large sizes, the tracking should be tighter, and I suppose browsers don’t do that."

On their own, browsers do what they do, depending upon the font. There is a default behavior.
Beyond that, web authors have as much control over tracking as can be gotten in any program - at least as far as screen display is concerned. (Not when the web page is printed out.)
Tracking instructions can be set at the pixel level. Cascading Style Sheets (CSS), is the "language" that browsers use to control presentation - spacing between glyphs being a part of that.
Inter-word spacing, too.
But instead of pixel units, I recommend using em units for tracking and kerning in CSS, for a variety of reasons.
One of them is that, within the font, the em unit is very finely subdivided (which, as a type designer, you know). On LCD screens, one result of this - at least in Windows with Cleartype - is that you can get the sub-pixels of the X-axis working for you, too.

However, right now, web authors usually don't fuss with typography on this level.
Viewed historically, there are understandable reasons for this. While browsers have had this capability for quite some time, in a world of CRT screens where everything looked crappy anyway, it just didn't pay.
Things change. Usually for the better. It takes time for new capabilities to sink into people's heads.

But then there are those who share the philosophy of DanGayle - that somehow lack of precision and predictability are virtues.
They aren't. They were just the consequences of web browsers and HTML being a young and very incomplete technology.
(I've run into this before. Many, many times.)
I don't believe this attitude will survive in the long term.

ciao, rich

*Occurred to me there's an example of exactly the kind of fine adjustment I'm talking about on my web site, Readable Web. I'm using @font-face to bring in the font for the logo type. The font/windows/browser decision about spacing between the R and e immediately following, and the W and e immediately following that, were too wide. I adjusted it - call it tracking, kerning, as you will - using CSS. I haven't checked it on a Mac but in Safari on Windows it's OK, too.

Dan Gayle's picture

"lack of precision and predictability are virtues"

Building with flexibility is virtue. This is the first time in human history that flexibility has even been an option, let alone a necessity.

It's all about the end user, and designing with flexibility in mind. Because, like it or not, the end user is going to override your finely wrought design somehow. Wrong browser, wrong viewport, wrong type size, wrong whatever.

I build websites precisely and predictably knowing that someone is going to not be able to see it the way I see it, and that's ok because they have different needs and circumstances than me.

As to the subject of @font-face, I think it's great. But I will not rely upon it until the performance issues are handled.

rampageraptor's picture

I have to say, I was a little frightened/unnerved. Maybe for a few lines of text; a sentence or two, on a plain white background with nothing else on the page, but certainly not the whole thing.

R//R
http://web.me.com/kyleleitch

Gary Lonergan's picture

Gary Lonergan

Not strictly on-topic but I would like some advice on the best way to design and build a website.
I am fluent in InDesign Photoshop Fontographer and would like to market my skills on my own website.
Some people are telling me InDesign is the way to go others say do it all in Photoshop
not to mention Pagemill Flash Dreamweaver etc etc HELP

Mark Simonson's picture

What you're asking is too big a topic to get an answer here (besides which, this site is about typography, not web design). I recommend this as a starting point: http://www.zeldman.com/talent/

Syndicate content Syndicate content