Using Notation to enrich your html with structured data will provide additional information to a search engine, and will help it display the right relevant information on their result page. For an academic personal page this could help people find your contact information, affiliation, and your publications as well.

Semantic notations for html documents have a long story. I've always been a microformats aficionado, but apparently Google is ignoring those. I'm honestly confused, you can read some more information around, but for now I will (probably cowardly) proceed with the most sponsored way. is a collaborative, community activity with a mission to create, maintain, and promote schemas for structured data on the Internet, on web pages, in email messages, and beyond. vocabulary can be used with many different encodings, including RDFa, Microdata and JSON-LD. These vocabularies cover entities, relationships between entities and actions, and can easily be extended through a well-documented extension model. Over 10 million sites use to markup their web pages and email messages. Many applications from Google, Microsoft, Pinterest, Yandex and others already use these vocabularies to power rich, extensible experiences.

The basic idea is write you content down in plain html, add some bloated additional markup, and when a search engine will parse your page, they will pick up this extra information, and possibly show it in a more prominent or readable way in the search-result page.

There is a long philosophical detour we could take, about the fact that this will actively disincentive people from visiting our website, and will just stop at the search engine result-page, but I'll leave that for another time.

In this case, one can either adopt the JSON-LD format, or the format. I am in favor of enriching the document markup, and against adding javascript metadata to a page.

I will show two examples: the personal contact snippet, and the publication. They may not be 100% correct, but the Google Structured-Data Validator, and they are currently on-line on this very website.

In general every self-contained piece of information is identified by an itemscope, and each item scope is characterized by an itemtype. For instance, if your markup is about a person, then you can look on and you will find all properties that you can mark-up. Those should be html elements inside the parent element with itemscope and should be defined with an itemprop attribute/value pair. For instance the full name <span itemprop="name">Matteo Lissandrini</span> or <span itemprop="givenName">Matteo<span> along with <span itemprop="familyName">Lissandrini</span>.

Note that you can put other items inside each other. For instance, you can have an itemprop=address which is also an item scope with type itemtype="". You will see below.

The Personal Contact

This is from my home page, but I have removed a lot of things here, to make it more readable and focus only on the important bits.

The code below embeds some magic HTML character coded `‍`, this is a non-visible zero-width space, and allows my HTML code to display verbatim.

<‍aside itemscope itemtype="">
        <‍img itemprop="image" src="" alt="Matteo Lissandrini's photo" />
        <‍strong class="secsubhead">Contact:<‍/strong><‍br />
        <‍strong itemprop="name">Matteo Lissandrini<‍/strong>
        <‍a itemprop="url"  href=""><‍/a>
        <‍a itemprop="email" href=""><‍/a>
        <‍div itemprop="address" itemscope itemtype="">
          <‍span itemprop="streetAddress">Selma Lagerløfs Vej, 300<‍br />Aalborg University<‍/span>
          <‍span itemprop="postalCode">9220<‍/span> —
          <‍span itemprop="addressLocality">Aalborg<‍/span><‍br />
          <‍span itemprop="addressCountry">Denmark<‍/span>
        <‍em itemprop="jobTitle">Assistant Professor<‍/em>
        in the
        <‍span itemprop="affiliation" itemscope itemtype=""
              <‍a itemprop="url" href="">
                <‍span itemprop="name">Department of Computer Science<‍/span>

The Publication

This is one of my publications, the item type is ScholarlyArticle and it has pretty rich properties, you can read them all on

Important to note here is that the specification requires both a name and an headline for the article. They are not really exploiting the name property apparently, so you can conflate them both with itemprop="headline name".

The code below embeds some magic HTML character coded `‍`, this is a non-visible zero-width space, and allows my HTML code to display verbatim.

  <‍blockquote itemscope itemtype="">
  <‍span itemprop="author" itemscope itemtype="">
    <‍span itemprop="name">Mottin, Davide<‍/span>;
  <‍span itemprop="author" itemscope itemtype="">
    <‍span itemprop="name">Lissandrini, Matteo<‍/span>;
  <‍span itemprop="author" itemscope itemtype="">
    <‍span itemprop="name">Velegrakis, Yannis<‍/span>;
  <‍span itemprop="author" itemscope itemtype="">
    <‍span itemprop="name">Palpanas, Themis<‍/span>.
  <‍br />
  “<‍span itemprop="headline name">Exemplar Queries: A New Way of Searching<‍/span>.”
  <‍div class="hidden">
  <‍time datetime="2014-01-27" itemprop="datePublished">December, 2016<‍/time>
  <‍span itemprop="image"><‍/span>
  <‍div itemprop="isPartOf" itemscope itemtype="">
    <‍em><‍span itemprop="name">The VLDB Journal<‍/span><‍/em>
  <‍span itemprop="isPartOf" itemscope itemtype="">
    <‍span itemprop="volumeNumber">25<‍/span>
  <‍span itemprop="isPartOf" itemscope itemtype="">
    (<‍span itemprop="issueNumber">6<‍/span>)
    (<‍time datetime="2016-12-01" itemprop="datePublished">December, 2016<‍/time>):
  <‍span itemprop="pageStart">741<‍/span>-<‍span itemprop="pageEnd">765<‍/span>.