Google Sheets Integration with FormKeep


Google Suite apps are the next big thing. Many people base their entire workflow within the Google Suite apps. The live editing features of Google Sheets makes it the go-to choice for teams collaborating on projects. Now imagine being able to see updated form stats and submissions without ever having to leave the Google Suite. All of your workflow in a single place! FormKeep’s latest integration with Google Sheets makes this possible in only a few steps.

Quick Integration Setup Video


All of Your Submission Data In One Place…And It’s Updated Live

FormKeep’s Google Sheets integration gives you all your submission data in a single place. All of the latest submission data from your forms is at your fingertips and can be accessed with ease. By linking your FormKeep account to a Google Sheet you will completely cut out the tedious steps of logging into your FormKeep account and refreshing the page to see your live form submission data. With the Google Sheets integration there’s no need to export to an external spreadsheet. All the data you need will funnel straight into your Google Sheet in real time! As the form owner you have full accessibility to customize which form data goes into your Google Sheet and where in the sheet it sits. Watch the video above for a full guide to rearranging form data in your Google Sheet.

Form Data with the Google Sheet accessibility you love

We launched a Google Sheets integration with our tool because we love the accessibility of Google Sheets. As the sheet owner you have the option to give your team full editing access to change form submission data and arrange where the form data comes in. However, you can also choose to only give your team the “read-only” permission so that they can see the form data live but cannot edit the location of output or the form data itself. 

A Match Made in Heaven

FormKeep is the best way to collect data from online forms without the hassle of running your own servers. Static sites using Jekyll, Hugo, Gatsby, or GitHub Pages can easily collect data from HTML forms, save the data here on FormKeep and also sending it over to Google Sheets for additional processing.

Setup in a Few Simple Clicks

Connect your Google account and you can send your form submissions directly to any Google Sheet. Set headers in the sheet to match the names of the submitted data. See the Data Integrations tab under each Form to select which Google Sheet tab to append submissions. Only non-spam submissions will be sent.



Slack Integration with FormKeep

FormKeep’s latest integration with Slack makes staying on top of form submissions and maintaining strong communication with your team easy!

After integrating FormKeep and Slack, new responses are sent straight to the Slack channel of your choice. The integration allows for easy pairing of specific forms and Slack channels, ensuring that the right people see the data submitted from your website.

With FormKeep and Slack, you’ll be able to

  • Send form responses to multiple channels and teammates
  • Select if you want the form fields to appear in your Slack message
  • Easily search Slack for form submissions

Slack Integration Video

How Teams use Slack with FormKeep

Customer Support

FormKeep’s integration with Slack allows for live notification the moment a customer needs help. Additionally, you can choose to see the content of the support form in the Slack channel of your choice. As a result of these features, FormKeep’s latest integration with Slack ultimately leads to a better customer experience. After all, one of the most prominent characteristics of a good customer support team is consistent timely responses to support requests.

Managing Feedback

Understanding where your product can improve is vital to the expansion and success of that product. Setup a form that prompts users to review your product and provide valuable feedback. Attaching a Slack channel to this form will give you access to live feedback, directly from your customers, about what could be added to your product. Being responsive to customers who are willing to share their opinions about your product adds to your brand image.

Easy Setup

Connecting your form to Slack easy to configure and control!

Important Data to the Right Place

If your team is already working in Slack, having to go to another system to check submissions breaks workflow. Bringing another data source into the original channel removes the hassle of switching between systems.

How to Create Better WordPress Forms Without a Plugin

Introduction

The WordPress repository has thousands of plugins, which you can use to extend the functionality of your static WordPress website. For example, there are several plugins that you can use to create forms and harvest user information.

However, the WordPress plugins are cumbersome to manage and, frequently, deny you the control to build things from scratch and create products that best resonate with your needs and preferences.

In this blog post, we’ll talk about how to ditch plugins and create better WordPress forms using FormKeep.

Why Minimize Plugins on Your Static WordPress Site?

Plugins are the lifeblood of most WordPress websites and blogs. They allow you to add custom features so that you can enhance the functionality of your site to suit your specific needs.

However, as much as plugins are important, they can lead to poor performance for your WordPress site. Therefore, it makes sense to look for ways to add features without relying on the plugins when you can.

