The war on IE6

It seems that the decline of IE6 has plateued at around 15-20% which has brought frustration to many web developers around the world. For nearly a year now I stopped supporting IE6 on my personal sites but 99% of my work is for clients who do not want to exclude what is a significant portion of their audience. This has lead to a signifucant portiin of development time taken up by finding hacks for IE6 or worse still dropping features that IE6 won’t support. Most clients wont accept that IE6 users should have a degraded experience and would rather lose a feature than have it only available to other browsers!

CNET Video page was a beast to get working in IE6 as even when it looked perfect scrollong down would cause divs to partially collapse and colours to flicker. IE6 also had issues with Ajax loading in content after the page had been rendered and wouldn’t expand boxes to accomodate the content. The hacks were ugly and made me hate IE6 more than ever. Note the page has been redesigned since these issues but I imagine many haslayout and delayed loading issues still remain.

Until IE6 is gone this is just a daily problem for developers and with the failure of Vista and the apathy/ignorance of users and corp IT departments something more drastic was needed. .net magazines started a campaign a couple of months ago to unite developers in putting IE6 to the sword. Check out bring down ie6 for the details. It has caused some controvecy as many developers feel that if your weblogs and clients say that IE6 is still important we should support it. And to be fair some users have no choice. However, rather than just allowing a page to appear broken in IE6 by boldly stating the reasons why you will recieve a degraded experience if isong IE6 as mobile me and google mail have done you both educate the ignorant users as to the existance of alternatives and irritate corporate IT departments into action. When the company MD cant access certain sites or keeps getting alerted to reduce performance, features and security because of his old browser it wont be easy for the IT department to make excuses for having firefox or IE7 on the users systems.

I think it could be taken 2 steps further. Educate users that you dont need admin rights to install firefox. In fact the first time I used firefox at work I installed it on a memory stick. Scandisk have memory sticks with U3 feature that runs several apps directly from the usb dongle. It’s self contained and so can be taken with you and run on any pc. However, i found memory stick run apps a little sluggish especially on scandisk dongles (I only use corsair now) so installing in the My Documenta folder is my usual recommendation. Where I work I am surrounded by IE6 users, all of them hate it but felt they had no option. A quick demo of a My Documents install and everyone’s converted. If this was added to the advise on upgradeing I am sure uptake would be higher. Note, installation of flash and java support for these browsers does require admin rights.

The next step would be to treat IE6 like a mobile browser. A mobile browser has reduced features and performance so has a cut down version of the site with just the essentials (i know there is more to it than that, screen res, bandwidth etc). So my IE6 site would have the content but not the look and feel of the full site. Again this will probably just be on my personal sites and for pro-bono clients, for the clients that pay the bills the best I can hope for is to include a message advising to upgrade their browser and link to the campaign page.

The more sites/developers that get on board the more effective this will be. Hopefully boosted by a succesful Windows 7 launch and MS dropping support for IE6 will see the browser retired for good.

Tools of the trade

So starting a new job on Monday I needed to set up my rig with the tools/apps that I have learned I cannot live without.

HP EliteBook 8530w

My new laptop is a HP EliteBook 8530w, I’ll be writing a review and a comparision with my Dell XPS m1530 soon.  First major difference is that it’s running Windows XP rather than Vista. A bonus, many may say, but I do miss quick launching apps with a hit of the Windows key and then typing a few letters followed by enter. Fortunately, there is the free, and brilliant, Launchy to the rescue. Alt-space takes the place of the windows key for firing up the launchy text box which works much like Spotlight on mac.

For web development work I found the following tools invaluable:

1) Faststone image capture - the ultimate screen capture tool, does wholepage, video, page portions and even scrolls a page and captures it as one image. The video feature can also be set to only record a portion of the screen which is great for screencasts or demos where you don’t want a massive filesize or a squashed/compressed illegable video from a fullscreen recording.

2) Browsers - firefox and google chrome were one of the first things I installed. I would have also used IE Tester but this seems to be a bit redundant now that Microsoft have released their own version so I downloaded SuperPreview

3) Aptana Studio - My IDE of choice. I code in aptana for html, css, javascript and PHP. It has great tools and features and cuts out a lot of the nonsense that are in some WYSIWIG editors. It is based on Eclipse and so is Java based and chomps though a lot of ram so you’ll want at least 2GB of Ram on XP and probably 3-4GB on Vista if you are running it along side other ram hungry apps like Photoshop. Has great plugins that allow you to preview your page on iPhone or sync with subversion.

4) Vertrigo - This is a WAMP app by a Polish developer that is free and easy to install. You simply run the setup and you have an Apache server with PHP and MySQL ready to go. What’s great about it is that it doesn’t try to be constantly running on your system. Just fire it up when you need and close it when you don’t. Good idea to install this as one of your first apps as I have had conflicts when installing it on systems with a lot of other apps that may have been using ports/resources that it needed.

