Começar

A marcação de e-mail usa dados estruturados em e-mails para funcionar. O Gmail é compatível com JSON-LD e Microdata. Você pode usar qualquer um deles para marcar informações no e-mail. Isso permite que o Google entenda os campos e ofereça ao usuário resultados de pesquisa, ações e cards relevantes. Por exemplo, se o e-mail for sobre uma reserva de evento, talvez você queira anotar o horário de início, o local, o número de ingressos e todas as outras informações que definem a reserva.

Sua primeira marcação

Digamos que você seja responsável por enviar ingressos do Google I/O 2013 aos participantes e queira usar informações semânticas de marcação nesses e-mails. No mínimo, o e-mail de confirmação do tíquete vai conter HTML como este:

<html>
  <body>
    <p>
      Dear John, thanks for booking your Google I/O ticket with us.
    </p>
    <p>
      BOOKING DETAILS<br/>
      Order for: John Smith<br/>
      Event: Google I/O 2013<br/>
      When: May 15th 2013 8:30am PST<br/>
      Venue: Moscone Center, 800 Howard St., San Francisco, CA 94103<br/>
      Reservation number: IO12345<br/>
    </p>
  </body>
</html>

É muito fácil marcar esse e-mail. As informações relevantes no corpo do e-mail podem ser adicionadas em qualquer lugar dentro do body do HTML do e-mail em um formato estruturado correspondente a um dos formatos aceitos. O bloco de código a seguir mostra como fica o e-mail marcado:

JSON-LD

<html>
  <body>
    <script type="application/ld+json">
    {
      "@context":              "http://schema.org",
      "@type":                 "EventReservation",
      "reservationNumber":     "IO12345",
      "underName": {
        "@type":               "Person",
        "name":                "John Smith"
      },
      "reservationFor": {
        "@type":               "Event",
        "name":                "Google I/O 2013",
        "startDate":           "2013-05-15T08:30:00-08:00",
        "location": {
          "@type":             "Place",
          "name":              "Moscone Center",
          "address": {
            "@type":           "PostalAddress",
            "streetAddress":   "800 Howard St.",
            "addressLocality": "San Francisco",
            "addressRegion":   "CA",
            "postalCode":      "94103",
            "addressCountry":  "US"
          }
        }
      }
    }
    </script>
    <p>
      Dear John, thanks for booking your Google I/O ticket with us.
    </p>
    <p>
      BOOKING DETAILS<br/>
      Reservation number: IO12345<br/>
      Order for: John Smith<br/>
      Event: Google I/O 2013<br/>
      Start time: May 15th 2013 8:00am PST<br/>
      Venue: Moscone Center, 800 Howard St., San Francisco, CA 94103<br/>
    </p>
  </body>
</html>

Microdados

<html>
  <body>
    <div itemscope itemtype="http://schema.org/EventReservation">
      <meta itemprop="reservationNumber" content="IO12345"/>
      <div itemprop="underName" itemscope itemtype="http://schema.org/Person">
        <meta itemprop="name" content="John Smith"/>
      </div>
      <div itemprop="reservationFor" itemscope itemtype="http://schema.org/Event">
        <meta itemprop="name" content="Google I/O 2013"/>
        <time itemprop="startDate" datetime="2013-05-15T08:30:00-08:00"/>
        <div itemprop="location" itemscope itemtype="http://schema.org/Place">
          <meta itemprop="name" content="Moscone Center"/>
          <div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
            <meta itemprop="streetAddress" content="800 Howard St."/>
            <meta itemprop="addressLocality" content="San Francisco"/>
            <meta itemprop="addressRegion" content="CA"/>
            <meta itemprop="postalCode" content="94103"/>
            <meta itemprop="addressCountry" content="US"/>
          </div>
        </div>
      </div>
    </div>
    <p>
      Dear John, thanks for booking your Google I/O ticket with us.
    </p>
    <p>
      BOOKING DETAILS<br/>
      Reservation number: IO12345<br/>
      Order for: John Smith<br/>
      Event: Google I/O 2013<br/>
      Start time: May 15th 2013 8:00am PST<br/>
      Venue: Moscone Center, 800 Howard St., San Francisco, CA 94103<br/>
    </p>
  </body>
</html>

Microdados (inline)

<html>
  <body>
    <p>
      Dear John, thanks for booking your Google I/O ticket with us.
    </p>
    <p itemscope itemtype="http://schema.org/EventReservation">
      BOOKING DETAILS<br/>
      Reservation number: <span itemprop="reservationNumber">IO12345</span><br/>
      Order for: <span itemprop="underName" itemscope itemtype="http://schema.org/Person">
        <span itemprop="name">John Smith</span>
      </span><br/>
      <div itemprop="reservationFor" itemscope itemtype="http://schema.org/Event">
        Event: <span itemprop="name">Google I/O 2013</span><br/>
        <time itemprop="startDate" datetime="2013-05-15T08:30:00-08:00">Start time: May 15th 2013 8:00am PST</time><br/>
        Venue: <span itemprop="location" itemscope itemtype="http://schema.org/Place">
          <span itemprop="name">Moscone Center</span>
          <span itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
            <span itemprop="streetAddress">800 Howard St.</span>,
            <span itemprop="addressLocality">San Francisco</span>,
            <span itemprop="addressRegion">CA</span>,
            <span itemprop="postalCode">94103</span>,
            <span itemprop="addressCountry">US</span>
          </span>
        </span>
      </div>
    </p>
  </body>
</html>

O e-mail acima contém o conjunto mínimo de informações para definir uma reserva de evento. Você pode marcar outras informações nos seus e-mails para melhorar a experiência do usuário. Por exemplo, a propriedade ticketToken do objeto FlightReservation permite adicionar uma imagem de código de barras, como um QR code, que pode ser incluída em um cartão de embarque.

Para saber mais sobre todos os tipos compatíveis e as propriedades deles, consulte o Guia de referência.