Use the "Hey Arnold" font instead of an image
Closed this issue · 3 comments
The header on our page is a static image. It would improve performance and user experience if we used a web font instead.
Here is the font:
arnold.zip
And here is some advice by Google on the subject:
If you ever find yourself encoding text in an image asset, stop and reconsider. Great typography is critical to good design, branding, and readability, but text-in-images delivers a poor user experience: the text is not selectable, not searchable, not zoomable, not accessible, and not friendly for high-DPI devices. The use of web fonts requires its own set of optimizations, but it addresses all of these concerns and is always a better choice for displaying text.
Started to do this and I'm very close, but I can't get the change to be pixel-perfect because the font seems to be slightly different than the one in the image. It's not the font weight or size, I'm sure I have those right, but the font in the image is slightly more condensed, I think.
That is a funny problem. But it looks pretty good, and I think it's close enough. We had a designer use that font to produce the image for us, and perhaps he made some tweaks to the exported image. Either way, can you send a PR?
@ghostwave can you weigh in on this issue? Perhaps you made some tweaks to the image after it was exported from the Hey Arnold font?