Here are some reasons why you should minimize the number of plugins on your static WordPress site.

  • Slow performance: Each plugin you introduce adds its own code and files to your WordPress database, which could slow down your site’s performance and increase its memory requirement.
  • Complicates management: Managing too many plugins on a WordPress site is cumbersome. You need to update the plugins constantly to keep them up-to-date. Furthermore, plugins can conflict with each other, and make your website to crash. Therefore, keeping to fewer plugins can assist you in quickly troubleshooting any issues with your site.
  • Exposes security risks: Some WordPress plugins are poorly coded or are not updated frequently to seal security loopholes. Since the risk increases every time you install a plugin, reducing the number of plugins could decrease the exposure to security vulnerabilities.

How to Create a Form Without a WordPress Plugin

As much as WordPress plugins let you create forms quickly and easily, some developers and designers are looking for unique customization options that suit their expectations.

For example, the plugins do not come with fine grain control options that support extensive modifications to suit the varied needs of users. As such, they opt to create WordPress forms without relying on any plugin.

Here are the simple steps for adding an HTML coded form on a WordPress page:

After logging into your WordPress dashboard, select Pages and click Add New.

  • Give the page a suitable title, like “Contact Us.”

  • Add a Gutenberg custom HTML block and write the code for your form.

If you are using an old WordPress version without the Gutenberg HTML block, you can click the Text tab and start writing the code for your form.

For example, here is the code for an HTML form we wrote to capture users’ data without using a WordPress plugin.

See the Pen
WordPress HTML Form Example
by Alfrick Opidi (@jasoya)
on CodePen.

When the coded form is published on a WordPress page, the resulting output is more flexible and robust than what you might get from a form plugin and, importantly, you maintain the simplicity, security, and manageability of a WordPress site with one less plugin.

Clearly, when creating a WordPress form without a plugin, the possibilities are limited only by your imagination and ability to propel yourself beyond your design boundaries.

If you intend to create better WordPress forms using custom code, it is essential that you specify the place to POST the submitted data for storage and processing. See below for more details.

Though WordPress plugins allow you to send the data to an email service, using a versatile tool like FormKeep offers a comprehensive and resourceful way of handling the collected information.

Limitations of Plugins to Create WordPress Forms

Even if WordPress plugins provide an easy way to create forms, they come with lots of limitations, which may impair the forms’ intended purposes.

Here are some limitations of using plugins to create forms on WordPress.

  • Inflexible customization options: Most WordPress forms plugins do not give you the complete control of creating something that reflects your tastes and preferences.
  • Difficulties in handling lots of data: Most of the plugins for creating forms allow you to provide an email address where the user submitted information will be sent. If you have a lot of submitted data, relying on an email service to process and manage the data becomes difficult.
  • Integration with third-party applications is not supported: Most of the forms created using plugins do not support integration with other external tools. This way, it becomes difficult to pass the form data to other third-party tools for enhanced processing and management.
  • Prone to security flaws: Since many developers rely on WordPress plugins to enhance the functionality of their websites, this has made the plugins a prime target for computer hackers. If a security loophole can be found on a plugin, it can simply be extrapolated to affect multiple websites.
  • Compatibility issues: The WordPress platform is often updated frequently. And, some of the plugins’ developers are unable to keep with the frequent updates and change their codes accordingly. As a result, this often leads to compatibility issues between the WordPress platform and the plugins. Furthermore, some of the plugins conflict with each other and lead to malfunctioning of WordPress sites.
  • Reduced performance: Installing several plugins to create forms and complete other actions may weigh down your WordPress site and affect its performance and speed.

Create Better WordPress Forms With FormKeep

FormKeep makes it easy to overcome the limitations of building WordPress forms using plugins. The tool is built with the needs of developers and designers in mind, and it will assist you to make the most of the collected user data.

