FFox broken image plug in

Posted by Phil on May 16, 2008 under Uncategorized | Be the First to Comment

Update: Brett/Burt has had a problem with this working on his box, so it may not be compatible with some plugins/add-ons.

One of the worst things that I run into is the prettifying that FireFox routinely does to webpages. When you surf, it’s a great idea, who likes to see broken image files? But when you are developing it gets in the way and can take an otherwise smashing page, and make it look… uh… well smashed. To get around this issue you used to have to install “greasemonkey” and then grab a user-script in order to force firefox into showing you broken image files. Well luckily those days are over as the other of the original script finally made it a standalone plug in. You can grab the plug in here.

I decided to do a little testing between FF2 (with the plug-in), FF3b5 (w/o plug-in), and a control IE7 (yes using IE7 as a control actually made me cringe, and may have given me a rash). I then created a generic html page with 6 broken img links in it. Here’s what we have:

Now as you can see, I have some invalid html (missing alt tag), a couple alt tags with spaces, a few with the alt tags as spaces, you know some ugly things you should never do, and yet we find all the time. Render Time!! Let’s start off with our control.

Here’s how FF3b5(w/o plugin) rendered this mess:

Notice that it shows up with alt tags showing, and at first glance it looks like it picked up 4 of the 6 images. Upon closer inspection though, you’ll see it only saw 3 and prettified the page by removing the rest. Although I gotta say, seeing the alt text looking so plain really throws me off when I’m looking for where an image should be.

And lastly a render with FF2(with plug-in)

We can see exactly what the plug in did. It doesn’t show the alt text now, but you at least know that there should be *something* showing up on the page. When it’s all said and done, I’d say that this is worth the install, and quite a nice plug in.

Weekly Training – Debugging

Posted by Phil on April 3, 2008 under Javascript, Training Sessions, Websphere Commerce | Be the First to Comment

It’s time to learn how to get the bugs out. This week we covered basic debugging (from starting the server) to using some external tools (such as the fantastic Firebug plug-in). For the full show you can check the audio clip at the end (I’ll post it when I’m done ‘cleaning’ it).

Highlights:

• Rational debugging mode
• Firebug (for both CSS editing and javascript debugging)
• Drew’s fantastic commentary as nothing works the way he intends (for the first 20-ish minutes)
• My extremely long pause… that I think I may still be on.

On a side note, there are two other tools that are very helpful when trying to debug or develop on IE, Safari, Linux browsers, etc. They are XRAY and Aardvark, and both are bookmarklets (meaning you bookmark the javascript itself and run it when you need it, similar to a bookmark).

XRAY can be found here http://www.westciv.com/xray/.

Aardvark can be found here http://karmatics.com/aardvark/bookmarklet.html.

Audio clip will be here when I’m done editing it…  UPDATE: Or it won’t, looks like my sansa destroyed the file, I mean it’s still there, just not in a format that any program can read…  I may still play with this, but I’m thinking it’s a lost cause… sorry