From Wiki of the E-Business and Web Science Research Group

Adding Images to Offers and Products

Very often, we want to attach images to offers (instances of gr:Offering) or products or services, which can be instances of

• gr:ProductOrServiceModel,
• gr:ProductOrServiceSomeInstancesPlaceholder, or
• gr:ActualProductOrServiceInstance.

The standard way of doing so is using the foaf:depiction and foaf:thumbnail properties. The advantage is that many Semantic Web and LOD tools can automatically display such images.

Note that Yahoo SearchMonkey recommends the media:image property for attaching images, which is a proprietary Yahoo element.
(Definition from 1: An image of something. Use this property to relate a document to an Image object embedded in it or in general to relate an object to an image representation of that object.). Also, rdfs:seeAlso can be used.

If you want to be on the safe side, use all three.

Example in RDFa:

 
<div typeof="gr:Offering"
  xmlns:gr="http://purl.org/goodrelations/v1#"
  xmlns:rdfs="http://www.w3.org/2000/01/rdf-schema#"
  xmlns:media="http://search.yahoo.com/searchmonkey/media/" 
  xmlns:xsd="http://www.w3.org/2001/XMLSchema#"
  xmlns:foaf="http://xmlns.com/foaf/0.1/"
  xmlns:use="http://search.yahoo.com/searchmonkey-datatype/use/">
 
  <div rel="gr:hasPriceSpecification">
      <span property="gr:hasCurrencyValue">99.99</span>
      <span property="gr:hasCurrency">USD</span>
  </div>
  <div rel="gr:includesObject">
      <span property="gr:amountOfThisGood" datatype="xsd:float">1.0</span>
      <div rel="gr:typeOfGood">
          <div typeof="product:Product gr:ProductOrServicesSomeInstancesPlaceholder">
              <span property="rdfs:label">Hepp Computertechnik Personal SCSI Controller</span>
              <span property="rdfs:comment">Fast 16-Bit SCSI Controller for PCs</span>
              <span rel="rdfs:seeAlso media:image foaf:depiction">
                  <img src="http://example.com/product.jpg"/>
              </span>
          </div>
      </div>
  </div>
</div>
 

Note 1:

• The namespace prefix foaf: stands for http://xmlns.com/foaf/0.1/.
• The namespace prefix media: stands for http://search.yahoo.com/searchmonkey/media/

Note 2:

• If it is important for your data to remain within OWL DL, you must either import OWL DL ontologies that define those properties or define them as owl:AnnotationProperty or owl:DatatypeProperty.

Example 1 in RDF/XML (just foaf:depiction and foad:thumbnail):

 
<gr:ProductOrServicesSomeInstancesPlaceholder rdf:about="http://www.stalsoft.com/dip/bookmashup/books/0387485309">
   <rdfs:seeAlso rdf:resource="http://www.amazon.com/Semantic-Web-Real-World-Applications-Industry/dp/0387485309"/>
   <rdfs:label>The Semantic Web: Real-World Applications from Industry (Semantic Web and Beyond)</rdfs:label>
   <rdfs:comment>The Semantic Web: Real-World Applications from Industry (Semantic Web and Beyond)</rdfs:comment>
<!-- Add this -->
   <foaf:depiction rdf:resource="http://ecx.images-amazon.com/images/I/51EOLmd5yQL.jpg"/>
   <foaf:thumbnail rdf:resource="http://ecx.images-amazon.com/images/I/51EOLmd5yQL._SL75_.jpg"/>
<!-- Add this -->
</gr:ProductOrServicesSomeInstancesPlaceholder>
 

Example 2 in RDF/XML (including media:image):

 
<gr:ProductOrServicesSomeInstancesPlaceholder rdf:about="http://www.stalsoft.com/dip/bookmashup/books/0387485309">
   <rdfs:seeAlso rdf:resource="http://www.amazon.com/Semantic-Web-Real-World-Applications-Industry/dp/0387485309"/>
   <rdfs:label>The Semantic Web: Real-World Applications from Industry (Semantic Web and Beyond)</rdfs:label>
   <rdfs:comment>The Semantic Web: Real-World Applications from Industry (Semantic Web and Beyond)</rdfs:comment>
<!-- Add this -->
   <foaf:depiction rdf:resource="http://ecx.images-amazon.com/images/I/51EOLmd5yQL.jpg"/>
   <media:image rdf:resource="http://ecx.images-amazon.com/images/I/51EOLmd5yQL.jpg"/>
   <foaf:thumbnail rdf:resource="http://ecx.images-amazon.com/images/I/51EOLmd5yQL._SL75_.jpg"/>
   <rdfs:seeAlso rdf:resource="http://ecx.images-amazon.com/images/I/51EOLmd5yQL._SL75_.jpg"/>
<!-- Add this -->
</gr:ProductOrServicesSomeInstancesPlaceholder>