Here are some benefits of using FormKeep to process and manage the form data on your WordPress website.

  • Exert full control of your forms: Unlike most WordPress plugins, FormKeep lets you customize your forms and design them to suit your specific preferences.
  • Better processing of form data: Whether you have lots of submitted data or not, FormKeep has many ways of helping you to process and manage the data without solely depending on an email service. You can use FormKeep to export form data in CSV format or use its developer-friendly JSON API to access the submitted data easily.
  • Heightened security: FormKeep uses the latest state-of-the-art cloud technology to provide optimized security to form data. What’s more, the tool has a sophisticated spam filter that assists in keeping your inbox clean and pristine.
  • Minimal maintenance requirements: With FormKeep, you’ll not be required to make frequent changes to stay updated with the latest version of WordPress or to constantly jump into your code to solve some compatibility issues with your other WordPress tools.
  • Improved performance: Creating a customized form using FormKeep allows you to avoid uploading unnecessary code to your WordPress website, which leads to enhanced performance.
  • Availability of extensive integration possibilities: FormKeep integrates flawlessly with several third-party tools. Therefore, you can conveniently manage the submitted form data and make the world to spin in your favor. For example, since FormKeep supports Zapier integration, you can confidently share your form data with more than 1,000 applications, including Mail Chimp, Slack, Constant Contact, Google Gmail, Salesforce, or HubSpot. Here is a screenshot of the Zapier website showing some applications that integrate with FormKeep.

How to enhance WordPress forms with FormKeep

To create better WordPress forms without relying on any plugin, you’ll need to write your own custom HTML form and then connect it to FormKeep.

As we illustrated in the earlier example, when uploading custom forms on the WordPress platform, it is important that you state where to POST your collected data—and this is where FormKeep saves your day!

To connect the HTML form to FormKeep and benefit from enhanced data processing and storage capabilities, you’ll need to add your FormKeep credentials in the action attribute of the custom form.

For example, here is how we included the details in the earlier example.

<form accept-charset=”UTF-8″ action=”https://formkeep.com/f/exampletoken” method=”POST” target=”_blank” id=”wpform”>

Your opening form tag should correspond to the above example. Remember to edit the exampletoken with the token credentials you were given after opening a FormKeep account. You can sign up for a FormKeep trial account and start using the free tokens right away.  

After connecting your custom HTML form to FormKeep, the submitted data will be forwarded securely to your FormKeep account. Consequently, you can implement data integrations with external tools, export the data to your preferred destination, view form submission reports, and carry out other activities.

Wrapping Up

Creating forms with WordPress plugins is fantastic and can save your time. However, using this shortcut can negatively impact the performance of your WordPress website.

Forms created using plugins are incapable of handling voluminous data, expose the website to security vulnerabilities, and cause other problems to WordPress sites.

FormKeep is an innovative tool that grants developers and designers the complete control of their forms. With FormKeep, you’ll get increased security, extensive integration capabilities, and several other better ways of processing and managing form data.

Do you want to learn more about using FormKeep?

Then, click here to go to the Interactive Form Demo environment.

If you have not tried FormKeep for building wonderful WordPress forms, then you need to give it a try today!

If you need any help on using FormKeep without depending on plugins, feel free to contact our friendly developer team at support@formkeep.com.

Podcast: Go Deep on FormKeep and Furious Collective’s Venture Production Model

This week thoughtbot featured Furious Collective in their weekly podcast called Giant Robots Smashing Into Other Giant Robots.

In this podcast, David Kloba & Rob Meinhardt, Co-Founders of Furious Collective, discuss the mindset and methodology of their venture production studio, recount their adventures over the past year of growing FormKeep after having acquired it from thoughtbot, and offer advice to founders preparing to sell their product or company.

Guide to Styling HTML Forms

One of the most appealing things about using form backend solutions like FormKeep is that, as a web designer or web developer, you can focus your energy on user experience and functionality. You can avoid the burden of building and maintaining your own backend infrastructure.

A large number of our customers choose FormKeep over other solutions because we’ve decoupled the backend from the front end. These customers can style their form exactly the way they want to, using any tool they wish. Complete freedom of expression; no more wrestling with a front end form-builder to get the results you require.

This, of course, begs several questions:

1. What are the foundational rules and principles for styling HTML forms?

2. Where can I find examples of well-styled forms?

In this blog, we provide some pointers to some great resources we have found on these topics.

Rules and Principles of HTML Form Styling

To a certain degree, smart HTML form design and styling is context sensitive so there are no cardinal rules. That being said, we have frequently referred to some nice and comprehensive resources on the web that can help you hone your skills. Here are some of our favorites:

Mozilla: Styling HTML Forms

