Aardvark
Now here is a great extension for web designers and developers.
After installing the Aardvark extension, load a web page, right-click on the page, and click "Start Aardvark." As you mouse over elements on the page, you'll notice they have a red outline with a small tag and a class or id attached to it.
The following keys are active when Aardvark is running:
| W | Wider | Select a wider area. For instance, if you have selected a table cell, pressing W will select the table row |
| N | Narrower | Undo the last "Wider" command |
| Q | Quit | Quit Aardvark (that is, stop selecting elements), until you restart it from the menu |
| U | Undo | Undo the last "remove" or "isolate" command. |
| R | Remove | Delete the selected element |
| I | Isolate | Delete everything surrounding the selected element |
| E | Erase | Clear the element of all content, while fixing its dimensions |
| B | Black on white | Set the element (and all contained elements) to be black text on white background |
| C | Colorize | Sets the element's background to a random color |
| V | View Source | Shows the source code of the element (with indenting and color highlighting) |
| D | "De-widthify" | Removes any fixed width values from the element (and any contained elements) |
As you can see, the Aardvark is a web designers dream come true. After somone creates a prototype of a web page, you can delete certain items on the page to get a feel for what looks good and what doesn't. But don't worry. If you made a mistake, just refresh the page. You can also view the source of which class the designer used for that type of font.
I like this extension. I like it a lot. Designers and Developers can almost use the Aardvark as a primitive editing tool for web page design modifications. The Aardvark is one extension thats been in my arsenal for a week now and I don't think I want to part with it anytime soon.
Tools

RSS Links
Share