Letting Go of John Hancock
Issue № 297

Letting Go of John Hancock

As competition strengthens, every step is vital in making or breaking a deal. Because clients expect everything to be faster, better, and simpler, web professionals must take an instant, foolproof, paperless, modern approach to how clients approve proposals and sign contracts. These documents speak volumes: After all, they are often your first chance to showcase your approach to doing business. I have a way to allow clients to submit legally binding signatures through a web page or PDF file—preserving the classic “signature” aspect while eliminating the most archaic requirements of many modern proposals and contracts. Let’s see how it works.

Article Continues Below

Disclaimer: I am a website professional, not a lawyer, and am not attempting to provide any legal advice in this article. Please consult a legal professional in your jurisdiction should you have specific legal questions.

Legal validity of electronic signatures#section2

What does a “signature” require to be legally binding and hold up in court? I consulted my attorney Tom Roth of Steinmeyer Roth LLP, who e-mailed me some comforting news:

Even with a notary verifying a signature, there is no guarantee [of legal impunity], as I have litigated cases in which the notary improperly ‘verified’ a signature of a person who in fact did not sign the document…the California Courts need only find ‘acceptance’ of the contract to determine it is binding…For instance if I send you a letter stating ‘we agreed that you shall pay our law firm $1,000,000,’ if I can demonstrate that you received the letter and did not object, the Court can make a judgment in my law firm’s favor for the $1M. A person’s proactive conduct, i.e., pressing the ‘accept’ link or ‘I agree’ button, is also more than sufficient to make a binding contract. The threshold for finding acceptance is rather low—you need not focus on the ‘signature’ aspect of the contract.

In other words, “acceptance” is not necessarily about the signature at all. While signing is a traditional and familiar way to signify acceptance, by itself it offers no guarantees. However, contract acceptance is implied when a follow-up e-mail comes from either party, you receive a down payment, the client sends files to you, or any other action outlined in the contract takes place. Let’s explore a way for clients to signify their acceptance electronically.

What we need—a document format that can post data#section3

PDF allows form elements to transmit data to a web page. Basically, a client can review a PDF proposal or contract, fill it out on the fly, and submit it instantaneously—all through Acrobat. I’m willing to bet that most website professionals already send out proposals and contracts in PDF format, and that most potential clients have Acrobat Reader installed. Expanding a PDF file to include form fields that may be filled out and posted to a web page is easy. And, we can even generate and display a PDF receipt automatically upon acceptance, which clients can save or print. All we need to do is set up a form inside a PDF proposal or contract, create a web page to post the data to, and create a PDF receipt template. We can do it using Acrobat Professional and some PHP.

Expanding a PDF proposal or contract#section4

To add an interactive form to your PDF, open the finished proposal or contract in Acrobat Professional, click “Forms,” then choose “Start Form Wizard.” Select the current document. Now, you’re in “Form Editing” mode. Upon entering this mode, Acrobat will attempt to detect anything that already resembles a form label (text followed by an underline) and create corresponding input fields automatically. You can add familiar form elements manually via the “Add New Field” button at the top left of Acrobat. You can edit form element properties by right-clicking on each element.

You may need to insert more fields or edit the added fields so that their name attributes are unique, appropriate, and can be referenced later. The PHP file that receives this data will associate <var>$_POST variables based on the “name” attribute of these elements—just like an HTML form posted from a web page to PHP.

Set all your input fields to “Required” by right-clicking, then choosing “Properties.” Add a hidden field named “proposal_id” and assign an appropriate, identifying value to each proposal. Include a plain text proposal with a link to a web page that contains an HTML version of the same form. This ensures that the agreement can be immediately accepted by the few people who might not have or have access to Acrobat Reader.

Finally, insert a button element to create an “Accept” button. Under the “Actions” tab of the button’s properties, change the trigger to perform the “Submit a Form” action. In the dialog box that appears, enter the URL where your PHP page that processes the data resides, then choose “HTML” as the export format.

Setting up a PDF receipt template #section5

