svgschema.orgmicrodatagoogle-rich-snippetsamp-html

SVG images in AMP article Microdata?


When attempting to validate a schema.org/Article against Google's Structured Data Testing Tool, I noticed that it gives an error if you specify an SVG image:

The value provided for logo must be a valid URL.

Required by:

AMP Articles (what's this?)

When the URL is changed to have a .png (or .jpg, .bmp, .webp, etc.) extension, rather than .svg, it passes validation.

Here is the example I'm working with:

<div itemscope itemtype="http://schema.org/Article">
    <div itemprop="publisher" itemscope itemtype="https://schema.org/Organization">
        <meta itemprop="name" content="Example" />
        <meta itemprop="url" content="http://example.com" />
        <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
            <meta itemprop="url" content="http://example.com/logo.svg" />
            <meta itemprop="width" content="600" />
            <meta itemprop="height" content="60" />
        </div>
    </div>
    <meta itemprop="dateModified" content="2016-01-05T12:43" />
    <meta itemprop="datePublished" content="2016-01-05T12:43" />
    <meta itemprop="headline" content="Example" />
    <meta itemprop="name" content="Example" />
    <meta itemprop="author" content="Example" />
    <link itemprop="mainEntityOfPage" href="http://example.com/article" />
    <div itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
        <meta itemprop="url" content="http://example.com/article.jpg" />
        <meta itemprop="width" content="1200" />
        <meta itemprop="height" content="800" />
    </div>
</div>

Changing the other image's URL's extension will also produce the error.

I was unable to find any information on why it rejects SVGs in the Rich Snippets documentation or the AMP HTML spec. Does anyone have an explanation for this behavior?


Solution

  • From one of the links you gave: https://developers.google.com/structured-data/rich-snippets/articles

    Images should be in .jpg, .png, or. gif format.

    Why? Who knows. Perhaps because SVGs still have some support issues in some browsers (particularly older ones).