Occasionally confused by Gmail

I had a bizarre problem the other day – well, these things are always bizarre when you don’t know the reason or solution – with Gmail.

Whenever I put 10am in an email, it would hyperlink it to http://10.am/ which brings up a slightly random website.

10.30 a.m. would be fine, as would 11pm, etc

Turns out, Gmail was doing it’s usual autolinking, like it’ll do to “example.com”: little did I know that “am” is actually a legitimate domain identifier, and it was reading my time as a domain name!

Firefox, Web Development plugins and Joe public – part 2

In part one of this post, I look at the Web Developers Toolbar, an essential firefox addon.

This time round, I think it’s worth a look at Firebug. Firebug is aimed more at what I would call ‘realtime’ debugging – it has a definite emphasis on Javascript, DOM manipulation etc.

For Mr/Mrs Joe Public, all this is beyond the realms of comprehension, but it does have one particularly useful function which shows the time used to get/parse the various files and elements which make up the page.

Firebug Screen

In this screenshot you can see the various CSS files, JS files, and the loading times associated. At the very least, this can help show a client where the issues in a page are, and why any page may be slow loading.

It also helps demonstrate what happens when you load an enormous image, and then resize it in the browser (rather than using Photoshop’s Save for Web command).

Firefox, Web Development plugins and Joe public – part 1

The general public are often mystified by how a webpage actually works. Sure, you could explain HTML, CSS, Javascript and Server side scripting to them, but you’ll often be faced with a pair of glazed over eyes and a puzzled expression. Normally, this is a sign you’ve said a switch off keyword like ‘parse’, or better still, some seemingly secret code like ‘ISAPI’.

I find that a good visual aid is often enough for people to make the link between what they’ve scribbled on the back of a napkin, and a working proof of a website.

Enter Firefox. Apart from being one of the best browsers out there (alongside Safari and Opera), it has an excellent range of plugins to visually represent the structure and layout of a website.

The main one I use (and use every single day, if not every time I even open Firefox), is the firefox Web Developer addon. If I’m actually showing someone how a website is put together, this is invaluable.

Take this site for instance; one click is all it takes to view the block elements, CSS classes, etc.

See these screenshots for a quick example:

screenshot for Web developer toolbar

 

Basic block elements

screenshot for Web developer toolbar

 

CSS Styles in place

screenshot for Web developer toolbar

 

Block level elements

Next up.. firebug