Skip to content

Instantly share code, notes, and snippets.

@daarom

daarom/the-semantic-travelagency.html

Last active August 29, 2015 14:11
Show Gist options
  • Save daarom/19f424c29df2b0c79a6b to your computer and use it in GitHub Desktop.
Save daarom/19f424c29df2b0c79a6b to your computer and use it in GitHub Desktop.
Download ZIP
Max out the semantic density of an online travelagency website I did. Declaring the complete offering of an online travel agency, with the hotel as top level entity, ensuring the rich snippet is presented in SERPs. Comments are very welcome :)
Raw
the-semantic-travelagency.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>My amazing online travelagency chained entities</title>
</head>
<body>
<!-- Cool ontology: http://ontologies.sti-innsbruck.at/acco/ns.html -->
<!-- header logo, usually elsewhere, island via itemref & id -->
<!-- whether the "a" property comes before the "b" property or not is not important: -->
<!-- http://www.w3.org/TR/microdata/ -->
<!-- Usually the header of the website holds the website publishers logo and url to the homepage -->
<div><span id="daaromlogo">
<img itemprop="logo" src="http://www.example.com/daarom-logo.png" alt="daarom">
<a itemprop="url" href="http://www.example.com/">Homepage</a> </span>
</div>
<!-- end of the header properties -->
<!-- the hotel is the top level entity, so we get a rich snippet - chain back to offer -->
<div itemscope itemtype="http://schema.org/hotel" itemref="hotelreviews">
<h1>
<a itemprop="url" href="http://example.com/paradise-hotel" title>
<span itemprop="name">Van der Valk hotel Haarlem </span>
</a>
</h1>
<link itemprop="sameAs" href="http://www.hotelhaarlem.nl/en/">
<img itemprop="logo" src="http://example.com/img/logo.jpg" alt="Paradise hotel logo" title width="60" height="60">
<p itemprop="description">Enjoy a perfect holiday at the Haarlem Hotel, the most beautiful hotel in Haarlem!</p>
<img itemprop="image" src="http://example.com/img/paradise-view.jpg" alt="Beautiful Paradise hotel">
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">123 toekan</span><br>
<span itemprop="postalCode">1234aa</span> - <span itemprop="addressLocality">Haarlem</span><br>
<span itemprop="addressRegion">NH</span><br>
<span itemprop="addressCountry">Netherlands</span><br>
Tel:<span itemprop="telephone"> 001 12 34 56 00</span>,
Fax:<span itemprop="faxNumber">001 12 34 46 01</span>,
E-mail: <span itemprop="email">toekan(at)example.com</span>
</div>
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating" itemref="hotelreviews">
Rated <span itemprop="ratingValue">4</span> stars -
based on <span itemprop="reviewCount">2</span> reviews
</div>
<div itemid="#Offer" itemprop="makesOffer" itemscope itemtype="http://schema.org/Offer">
<div itemid="#businessfunction" itemprop="businessFunction" itemscope itemtype="http://schema.org/BusinessFunction">
<link itemprop="url" href="http://purl.org/goodrelations/v1#Sell"></div>
<link itemprop="seller" href="#travelagency">
<div class="event-price" itemprop="price" content="99.00"><span itemprop="priceCurrency" content="EUR">99.00</span></div>
<div itemid="#ProductService" itemprop="itemOffered" itemscope itemtype="http://schema.org/LodgingReservation">
<link itemprop="provider" href="#HotelChainX">
<span itemprop="lodgingUnitDescription">The most luxurious suite of the Haarlem Hotel</span>, the
<span itemprop="lodgingUnitType">Presidents suite</span>,
<time itemprop="checkinTime" datetime="2014-11-05T08:30:00-08:00">
<time itemprop="checkoutTime" datetime="2014-11-09T08:30:00-08:00">
</div>
</div>
</div>
<!-- /Reservation Details -->
<div itemid="#HotelChainX" itemscope itemtype="http://schema.org/Organization">
<h2 itemprop="name">van der Valk Hotels</h2>
<link itemprop="sameAs" href="https://www.freebase.com/m/0gkxmnj">
<link itemprop="sameAs" href="http://en.wikipedia.org/wiki/Van_der_Valk_(company)">
<img itemprop="image" src="http://example.org/hotel-chain-x.jpg" alt="Hotel Chain X" title width="120" height="120">
<p itemprop="description">Hotel Haarlem is part of the van der valk hotel chain or brand. Famous for the cherry in their applemouse</p>
</div>
<p>
<!-- end of hotel declaration -->
<!-- Seller Details - this travelagency offers reservations for accomodation like hotels -->
<div itemid="#travelagency" itemscope itemtype="http://schema.org/TravelAgency" itemref="daaromlogo">
<h2 itemprop="name">Daarom inc. - Online travelagency</h2>
<link itemprop="sameAs" href="https://www.freebase.com/m/010w2jqx">
<link itemprop="sameAs" href="http://en.wikipedia.org/wiki/Travel_agency">
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
My address:
<span itemprop="streetAddress">Weteringkade</span>
<span itemprop="postalCode">1235aa</span>
<span itemprop="addressLocality">Noordwijk</span>
<meta itemprop="addressCountry" content="NL"><br>
Tel:<span itemprop="telephone"> 001 12 34 56 00</span>,
Fax:<span itemprop="faxNumber">001 12 34 46 01</span>,
E-mail: <span itemprop="email">vincent(at)example.com</span>
</div>
</div>
<br><br>
<!-- end of seller declaration -->
<!-- Reviews of the hotel - usually reviews are somewhere else, not in the scope of the TLE div-->
<div id="hotelreviews">
<h3>Customer reviews:</h3>
<div itemprop="review" itemscope itemtype="http://schema.org/Review">
<span itemprop="name">Not a happy camper </span> -
by <span itemprop="author">Ellie,</span>
<meta itemprop="datePublished" content="2014-04-01">April 1, 2014
<div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating">
<meta itemprop="worstRating" content = "1">
<span itemprop="ratingValue">4</span>
<span itemprop="bestRating">5stars</span>
</div>
<span itemprop="description">It wasn't as good as advertised, but the central location is awesome! </span>
</div><br>
<div itemprop="review" itemscope itemtype="http://schema.org/Review">
<span itemprop="name">Value purchase </span>
by <span itemprop="author">Lucas</span>,
<meta itemprop="datePublished" content="2014-03-25">March 25, 2014
<div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating">
<meta itemprop="worstRating" content = "1">
<span itemprop="ratingValue">4</span>/
<span itemprop="bestRating">5</span>stars
</div>
<span itemprop="description">I love this place.</span>
</div>
</div>
<!-- end of /reviews island -->
</body>
</html>
@inetbiz
Copy link

inetbiz commented Dec 21, 2014

Why did you choose xHTML markup instead of the new HTML5 attributes?

@daarom
Copy link
Author

daarom commented Dec 21, 2014

ow, that must have been dreamweaver, haven't paid attention to HTML at all, just chained up all the entities. You can copy the all this markup and throw it into http://www.google.com/webmasters/tools/richsnippets html input. Everything seems to be linked togetter well. Just need to fix that review/rating issue.

also if anyone can explain the difference between itemref vs ref, and itemid vs id and when to use href instead? That is puzzling me. As is the businessFunction of an Offer and whether or not seller and provider, offer and itemoffered and hotel having an offer is. Is this marked up properly? Look foward to any improvements one might find :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment