It is often useful for web-designers and developers to be able to measure a distance in a web-browser, either for design or locating a bug. Unit is a JavaScript bookmarklet which allows you to obtain the distance between any two points on a page.
Usage
Using Unit is extremely simple:
-
Drag the Unit link below to your bookmark bar (or add it to your bookmarks by right clicking the link and selected 'Add to bookmarks/favourites'):
- Load any web-page you want
- Click Unit in your bookmark bar
- Click on the two points you wish to measure the distance between on the page
Have you ever held a piece of paper up to a web-page on a screen and marked off a particular measurement, to get some idea of the distance between two elements (particularly when trying to chase CSS differences between browsers)? I often find it exceptionally useful to measure the distance between two particular elements, and this is exactly what Unit is designed to do in a simple and fast manner.
Usage
To use Unit, load the JavaScript bookmarklet by following the instructions above. The simply click and drag between the two points you wish to measure the distance between on the page. A triangle with measurement rulers will be drawn over the page indicated the area being measured, and the Unit information panel will be updated with the measurement information. To then make a new measurement, click and drag on the page again.
Unit can be used in a similar manner to traditional desktop design tools for measurement, by holding the shift key to force the measurement to be on the horizontal, vertical or diagonal only. Releasing the shift key will allow Unit to resume its free ranging measurements.
Supported browsers
The following browsers are supported in Rule:
- Internet Explorer 7
- Firefox 2+
- Safari 2.0.4+
- Opera 9.2
These are exactly the same as Grid, and there is no IE6 support for exactly the same reason as before.
Revision history
Version 2.0
- Redesigned the interface to be click and drag
- Added 'shift' key detection for angular measurements
- Dropped the node information display (this is the realm of the outstanding XRay!)
Version 1.0
Settling Yet another outstanding post from Seth Godin. On the path we travel we settle for mediocrity. If you want to excell at anything - do not settle!
Opera Unite Thanks to Opera, now everyone can have their own little web-server. Interesting idea, although it is sure to attract attention from the RIAA etc
A reason for everything Excellent words from Jack Moffett. A designer (or developer) should be able to give a reason for everything that they do. Otherwise they are doing it wrong.
Mega downtime I am very sorry to say that I was caught up in the attack on VAServ over the week - which is why all my sites were down. However, all back now and kudos to Rus and his team for getting it sorted in the manner than they did.
American Airlines redux This is an interesting saga. Dustin Curtis did a redux of the AA site, and received a reply from an AA UX designer. The problem with the AA site? Top level management basically. The designers and developers are obviously very capable.
Zune HD - IE6 Oh my! The Zune HD (when it ships) will comes with a "version of IE 6 that has been highly customised and optimised for multi-touch". Please no - just when IE6 was looking down and out.
If you find the software on this site useful, and/or enjoy using it,
please consider assisting my beer fund as a way of thanks!.