Improve semantics for search engines: using microdata

semantic_webWhy use microdata?

Your web pages have an underlying meaning that people understand when they read the web pages. But search engines have a limited understanding of what is being discussed on those pages. By adding additional tags to the HTML of your web pages—tags that say, “Hey search engine, this information describes this specific movie, or place, or person, or video”—you can help search engines and other applications better understand your content and display it in a useful, relevant way. Microdata is a set of tags, introduced with HTML5, that allows you to do this.

schema.org provides a collection of schemas, i.e., html tags, that webmasters can use to markup their pages in ways recognized by major search providers. Search engines including Bing, Google, Yahoo! and Yandex rely on this markup to improve the display of search results, making it easier for people to find the right web pages.

On Bas22 we decided to use JSON-LD (JavaScript Object Notation – Linked Data) instead of HTML markup. JSON is “JSON-based format to serialize Linked Data,” meaning it relies on JSON to provide that same schema.org information to data consumers. So while RDFa and microdata require HTML, JSON-LD can be provided as islands embedded in HTML, or used directly with data-based web services and in application environments.

Example

google_markup_testerSadly, JSON-LP right now is not supported by the official Structured Data Testing Tool of Google and as we expected, the microdata is not displayed in Google´s Search results page, the same behavior happens in Bing and Yahoo.

You can test it on using the next link:

To see html tags in action, we decided to use that approach in one of our pages: work here 

Finally, despite that JSON-LP right now is not officially supported by Google, Bing or Yahoo, we believe and trust on this new technology, as example, I invite you to visit and read about Carbon LDP.

References:

Hope you find this information useful!!

What is a client-side template?

options_0This post is an introduction to learn about client-side templates and It’s not always good to reinvent the wheel, and that applies to this article too.

I have found a very good article that explain what I wanted to write here, is called From The Server To The ClientClient-Side Templating. I truly recommend to read this article in detail if you want learn how to deliver dynamic content via client-side and maximize code reusability and maintainability using JavaScript/jQuery, HTML, CSS, Ajax, JSON and of course, client-side templates.

Also, my teammate, Osvaldo Flores, has wrote about the same topic, he focused on Trimpath that is still our current JavaScript Templating engine here on Base22, but as all has to evolve, we are currently working on a new version of our assets using dust as our new engine, but that is another topic.

If you want to see a live demo of this client-side development technique, please visit our website Base22.com, there we use our xWidgets assets to show dynamic content that live in IBM WCM v8.

Future readings:

Hope you find this information useful!!

Genus Media Upshot API: How to…

Genus“Developed by Genus Technologies, an IBM Premier Partner. Genus Media Upshot is built on the foundation of IBM Enterprise Content Management, providing a highly scalable, secure platform for global asset management. Tight integration with WebSphere Portal and IBM Connections provides a streamlined, simple solution to store once and deliver rich media assets anywhere.”

In this how to… post I will share the links to the Base22.com public knowledge wiki posts where I have documented some of the actions that can be coded using the Genus Media Upshot API via jQuery Ajax.

I really hope you find this information useful.

How to convert a value to JSON string

jsonI’m working on a project where we use JSON arrays to send data to an API via JavaScript code, but we need to be sure that the data that we are sending is correctly encoded. Specially, with characters like: \, @, double quote, etc.

I found some alternatives, like the escape() function, but at the end, a friend suggested me that we should use JSON.stringify() instead, since we are working with JSON, and was the perfect solution!!.

Here is an example of how you can use JSON.stringify() using jQuery Ajax:

var strData = "{'content' :" + JSON.stringify(txtComment) + "}";

$j.ajax({
	url : url,
    type : "POST",
    async : false,
    data : strData,
    contentType : "application/json",
    statusCode : {
    	200 : function() {
            console.log("added");
       	}
    }
});

Note: console.log can throw errors in IE, they are there for illustrative purposes only and should be changed as required.

So, sending a text like: “This” is a message, using the previous code, the text will be converted as:

{'content' :"\"this\" is a message"}

And now it can be correctly interpreted by the API.

I really hope you find this information useful.