Mozilla: Advanced Styling for HTML Forms

3 Best Form Design Practices for Your Design Process

Samples of Well-Styled Forms

There are many examples of good and bad forms all around the web. You may have some favorite examples or examples you don’t like. Here are a few places you can find some good looking form examples including sample code:

10 CSS HTML Form Designs

Top 36 Free HTML5 & CSS3 Contact Form Templates 2018

Two CodePen Examples (HTML Forms and Ultra-Clean UI ‘Contact Us’ Form)

Connecting Your Form with a Backend

Of course, once you have a nicely designed form, you need a place to send the data where it will be secure, manageable and can connect with other systems like Google, Salesforce, Hubspot, ZenDesk, Slack and others.

With FormKeep, to make this form active on your website, simply copy the provided html and CSS and customize it as much as you want. Then, all you need to do is update the action attribute. Your form tag should look like this paying careful attention to update the underlined area of the highlighted URL with the token provided to you within FormKeep (Trial or Paid account):

<form accept-charset="UTF-8" action="https://formkeep.com/f/exampletoken" method="POST">

See how with our sample CodePen by clicking here:

See the Pen Sample “Contact Us” Form Template You Can Customize by FormKeep (@formkeep-samples) on CodePen.

How You Can Do More With Weebly Forms

Introduction

Weebly is a wonderful website and ecommerce service that hosts millions of businesses online. Weebly tools make it easy to build a professional, mobile-optimized site and grow your business with integrated marketing and advanced analytics.

In this blog, we will cover some basics about how to add a basic form to a Weebly site and, also, how to expand Weebly’s native form capabilities with FormKeep.

Basic Forms In Weebly

Though most users build static web pages on Weebly; the service does offer a simple form way to add a form to a web page. To add a simple Newsletter Sign-Up Form or Contact Form all you have to do is drag the corresponding icon from Build menu (i.e., Build/Basic/Contact Form or Build/Basic/Newsletter Form) as shown below:

html form, weebly
Weebly Form Actions

In this example, we have added a simple Contact Form to one of Weebly’s standard templates (highlighted in red). This form includes name, email and contact fields.

html form, weebly form, contact form
Simple Weebly Contact Form

Once the form is in place, there are a number of configurable options. Click on the form element within the Weebly designer and then click “Form Options” to reveal the Form Options panel. Here you will have options for configuring the email that will receive data from the form, Google Captcha spam protection, opt-in and some other settings as you can see below:

html form, weebly form, contact form
Weebly Form Options

Once your form set up and you’ve pushed your website into production, your form can begin receiving data. When users submit information via the form you created you will receive an email that notifies you and contains the form data. You can also log into Weebly and access the data by clicking on the form element in the page designer and selecting “View Entries”. Here’s what the data looks like when you access it via the Weebly console.

html forms, weebly forms, form data, contact form
Weebly Form Data

Weebly’s built-in form builder is very powerful and simple to use. It makes form building easy for many users. However, some users are looking for opportunities to do even more with the Weebly forms. We will explore some of these opportunities in the next two sections.

Controlling The Look And Feel Of Your Forms In Weebly

As powerful as the Weebly form builder is for most users, some users want to exert fine grain control over the look and feel of their form. For example, the default form in the example above is a bit hard to see against the background used in the selected template. How can a designer make this form pop out against the background?

html form, weebly form, form design
Form Enhancement Opportunities

Weebly does not offer fine grain control of these elements in the standard form options area. However, Weebly does offer a relatively simple way for developers and web designers to control the look and feel of their form element. Rather than using the included form builder, designers who would like more control can use the Embed Code functionality within Weebly. Rather than dragging the Contact Form or Newsletter Form icons onto your web page, simply drag the Embed Code icon as shown.

html form, weebly form, custom form
Embed Code and Custom HTML Form


With this embedded control in place, the designer or developer can now custom-craft an HTML form to fit their needs and design preferences. In this example, we used the following HTML to design an enhanced form for this template:

See the Pen Weebly HTML Form Example by FormKeep (@formkeep-samples) on CodePen.

The result, when this code is placed in the Edit Custom HTML widget within Weebly is a form with different styling than the native form tool would normally allow. In this case, the form is formatted with a background that allows the form to become more visible against the template background. See the comparison below.