5) An IM client. In my opinion Skype had the best IM client for a long time (not to sure about the latest design) but seeing as most of my contacts are on Yahoo/MSN now I opt for the YIM client. I may switch this for Trillion or another all in one client in future but having an AIO client usually means features such as file transfer or group chat.

6) VLC media player - Not only is this the best player because it plays the most formats it is also even better at playing those formats than the native players. This is especially evident when playing HD content. HD MOV/MP4 files natively play in quicktime but even on decent spec systems can stutter at times. VLC plays them smoothly even on low spec systems (I’ve seen Hi-res video playing fine on netbooks with VLC). It also playes flash video (FLV) and supports more obsure codecs like HD MKV, which is becoming the standard for distributing large HD video files.

7) Adobe CS4 - no getting round it, although the price tag seems ridiculous and there are some alternatives out there, a serious designer/developer will almost always end up with Adobe software. I’ve given up fighting it and fortunately so have finance so will be getting CS4 installed shortly.

Firefox Plugins - The list of must have plugins seems to have shrunk as I find I am using the same small list regularly and others are just a distraction. I now use Firebug, Web developer toolbar, colorzilla, measureIT, ImageZoom, Delicious, and may get round to installing Scribefire now that I’ve started blogging again.

9) Office - Not too fussed whether it is MS office or Open office plus Thunderbird but best to keep to what everyone else running in the office so have the now ageing MS office 2003.

10) WinRar - For opening everything from ZIP/RAR files to ISO or 7zip - another AIO solution for compressed archives.

For entertainment I could add iTunes and a few other apps but as I’m tight on HDD space on this system I will stick to my iPhone for my music jollies. Fortunately I can now get my podcasts straight to my phone over wifi so PC syncing no longer a daily requirement.

What apps are in your utility belt? What tools can you not live with out?

IE7 critical update, more users moving browser

Microsoft released a critical out-of-band patch for IE7 causing panic updating in IT departments around the globe. Some took advantage of this update to encourage users to make the switch to a more secure browser like Firefox or Google Chrome.

This prompted me to take another look at the figures for browser usage on some of the sites I maintain to see if there is a shift from IE after this update. I was expecting to see the usual 60-70% IE dominance split almost evenly betwen IE7 and IE6. However, it seems IE6 usage has significantly dropped off in the last few monts across a range of sites. The users don’t seem to have all shifted to IE7 either as overal IE usage has dropped to around 50%. The increase has been seen in Firefox 3, Safari and Google Crome. Safari seems to have gone up from an average of 2-3% to 3-5% depending on the site. Google a new entry is around 2-3% and Firefox is enjoying 30-35%. Dare I hope that soon I will no longer have to support IE6!?

Well I expect I’ll have to wait until Windows XP is no longer supported by Microsoft before it finally dies or an unpatchable security hole is found and users are forced to upgrade.

In any case if you haven’t done a windows update today do it now and get IE7 patched even if you don’t browse with it.

Will check browsers stats in a couple of weeks to see if there is a dip/change after everyone has update panic.

Firefox 3 and Firefox 2 windows media support

Those of you trying out the Firefox 3 beta or considering it may want access to firefox 2. This is particularly true for developers as you will want to test in both version of the browser and the much loved Firebug plugin is not supported in Firefox 3 yet.

Fortunately there is an excellent guide on getting both Firefox 2 and Firefox 3 running at the same time thanks to Hikikomori’s blog redemption in a blog

The problem I encountered is Windows Media Player video embedded in a page will not play. I tried re-installing the plugin but while this works for firefox 2 it does not for firefox 3.

I then recalled I encountered this same problem when first upgrading to Vista. A fix is to copy the needed dll files into the firefox 3 plugin folder. You can just copy the files over from firefox 2 plugins folder or download only the required ones from dll dump.

Quote from last blog post on this topic:

You can find the missing files on dlldump.com

• npdsplay.dll
• npwmsdrm.dll
• npdrmv2.dll

If this doesn’t solve the problem get more indepth help here: http://forums.mozillazine.org/viewtopic.php?t=206213

Microsoft make a desperate push for IE7

With uptake of the latest Internet Explorer browser being slow compared to that of main rival Firefox, Microsoft have started a big push to encourage more users to make the change.

The first big advantage Microsoft had was having it pre-installed on it’s latest OS - Vista and not allowing the obsolete Internet Explorer 6 to be installed (which would undermine vista security anyway). However, with Vista uptake being slow and with the tech savvy already using firefox, opera or other browsers IE7 is struggling to make much ground.

Latest figures I have from various sites I run/developed show that on sites for web developers or tech savvy users Firefox now has the majority over both all other browsers combined.

On consumer sites it is about 30% IE7, 28% IE6, 40% Firefox and the remaining 2% using other browsers. So although overall Internet explorer has the majority users still, IE7 alone has not caught up with firefox.

On business sites the weighting is slightly more in favour for Internet explorer but then the figure is increased for IE6 rather than IE7.

In a bid to convert more users to IE7 this week we’ve seen them <a href=”http://news.zdnet.co.uk/security/0,1000000189,39289859,00.htm”>remove the validation requirement</a> to download it.

Now they have sent out a newsletter promoting Internet Explorer 7. It seems to be targetted at IE6 users as it focuses on the improved security in IE7 and the fact that it doesn’t render correctly in Firefox:

<em>”The Internet is a vast place–and not every site is friendly. How do you help protect yourself online? With Windows Internet Explorer 7. Already, the Internet Explorer 7 Phishing Filter prevents nearly one million visits per week to known dangerous websites. In just a few clicks, see how the latest version of the world’s most popular web browser can help you be safer online.”</em>

The latest version of <strong>the world’s most popular web browser</strong> may not be a statement the internet explorer team can use for much longer…

As a developer I am happy with this push to IE7 - the sooner we get rid of IE6 the sooner I will stop having to support it. It is currently holding designers/developers back in what can be done as we have to ensure whatever we do is supported it. Binning IE6 will mean - less hacks, more advancement, less development time - resulting in savings for everyone.

Firefox 3 on the horizon

You can download this blog post in audio format here (right-click and save target/link as..) or play it using the podcast player on the right.

Firefox 3 - code named Gran Paradiso is under development. It will use the Gecko 1.9 engine and the latest build released already is said to have passed the CSS Acid2 test. Although Opera, Safari have already achieved this it’s a big landmark for Firefox and a good sign of things to come.

Firefox 2.0 already features the most advanced CSS 3.0 support including CSS rounded corners and alpha transparency and Firefox 3 is set to have full support. Other features include improved graphic rendering and support for Javascript 2.

Of course we can expect there will be many bug fixes and tweaks making Firefox faster and more stable. It has been optimised to make better use of your systems hardware so if you have a good graphics card you should notice big improvements both in visual quality and speed for sites that take advantage of this.
Continue reading »

Hacked to Death iii

While testing Krugle for my pending review I was able to find a Safari hack that works.

You may already have heard of the Safari Stokely Hack. It’s not as straight forward as most IE hacks but it works on even the latest versions of Safari and can be a real life saver.

View details on the Stormdetector website.

Now IE7 is here hacks have to be more specific in their targeting. Some Beta versions of IE7 ignore * html hacks and some apply them (The final release ignores them).

To be sure which browser will be affected by your styles you can use conditional comments.

e.g.
<!--[if lte IE 6]>
(html for IE 6 or older goes here)
<![endif]–>

This goes into your html not your css file. The version(s) of IE you specify will read the code you enter within the comments while other browsers will ignore it. This means you can link to a seperate style sheet with your IE hacks in and it will not affect other browsers.

Selecting versions to affect:
To affect just one version of a browser (e.g. IE7) simply start your conditional comment with <!–[if IE 7]> replacing 7 with whatever browser version you want to target. If you want to target a range of browsers you can insert an extra word before IE.

• lte - less than or equal to
• lt - less than

Because you have targeted a specific set of IE browsers future releases should be happy viewing your page without the hacks getting in the way.

These conditional comments can be used to hide any other html from non-IE browsers too, such as an IE only feature you may have on your page.

Hacked to Death ii (Safari)

Apologises for the lack of posts the last few days. I’ve not been on holiday, far from it, I’ve started a new contract. I will be producing for a leading media company.

This actually brings me nicely onto this blog entry’s topic - Hacking Safari. I am used to testing on the major PC based browsers (FireFox, IE, Opera and to a lesser extent Mozilla, Netscape, linx) but have never been required or had the hardware to test with Macintosh’s Safari.

For the most part if a design works in FF and IE, Safari will quite happily play along. However, on one page where I have used relative positioning to move an image up by a few pixels I encountered a problem. FF and IE6 didn’t line up. I was forced to use an IE6 hack (see previous hacked to death entry) to set a different pixel adjust for the two browsers. While this solved the problem in IE6, Opera, FF and IE7 - Safari was not happy.

While Safari had rendered the page as FF it treated the positioning of this image as IE6. As IE6 hack only affects IE6 and older Safari’s positioning of he image is not corrected. Quiet a problem.

Thus began my quest to find a CSS hack that only affected Safari. Preferably an elegant hack (if there is such a thing) still allowed my style sheet to validate and would not affect future versions of The browser.

Continue reading »

Hacked to Death

Everyone working on the front lines (building for the front-end) will have likely encountered a page that despite being a coding piece of art looks great in one browser but falls apart in another.

If you don’t work for Microsoft you’ll know the problem is usually with the Internet Explorer browser. A lot of the time tweaking a style sheet a little can solve things but sometimes there is no other option but to add a hack.

No one likes hacks, in fact I go to insane lengths trying to find an alternative before I will use one. However, if it is necessary to ad a hack is there a good way, or is a hack always going to be ugly and we just have to face it?
Continue reading »