receipt-examples

Receipt

Overview of Receipt exploratory discussion goes here...

Authors

Contributors

Rob Manson

Real-World Examples

Bill / Invoice

Bills or Invoices are "yet to be paid" items.

Question: Perhaps these examples (yet to be provided) should be moved to a separate page as Bill/Invoice is quite different from Receipt.

With hResume, I've suggested that the subtle difference between actively seeking work and just presenting your resume be a case of including hlisting markup.

With bills vs invoices, it may turn out that the content found within would be identical, and it might just be a case of putting in a class flag to indicate whether the presented document has been paid for or not.

SignpostMarv 12:55, 21 Jul 2007 (PDT)

I think a class flag is a great idea, but I don't believe we have any samples for invoices. However, if we look at order review vs. order summary rather than invoices vs. receipts, the payment flag does become relevant in many of the sampled online stores.

How would such a flag be implemented?

• <div class="hreceipt unpaid"/"hreceipt paid">...
• <div class="hreceipt" title="paid">...</div>

Lastorset 14:55, 16 Aug 2007 (PDT)

Receipts

Receipts are post-purchase items.

Amazon

• Example
• contains:
  • email address (could not find in examples)
  • date of order
  • order id
  • shipments
    • shipping estimate
    • delivery estimate
    • shipping address
    • shipping speed
    • shipping preference (item grouping)
    • items
      • quantity
      • seller
      • price
      • item information
  • payment
    • card type
    • last 5 digits
    • expiration date
    • billing address
    • subtotal
    • shipping and handling price
    • total before tax
    • tax
    • grand total
  • discount price (could not find in examples)
• Little semantic HTML of interest, except an anchor with id "payment-info"

Skype

Skype Phone

• example source code
• Skype order history

• Name
• Shipping Address
• Order blurb "Confirmation of incoming order"
  • date in dd/mm/yyyy format
• Order number in nnnn-nnnnnnn-nnn format
• Reference (was blank in example, presumed to appear on bank statement for this transaction)
• Order resume
  • Quantity
  • Description
  • Price
  • Total
  • VAT (tax) %
• Payment
  • subtotal
  • shipping cost
  • VAT (percentage)
  • grand total
  • total (VAT excluded)
  • VAT (amount)
• Notification of chosen payment method blurb: "Your payment method is: Credit card"
• Legal blurb

Semantic HTML:

• Order resume class="order-listing"
• Each item class="row"
• All totals rows class="totals-row" except grand total class="grandtotal-row"

Internet banking transaction receipts

Example 1

receipt number
date
time
receipt type (e.g. TRANSFER BETWEEN MY ACCOUNTS)
  transfer from
  transfer to
amount
description
information/comment

Digital product purchase receipts

Example 1 : Software

receipt title/type
order/receipt number
seller's details
  sold by (hCard candidate)
    org
    adr
  tax number (VAT in this example)
  tax id (Federal Tax ID)
buyer's details
  buyer (hCard candidate)
    name
    org
    street-address
    locality
    region
    postal-code
    country-name
    tel
    email
  credit card number (PAN truncated - with type)
item list
  product code
  name
  comments
  price
  delivery method
  quantity
  total in selected currency
  total in sellers currency
total (sum of item list totals)
processing fee
grand total (final amount charged)
information (caveats and tax info)
permalink

Example 2 : SSL certificate

receipt title/type
seller (hCard candidate)
  org
  street-address
  locality
  region
  postal-code
purchase information
  order id
  product name
  domain name
  validity period
  number of licenses
  card number (PAN truncated)
  amount (with selected currency)

Physical product purchase receipts

Example 1 : Computer hardware

receipt title/type
seller's name (hCard candidate)
seller's URL (hCard candidate)
invoice id
org govt reference (ABN - Australian Business Number)
date
seller details (hCard candidate)
  street-address
  locality
  region
  postal-code
buyer (hCard candidate)
  fn
  billing address
    street-address
    locality
    region
    postal-code
  delivery address
    street-address
    locality
    region
    postal-code
  phone
item list
  item
  description
  amount
  quantity
  product url
  total
delivery cost
total excluding tax
tax (GST - Goods and Service Tax)
total including tax

Service purchase receipts

Example 1 : Online subscription

seller's details (hCard candidate)
  org
  street-address
  locality
  region
  postal-code
  country-name
buyer's details (hCard candidate)
  fn
  street-address
  locality
  region
  postal-code
  phone
date
receipt id
item list
  product description
  quantity
  rate (per unit)
  price
sub total
amount paid
balance due
information
transaction id