It’s easy to set up a PDF template that can be filled in dynamically. Simply create a new PDF document and add read only “Text Fields” containing “name” values that correspond to those in your PDF proposal. For example, if the proposal has an input field named “proposal_id,” the PDF template will populate a hidden field named “proposal_id” with the corresponding posted variable. For the viewer’s sake, create labels that identify the hidden fields. While the template is still open, click the “Advanced” tab and choose “Extend Features in Adobe Reader.” Now, clients can save each receipt the template generates using Acrobat Reader—something they would otherwise need Acrobat Professional to do. Lastly, we publish the template to a location that clients may access—referred to as “http://example.com/receipt.pdf” later, in our PHP file.

PDF accessibility#section6

Before we finish with the PDF files, it’s important to address PDF accessibility. Make these PDF proposals and receipts accessible with the same enthusiasm you use to make web pages accessible. Luckily, you can structure and mark up PDF documents similarly to the way you mark up HTML documents. Acrobat has tools to check file accessibility. While PDF accessibility is beyond the scope of this article, most basic proposals will require a language specification, tags, and form field descriptions.

Creating a PHP file to process the submission#section7

The PHP file expects six <var>$_POST acceptance variables (name, e-mail, and so on). It adds two more: the date, and the IP address of the access point requesting the PHP file. I’ll add these to the <var>$_POST array.

Here’s the code so far:

<var>$_POST['ip']</var> = $_SERVER['REMOTE_ADDR']; 
<var>$_POST['date']</var> = date('M j, Y');
 

Next, we need to copy the <var>$_POST information into a format that our PDF receipt template can use to populate itself dynamically. FDF (Forms Data Format) is the format we need. Adobe created it to represent form data and annotations contained in PDF form. We could use the FDF Toolkit to convert our array into an FDF string, but it’s not available by default on most hosting plans, and for this technique, I prefer a pure PHP solution. Luckily, our FDF needs only a specifically formatted string that contains name-value pairs and a link to an associated PDF file. For these purposes, we can get by without the toolkit.

In FDF, name-value pairs are encased in and separated by parentheses. So, other than dumping the <var>$_POST array contents into a specifically formatted string, we need to make sure that we escape any parentheses a client may have entered. Otherwise, clients may get a vague error message when they attempt to accept the agreement. The simple function “fdf_prep” in the following code block escapes client-submitted information. We’ll run each value through the function before appending it to the <var>$fdf_str</var> string.

function fdf_prep(<var>$submitted_value</var>) {
  <var>$search</var> = array('(', ')');
  <var>$replace</var> = array('(', ')');
  return str_replace(<var>$search</var>, <var>$replace</var>,»
<var>$submitted_value</var>);
}// the <acronym title="Portable Document Format">PDF</acronym> template we created earlier
<var>$pdf_receipt</var> = 'http://example.com/receipt.pdf';// our <acronym title="Forms Data Format">FDF</acronym> string
<var>$fdf_str</var> = "

About the Author

Bjørn Enki

Bjørn Enki spends most of his time running Bjørn Enki Website Design, striving for optimal solutions, quality results, and thrilled clients. He lives in Pasadena, CA and is passionate about custom web services, web standards, and open source.

