Web Inspector quickly inspect element

keyboardsafariweb-inspector

How do I quickly inspect an element using Safari's Web Inspector, preferably by keyboard shortcut?

Expected functionality

In Chrome, command+shift+c enables the function and the mouse then selects an element.

How things work in Safari

In Safari, the same combo seems to work, but only if Web Inspector is selected. Here are some example scenarios:

  1. Web Inspector is not open. Pressing command+shift+c does nothing.
  2. Web Inspector is not open. Pressing command+option+i opens and selects Web Inspector, so following up with command+shift+c enables inspection mode.
  3. Web Inspector is open, but user has interfaced with web site and Web Inspector is not selected. Pressing command+shift+c does nothing and pressing command+option+i closes Web Inspector.

Best Answer

Right-click an element, then choose Inspect Element. This opens the developer tools and selects the element in the DOM. This can be scripted with Automator/Keyboard Maestro/etc for activation with a keyboard shortcut if you wish.