How to view HTML source in Safari And Firefox

If you’re a Linux and a Mac OS X user, like I am, chances are that you tend to stick to the same browser in both the operating systems, maybe because you’re familiar with it or maybe because you just like that one browser. In my case, that’s usually the Mozilla Firefox browser. While I have both Chrome and Firefox installed on both my machines, I still tend to come back to Firefox always. Anyway, I digress.

I’ve been using Firefox to debug and display a ruby on rails app that I’m working on and it was going fine till I decided to use Safari for the same work, because I thought I should test in both the browsers.

Now, if you’ve developed any HTML based app before, you’d know how important and useful the “view source” function is, that any modern browser incorporates. HTML is a simple markup language and mostly you can just debug your markup by just looking at the browser UI, but sometimes, especially when you’re dynamically generating content and pages, as in case of Ruby on rails, you need to view the source to figure out what’s happening.

On Firefox, you can view the source of the current page but clicking on Tools->Web Developer->Page Source.

View source in firefox

when I moved to Safari, though, I couldn’t find a developer menu at all. In fact, I couldn’t find any way at all to view the page source. Now I like Safari as a browser and Mac OS X is really a wonderful operating system, but Apple sometimes really does take things too far when it comes to making their products user friendly. Sure, regular users don’t like the view the source of their web pages but what’s the harm in having an option to do that.

Anyway, the way to view the HTML source of pages on Safari is to enable the developer menu.

Click on the Safari menu and select Preferences. Go to the Advanced tab. Now, check “Show Develop menu in menu bar” and close Safari’s preferences. At this point, you will have a new menubar item, named “Develop“.

Safari develop menu

Click on Develop and select “Show Page Source” to view the source code of the current page.

Have anymore Safari tips to share ? Share with me through the Contact form or in the comments below.