How To Important

Make your hyperlink interactive

Hyperlinks are boring, they only perform one task i.e. take you to new page. Is that what you always need?

Why interactive hyperlinks?

On one of our web property (ziffy.in) we wanted to have a way where we can transfer the visitor to a new page e.g. to a page where we can describe the service or plan more effectively but if we use a normal hyperlink then there are chances that the visitor may not share his contact details and leave the website before even we can understand his requirement. Believe me or not many of the times website visitors may get confused with all the offering you have and ended up in leaving the site before making any decision.

So to solve this problem we added interactive hyperlinks on scrap.me.

How does interactive hyperlink works?

Actually it is a very simple solution. What we did is added a new attribute to the hyperlink, which open ups your contact form and once the user filled the form he will be transferred to his desired location.

With this method you can also turn any hyperlink in to a popup form action button i.e. by clicking on the hyperlink user will be presented with a contact form instead of taking them to new location. But when a non-javascript client visits your website it won’t feel any difference (I meant search engine bots).

How to enable it?

Just with one additional attribute you can turn your boring hyperlink in to an interactive hyperlink. Following code first open the form and on successful completion it will redirect the page to scrap.me.

<a href=”http://scrap.me” scrapme_redirect_url=”http://scrap.me”>Click This</a>

If you don’t want to transfer the control to another page then replace scrapme_redirect_url value to “NA”.

<a href=”http://scrap.me” scrapme_redirect_url=”NA”>Click This</a>

Above code won’t transfer the control but will open a contact form.

[retweet]