How do I export an SVG from Illustrator such that it renders well in small sizes?

I come from a Photoshop background and this is my first time dabbling with AI.

I would like to show my product logo in a small size on a webpage (about 15px height). I currently have a PNG (created in Photoshop) but the font is quite choppy. I am assuming it has to do with the scale.

To fix it, I am now trying to work in Illustrator and saving as SVG. I’ve tried a bunch of things but the logo shows up very nicely in large sizes, but not small.

Here’s how it is big:

enter image description here

But here’s how it shows when it’s close to the size I am looking for:

enter image description here

How do I make the smaller text smoother on my webpage?

I have tried setting anti-alias in the Character window but it’s disabled. Should I even try using an SVG or should I try fixing my PNG in Photoshop?

Answer

You need to use a font typeface that scales to smaller sizes, allowing the browser to render the font with better clarity. Not all typefaces are suited for extremely small, same goes with some types are not suited for large print either, as they become too pixelated.

Attribution
Source : Link , Question Author : Curtis Sacco , Answer Author : Etrahkad

Leave a Comment