0

I made an infographic in Adobe Illustrator, and saved it as a .svg file. But then when I tried to open it in the Google Chrome browser, some of the fonts and some italicized fonts were not even italicized. Why is this happening and what is the solution?

It was 600*1100 pixels because I had read somewhere that it is a good size to start with.

It actually turned out to be pretty ugly!

  • Fonts aren't automatically embedded in an SVG. Read this question for more information: graphicdesign.stackexchange.com/questions/5162/… – DA01 Jul 3 '14 at 19:12
  • I do not have to do anything with the web, I just did not have any thing else to open the SVG, so I used the web browser. Is there any solution other than that stuff because I don't understand that language. – Solace Jul 3 '14 at 19:20
  • 1
    What is your end-goal with the SVG? Is this for print? – DA01 Jul 3 '14 at 19:21
  • It's basically for print. – Solace Jul 4 '14 at 10:26
1

The best way around this is to expand your fonts/any other assets in your SVG that aren't rendering properly when you open it in the browser. What this means is, you need to highlight your text areas and turn them into Illustrator paths instead of leaving them as selectable text.

The easiest way to do this is:

  1. Select all of your text
  2. Go to Object >> Expand
  3. Hit 'okay'
  4. Resave your SVG.

enter image description here

  • 1
    This works well for print, but note that for web, you likely don't want to convert type (for accessibility and SEO reasons) – DA01 Jul 4 '14 at 3:43
  • OP above has stated it's for print. – Helen Jul 6 '14 at 21:51
1

I would save a backup with fonts active, and then save another version with fonts converted to outline, saved as .svg format for usage on the web.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.