Exporting logo with text to SVG issues with text gaps

[groppo91]

I created a logo in illustrator with text underneath a simple design anyway when I export to SVG format it splits the single word up into 6-3-8 by adding extra gaps between letters it looks dreadful and I can't find a solution anywhere

[Monika Gause]

WHich version, which system?

How exactly do you export your SVG?

WHich options?

How do you open the SVG?

Can you please show a screenshot?

[groppo91]

windows 10 adobe illustrator 21.1.0 im a creative cloud member so should be latest version

file>export as>save as .svg>done

open in chrome

As you can see the t and h spacing is big looks worst when filling the screen there are few other gaps more noticeable when large too

[Monika Gause · Accepted solution]

file>export as>save as .svg>done

You might want to read about the options you have on how to treat text.

Export SVG for the web with Illustrator CC | Creative droplets

[groppo91]

Thankyou so much I am new to illustrator and just realised when exporting to svg, I was exporting with svg on the text. When I changed to 'convert to outlines' it fixed my issues. Not sure if this is the correct way but good enough for me

[Monika Gause]

You're welcome.

What's correct can only be decided per project.

For a logo, outlining text usually is the best decision. You need to discuss with the web developer. When text needs to be accessible or when you want to change it via scripting or animate it or whatever then other solutions might be more appropriate.

[Markoh75]

Anyone have the information from this adress now? It goes to a site that does not exist anymore...

[Monika Gause]

It's still in the wayback machine: https://web.archive.org/web/20181211230711/http://creativedroplets.com/export-svg-for-the-web-with-i...