Illustrator svg output saves each letter separately

I really like that it’s possible that Illustrator is capable of saving files as SVGs. My problem is that when I save a file that contains text as svg each letter is saved separately. I don’t have any idea why Illustrator does that.

Example:

<text transform="matrix(1 0 0 1 165.8027 35.6523)" font-family="'MyriadPro-Regular'" font-size="5">H</text>
    <text transform="matrix(1 0 0 1 169.0625 35.6523)" font-family="'MyriadPro-Regular'" font-size="5">A</text>
    <text transform="matrix(1 0 0 1 172.1226 35.6523)" font-family="'MyriadPro-Regular'" font-size="5">L</text>
    <text transform="matrix(1 0 0 1 174.4824 35.6523)" font-family="'MyriadPro-Regular'" font-size="5">L</text>
    <text transform="matrix(1 0 0 1 176.6475 35.6523)" font-family="'MyriadPro-Regular'" font-size="5">O</text>

I guess there is a way that Illustrator generates a svg that looks like this:

<text transform="matrix(1 0 0 1 165.8027 35.6523)" font-family="'MyriadPro-Regular'" font-size="5">HALLO</text>

I can’t figure it out, any help is appreciated!

Answer

I think that happens when text is kerned (to preserve the appearance of the text in the SVG). There’s a few different export methods in Illustrator. Export As is the newest, and it seems to create the nicest and most compact SVG, too. Very handy if you’re using it to save web assets.

Illustrator SVG test

And the same example document, now with kerning.

Illustrator SVG test with kerning

Attribution
Source : Link , Question Author : morty , Answer Author : Marc Edwards

Leave a Comment