5 Reasons to Turn on Debug in Safari

Not many people know that you can turn Safari into a powerhouse browser with a simple terminal command.  Use the following command to turn on the debugThe Safari Debug menu option menu in Safari:

defaults write com.apple.Safari IncludeDebugMenu 1

With this on (run the same command but swap the 1 for a 0 to turn it back off), and Safari restarted, you’ll have access to the Safari Debug menu.  This opens up a world of opportunity for those in the know, and below I’ve picked the top 5 features this opens up.

  1.  View pages in other browsers – Under the Debug menu, there’s an item called “Open Page With”The Safari Open Page With Option which allows you to quickly open up the current page with any of the other browsers installed on your machine.  This is particularly usefull if a site doesn’t work correctly in Safari or, for the web designers out there, you’re currently testing a new site.
  2. Fake it – For some reason, there are certain sites that won’t let you view their content in certain browsers.  This goes beyond putting a warning on the site alerting you to possible rendering issues, some sites will not let you in.  The UK’s National Lottery site used to mandate IE usage, despite the fact it worked fine in FireFox.  The reasoning is completely beyond me.  So, in steps Safari.  Through the User Agent option you can make websites think you are using a different browser.  These include 2 versions of FireFox, Mac IE, various versions on Netscape and, horror of horrors, Windows IE.  It won’t prevent rendering or functional issues, but it may get you through the front door.
  3. Get a new view on a page – If you’re a developer, this may interest you.  Safari has some very powerfull tools built right in for inspecting the structure of the page.  These include a web inspectorThe Safari Web Inspector and a render tree.  The render tree is pretty self explanatory, the web inspector is where it’s at.  This is such a cool little tool.  Essentially, it lets you search for a piece of text or element/node and view lots of very usefull information about it, such as it’s dimension, styles and properties.  As you can see from the screenshot to the left, it looks insanely cool and also helps you out by highlighting where the element appears on the page.  It reminds me a bit of the X Ray feature in the excellent CSSEdit, but with a bit more style.
  4. Learn Basic HTML Safari Snippets– I can only really come up wih one reason for this feature, Apple wants you to learn some basic HTML.  Under the debug menu, you’ll find something called Show Snippet Editor.  If you select this, a window will appear with 2 panes and two buttons.  Within this window, you can input marked up text in the top window, click one of the buttons, and see Safari-Rendered text below.  You can do this for either HTML or Rich Text (RTF).  So, get a list of HTML tags and figure out what they all do.
  5. Get a list of Keyboard and Mouse shortcuts – This isn’t something I expected to find in the debug menu, I have to admit.  If you select Keyboard and Mouse Shortcuts a new Safari window appears with a list of all the shortcuts currently assigned.  Which is brilliant.  If you don’t want to turn on the debug menu, you can access this list at the following URL, file:///Applications/Safari.app/Contents/Resources/Shortcuts.html

Has that tempted you to dip your toes into the Safari debug menu?  For me, the web inspector alone is a great little utility and worth it’s weight in gold.  In fact, I may consider writing up an article on how to use it efficiently.  Any other Safari tips I’ve missed?  Drop them in the comments below.