A few weeks ago I was working on the company website of my mom, http://www.detwist.nl. I had already made the site responsive, which was a huge step forward since nearly 24% of her visitors view her site on a mobile device. But I wanted more…
For most company websites the leads (prospects) come in via forms. Which is an excellent way for contacting a business when visiting a site from a laptop or desktop computer, but it doesn’t feel ideal on a phone. Especially on touch screen phones like the iPhones, Androids and even Windows and the latest Blackberry devices, typing should be avoided unless absolutely necessary.
Even though mobile sites and RWD (responsive web design) are becoming increasingly more common, we tend to focus just on the readability of the content on a mobile device and ignore the usability. And it’s the usability that makes the visitor like you as a person or as a company. It means you’re not just pushing your products or services by squeezing it onto a smaller screen – it shows that you care about your customers.
A great benefit that mobile phones offer is – and this one gets a bit ironic – that it actually is a phone. You can make phones calls from a smartphone. So why would you present your visitors an extensive form to fill in and maybe show a phone number that people can try to memorize or maybe – if they figured out how to copy and paste – copy it into the dialer, when you can just integrate that action directly from your site?? A simple tab on the screen should be enough to place a phone number directly into the phone’s dialer right?
So with that in mind I picked up my mobile phone and started thinking how somebody would scroll and navigate across the site. How do you hold your phone and where do you keep your fingers? I noticed that when I’m reading an article, I am generally holding the device in my right hand (I’m right handed so this is likely the opposite for left handed people). Then I’m navigating through a site, my phone generally lies in my left hand and I’m tabbing and sliding the screen with my right hand. This means that in either situation it would be very easy to tab a button in the bottom right corner of my screen.
And that’s where the Call Now Button was born. A simple piece of code, mainly css, that triggers a call button to appear in the bottom right corner of a mobile device that supports CSS3 (which includes all popular touch screen devices). For responsive websites (the types that adjust to the size of your screen) this button will automatically appear on small screen devices and hide on desktops, laptops and tablets.
And because your visitors are king, do keep your forms as well so they will have the option to choose the contact method that they prefer.
I’ve created 2 ways for you to implement the call now button into your website. If you’re running a WordPress powered website you can add this by simply installing the Call Now Button plugin which you can find directly within the plugins section of your dashboard.
The still super simple alternative is to generate your code on http://callnowbutton.com and paste that into your website just under the openingtag. That’s all there is to it. Good luck and please leave a comment and let me know what you think!