Andi Smith on January 9th, 2009

“Honza has made some fantastic improvements to the Net panel. John Barton has improved the Script panel and debugging features as well as tweaking the console. Maybe more significantly were some of the changes under the covers. The new Tracing panel (FBTrace) for debugging Firebug itself during development is a huge improvement over the previous console-based system. We’re starting to get some unit test coverage through John Resig’s and Honza’s FireUnit.”

Grab a copy of the extension here

Please note: it doesn’t currently work on Firefox 3.1 beta.

Continue reading about Firebug 1.3 released

Andi Smith on November 18th, 2008

Over the last few months I have seen the issue of website accessibility become a much more important consideration to my company’s clients whenever we are building new websites. DDA compliance is no longer just a buzzword, it’s something clients request as an essential requirement. As such, it’s getting increasingly important for Web Developers to consider screen readers as they develop their web pages.

One useful tool for building screen reader friendly web pages is Fangs – a Firefox 3 extension that creates a text version of what a modern screen reader program would read.

I would strongly recommend that every web developer downloads this extension and gives it a try - you may be extremely surprised at the results and find that the accesible website you just built isn’t actually that accessible after all.

Continue reading about Fangs for the Text

Andi Smith on November 17th, 2008

Robert Kieffer has released a new tool for testing JavaScript code performance.

JSLitmus is designed specifically to allow you to quickly and easily write a JavaScript test, run it on any modern browser, and document the result.

By including the JavaScript file and a single line of code per test, loading the page in your browser will give you access to the test suite. By hitting the run button you will get a break down of each test, together with a graphical chart showing the results. You can, of course, use the testing suite in different browsers to see how your code performs in them all.

Want a demo of the tool itself? You can try it out on the JSLitmus homepage.

Continue reading about JSLitmus

Andi Smith on October 10th, 2008

It’s not going to solve anyone’s web development problems, but this week’s tech tool is an extremely useful bookmarking add-on to Firefox which allows you to seemlessly synchronise your bookmarks between computers. By storing your bookmarks with Foxmarks they are also backed up should your computer fail and are available online, anytime. Even if you are at a client’s computer, or on a computer with only Internet Explorer installed, the bookmarks are available from the Foxmarks website.

So why use Foxmarks instead of del.icio.us? Personally, I find Foxmarks much more user friendly then del.icio.us, with bookmarks appearing as I’d except in the bookmarks toolbar, the ability to order they hierarchically, with drag and drop and edit/delete always just a click away. It all comes down to personal preference.

Check it out at Foxmarks.com

Continue reading about Foxmarks

Andi Smith on September 2nd, 2008

Well, it happened. After all the rumours throughout the years - Google have finally released their own browser, and a lot quicker than we expected. Turns out the comic released yesterday was accidently leaked one day earlier than planned.

You can download Google Chrome from the website: http://www.google.com/chrome - what do you think?

For those who need guidance, there’s a list of Google Chrome’s features here (at the time of writing, the accompanying videos are unavailable):

http://www.google.com/chrome/intl/en-GB/features.html

And there’s a Google Chrome FAQ for web developers here:

http://www.google.com/chrome/intl/en-GB/webmasters-faq.html

Chrome’s rendering engine is WebKit, so it renders pages similar to Safari 3.1.

This page also details the tools available for developers: Web Inspector, Task Manager and JavaScript Debugger.

We’ll be following this story all week, so stay tuned for more as it develops.

Continue reading about Google Chrome Released

Andi Smith on July 23rd, 2008

Here’s a tool that’s not strictly to do with web development, but could be useful should you need to record a video demonstration with instructions on how a website works at any point.

http://www.jingproject.com/

Continue reading about Get with Jing!

Andi Smith on March 18th, 2008

If you’re keen on making sure your website code is perfect, then make sure you give the W3C’s HTML and CSS validator’s a try. These free web-based tools allow you to check whether your HTML and CSS files conform to the W3C specifications.

The W3C HTML validator allows you to check any online web page or upload an offline HTML page, and will return a detailed list of where your page does not conform to standards.

The W3C CSS validator can check that you have written valid CSS in external CSS stylesheets.

Finally, the W3C Broken Links report will check for any broken links.

If you’re HTML is in a mess (!!!), check out HTMLTidy, which is available both as a web based service and as a Firefox extension. HTMLTidy will remove any empty tags, correct simple errors and indent code nicely to make it more readable.

Continue reading about Validating Your Website

Andi Smith on March 13th, 2008

This week’s tech tool is actually a JavaScript file that makes loading Flash content onto your HTML pages incredibly easy.

SWFObject (or SWF Fix as some of you may still know it by) can detect the Flash plug-in for all major web browsers and is also very search engine friendly, degrades gracefully and creates valid HTML.

Flash Object

Click to continue reading “SWF Object”

Continue reading about SWF Object

Andi Smith on March 4th, 2008

This week’s tech tool, Fiddler, is an extremely useful tool to have around when reaching the final stages of creating  a website.

Fiddler is a HTTP Debugging Proxy which logs all HTTP traffic between your computer and the Internet. Fiddler allows you to inspect all HTTP Traffic, set breakpoints, and “fiddle” with incoming or outgoing data. Fiddler includes a powerful event-based scripting subsystem, and can be extended using any .NET language.

I myself have used it many times for looking at cookie data, finding out if a particular CSS file is loading, or seeing if any of my file paths are returning 404 errors.

Fiddler

Fiddler’s definitely worth a look, and at the price of free - how can you go wrong?! Check it out!

Continue reading about Fiddler

Andi Smith on February 27th, 2008

Ever wondered how you could speed up your web pages? Perhaps you feel you’ve tried everything but you just can’t nail down what is taking the time to load? Enter Yahoo’s YSlow, which is actually a plugin to another Firefox plugin - Firebug. YSlow analyzes web pages and tells you why they’re slow based on certain rules. For each rule your website will be given a grade along with an explanation of why your website received that grade so that you can focus on key areas to speed up your content. A detailed description of the rules can be found here.

YSlow

In the coming weeks, I’ll be looking into some of the techniques that can be used to speed up your website, but in the meantime, find out more information about YSlow here!

Continue reading about YSlow