Pages

Showing posts with label IE. Show all posts
Showing posts with label IE. Show all posts

August 26, 2010

Why haven’t I used IE in months?

Share on Facebook


icon_ie7

I think I was conducting a training on “Windows programming using C” in a company called VeriFone Bangalore when I first saw Internet Explorer. Like Netscape, it had a logo on top right which would rotate as the page was loading. I was fascinated with the UI and thrilled that I could look up information so easily and quickly. On the other hand there was Netscape, a powerful browser which was the de-facto standard. I think Netscape was $50 while Microsoft started giving away its browser free with the operating system which led to a massive law suit and Browser wars. The browser war was good in a way because it made both companies bring host of innovation and rapid changes eventually helping the customers. Its another thing that Netscape lost the war and IE became the de-facto standard on the web. I was siding with IE thru the war as I found it to be a better browser than Netscape.

Phoenix rises from the ashes of Netscape

120px-Mozilla_Phoenix_Logo

As Netscape lost the battle and made the source code open, the code base gave rise to another project called Phoenix (rising from the ashes of Netscape). Phoenix was however already a registered name so the team tried to rename it to Firebird, which too turned out to be registered so they finally called it Firefox. I have been using Firefox since Phoenix days but did not pay too much attention as it could not match the capabilities and features of IE. But I did keep an eye on the browser as it matured. Then one day it happened… I discovered add-ons and extension which allowed me to customize, configure and personalize the browser the way I wanted. Also, the new JS engine made its way into Firefox, speeding it way beyond IE performance.

Missing IE?

ffx_ie7When people don’t like or use a software, they tend to remove or uninstall it. However, IE is one software which remains on every Windows installation that it there. Why? Because you never know when you will need it. There are hundreds of site which work with IE but not Firefox. This may not be intentional but due to the fact that IE did not enforce strict adherence to HTML and web standard while Firefox always did. So a missing closing tag would still render in IE whereas it would refuse to show up in Firefox. Imagine you test your web site in IE and a day before you go live, out of curiosity you open in it Firefox and you are horrified as the page is a mess. Can’t imagine? Ask Chandrasekhar “Netscape” Vyas who earned this moniker precisely for this reason Smile

Stop switching between FF and IE

If you use Firefox regularly but have to switch to IE because of certain sites, now you can get IE Tab Plus. What this Firefox add-on does is it loads IE in one of the tabs in Firefox. I am not talking about emulating IE, I am talking about loading the IE engine in the tab so that you can open all those IE specific sites in Firefox without having to even launch IE. Go ahead and download IE Tab Plus from Firefox Add-ons site and lets roll.

image

Once you install IE Tab Plus, you will see and icon in the system tray. This icon toggles between FF and IE.

Lets get to work

The number of sites which work only with IE is reducing fast but there are still some sites which either refuse to work with anything other than IE or don't work well with non IE browser. Lets take a look at such sample site.

SNAGHTML70c4df5

This site flatly refuses to work with Firefox. It clearly says “Sorry, this site requires Microsoft Internet Explorer 5.5 or later.” Now lets switch the site to IE by clicking the FF icon in status bar.

 

image There are variety of ways in which you can switch the engine from Firefox to IE. The easiest way is to click in icon. Another way is to right click the page which brings up Firefox context menu which allows you to switch rendering engine. If you right click on the icon, it brings up a menu (as shown in the image). You can take a call if you want to switch the engine in the same tab or launch the page in IE.

 

image

Here is a screenshot of the same site, still running in Firefox but being rendered using IE engine. As this is not simulated (browser-agent switching), you get real experience of IE. As you can see in the screenshot, if you right click on the page, you get IE context menu and not FF. To switch back, simply click on the icon back. If you require full IE interface, you are welcome to use “View Link in Internet Explorer” which will launch IE and not use FF tab.

Configuration

You can configure IE Tab Plus to share cookies with FF or even allow AdBlock Plus. You can also decide in-tab switching or opening a new tab. It also allows a site filter where you can specify sites which will always open in IE (at one point of time windowsupdate was the most gruelling IE-only site).

SNAGHTML6452136

Conclusion

So now you know why I haven't used IE in months Smile

Happy switching Smile

August 12, 2010

Aero Effect in browsers

Share on Facebook


image

People have been asking me how I am able to get Aero effect on browser like Chrome after they saw the screenshots in the previous post). I kind of like the transparency effects in Windows 7, especially the change from Vista where maximizing the window no longer makes it title bar opaque. While transparency is built in and automatic for some applications, you need to tweak or even install add-ons and utilities to bring transparency in some applications.

Enabling Transparency

First of all you need to enable Aero in your Vista or Windows 7 by going to Desktop > Right Click > Personalize menu and choosing “Enable Transparency”. I tend to choose the lightest colour (Frost) for Windows borders, start menu, and taskbar. It gives almost clear glass like transparency effect. You can also adjust the colour intensity which will adjust the opaqueness of your title bar. Least intensity will make it look like clear glass whereas max intensity will make it look like frosted glass. Once you are done with adjusting aero, we can start looking at applying aero capabilities to various applications.

image

Transparency in browsers

I use 4 browsers for testing – Firefox, Chrome, Internet Explorer and Opera. Each of these browser requires a different method to make their toolbars transparent.

  • Internet Explorer – Built in transparency with Windows 7
  • Opera – Transparent skins available for download
  • Firefox – Add-on available for making the toolbar transparent
  • Chrome – Hacking the theme to convert the toolbar transparent

Lets take a look at each of these one by one.

Opera 10.x

Opera, like many other applications, has the concept of skin (theme). All you need to do is browse online themes from Opera menu and apply a glass or transparent theme. Opera comes with 2 built in themes – “Opera Standard” and “Windows Native”. While Windows Native provides standard windows colour to the toolbar.

image

Opera Standard applies glass effect to the tab area as well.

image

Applying Opera Standard Theme by itself give you transparency effect on Opera toolbar but if you want to extend it, there are a number of transparent theme available which can make the tabs and even empty page totally transparent. To browse and install these themes, go to Opera Menu > Appearances > Skins. Click on “Find more skins” radio button and browse for skins online.

image 

Applying this skin makes the ENTIRE opera transparent, but don't worry, its only for the blank page and not when you open web sites Smile

image

Firefox 3.x

Firefox is the most customizable browser out there and you don’t have to rely only on Mozilla to provide you with the feature you are looking for, you can browse thousands of add-ons available on the site and you are most likely to come across an add-on which satisfies your requirement. In this case, and add-on called “All Glass” which can be applied to Firefox to make its toolbar glassy like Internet Explorer or Opera. To install, go to Tools > Add Ons > Get Add Ons > Search for All Glass.

image

When you find it, click on the Add on name and select “Add to Firefox”. You will be instructed to Restart Firefox for the add-on to have the effect.

image

Restart and Voila! Your Firefox is all glass now.

 

Chrome 5.x

Chrome is the trickiest of the lot to glassify. Though if you were to search for Transparent themes, you will find them on Google site and these themes even show the white/gray square indicating transparent background (as depicted in PhotoShop/Gimp and other editing product). If you excitedly apply the theme hoping that the gray/white areas will be transparent, well.. they will be gray and white.

image

image

Chrome installs extension and themes and stores them under User profile. The theme contains a JSON file which specifies the theme attributes. It takes a simple micro surgery to remove the frame attributes altogether forcing Chrome not to apply ANY colour to its frame, leading to transparency.

First apply a theme you would want before making rest of the toolbar transparent. Having done that, lets find out where Chrome stores its theme attributes. To do this on Windows 7 you need to go to \Users\<YourLoginName>\AppData\Local\Google\Chrome\UserData\Default\Extensions as shown in the image below.

image

These are all the extensions that have been installed in Chrome. Unfortunately, Chrome does not use the extension name for the directory name making it difficult to figure out which extensions these are and more importantly, which of these directories is the theme directory. You need to search the directory which contains a folder called “i” and that’s the one in which we are going to modify the attributes. For me, its located in this folder

image

Now, edit the JSON file using any text editor and knock off the lines referring to the frame. For example, my current theme specifies:

image

We are going to take this modified extension and create a new theme (extension) out of it. So save the file and copy the version number folder (1.0_0)  to another location, say on desktop. Next, in Google Chrome, go to Menu > Tools > Extensions. Make sure the developer mode is on and click on pack extension to create an extension file (.crx).

image

This will generate a file on the desktop 1.crx. Now just drag and drop the file anywhere on Chrome. Chrome will give a warning at bottom of its window that installing extension can be harmful.. blah.. blah. Just go ahead and click on continue.

image

 

And Voila!

image

Conclusion

Most applications either support transparency naturally or have tweaks and extensions to achieve it. There are 3rd party apps which are capable of applying transparency to any application, but the don't do it selectively, rather to the entire window.. which is not what you may be looking for.

Happy Glassing Smile