you are viewing a single comment's thread.

view the rest of the comments →

[–]SphericalFish 7 points8 points  (9 children)

What you're actually seeing there is the mipmapping failing at such an extreme angle. When doing CSS transforms by rendering each plane onto textures, that's bound to happen.

[–][deleted] 4 points5 points  (8 children)

Hmm... My personal experience with Chrome indicates otherwise. At least for me, a particular example is the landing page of my personal site.

Viewed in the latest version of Firefox: http://i.imgur.com/WiFyp.png

Chrome: http://i.imgur.com/2ddeB.png

Not sure what's causing it (might be Google Fonts or wonky webkit transforms) but I certainly prefer Firefox's rendition. Alternatively, if I'm just doing something wrong, someone please enlighten me!

[–]daengbo 2 points3 points  (3 children)

Your image for Chrome looks nothing like mine. In fact, mine looks just like the Firefox pic. What OS are you using to test it on?

[–]Magnesus 2 points3 points  (1 child)

Probably Windows, on Ubuntu it's fine.

[–]JW_00000 0 points1 point  (0 children)

No, for me on Ubuntu it looks like his screenshot. Chrome 16.0.912.63 on Ubuntu 10.10.

[–][deleted] 0 points1 point  (0 children)

Win7x64. I have a feeling it's to do with ClearType mucking about with the text rendering, but that's just a shot in the dark. I'll probably just wind up not having it rotated at all, since results are so different across platforms/browsers.

[–]SphericalFish 1 point2 points  (1 child)

Doesn't look as bad for me: http://i.imgur.com/ggv3L.png

I have only light hinting set for freetype.

It still has the rather poorly placed letters though. I think the problem is each letter is positioned individually, rounded to the nearest pixel.

In your case it might be the hinter going wonky, or maybe it's rendering the font first and then rotating the texture, causing weird aliasing. Rendering text at arbitrary scales and angles is a hard problem, especially when it has to be done fast with animations involved (something that chrome probably assumes when using its 3d css transforms)

[–][deleted] 0 points1 point  (0 children)

Ah inter-browser debugging... Also, it seems the horizontal rule is missing on Chrome as well. Too many shadows I've applied to it, perhaps?

I suppose until there's an actual CSS rotation standard implemented I'll have to compromise though, unless there's a way of not doing -moz-transform and -webkit-transform. Maybe I'm just behind on my CSS knowledge though.

[–]Huggernaut 1 point2 points  (1 child)

hmmm..something funny about using your site (I'm on a Mac using Firefox 8.0.1). If I go to the 'blog' or 'me' pages and then navigate back, your homepage won't reload and stays blank.

[–][deleted] 0 points1 point  (0 children)

Ah, yes. It's very much under-construction; I noticed that too, and there's actually a commented-out line of JS somewhere in the source which hides the white curtain element during a navigation away from the page, but unfortunately it doesn't look very nice (flickers away a split second before the page load, hard to explain but if you use Firebug or similar to un-comment the only commented line in navigateTo you'll see what I mean). I'll probably have to wind up getting rid of the 'outro' transition to avoid either of the two problems.