How To use Schema to Mark Up Webpages

Posted on May 31 2013 - 7:38pm by Itender
effective schema design

HTML tags are the lifeline of a web page document. They instruct browsers how to display information enclosed in the tags. Whether you need to add a text in the header section, link the text to an external web page; set alignment of it  or change font color, type and size , HTML tags do everything and beyond. A properly marked up webpage can improve
your site’s search engine optimization by signaling to search engines what is important on your site. However, there are limitations too.

Limitations of markup language:

When it comes to displaying relevant content to search engines HTML tags alone can’t fulfill the purpose.  HTML tags do not tell browsers what the text means. That is why, search engines have a tough time to understand tags and apply their intelligence so as to display relevant content to searchers.
For example, if a text in your web page document is ‘Harry Potter’, HTML tags associated with it cannot describe if it is a name of a movie, a popular fiction character or a collection of books. This makes the jobs of search engine more difficult. They need to find relevancy of the text with searcher’s query.

New Age Markup Language with Schema:

If you are a web developer then by applying some programming tricks using schemas on your web pages can make a whole lot of difference to how HTML tags relay webpage information and how search engines can make intelligent use of those HTML tags. Schema.org offers a collection of vocabularies that website developers and programmers can use to solve the purpose. By adding schema vocabularies (along with micro-data format) to HTML content , it is possible to build meaningful  HTML tags that popular search engines can understand and relate.

What is schema?

Schemas are the html tags that web developers can use to markup  web pages so that search engines can identify them and use them to display better search results.

What is microdata?

HTML microdata is a machine readable data that can be embedded in HTML documents. Microdata can be integrated to HTML5 documents in an easy-to-write manner. These data are also compatible with any other formats such as JSON  and RDF. The latest version of HTML5 microdata was released on 25th October 2012 and it is available at http://www.w3.org/TR/microdata/

What should you use microdata?

Usually websites are developed from structured data which are stored in databases. When these data are formatted into HTML , it becomes almost impossible to recover the original structured data. Search engines prefer accessing structured data in order to provide relevant search results. By using shared Schema vocabularies webmasters can decide a markup schema for their web pages that is search engine-friendly .

How do you mark up web page content by using microdata?

Microdata contains group of name-value pairs. The groups are termed as ‘Items’ whereas each of the  name-value pairs is called ‘Property’. ‘Itemtype’ is another attribute that specifies the nature of the item.These items and properties are regular elements. To create items you need to use ‘itemscope’ attribute and to add a property you have to use ‘itemprop’ attribute.  An item can have different properties and property can have different values (also called ‘strings’).

Here is a simple example of how microdata look like within an HTML format -

 

Producer: David Heyman (born July 26, 1961)

Motion Picture
From the above markup data search engines can easily understand –

http://www.harrypotter.com is a URL and it is related to motion picture movie Harry Potter which was produced by David Heyman who was born on 26th July 1961

What is Schema vocabulary?

We know that not all web pages display same type of content. There could be various item types and properties for each of the item type. ‘Thing’ is the broader version of any item type which consists of four properties such as name, description, image and URL. More specific item type shares properties with broader item type.  Thus there are different set of common item types one may use.  These are person, organization, place , event, Local business, Product offer, book, movie, music recording , recipe , review and more.  There is a full list of item types you may find on http://schema.org/docs/full.html.

The whole objective of applying schemas to your web page is to make it more search engine-friendly.  The days have gone when a developer could get away with basic form of markup language (HTML). Today you need to help search engines to know you better and that too from human perspectives.