Example 2 : Co-location

receipt title/type
sellers details (hCard candidate)
  org
  url
  phone
message
receipt number
date
amount
information

A1Books

Example

• vendor
  • name
  • fax
• date
• order number
• shipping address
• billing address
• items
  • description
  • list price
  • sale price
  • quantity
  • amount
• subtotal
• shipping
• total
  • quantity
  • amount
• account information
  • phone
  • e-mail
• credit card last four digits

No semantic HTML.

Barnes&Noble

Example

• shipping address
• billing address
• payment
  • last 4 digits
  • exp. date
  • charge
• savings on shipping
• order no.
• delivery option
• items
  • description: title, author, ISBN, price
  • qty
  • gift options: wrap, message
  • total price
• shipment subtotal
• shipping cost
• tax
• shipment total (seems to account for orders requiring multiple shipments)
• order total

Semantic HTML:

• receiptOrderNumbers
• receiptOrderPlacedOn
• orderInformation
  • shippingAddress
  • billingAddress
  • paymentInformation
• shippingSelections
• showProducts
  • reviewTable
    • qtyValuePosition
    • reviewGiftOptions
• reviewTotalsDisplay
  • reviewTotalsSummary
  • reviewTotalsNote
  • reviewTotalsBreakdown
• reviewTotalsSummary
  • reviewGrandTotal
• reviewCreditCardCharged
• review

The semantic class names found are a good start, although the "review" part appears to be context-specific (reviewing an order). Additionally, the implied hierarchy in names such as "reviewTotalsSummary" and "receiptOrderPlacedOn" is probably unnecessary for our purposes.

Facebook

Example

• purchase total
• items (informal description of two items, including quantity)
• recipient name
• order id
• billed-to name

No relevant semantic HTML.

Google Checkout

• Example email receipt
• Example web receipt

• vendor address
• shipping address
• date
• order id
• items
  • shipping status ("Not yet shipped", etc.)
  • qty.
  • description
  • price
• shipping cost
• tax
• total
• order history (placed, received, charged, shipped) (web receipt only)
• payment info (web receipt only)
  • card type
  • last 4 digits
  • exp. date
  • cardholder address
• permalink

Semantic HTML:

• taxRow
  • taxIdentifier
  • taxAmount
• totalAmount

iTunes

• iTunes e-mail receipt

• billing address
• order no.
• receipt date
• order total
• card
  • type
  • last 4 digits
• item
  • item no.
  • description (including link to write a review)
  • unit price
• subtotal
• tax

No relevant semantic HTML.

Longs/FujiFilm

• Longs/Fujifilm e-mail receipt

• order no.
• payment info
  • method (COD, credit card, etc.)
• customer address
• pickup address
• items
  • name
  • qty.
  • description
  • price
  • line item subtotal
• order items total
• tax
• order total

Semantic HTML:

• payment-heading

Mobivox/PayPal

• Mobivox/PayPal receipt
• Mobivox/PayPal printable receipt

• seller address
• receipt id
• date of order
• items
  • description
  • item option (not quite sure what this is for)
  • unit price
  • qty
  • total
• subtotal
• tax
• total amount
• payment info
  • method
  • last 4 digits
  • charge
  • appears on bill/statement as "MOBIVOXCORP"
• buyer contact

Relevant semantic HTML:

• order-summary
  • cart
    • (unnamed tr)
      • item-name
      • item-total
      • item-option (not quite sure what this is for)
  • subtotal
  • totals-value
  • totals-currency
  • purchase-summary
    • summary-total
      • price-total
      • price-currency
• funding-mix
  • payment-type
  • amount
  • ccStatement
• contact-information (contains hCard microformat)

This semantic HTML is the most complete and well-thought-out I've seen in this analysis. It even makes use of the fieldset element in forms, something I've never seen before.Lastorset 16:21, 25 Jul 2007 (PDT)

Microformats used:

• hCard (non-compliant due to missing formatted name): buyer contact info

Symantec

• Symantec e-mail reminder

• buyer name
• date
• payment method
• last 4 digits
• appears on statement as "DR *Symantec"
• items
  • qty
  • product name
  • platform
  • delivery method
  • price
• subtotal
• grand total
• permalink

No relevant semantic HTML

Existing Practices

Listed below is an overview of existing patterns and practices found in the wild for bill and receipt data.

Other attempts to solve The Problem

For paper receipts, NeatReceipts Scanalizer offers a heuristic-based solution.

See Also

• receipt
• http://en.wikipedia.org/wiki/Receipt