3

Hey there :) I'm having some trouble with the design I have from a designer and the need for structured data.

The problem is as follows:

The design of the frontpage has 8 integrated articles that leads to the full article. It has a title, desc, date time published, and they want structured data for the news on the index. But there is no image and on the Google structured data validator it says image is required... Can I just use display:none in css and hide the image, and still setup data for the news/article image? Or will I get in trouble with Google here?

Or should I just tell them that it can only be done on the full article page, where there is a dedicated image to the article.

Maybe I could use the JSON application approach to avoid using display:none;?

I tried looking into the suggested Questions, but didn't find a clear answer. Please mark as duplicate if there is a clear answer out there. Cheers.

Example of what I'm trying to do:

<article itemscope itemType="http://schema.org/NewsArticle">
    <header>
        <time itemprop="datePublished" datetime="">

        </time>
        <h1 itemprop="headline">News</h1>
    </header>
    <div itemprop="articleBody">
        <img class="hide-article-img" itemprop="image" src="specific-news-thumbnail.jpg" alt="specific-news-thumbnail desc"/>
        <p>This is the content of article.</p>
    </div>
    <footer>
        <a href="#">Læs mere</a>
    </footer>
</article>
Improve this question

3 Answers 3

Reset to default
4

you should be clear, why do you want to make use of structured data? to go through the testing tool or to deliver correctly formatted and standard conform structured data to search engine, so your site will be included into Google News output?

Google News Article needs image: that's the fact. Why it needs it? To show it to the people. What are solutions?

  • Don't deliver an image to Google isn't a solution for you, cause your site will not be conform with the News standard and, finally don't be shown in the News.

  • Display:none; isn't a solution too: Google and users need to see it, and display:none; actively prevent it.

  • Then the only solution to deliver the image to Google and users and not to actively show it on the site is JSON-LD.

Improve this answer
1
  • Thank you mate, ye I thought so about the JSON-LD, thank god for that approach :)
    – Mikkel Madsen
    Sep 14, 2015 at 14:20
1

First, you don’t have to provide an image. Google just informs you that they won’t display a Rich Snippet for this document if it doesn’t provide certain properties. However, for a teaser list of multiple articles, they wouldn’t display this Rich Snippet to begin with, I guess.

If you have an image but don’t want to show it on your page, there’s no need to switch to JSON-LD. You can provide its URI in a link element:

<link itemprop="image" href="specific-news-thumbnail.jpg" />
Improve this answer
1
  • The comments above are also correct. There are rare occasions (which is why I up-voted this answer) where the image wont be visible. Using this technique I'll still get the benefit of schema image w/out having to compromise the design of the site.
    – erier
    Nov 1, 2016 at 18:32
0

You can also use a <meta itemprop="image" content="..."> tag.

So in your code you'll insert this row

<meta itemprop="image" content="specific-news-thumbnail.jpg">
Improve this answer

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.