Micro Formats
What are Microformats?
To start understanding Microformats, you must first look at where micro formats came from as it arrived within two stages of development. The first implementation arriving in 2005 as part of a grassroots movement to make recognizable data items (such as events, contact details or geographical locations) capable of automated processing by software, as well as directly readable by end-users.
Microformats2 2007 was intended to make it easier for authors to publish microformats and for developers to consume them, while remaining backwards compatible.
Within the beta development of microformats there was varies types of microformats available to developers.
• hAtom (superseded by h-entry and h-feed) – for marking up Atom feeds from within standard HTML • hCalendar – for events • hCard – for contact information • hMedia - for audio/video content • hAudio – for audio content • hNews - for news content • hProduct – for products • hRecipe - for recipes and foodstuffs. • hResume – for resumes or CVs • hReview – for reviews • rel-directory – for distributed directory creation and inclusion • rel-enclosure – for multimedia attachments to web pages • rel-license – specification of copyright license • rel-nofollow, an attempt to discourage third-party content spam (e.g. spam in blogs) • rel-tag – for decentralized tagging (Folksonomy) • xFolk – for tagged links • XHTML Friends Network (XFN) – for social relationships • XOXO – for lists and outlines
Several microformats have been developed to enable semantic mark-up of particular types of information. However, only hCard and hCalendar have been ratified, the others remaining as drafts:
What are hCards? hCard provided a set of values for the class attribute what could be used to show contact information such as addresses, phone numbers, email address and other work-related details commonly found on physical business cards. hCards were developed on the same format commonly used for contact information via Microsoft Outlook and Apple Address book. hCards could be created manually, but there are also generators available to users to help generate the HTML code for them via a useful online UI.
Below I have attached a table comparing the information the UI requires and how you input that data, vs how the online generator codes that information into a working hCard.
Generator used: http://microformats.org/code/hcard/creator
RAW Information HTML
Robert Evans Ford
What are Microformats in SEO?
Microformats are a type of structured markup. Which In layman's terms, microformats are bits of code that bookend information on your website, and tell search engines like google, Duck Duck Go, Bing, AOL and varies others, what kind of data it is. You can think of microformats as "labels" for parts of your content, which means that rather than Google, for example, manually searching through your website to compile content for its search engine rankings. You can force inject Google with individual bits of information about your sites page in order to allow for a more in-depth understanding and organisation of your website's data.
Search engines can use the information from your microformats to present you SERP (Search Engine Results Pages) listing with what called a 'rich snippet." This rich snippet can be treated like a recipe, and that recipe means that instead of your website listing being just a page title, URL, description and other random information. It will be given some more instructions and ingredients to add to your sites SERP.
What can this recipe add?
The information that this recipe can add, changes depending on the website type in question. For example, if you were a restaurant, the information that you would be able to add to this recipe, would be things like.
• • Hours of operation
• • Location
• • Average rating or review score
• • Contact information
However, if you were a blog, news company or another publishing-related website, then you may wish to use microformats to display different types of information such as.
• • Name/Author
• • Publisher
• • Article Section
• • Date/Year
What do microformats look like in the real world?
When using search engines like Google, you will see Microformats are very common without realizing it. The way in which some search engines like Google display microformats is via a piece of software called Google My Business.
Google my Business is a way of creating microformats outside of your websites code itself, in order to create the same effect as if you were to embed them within your site.
You can create the "display" of microformats via either method, and you will be greeted via the same UI no matter the option you choose.
Below is Extended Screenshot of the University of Greenwich Microformat display.
Within this screenshot I will explain how each type of information will have been inputted and the benefit of displaying this information in microformats rather than on-page within your site.
Google Map API – This can provide the user with the ability to load the location of the said place in the google map app and direct you there from inputted or current location via various modes of transport.
Business Name – Taken or inputted straight from the HTML or Google My Business.
Business Description – Taken straight from Wikipedia and linked to the Business name for a more in-depth description.
Address & Phone Number -: Taken or inputted straight from the HTML or Google My Business. Quick access for users without visiting the site.
Events - Events are an excellent use of embedded HTML microformats as this allows Google to compile upcoming event information from various webpages into one area for easy access without accessing the site.
Reviews from web – This microformats data is gathering review about the stated company from various sites on the web and compiling them into an overall score. In this instant, it is only gathering information from the stated Facebook Page.
Notable Alumni – Taken or inputted straight from the HTML and creates a link with the stated names google search page for the user to interact with.
Social Media Profiles: You can input data within your microformats to create links to other social media pages, including YouTube, Facebook, Instagram, Twitter and many others.
Reviews from Google – This microformats data is gathering review about the stated company from Googles own reviewing platform, this further allows you to view individual comments and ratings.
How do we make/add microformats?
Microformats are traditionally added via embedded code with the HTML, and this code can be generated by tools such as the Open Markup Builder.
Within this builder, you can select if you are building code for a web page of e-mail and then further select what kind of data type, you're going to use from the list below.
• • Articles
• • Book Reviews
• • Events
• • Local Businesses
• • Movies
• • Products
• • Restaurants
• • Software Applications
• • TV Episodes
• • TV Episodes with Ratings
Within the Ul you can then paste in the HTML code directly or give a link to the URL of the live site. This will then bring up your webpage or HTML code in a manner what will then allow you to select various data types and identify its data type.
These data types can range from simple things such as company name, description, logo to more complex data types such as reviews and Google map API.
Once you have declared all the information types that you wish to for that HTML page or URL webpage, you then continue to create the HTML code needed for the microformats. You can download this is two different forms, and you can download the microformats as a stand-alone piece of code and also as a completed file where the Open Markup Helper would combine your submitted code with the newly created microformats to creating a finished piece of HTML code.
You should then test your new piece of code with the data structure testing tool, which takes your newly finished piece of code and loads the webpage with in-depth tools to check the microformat data is correct and or present in the finished code.