Evidence #69: Anchors Vs. Modals

Thanks to Justin Rondeau from digitalmarketer.com for sharing Evidence Test #69. This experiment contained a simple change in how the calls to action behaved. In the control, the buttons were anchored to the form below. When they were clicked, the screen shifted downwards to the form (or didn't when the user was already at the bottom of the screen). In the variation, the buttons launched an instant modal window.

What Can We Learn From This Test?

The variation showed a possible +6.3% increase to leads being generated. I think was might have been caused for two reasons:

  • Scroll Position Changes Might Be Confusing

    Clicking on anchor links shifts the scroll position of the browser. Perhaps this confuses people as they try to recover of a such a shift. After a scroll change (performed by the browser and not the person), people may wonder what is the next element, headline or copy that they need to focus on next.

  • Lack Of Feedback

    If the anchored element (the form) and the buttons are in proximity and close to the bottom of the screen, there may be no change whatsoever. Clicking on the links does nothing, since the user is already at the bottom of the screen. This results in an action with no feedback.

  • Any Other Explanations? Share Your Comments Below


  • Odd-Wiking Rahlff

    Odd-Wiking Rahlff 6 years ago 10

    Interesting case.

    I guess the unpredictable automatic scrolling takes away the feeling of control the user has and thereby also loses whatever trust the user has of the site. The lightboxed dialog however presents and focuses on the minimum amount of input needed to actually get the worksheet with no fuzz and unneeded screen movements.

  • Jonathan

    Jonathan 6 years ago 10

    I think what you have is good. I do also believe because the user moved on the the modal there might have been some sense of progression. The action becomes much more focused as well without all those distracting elements on the original page.

    • Jakub Linowski

      Jakub Linowski 6 years ago 00

      Could very well be. Thanks for the observation.

  • Tomaz Hocevar

    Tomaz Hocevar 6 years ago 10

    A possible explanation for modal window would also be that you get rid of the clutter by shadowing the background content and focusing only on the form.

  • Tomaz Hocevar

    Tomaz Hocevar 6 years ago 10

    Hey Jakub,
    do you know how many leads were generated through each form under the Variation (B). If I understood correctly, user had both options to opt in - either by pressing the button or scrolling down when reading the page and at the end fill the form at the bottom?

    • Jakub Linowski

      Jakub Linowski 6 years ago 00

      Hey Tomaz. I don't think the test measured completions for each form separately for var B. Only the totals for A and B are shown at: http://www.goodui.org/evidence/test069 Would have been interesting to know.

  • Edwin van Oostrum

    Edwin van Oostrum 6 years ago 00

    Hi Jakub, thanks for this! I can see this for desktop indeed but what would be the outcome for mobile? Anchoring or using a modal? Screen estate is obviously less than on desktop meaning that chances are higher that the form sits below the viewport which results in scrolling (aka the user experiences movement and lands on the form area).

    • Jakub Linowski

      Jakub Linowski 6 years ago 00

      Hi Edwin. A desktop vs. mobile segment would definitely be great to analyze. Unfortunately the test didn't come with that data. Sorry.

  • zixin

    zixin 6 years ago 00

    I think it makes great sense that modal works better than anchor on a desktop site. But I was wandering if the opposite is true on a mobile device? I havent experienced good modal experiences on mobile devices, and the second "Lack of feedback" issue wont happen then.

  • Matej

    Matej 6 years ago 00

    Hey Jakub, thanks for a great test! Really insightful.

    I do have some feedback regarding this page, though! I wanted to share this page on twitter AND linkedin. I clicked the twitter button and was lead to a share page, yes, but not in a new window. The title of your post wasn't edited in the tweet to make it appealing (didn't contain hashtags, for example), and the twitter share page opened in the same window as your article. Which lead me to complete my twitter share and forget about the linkedin share. I didn't want to click 3 pages back to find your article to share it again on a different network. If it had opened in a new tab, that would have been more convenient and I assume would result in more shares from people that really like an article. My two cents ;)

  • Mario Lurig

    Mario Lurig 6 years ago 30

    I wonder if it was using a JS smooth-scrolling to make it more guiding for the top-most click, I think having that vs #anchor clicks would make a difference (also using .focus() on form fields).
    Secondly, I think you're 100% right that it's based on the distance between the 2nd click and the bottom, preventing your click from DOING anything, thus the modal is better for rewarding customer behaviour with focus.

    I'd love to see a new variation with smooth scroll to bottom on 1st button, and modal on 2nd button, compared to the variation here (modal on both). I think we'd find no significant difference.