Product Page with Schema.org Markup

<article itemscope itemtype="https://schema.org/Product">
    <h1 itemprop="name">Mechanical Keyboard — Tactile</h1>
    <img itemprop="image" src="/products/kbd.jpg"
         alt="Mechanical keyboard with brown switches">
    <p itemprop="description">
        A 75-key tactile mechanical keyboard with hot-swappable switches.
    </p>

    <div itemprop="offers" itemscope itemtype="https://schema.org/Offer">
        <span itemprop="priceCurrency">USD</span>
        <span itemprop="price">129.00</span>
        <link itemprop="availability" href="https://schema.org/InStock">
    </div>
</article>

<!-- JSON-LD version (preferred by Google) -->
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Product",
  "name":  "Mechanical Keyboard — Tactile",
  "image": ["https://example.com/products/kbd.jpg"],
  "description": "A 75-key tactile mechanical keyboard with hot-swappable switches.",
  "brand": {"@type":"Brand","name":"Example"},
  "offers": {
    "@type":         "Offer",
    "url":           "https://example.com/products/kbd",
    "priceCurrency": "USD",
    "price":         "129.00",
    "availability":  "https://schema.org/InStock"
  },
  "aggregateRating": {
    "@type":       "AggregateRating",
    "ratingValue": "4.6",
    "reviewCount": "127"
  }
}
</script>