Sunday, 4 July 2010

Out of the Sandbox, Template V3


After a week's tweaking, the new template is finally out! It has been tested on Google Chrome and Internet Explorer. (For your reference, out of the five major web browsers, Chrome ranks number one in terms of performance while IE ranks the last.) Although I have tried my best to optimize it to IE, there is no reason to forgo the many features not supported by the browser. During the development of this template, I felt the urge to walk up to the developers of IE and wag the middle finger at them.

Just in case you're still an IE user, give up on the browser. Get a copy of Chrome. You'll see for yourself how much you've missed out on. Enough said, here's a summary of the changes in Template V3.0, in terms of layout and scripting.

CSS Layout
Basically, the layout was strictly done in CSS. But to be honest, there are only some minor changes. The sidebar has been moved to the right, but the same widgets are kept.

jQuery
I wish I discovered jQuery earlier. It's a JavaScript library that has revolutionized the way JavaScript is used. In the past, to script an interactive website in JavaScript was a feat which could only be achieved by Skynet. But now, with the help of jQuery and some ad-on scripts, even your grandma can do that. The image slider up there serves as a proof; it took around five lines of code to make.

Another cool feature made possible by jQuery and an ad-on, tipsy, is the Facebook-like tooltips effect. However, this is currently implemented only in parts of the blog. An example is shown in the screenshot below.



Webkit/CSS3
This layout engine was initially developed for Safari. Although it is now widely supported by other web browsers, IE still falls behind. Two features implemented on Template V3.0 are rounded corners and box shadow.


The difference in the box corners is easily noticeable but I have kept the shadow effects subtle. In fact, depending on your monitor settings, you might not be able to see any effect. It is admittedly carelessness on my part that I did not foresee this but for the time being, I have no plans of addressing this issue. However, if your browser supports CSS3, you should at least be able to see the 3D effects of the image borders in the blog posts.

0 persons flung their shoes: