Awesome feature for Safari 4 users

  • 3
  • Idea
  • Updated 10 years ago
Hey Guys,

Forgive me if you know this already.
This is more of a useful tip than an idea, if you're using Safari 4 you might find this helpful when diagnosing problems you have found when viewing your site live or when you want to analyze certain behaviours of the components of your site.
While I think people who aren't that comfortable with web development yet should maybe take a raincheck on this until they are, there is a feature I want to point out.

There is a "Develop" menu that can be activated through the Safari> Preferences dialog box. Once the Develop menu is active you will see it amongst the rest of your menu options on the menu bar.

Two features that are contained in this menu offer amazing functionality.
1."User Agent"- here, you can select the engine characteristics of the browser you would like to see your page load in. Check it out..
2."Show Web Inspector"- if you know what you're doing, this is super helpful.
- you can edit HTML and Stylesheets live in the browser (original files on the server are not altered)
-you can check out the "Resources" tab which will tell you a whole lot about how each element loads on your page.

Anyway, there's lots more. The screen shots below should help.
If you don't have Safari 4.. download it here

Again, this might not be that helpful for those just starting out.


Photo of Dre


  • 9 Posts
  • 2 Reply Likes
  • loving this

Posted 10 years ago

  • 3
Photo of Marije

Marije, Official Rep

  • 4636 Posts
  • 237 Reply Likes
Wonderful - thank you Dré! I'm going to check it out...
Photo of Connor McCarra

Connor McCarra, Champion

  • 944 Posts
  • 47 Reply Likes
Very useful, I would love to use Safari but it doesn't look the same on Windows as it does on Mac.

There is also a Firefox add-on called 'Web Developer' which is very similar to this. Here'sthe link if you would like to download it. I use it very often and it's quite useful for troubleshooting and also learning by looking at the css of other sites you like the design of to see how it's done.