PDF forms on the web shouldn’t waste my time

How to create online forms from PDF documents on a webpage

Recently, I was completing all the necessary steps to apply for parental leave at work. Exciting times! As one would expect, there are many steps and paperwork with my company and with the company’s insurance company.

After filling out a bunch of online forms, the online portal instructed me that to get paid with direct deposit, I would have to download a PDF, print it out, sign it, scan it back in, and upload it back into the online portal.

After examining the form, I discovered a few challenges:

The PDF didn’t have interactive forms

For over 20 years, tools like Adobe Acrobat have allowed PDF documents to have had the ability to have interactive form fields. Even the IRS has interactive PDFs. If the US government can provide an interactive PDF, shouldn’t that be a basic standard of PDF forms?

Needing a printer

Like many millennials, I don’t have a fax machine, a printer, a tape player, or even a CD-ROM reader in my house anymore. As we are moving to a post-COVID world, printing paperwork should be reserved for the most archaic of processes.

Errors cause redos

Manual paper forms is it requires someone to manually review the form. If there is incorrect information or someone misses a form, then this needs to be communicated back to the client, which slows the delivery of the service.

Re-keying information

When you have a document that needs to be filled out by hand, this means it requires someone to manually review and re-key information. Every time you have a re-key or human process to this it creates risk of error and a security risk with sensitive information.

Lack of tags for accessibility

PDF documents can have tags to help screen readers to read content in the PDF document in the appropriate reading order. Unfortunately, this form had none of those, meaning the process of providing direct deposit information would be a more inconvenient task for someone who is visually impaired.

As I was going through this process, all I was thinking was “there are so many ways to make this so much easier. So, for this article, I want to share some of the ways you can make this a better experience for everyone.

Tip #1: Turning a PDF into an interactive form

Interactive forms in PDF documents allow you to easily fill out a PDF on your computer or mobile phone without having to print. Using Adobe Acrobat DC, you can take any PDF and turn it into an interactive PDF form that you can fill out in Adobe Acrobat Reader or your web browser.

Acrobat DC will automatically detect the fields that may exist in the document. You can then use the tools to add and remove text fields, checkboxes, and drop-downs to turn the document into an interactive PDF. When someone downloads the PDF from your webpage, it can then be interactive, and they can fill most of it on the computer.

Tip #2: Use tagging for accessibility

Whether it is websites or PDFs, it is important to make content accessible to everyone. Fortunately, Acrobat DC does help provide a straightforward way to help you create a more accessible document for screen readers.

Tip #3: Turn into online web form

Going beyond the steps of Tip #1, why make someone download a PDF at all? Using Adobe Acrobat Sign, you can turn your PDF documents into a form that you can link to on your website or embed. What’s more, Acrobat Sign is a trusted and secure which can be used for collecting some of the sensitive information in the form.

Using an Adobe Acrobat Sign Web Form can have the following benefits for this form:

Make fields required

Make sure people fill all the information in the form the first time correctly without having to communicate after there is an error.

Form field validation

Make sure that form fields like social security, routing number, and account numbers have the right type of information with form field validation.

Merge information into documents

Why fill in data that you already have all over again? If you have already collected information, either in a database or a previous form on your website, you can populate into that form as URL parameters.

Capture electronic signature

Capture electronic signatures from signers without having to print out, sign with a wet signature, and scan it back in. These signatures

Add file upload and scan

For forms like this which may require an image to be attached, the Image field in Acrobat Sign can help require the signer to attach an image by taking a picture with their camera or uploading a file. Tools like Adobe Scan can even help scan a document using your smartphone.

Tip #4: Get form field and image information

Once your signed document is completed, the last thing you want to eliminate is the need to manually re-key information filled out. While there are some services today that can read handwriting, the results can often be mixed, and it is ideal to avoid handwriting in data altogether.

In this scenario, because there is sensitive information like banking information and social security, the less that data needs to be re-keyed, the more secure it is. Adobe Acrobat Sign provides APIs to extract information from the form and populate it into a database. It can extract the values of each of the form fields as well as any of the images that are attached to the document, making it easy to integrate with less manual interaction and fewer errors.

{
"formDataList": {
    "completed": "2022-07-31 22:03:11",
    "email": "adobesigndemo+new@outlook.com",
    "role": "SIGNER",
    "first": "John",
    "last": "Echostone",
    "title": "",
    "company": "",
    "Account_Type": "New",
    "Address": "123 Any Street",
    "Bank_AccountNumber": "123456789",
    "Bank_Address": "123 Any Ave",
    "Bank_BenefitSentOut": "No",
    "Bank_City": "Anywhere",
    "Bank_MoveFundsOutsideUS": "No",
    "Bank_Name": "Bank",
    "Bank_PhoneAreaCode": "555",
    "Bank_RoutingNumber": "123456789",
    "Bank_StateAddress": "CA",
    "Bank_Type": "Checking",
    "Bank_Zip": "12345",
    "City": "Anywhere",
    "ClaimNumber": "12345",
    "Claimant": "John Echostone",
    "Account_AreaCode": "555",
    "Account_Phone": "1234567",
    "Account_Number": "123456789",
    "DateOfBirth": "01/01/1970",
    "Image 1": "https://secure.na1.adobesign.com/document/cp/3AAABLblqZhDxQRbXBwFPcIx5KCbzUMWWRB-MS_Om6xYHN63lQh0ugyJR_QLyDiGABixJYxSVjr4*/t4741216544757494282.jpeg",
    "SSN": "123456789",
    "Sponsor": "ABC Company",
    "State": "WA",
    "Zip": "12345",
    "agreementId": "CBJCHBCAABAAWqopySl_3QHjpZgEeLxHkpVqBHZ_vLC4",
    "email verified": "Yes",
    "web form signed/approved": "2022-07-31 22:03:08"
}
}

Last thoughts

As we are migrating to our post-COVID world, the hope is that we have learned that having experiences that depend on paper on a website does not make it ideal for anyone. It doesn’t make it ideal for a customer as they try to navigate how to print out and scan back in documents. It doesn’t make it ideal for companies that have-to-have additional overhead to process the forms. It makes it longer to process any sort of document rather than being a digital process.

Have a look at some of the forms and documents that might exist on your websites. Give Adobe Acrobat DC a try to optimize your PDF documents. Utilize Acrobat Sign to create online web forms and extract the form data into your systems.