Most resources suggest using onclick handler with trackEvent() for tracking outgoing links. BUT this way does not work with all navigation methods! It won’t work if you click with middle button (except Chrome) or control-click (except Chrome and FF) to open new tab, if you right-click and select new tab or window from context menu or if you drag link to another tab. Is such cases onclick is simply not called. You can check it with very simple link:
<a href="http://www.google.com" onclick="alert('GO');">GO</a>
Putting JavaScript in href attribute breaks the link in all cases when new tab or window is opened.
Putting onclick in span that looks like a link, will not allow users to decide if they want to open in new tab or not.
Finally, going through a redirect page, which tracks outgoing event, causes problems with back navigation – when users try to go back, they get back to the redirect page and then JS again redirects to the destination page. They need to click back twice … quickly.
Is there a better way, which would be both accurate and user friendly?
Context menu can’t be detected by using JS. So if you want to catch that you need to use the redirect method. To fix the back button problem, redirect using
location.replaceto remove the tracking page from the back-button history.