html form, weebly form, styled form, form comparison
Weebly Form Comparison

Obviously, when using the Custom HTML capability within Weebly, the design possibilities are bounded only by your imagination and design sense.

One thing to keep in mind if you use the Custom HTML capability is that you will have to designate a place for your form data to POST information for storage and processing. Weebly normally handles this for you. However, FormKeep makes this easy. You can learn more about how to do this at the bottom of this article. Read more below or click here to skip directly to the appropriate section.

Enhancing Form Data Management and Integration in Weebly

As we discussed earlier, Weebly handles your form data by default in two ways: 1) an email is sent to a designated email address each time a form is completed with the data from that form and 2) the data is accessible via Weebly’s interface when an administrator selects “View Entries” in the form widget.

For many applications, this is adequate. However, if any of the following apply to you then you may be looking for some more advanced data handling capabilities:

  • Lots of Data:
    If you are receiving a lot of data in each form or many form submissions, it may not be convenient and manageable to receive all of the information in an email.
  • Data Routing:
    If you want to route the data to more than one person, it may not be convenient or secure to share the log in credentials to Weebly or route the data through a single email address.
  • Integration with Other Applications:
    If you would like to pass your data on to another system you will need a point of integration that is not available in a standard Weebly form.
  • Excess Spam:
    Google Captcha will reduce but not eliminate spam. Or, you may decide not to use Google Captcha. If you don’t want to flood your email inbox with spam submissions, you may want a data management rather than email solution for handling forms.
  • Field Validation:
    If you would like to use custom field validation logic, you can do that with a custom HTML form.
  • Many Forms On Separate Pages:
    If you have a long form or multiple forms broken across several pages, you may wish to view all the data in one place.

In each of these cases (and many others) you may benefit from using a form backend like FormKeep alongside your Weebly site. With FormKeep, instead of routing your form data to Weebly or to email, your data will be stored, secured and accessible in the cloud. From there, you will have a variety of tools to help you manage your form data and route it in a variety of different ways.

One popular way that designers and developers use FormKeep is using WebHooks or integration via Zapier to feed data to other applications like Hubspot, Constant Contact, Google Gmail, Salesforce, Slack or Mail Chimp (and thousands of others). You can search for over a thousand different integration points between FormKeep and other applications on the Zapier web site (pictured below):

html forms, formkeep integrations, zapier, zapier integrations
FormKeep Integrations – Zapier

In order to take advantage of advanced data routing capabilities available in FormKeep you will have to place your own custom form into your Weebly page and then point that form to FormKeep.

You can read more about how to create a Custom HTML form within Weebly at the top of this page (Click Here)

Enhancing Weebly Forms with FormKeep

One thing to keep in mind if you use the Custom HTML capability within Weebly is that you will have to designate a place for your form data to POST information for storage and processing. Normally, Weebly handles this for you with their standard form tools. However, fear not! This is where FormKeep makes life easy.

Let’s review an excerpt from the form code from the CodePen example above. At the beginning of the form you will notice this syntax (Click Here to View Above):

<form accept-charset="UTF-8" action="https://formkeep.com/f/exampletoken" method="POST" target="_blank" id="weeblyform">

All you need to do is update the action attribute in your form. Your form tag should look like the example above paying careful attention to exampletoken to the token provided to you within FormKeep (Trial or Paid account). You can create one of these tokens for free by signing up for a free trial account at FormKeep Free Trial.

Once you’ve created your HTML form and configured the action attribute, the data will be posted directly to your FormKeep account. From there, you have the option to configure many settings such as spam suppression, thank you pages and re-directs as well as integrate your form with thousands of other applications via Zapier.

You can experiment with this in the FormKeep demo environment in CodePen by clicking here.

If you would like help getting FormKeep setup with Weebly, feel free to reach out to our friendly team at support@formkeep.com.

 

Sample “Contact Us” Form Template You Can Customize

At FormKeep, we make it easy to use your own form HTML and use our backend to capture, store and process your data.

In this example, we have developed a simple Contact Us template that includes the following elements: First Name, Last Name, Email, Subject and Newsletter Subscription Checkbox.

Below the Submit button you can see plenty of other attributes implemented that you can copy and paste to fit your needs. In this example, you’ll see radio buttons, drop down list, email fields, phone number, check boxes, color selectors and many more.

