Free Newsletter Growth Strategy #1

Autofocus your signup form for better conversions

Oct 14, 2020

Welcome to the first ever Grow My Newsletter free article!

Let’s kick things off with a surprisingly powerful tip to turn a lot more of your website visitors into newsletter subscribers, courtesy of Pete from the No CS Degree newsletter…

👇 WHAT

Guide your website visitors’ attention to your newsletter signup form, by setting the email input field on the signup form to autofocus when the page loads.

That way, when a visitor shows up on your page, the signup form is already highlighted and the cursor is blinking. Ready for them to enter their email.

👇 WHY

What do the following things have in common…?

… your latest article
… TikTok
… Twitter
… a cute dog playing in front of your office window

The answer?

… they’re all competing with your newsletter signup form for your website visitors’ attention!

Autofocusing that signup form on page load is an effective way of grabbing the visitor’s attention and directing it to your signup form. So they don’t get distracted.

And fewer distractions means a higher conversion rate. Which means more subscribers.

But how many more subscribers?

Well, when Pete from No CS Degree switched his main signup form to autofocus on page load, he saw a 4x increase in conversion rates after a week!

See it in action here…

👇 WHAT RESULTS YOU CAN EXPECT

I don’t expect anyone to be able to replicate Pete’s 400% increase in conversion rates. That seems very, very high to me.

But I’ve since put this trick into action with two of my consulting clients’ newsletter signup pages…

And they saw conversion rates increase by 6% and 23% respectively!

Not bad for a tweak that only takes ~5min and costs nothing 🎁

👇 HOW TO DO IT

You probably only want to do this on your ‘main’ signup page. With your ‘main’ signup CTA.

If you have access to edit the form code itself, adding the autofocus tweak is quick and easy thanks to HTML5.

In your form code, find the email input field and add the autofocus attribute directly after the word input.

For example, if your form originally looks like this…

<form>   
     <input type="email">   
     <input type="submit"> 
</form>

Then you’d add the autofocus attribute to the email input field (only!) like this…

<form>   
     <input autofocus type="email">   
     <input type="submit"> 
</form>

That’s it!

What if I don’t have access to tweak my signup form’s code directly?

In that case, it’s a bit more complicated.

The best bet is to ask a developer friend to help you (shouldn’t take them more than 10-15 minutes).

Otherwise, you can add the following script to the page your main signup form appears on…

<script>
  window.onload = function() {
    document.getElementById("changeMe").focus();
    document.getElementById("changeMe").scrollIntoView();
  }
</script>

⚠️ Warning: This will only work if your email input field has an ID, and you swap out both instances of changeMe in the code snippet above with that ID.

👇 WRAP UP

There you have it… an easy way to significantly increase signups, for free, in just a few minutes!

Thanks again to Pete for discovering and sharing this trick.

Are you planning on giving it a go?

Reply to this email (or hit me up on Twitter) with your page (and/or results), and I’ll share them in next week’s free article!

Here to help,

Louis

Grow My Newsletter