16

I have an SVG image that I want to embed on a web page (inside a html file)

I created the image with Adobe Illustrator and it contains the following headers:

<?xml version="1.0" encoding="utf-8"?>

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 462.219 381.915" enable-background="new 0 0 462.219 381.915" xml:space="preserve">
...

Do I need the xml and DOCTYPE declarations? Or just embedding the contents of the <svg> tag is fine?

1

1 Answer 1

11

The XML header lines should be removed when you are embedding an SVG in an HTML page or another SVG.

UPDATE

Just to clarify:

Well-formed XML documents contain only one prolog. So they should be removed if you are embedding one SVG inside another. See: http://www.w3.org/TR/2008/REC-xml-20081126/#dt-wellformed

When embedding an SVG inside an HTML file, you could keep the prolog lines. The HTML parser in the browser will ignore them. But given they serve no purpose, it is my advice that you "should" remove them to make your document smaller - and more readable. :)

2
  • 1
    But what if the encoding of the HTML page is different from the encoding of the SVG file?
    – bart
    Nov 30, 2015 at 5:08
  • You contents of the embedded SVG file should have the same encoding as the HTML file it is a part of. Nov 30, 2015 at 7:40

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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