Semantics for better User eXperience

Semantics intrinsically gives a better User eXperience!

What is Semantics?

Per Wikipedia:Semantics: Semantics is the study of meaning; focusing the relationship between signifiers, like words, phrases, signs, symbols etc.

For Internet, Semantics mean a Web with a meaning!

Semantics Web enable the Machine to understand the web. These machines - Search Engine, Browser, Geo Locators and other Devices or Service - matters for you in many ways.

HTML

Below are the semantics present in HTML standard, which provides a user and machine to grasp the content and interpret differently. Try differentiate the below group of HTML tags, that will give you the idea of what Semantics can do to User experience - visually and by usage.

• h1, h2, h3, h4...
• em, strong, b
• div, span, p

HTML5

Seeing the need, usage and benefit of Semantics, HTML5 is coming up with quite a lot of Semantics for the data to be structured. Below are few of them for your quick reference.

• HEAD
• META
• LINK rel="icon|alternate|canonical|stylesheet|license|nofollow|noreferrer" 
• newer: rel="start|first|prev|next|last|stop|up|down|prefetch|search|tag"
• HEADER
• NAV
• ARTICLE
• SECTION
• ASIDE
• HGROUP
• TIME
• MARK
• FOOTER

Before HTML5 could come up with these Semantics the Web community started inventing and pushing for the Semantics to be included in the web pages. Below are the most popular and adopted formats.

1. MicroFormat: 
1. (+) Simple and Quick to implement
2. (+) Less side effects to the webpage
3. (-) Limited formats and proposing a New format takes 
2. MicroData
1. (+) Very clean and explicit about the usage
2. (+) Good documentation
3. (+) Searchability/Finding is straight forward
4. (-) Takes time to implement
3. RDF
1. (+) Has all pros like MicroData; also similar implementation
2. (+) Complex representation can be made
3. (+) Custom data representation
4. (-) Since its complex, it take even more time than MicroData.

Google (@ Google support), Yahoo! (Monkey finds MicroFormat) and Bing (Marking up your site) support these formats, and provide a very informative search result accordingly. They also rank the pages better than other if such formats are implemented - since the machines are sure about the pages content via these Semantics, while others are _guessed_.

To conclude, Semantic Web is about Linking data and some say it as Hidden Web Service!

User Experience

User Experience is all about:

• The attractive design - e.g: Jewellery, Ferrari etc
• The engagement of the product - e.g: Gaming consoles
• Usage of a Product - e.g: Touch screens
• Interaction of the product with its eco-system, i.e. retaining the user within its eco-system. e.g: Mac products - iPod, iPhone, iPad, iMac etc.

UX Design Lab says: User Experience Design has to attract, engage, acquire and retain.

Semantics for UX

Try searching for "Events in Bangalore" in Google - or for any location. Notice the results from burrp.com.

Try searching for "Nikon" in Google - or for any location. Notice the results from mysmartprice.com.

When I look at search results, my immediate impressions are:

1. Precise details for my search without clutter.
2. Additional info for my search, upfront, without going to another page 
3. More interaction points for the end user and machines
4. Richer User experience 
5. Better conclusion on the search.

There are more usages:

1. Readability of the machines to voice over for the Visually challenged people. An article from Instagram inspired me to provide rich content.
2. Data Portability. 
1. If there is an 'Address' snippet
1. The search engine can help locate it quickly
2. The address can be downloaded to Outlook or any standard address book with one click
2. Author info
1. Helps link the content from different sources.
2. Identify the related documents owned
3. Header & Footer
1. Mobile browsers may adapt to hide the HEADER and FOOTER section, if the user is staying on the page for a considerable period, to provide more real estate for reading the ARTICLE!
2. Highlight them as necessary, since it contains information about the website and page - like Logo, Copyright etc.
4. Social network portability. FOAF - Friend of a Friend
1. Social networking has enabled a various industries in improving their UX multi-fold. How many decisions have you made online because one of your friend or friend's friend have chosen/used/reviewed/accepted it?
2. Find items, relations, jobs and professional connections via this Semantic.

Conclusion

• Semantics provide a clue for minimally required content. 
• Try leveraging the rich capabilities of Semantic technologies to design and enhance the vision of next-generation products. 
• Let the machine understand and enhance the user experience - like the way HTML5 is proceeding
• UX for the visually challenged - Semantics is the answer!

Related references (Not necessarily related to above content!!):
http://semanticstudios.com/publications/semantics/000228.php
http://msdn.microsoft.com/en-us/magazine/ff979268.aspx
http://blog.search-mojo.com/2013/07/23/new-download-the-definitive-guide-to-rich-snippets-for-google-and-bing/
http://uxontherocks.com/rich-snippets/

http://www.nngroup.com/articles/definition-user-experience/
http://uxmag.com/articles/many-forks-in-a-new-road

http://www.huffingtonpost.com/2013/01/04/how-blind-people-use-instagram-tommy-edison_n_2409973.html