You can edit the html on the left of the CodePen and see the resulting form on the right.

See the Pen Sample Contact Form (With Extra Controls) Styled by FormKeep (@formkeep-samples) on CodePen.

To make this form active on your website, simply copy the provided html and CSS and customize it as much as you want. Then, all you need to do is update the action attribute. Your form tag should look like this paying careful attention to update the underlined area of the highlighted URL with the token provided to you within FormKeep (Trial or Paid account):

<form accept-charset="UTF-8" action="https://formkeep.com/f/exampletoken" method="POST">

You can also update this token in the CodePen example directly and, then, when you press submit on the sample form, the data will be posted directly to your FormKeep account. From there, you have the option to configure many settings such as spam suppression, thank you pages and re-directs as well as integrate your form with thousands of other applications via Zapier.

If you have any suggestions for this form template, please send them to support@formkeep.com.

Thank you!

The FormKeep Team

FormKeep and Zapier Connect Web Forms with over 1000 applications

FormKeep Connects to 1000s of Popular Applications Like Salesforce, Google Docs, MailChimp, Intercom and Slack

FormKeep and Zapier Connect Web to the World.

We know that getting your work done requires many different web tools. In fact, the average mid-sized business uses between 10 and 16 apps and, for enterprises, there can be hundreds or thousands of apps running various workflows. You have your email app, CRM, note-taking tool, emarketing platform, cloud storage tool, team communication app, along with project management tools and more. Sometimes, it can be a struggle to get them all working in tandem. Now that FormKeep has 1,000 integrations, you can choose your favorite tools and easily integrate them with FormKeep.

Thanks to our Zapier integration, FormKeep connects to 1,000 other web tools and applications. Now you can connect data submitted via forms on the web to all kinds of applications and workflows that reside in places like Slack, Google Docs and Salesforce. You can use Zapier to connect with your FormKeep data via codeless integrations called “Zaps”. Zaps will automatically send information from one tool to another, so you’ll spend less time manually transferring data between your business tools and can dedicate more focus to creative, big picture tasks.

Boost Your Productivity with Popular FormKeep Integrations

No matter what other apps you use, chances are you are looking for ways to use web forms to take data from customers and employees via the web and connect that data with the applications you use to run your business. Here are some of the most popular integrations that FormKeep users already use to be more productive.

The New Year is the perfect time to evaluate your processes and find ways to boost productivity. Try out some of the Zaps above or view more ways to integrate FormKeep.

 

How to Gain New Clients as an Agency

For budding agencies, finding new clients is a constant effort. Larger, established agencies often have enough word-of-mouth marketing to bring in more clients than they can handle. But smaller or early-stage agencies can’t rely solely on word-of-mouth promotion, simply because they don’t have the clients to do it for them. Although a marketing plan might seem like something for a more rooted agency, it’s in fact most important for younger agencies.

Design business expert David Baker looked at several hundred design firms over two decades, and his conclusion was that: yes, ok, you do need a graphic design marketing plan, but it’s not what will bring you most clients.

Understand Your Clients

Finding new clients as an agency is not like project management, accounting or IT. You must get intimately involved in the process. If you truly are after getting new – and worthwhile – clients, immerse yourself in your clients’ world rather than your peers’.

Understanding your clients’ needs will go a long way towards generating trust. Agency Scout Debra Giampoli says she won’t work with any agency who hasn’t done their homework. Agencies should know the roles of their potential clients and what they value in an agency. By finding out these things, you can more accurately target specific clients, with a higher success rate.

Build up Confidence and Expertise

Successful people radiate self-assurance. Get out there and profess credible claims, with the certainty that you’ll be able to deliver with ease. Price your work accordingly – underpricing yourself puts you in a lower-tier market, and gives the impression of a less-capable agency. Higher rates may scare away some clients, but they’re generally clients you can afford to lose. In reverse, lower rates may place doubt into bigger clients – the ones your agency needs.

Finally, deliver with solid design solutions. Your reputation is built around what you repeatedly do, so if you’re over-promising and under-delivering on a regular basis, it won’t make for good word-of-mouth advertising. Not to mention the stress this adds, having to deal with upset and disappointed clients.