18 Reader Comments

  1. I absolutely agree that it’s vital to webbusiness to make contracting easy. Since the most secure way to contract still is a underwritten document I use an efficient way to create the contract on the fly:

    (1) Create an OpenOffice Doc containing your contract with some “variables”. Unzip the saved oo doc, you’ll find a content.xml file containing your “variables” in plain text.

    (2) In your PHP backend, present the contact’s options to your customer. On submit, load the template contract’s content.xml and substitute your “variables” with the values/choices of your current customer.

    (3) In your PHP backend, pack-zip your oo doc (ie with zib.lib.php) and call oowriter to produce a PDF file from your modified contract template.

    (4) Deliver the PDF to your potential client’s browser to make her print it, underwrite it and finally fax it.

    I found this to be the most simple – while professional and legally reliable (german law) way to contract in the web.

  2. Or you could just use http://www.echosign.com — I’m not a salesman, promise! We use them at my agency, it’s pretty cheap, professional, and has dramatically reduced both our sign-off times and the number of sign-offs we can send (contract, order form, design, testing, go live, project completion).

  3. I may be being naive here, but if I send my terms & conditions document and require that the client responds in an email affirming those Ts & Cs, have I not achieved the same thing?

  4. Full disclosure: I work for and electronic signature vendor, eOriginal (www.eoriginal.com).

    Electronic signatures are a great way to improve and speed up your business processes, however to make your documents legally admissible in court there are a few steps in the process that must be taken to ensure that your documents hold up to a legal challenge. I could get into all that here but it would make for a very long comment stream. But if you would like more information or have any legal questions you can view our compliance information http://www.eoriginal.com/solutions/legal.php, it may clear up a few questions.

  5. Hi.

    I require from my clients an e-mail confirmation with the quote attached, and a downpayment (by check). That’s enough legal evidence (at least in France).

    Regards.

  6. A lot of us Mac folks use Preview to view PDF files. Acrobat is massive and slow on the Mac — or so I’ve been told. Preview would not have the capabilities to submit the form, but of course it would still be readable. Just something to be aware of.

  7. I realize this is a bit off topic but posting php examples with incomplete data sanitization is not good.

    Thank you, “.$_POST[‘accepters_name’].”! Your acceptance» ”

    This is especially confusing as your very next block of code does some sanitization.

    I really enjoy the content and A List Apart and consider it a top notch resource for quality examples. In the future when providing examples that make use of php and $_POST/$_GET you could also reiterate the importance of sanitized data by including an extra 7 lines of code for data sanitization:

    $post = array();
    //filter post data once we get, filtyers out any unwanted html tags the user may submit as well as converting entities back to characters.
    foreach($_POST as $k => $v)
    {
    $post[$k] = trim(strip_tags(html_entity_decode($v, ENT_QUOTES)));
    }

    /*
    . . . .
    do whatever php your page needs here using the $post array you just built instead of $_POST
    . . . .
    */

    //make the output safer with htmlentities before we go echoing it back tp our html
    foreach($_POST as $k => $v)
    {
    $post[$k] = htmlentities(stripslashes($string), ENT_QUOTES);
    }
    //end php block and begin our html output if echoing $_POST data back to the form once again use the $post array you created

  8. Thanks for the comments and thought you’ve all put into the article!

    To hopefully clarify, the point my lawyer makes about signatures holding up is that they are rarely used to determine the validity of a contract—whether written or electronic. Neither type comes with a guarantee, and proof usually relies on actions that imply “acceptance” and are easier to verify than signature validity. In this regard, an e-mail or even a nod of the head can be used for contract acceptance. The article focuses more on using PHP, HTML and PDF specifically to create professional, quick, free, and universally accessible means of entering agreements, receiving confirmation, and providing receipts.

    With client impressions and experience in mind, my pudding hopefully retains a balanced ratio of egg. 🙂

  9. bq. I have a way to allow clients to submit legally binding signatures through a web page or PDF file

    Is there a clear advantage you went through all the burden of doing the same work twice, i.e. both in HTML and PDF format?

    I may be totally mistaken, but forms in PDF are not so common compared to HTML ones; even though your idea is brilliant, aren’t you confusing clients with a format they use only for reading 99.9% of the time?

    If you’re looking for the emotional response that a PDF document triggers–it’s _nearly_ paper–then you might want to (1) use HTML for form-filling and (2) create a beautiful PDF document with the submitted data.

    Airbag Industries once created a very simple and effective work request form where potential customers could fill a few fields. The result was designed to give the impression that the user actually wrote a letter. It’s not available anymore unfortunately.

  10. I really don’t think that this problem is solved by any kind of neat use of PDF – or indeed an understanding of the law.

    The real problem is getting the client to commit psychologically to the decision. Personally, I think getting people to physically sign their own signature – even if they then only send you a scan or a fax helps. But even if they do this, if they haven’t actually committed themselves mentally you will still get problems.

    This is why I think it’s a good decision to try to get the client to either commit to you as a designer – or walk away – early in the process as I recommend in this blog post:http://www.agile-lab.co.uk/2009/12/this-is-really-funny-but.html .

  11. I’ve been debating the annoyance of _print>sign>scan>email_ versus the lightness of the _I accept_ email response.

    It looks like you’ve worked out all the nuts and bolts. Why not show a demo, so we can get a sense of the mouthfeel of this process?

    Thanks for the article.

  12. Disclosure: I drafted the first federal legislation making electronic signatures legal (GPEA 1998) and co-drafted ESIGN that covers commercial transactions.

    Without giving any advice on the legality of signatures and generally accepting the premise by the author about court oversight, let me mention other possibilities. When considering building any new system, I think it would be helpful to consider the BLT methodology– that there are at least three layers to be considered: business process, legal issues and review and the technical implementation.

    For a contract on web site development it might be good to have a workflow that shows the steps involved in designing, coding and building the site. There could be rounds of client review and client sign off. On the legal side there could be an electronic contract which is represented by a permanent URL with sections linkable by fragment URLs (i.e. #fragment) which can be done either in XHTML (or PDF if you know how). Within the workflow there would always be links to the contract portions, say to the three mockup agreement with a extra cost for additional mockups. Having an active and easily transparent contract that actually shows up as appropriate in a human readable way may help with avoiding disagreements and misunderstandings.

    Also, by incorporating the client signoffs in the system there is a way to track and audit with project management the realistic time assessments on what caused any delays.

    And instead of speculating on the legality of electronic signatures, just cite the laws, especially by linking to the law(s) governing the contract (could be state or federal or another country) and to any legal opinions or briefs. Copy and paste into all of your contracts. Done.

    Daniel Bennett
    CTO, eCitizen Foundation

  13. I work as a business analyst at an electronics components distributor, and one of the major bottlenecks in processing any paperwork involve the obtaining of signatures from all the relevant parties signifying agreement on the stated terms. As these are mostly internal agreements, I can see how an e-mail agreement can be made to substitute the traditional signature.

    But the points raise by @4 and @5 summarise the main dangers of having such an agreement: will it be admissible in court if disputes do occur? It’s a tough question to answer, and possibly unanswerable. Perhaps one way around this problem is to have contracts believed to be above a certain dollar amount be signature-only, and only those below that amount be allowed through the fully electronic agreement process. This way, if problems do occur they won’t be catastrophic.

  14. However nice an idea this is, it’s simply not viable for me, my companies and pretty much everybody else in the field I know for one simple reason: clients are stupid.

    Our clients expect things to be faster and easier not because they’re savvy, enlightened or educated, but because “well, it’s all done on computer isn’t it, so why does it take you so long?”. Yet if I were to send something like electronic contracts or approvals (such as Adobe Clip Notes) they totally freak out with “oh this is too complicated, can’t you just fax me it?”.

    The furthest I’ve been able to go is get a few of my more tech-literate clients to deal with projects through Basecamp, but even that is too much for most.

    The 2 clients I have who would understand and appreciate such an electronic system have mind enough to not rush any contract process anyway – they know anything legally binding needs to be done properly, so saving a few minutes signing an online PDF instead of faxing aprint out is hardly worth it.

    So I genuinely envy anybody here who has a client with brain-enough to work with something like this, but for me they sign a printed contract with a pen and fax it back to me. The fact that the contract was a PDF I e-mailed to them is as technical as it gets.

  15. Hey, we tried a few companies like echosign but found their services did not deliver the value we had hoped. Truth is, digitally signing offers a minimal amount of protection but an impressive amount of credibility. Kinda like putting a “this site is safe” image on a website.

Got something to say?

We have turned off comments, but you can see what folks had to say before we did so.

More from ALA

I am a creative.

A List Apart founder and web design OG Zeldman ponders the moments of inspiration, the hours of plodding, and the ultimate mystery at the heart of a creative career.
Career