I'm making a html5 canvas app and I'll be using a pixel art font, that will be always the same size (maybe additional size for mobile devices). I only need uppercase, some basic punctuation and numbers, total of 50 symbols.
I tried converting this font I have with cufon http://cufon.shoqolate.com/generate/ , but it scales really bad. It gets pretty blurry or distorted. It would do eventually, but it is not perfect.
So I was thinking, since I am using canvas, if I should just use a spritesheet with all the letters and symbols since there is such a small number of them in my case and make a script that would just display every string of text on screen using those letter sprites.
Would this solution hurt performance very much?
I was thinking also if it is possible to change the default size of the font. I noticed that there is a certain size of every font not made for web, where it is displayed perfectly in a web browser. When I resize, it starts to distort. Is it possible to somehow change it?
If you want distortion free scaling, convert your font to SVG.
Normal fonts are raster drawings...composed of fixed pixels that scale badly.
SVG is vector drawing...composed of lines+curves that scale very well.
You can use your SVG fonts directly in browsers except in Firefox and IE.
For those 2 browsers, you will have to learn a little about embedding SVG in your document--it's not that hard. You can build a text factory that builds text-output using the SVG glyph data.
Here is a website that will convert TTF fonts into their SVG glyphs:
http://www.freefontconverter.com/
Good luck with your project!