You may be able to burst into any room (or email inbox), but if you don’t have compelling things to say when communicating with clients, you’ll quickly lose their attention. Craft a statement that people won’t easily forget. Again, understanding your clients and their needs goes a long way to creating a truly compelling pitch.

Sharing is Caring

The ultimate lead generation tool is content marketing: keep an awesome blog that targets and attracts the kind of people you’d like to work with. In time you can establish your agency as an authority and thought leader. Social media is an obvious supplemental tool, but always back up your tweets and Instagram pics with long-form, educational content.

Whether you’re writing case studies, blog posts or short and sweet punchy tweets,  always keep in mind the entire user experience. Will your users reach your blog through social media, newsletters, or Google? How might this affect how they interact with your blog, and the rest of your website?

Don’t use your blog or social platforms for sales pitches. People will follow you if you’re providing useful and interesting content. If all you post is blatant advertising, followers will drop off as quickly as they sign up. Focus on posting up your best work, and let them speak for you.

Keeping it Organized

Make a name for yourself by getting organized and delivering on time. Don’t be in a rush to accept more projects when your hands are already full. With an outstanding portfolio, good clients will be more likely to contact you ahead of time, without the expectation that you’ll start the project yesterday. “Reputation is the foundation to generating new job leads and keeping a steady stream of orders lined up in your email”, says Kevin Harter of Hongkiat and owner of Crystalint Media.

Follow up on any leads as soon as possible. Every hour you delay responding to leads reduces your chances of converting them to a client. If you’re not already, set up an automated email response to any contact form submission. Zapier is a great tool to integrate to whichever form solution you’re using. Use this initial email response to give your client a next step that isn’t just “wait for us to reply”. The more targeted you can make this email, the better. If you’re not able to set up a next step based off the limited information gathered in a contact form submission, maybe ask for a little more information from them. They’re already invested enough to submit a contact form, so asking for some more information about their project won’t raise much resistance.

Some agencies disregard databases when tracking their client interactions. This is a big mistake: databases are priceless. Maintain an up-to-date lead database, and keep track of any prospective clients. Record the name, address, email and phone number of any potential clients you’ve contacted, regardless of how you communicated with them. Don’t get discouraged if you don’t convert a lead to a client on the first, second, third or even fourth contact. 80% of sales require 5 follow-up calls after the initial meeting. 92% of salespeople give up before this 5th follow-up call, meaning 8% of sales people get 80% of the sales.

Find Your Niche

Set your agency apart from your competition by delivering what others can’t. Whether it’s punctuality, beautiful user-focused design, or the ability to creatively solve problems, let your prospects know about it. “Clients will buy from a place where they are likely to get something extra. Find the ‘extra’ for your business,” says Kevin Harter.

A Cohesive Marketing Plan

In spite of what you might plan or dream will happen, most great clients will come from indirect efforts such as client connection, a vendor, employee or supporter connection. But while it could be any of these things that cinches the deal, all of your efforts play a part. An agency with a good reputation, educational content marketing, a strong customer understanding and a little something extra will always beat out a rival agency with a weak spot in any of these aspects. If you can’t promote yourself well, how can a client expect you to promote them well?

Designing Forms that Convert

A huge part of the success or failure of an online business depends on its forms and their ability to convert viewers into paying customers. Contact forms must gather essential information on leads, and checkout forms must endear enough trust for users to hand over their credit card details.

Designing forms is an art. There are many subtle elements: your forms must be brief yet exhaustive, noticeable yet non-intrusive, unambiguous yet not trivial, minimal yet interesting. Web forms should be about the user experience above all else – but they must also provide you with the data you need to run your business.

Luckily, there’s a lot of simple things you can do to increase your conversion rates without sacrificing data quality.

Reduce form length

Many companies have massively increased conversion rates by just removing a few unnecessary fields from their form. Expedia, for example, eliminated one field (company name), and gained $12 million/year in profit. Imaginary Landscape compacted their form from 11 fields down to 4 and found a 120% increase in conversions. Even better – the field they removed had no real impact on the quality of leads generated.

Don’t ask for phone numbers

