Popups have been existing on the internet for over a decade. And even though some people hate them, it’s a fact, they can’t be ignored.
Now something which can’t be ignored clearly has a huge potential to convert people, right? (*Yes it does*)
Keeping this in mind, I’ve jotted down 5 basic but often ignored elements of popup designs. These elements if done right have a huge potential to increase conversions. So read carefully..
#1 Craft Great CTA Buttons
The Call-to-Action button is the most important part of your web popup design.
The Call To Action text is the ultimate decider of whether the button gets clicked or not. Click To TweetStrategy:
Here are a couple of things to keep in mind to make your CTA more clickable:
- Use contrasting button colors
- Make button text appealing
Use contrasting button colors
Make sure your CTA button stands out. And a simple way of ensuring that is giving the CTA a color that completely contrasts the body of the popup.
Below are some good popup designs having contrasting CTA buttons:
Liked these designs? Get them within Icegram’s Gallery
Make button text appealing
If you only have one CTA button, make it sound as appealing as possible. Use positive words like:
- Get This Now
- Begin Download
- Reserve My Seat
Liked these designs? Get them within Icegram’s Gallery
In-case, you have two CTA buttons that’s a ‘YES’ as well as a ‘NO’, you must make the text on the NO button sound very regretful. This will make the reader think twice before clicking on the No button.
- No, I don’t like offers
- Nah, Not interested in traffic
- No, I want to let this go!
#2 Focus On The Typography
Which text was easier to read? Ofcourse, it was Text 2. Why?
Because – it did not stress your eyes. One glance and you knew the word in the picture was ‘Flourish’.
Strategy:
The above example clearly proves, why typography is extremely important when it comes to convincing customers.
If the font used in your popup is unreadable, the customer won’t make any attempts to understand it.
So it is very very important to pay attention to the typography you use in your popups.
Actionable Tip:
The thumb rule with typography is to keep it readable. Don’t go for over the top artistic fonts. Pick a beautiful font with clear alphabets and which is easy to read.
Additional Resource:
Use Google Fonts. You can type in your sentence and check how it looks. Once you are sure about which font you like, use it in your popup.
If you are an Icegram user, and you wish to change the default font. Here’s how to do it under 5 minutes.
#3 Decide The Position Of The Close Button
Yes, the close button can also be a factor that increases click through rates of your popup.
Wondering how?
Strategy:
- Make the close button difficult to click view
As shown in the example below, the close button is kept at the extreme top right corner. Making it very difficult to spot. So reducing the possibility of the viewer blindly closing the popup.
- Replacing the close button with a negative CTA button or secondary text
In this example, there is no close button. Instead you have negative secondary text -‘No thanks I don’t like free stuff’ which when clicked closes the popup. Now as the negative text is guilt inducing, a reader thinks twice before clicking on to it. Instead he is pushed to give his email id and end-up downloading the free ebooks instead.
- Eliminating the close button completely
This strategy may sound a bit pushy. As the reader is given no option but to click on the desired CTA. Here’s an example of how this strategy can be implemented.
#4 Pick Awesome Images
An image acts as an anchor in your popup. It’s no surprise that, even if you popup is well designed but the image used in it is mediocre, there are high chances that it might fail.
Similarly, even if you have simple popup with an attractive image, it might just work.
Strategy:
Use images which gain instant attention. Something with pleasing background, attractive people is a common strategy used by many. Checkout this example:
Liked this design? Get it within Icegram’s Gallery
#5 Include Your Brand
It’s important to blend your popup design with the rest of your website. The reason being, it should look like a part of your website. If it doesn’t, visitors will assume it’s some spam and simply close the popup or abandon your website.
Strategy:
Keep in mind the brand color, brand logo while making your popup design template. Suppose your brand color is blue and yellow, you can design a popup having a similar color scheme.
A few examples are listed below-
Liked The Popup Designs You Saw? Here’s A Surprise
All the popup designs templates shown above you could yours – IN JUST A CLICK!
They are available within Icegram’s Gallery. So if you are an Icegram customer, simply go to the Gallery and start using them right away.
If you don’t have Icegram, download it now.
More Designs From Icegram’s Gallery
Liked these designs? Get them within Icegram’s Gallery
It’s Your Turn
It’s a wrap. Implement the strategy or simply use the popup designs from Icegram’s Gallery and start doubling your popup conversions right away. If you have any questions or suggestions, feel free to mention it in the comment section below.
Great post, thanks for share it.
Thank you for your kind words 🙂 Glad you liked it.
Wow, awesome guide to pop up design. This is one of the best guide so far.
Thanks
Can u tell me how can I open the popup by clicking on any text in website?
Hi Komal,
Please check this to open popup by clicking any text in website – How to Trigger Icegram Messages On Button or Link Click
Try it and let me know how it goes for you 🙂
where do I find the subscriber list if I am using icegram popup for subscription?
You need to use a mailing list system or our Rainmaker plugin to store subscribers. You can use our free Email Subscribers plugin, or a third party mailing list service – like MailChimp. Your subscribers will get added to the service you use.