Introducing Adobe Blank

http://blogs.adobe.com/typblography/2013/03/introducing-adobe-blank.html

by maguay • 13 years ago

68 30 13 years ago

blogs.adobe.com

tl;dr: It is a fall-back font of which every glyph is zero width. It can be, for example, used as a substitute font while the actual web font loads; the text width of zero indicates that the web font is yet to be loaded.

chongli2• 13 years ago

This seems like a whole lot of effort for nothing. Why not just use the onerror callback of an image to check if it's loaded?

PavlovsCat• 13 years ago

Because "an image" is not the webfont you're actually interested in maybe?

turtlepower• 13 years ago

The terrible kerning makes this font barely readable.

nnnnni• 13 years ago

What? It has great keming!

minikites• 13 years ago

Very dean and modem.

Samuel_Michon• 13 years ago

‘Adobe Blank’

So they finally ran out of names for new products. It had to happen some day.

iMark3• 13 years ago

I'm interested in the technique suggested for font loading. As an exercise I just created a font containing a single character at zero width. The resulting file size is considerably smaller than Blank (1440 bytes, versus 80k) which makes it nicer to inline, but should be able to serve the same purpose for font loading:

Create a span containing the character, with the font family referring to the font being loaded and the empty font (inlined in the css) and when the width is non-zero the font is loaded.

nsfmc• 13 years ago

the generalized form of this technique (which you can also use to see if somebody has a font installed locally) is to basically create two rules:

    .load-base { font-family: comicsans-ms, verdana; }
    .load-test { font-family: fancyfont, comicsans-ms, verdana; }

and periodically check that the width of a line of nonsense text for both classes is not the same. Blank has the obvious benefit that it will be obvious when 0 != something else, but you can do it if you have some reasonable expectation that some other common font will exist with different metrics than your fancy font.

interesting to see the process behind the font, though.

iMark3• 13 years ago

As you say, if you know that the font you're loading has different metrics this approach will work, but if you have to make that sort of assumption it's not a generalised approach.

If you know that one font has zero width dimensions and one does not, then it greatly simplifies matters.

kephra• 13 years ago

lol DDoS by Hackers News is a common curse for small websites. But "Error establishing a database connection" for only 16 points on Hackers News is a shame for Adobe.

criley• 13 years ago

Loading fine at 23. Perhaps you experienced an edge case load? Did a simple refresh fix it? Either way, performance seems totally fine on my end.

rayiner• 13 years ago

Saw the title and thought it was an early April fools. Got ready to comment how knowing adobe even an app showing just a blank screen would be full of tons of security vulnerabilities and need biweekly updates.

sdfjkl2• 13 years ago

I assumed it was a screensaver.

83457• 13 years ago

That was my first thought to but skimmed it and sounded like there might be some uses for it. Then reached the link at the bottom "this font was built using only AFDKO tools" and immediately thought that AFD stood for "April Fools Day", I had been fooled, and clicking the liked would just be a page explaining the joke. I couldn't figure out what the KO could stand for though so I clicked and turned out the abbreviation was just for "Adobe Font Development Kit for OpenType".

SingAlong• 13 years ago

The blog post is about a new font. I see no use of it on the page. And there's not even a picture of it in the blog post.

That's a really bad way to introduce it.

Or am I missing something? (I'm on Mac OSX 10.8, Chrome 26)

sdfjkl2• 13 years ago

You missed reading the article. The font is blank. As such, it's not very picturesque.

mlntn• 13 years ago

You wanted a picture of a zero-width font? One could argue that there were an infinite number of pictures of that font in use on that page.

willtheperson• 13 years ago

Maybe you wanted to see something like this: http://d.pr/i/OaFV

ArtB• 13 years ago

What does "All code points are rendered using a non-spacing and non-marking glyph." mean?

goldfeld• 13 years ago

It means any and all text rendered in it is gonna be blank and take no space.

vlad• 13 years ago

There's an interesting issue with invisible fonts that hasn't been pointed out in the comments thus far.

In a job interview last year, I was asked to name some ways to hide an element on a page. I think I came up with seven or eight ways and listed upsides and downsides of each.

Besides obvious ones like opacity, visibility, display: none, z-index, moving the elements off-screen, setting font-size to 0, etc., one idea I came up with on the spot was to design a font with blank characters in case the div was simply text. The text would be visible to search engines but not to users.

(Since I was interviewing at a large search company, I also raised the point that they might want to start analyzing custom fonts to make sure they're not simply empty characters, if they're not already.)

iMark3• 13 years ago

The issue isn't unique to invisible fonts - in all the cases you mentioned the text would be visible to search engines but not users.

jaredsohn• 13 years ago

I don't think the GP made the claim that the issue was unique in that way; just that it is another way that such a phenomena can happen.

Introducing Adobe Blank

Related Stories