Almost every contact form involves asking for an email address, but some forms ask for a phone number as well. Including a phone number field decreases your conversion rates by about 5%. For businesses that rely on post-click sales calls, this may be a worthy trade. But for most, it’s better to leave it out, or at least make it optional. In one study by Luke Wroblewski, making a phone field optional led to a 37% drop-off on the phone number field entries, but doubled the conversion rate of the whole form.

Show the password

By default, any password field in a form masks all the characters with asterisks. But like Reset buttons on forms, this seems to be one of those 20-year-old decisions that have become “just the way things are done”. Password masking then led to people making mistakes when entering their password and not being able to log in, which created the “Confirm Password” field that everyone loves.

But if we just take a step back and reconsider whether that 20-year-old design decision is still serving us well, maybe we can remove another form field! Many companies like MailChimp and Amazon are now presenting a single password field, along with a checkbox to show the password as plain text. In one A/B test, Formisimo found that replacing the Confirm Password field with a Show Password checkbox increased conversions by 56% and decreased the number of corrections made (from mis-typing or second-guessing) by 24%. Interestingly though, it had no effect on the password reset request rate.

password-afterpassword-before

Use the right inputs

When you’re deciding which form fields to keep and which to throw out, keep in mind that not all fields are equal. The cost of keeping or adding a field depends on what type of field you’re adding. One extra text input field won’t do much to your conversion rates – just a $12 million/year loss . Adding one text box can drop your rates by almost 10%. It makes sense: most single-line text input fields don’t involve any creativity or decision-making. It doesn’t require effort for a user to recall their name or email address. A radio button is slightly more difficult, but at least all the possible answers are pre-defined. But a text area means that the user has to get creative and come up with a response on the spot – usually a complex message or comment. If you must include a text box, think about marking it optional.

Dropdown boxes aren’t as bad as text boxes, but they’re still significantly worse than single-line input fields. If your dropdown box only has a few options (5 or less), try replacing it with radio buttons. Radio buttons are faster to interact with because they allow the user to see the answers before they click on the input.

select-radio

Real Time Validation

If you’re only validating upon form submission (or worse, not at all), you’re missing out on a really easy conversion rate boost. Luke Wroblewski ran a few studies and found that real-time validation increased conversion rates by 22%, decreased errors by 22% and decreased completion time by 42%.

Focus on your Call to Action

Ok, so now you’ve optimized the hell out of your form fields. What else can we do to increase conversion rates? Let’s look at the Call to Action (CTA). Minor changes to your CTA can make a surprisingly big difference on conversion rates.

The first thing to look at is the color and position of the CTA. You may have heard of HubSpot’s study – they ran an A/B test on one of their client’s websites, and simply changing the CTA’s color from green to red improved conversion rates by 21%. So does this mean that you should immediately go out and change all your green buttons to red? Not necessarily. Take a look at the website HubSpot was testing:

cta-contrast-1

The logo is green, the icons are green, the screenshot is green – so of course the red button stands out a lot more than the green button. Take a look at the following design – which of these buttons do you think will convert better?

cta-contrast-2

So the lesson to take out of this is not “make all your CTA buttons red”, but “make sure your CTA buttons contrast well against the rest of your site”.

Once that’s handled, take a look at your CTA copy. It may seem that as long as it’s clear which button is the “Submit” button, and it says something like “Submit,” you can’t go wrong. In fact, Dan Zarella found that “Submit” is one of the worst words to use for your CTA. Take a look at the graph below: “Click Here” performed almost twice as well as “Submit,” and more than three times better than “Register.”

cta-text

But don’t go rushing off to change your CTA buttons to “Click Here” just yet – think about how to best apply this to your design. Optimizely increased their conversion rates 27% by changing their CTA text from “Get Started” to “Test It Out.” They concluded that “this language made it more clear that the user could try it immediately without a long process. We thought “Get Started” presented a more hands-on, involved process.” Taking another look at the above graph, this makes sense. “Click Here” involves absolutely no commitment – it’s purely a directive. “Register” on the other hand, sounds like going to the DMV and spending three hours in line.

A/B Testing

Before you make any modifications to your forms, use an A/B testing setup to compare your conversion rates before and after. Maybe you’ll be able to add in a new input field without sacrificing conversion rates. Perhaps you’ll finally get an objective answer on what text to place in your CTA button. With time, iteration and solid data, you’ll be able to increase form conversion rates and boost your client base.