Safari Web Inspector
I use Safari as my main browser, but I always keep Firefox running as well because of the superior web development tools that are available for it. Safari is a bit lacking in that respect, though there are some options. However, the WebKit team are about to change that by Introducing the Web Inspector:
The Web Inspector lets you browse the live DOM hierarchy in a compact HUD style window, catering to the needs of web developers and WebKit hackers alike.
The Web Inspector highlights the node on the page as it is selected in the hierarchy. You can also search for nodes by node name, id and CSS class name.
To try the Web Inspector out you can download a WebKit Nightly Build, load a page you want to inspect, right click on the element to inspect, and select “Inspect Element”. This brings up the Web Inspector window (which in my opinion should be completely opaque, so I would like to be able to adjust the transparency). You can then browse the DOM tree and select any element you want more info about. The selected element will also be outlined on the page, complete with a very Web 2.0 fade-out effect for those of you like that stuff. Very nice, and very useful for debugging purposes.
There is more to do before this matches the fantastic tools available for Firefox, but this looks really promising.
- Previous post: Search engines and canonical URLs
- Next post: Setting font size in pixels