Only interact

Many people still appear to see the Web as a ‘broadcast’ medium, a place where companies and media owners either present information for public access or sell it via some kind of subscription model. But such a view misses one of the most important aspects of HTML and the Web; namely, interactivity. Many websites are little more than online brochures, albeit with the odd splash of animation and fancy navigation. Such sites could easily be replicated on paper (and, indeed, soame might even work better that way). Try reading the archives of this column on the PC Pro website to see just how readable the articles are compared to this page – a great reason to keep buying the paper magazine!

Only interact

The tables are completely turned, though, when it’s a matter of site visitors feeding information and data back to the company. There are many reasons why online forms are better than traditional paper questionnaires or telephone surveys, but probably the most important is that such data can be put directly into a database with no need for transcription, rekeying or OCRing (all of which introduce a significant level of inaccuracy). The cost savings can be huge too. That’s why the banks love their online-only accounts, where you’ll often find their best rates of interest. That’s also why some electricity and gas companies offer discounts if you enter your own meter readings via their website. And, it’s why the PC Pro Reliability and Service Awards now employ Demographix ( to capture their data, as opposed to the postal and faxback methods we used a few years ago. Oh, and before we get accused of ‘doing a Blunkett’, at this point we must declare a potential conflict of interest; namely, that Paul is now a director and part owner of Demographix. More than 20,000 people completed the online questionnaire this year – a fantastic new record. Imagine what a nightmare it would have been to compile and analyse all of that data if it had arrived as paper forms.

Anyway, back to interactivity. There’s always been a dilemma about the best way to create complex multipage HTML forms, such as the aforementioned PC Pro survey. You need some mechanism to pass the entered data from one page to the next, so that when you get to the end you’ve got everything you need to write back to the database, send the email, place the order or whatever. Some people pass data from page to page via a series of hidden form fields, while others use a frameset with a hidden frame used to store the data. There are even people who write the data from each page into a temporary database record, then reassemble these into a single record once the final page is submitted. Each of these methods has its pros and cons, and none of them is perfect.

Deeply DIVvy

We’d like to suggest another method, and that’s to not have multiple pages at all; instead, put all of your questions onto a single page. At this point, you’re probably recoiling in horror, imagining ‘skyscraper’ pages with hundreds of questions and horrendous amounts of scrolling, but that’s not what we’re suggesting at all. The key to our method is to divide up the questions as you normally would, but then to place each block of questions into its own <div> rather than a separate page. Previous and Next buttons are coded so that they perform any required data verification, then alter the visibilities of the <div>s so that the current one vanishes and the next appears. The benefits of this method are that there’s no need for frames, nor for round trips to the server between pages, and you won’t get the ‘back button’ problems that hidden fields often introduce. Another useful side effect is that moving from one ‘page’ to the next becomes a lot snappier, and you’ll have all of the data available, so it’s easy to build conditional questions and pages. For example, if someone told you on p1 that they drive a Rover, on p4 you might add the optional question ‘What year did you start drawing your pension’…

Disclaimer: Some pages on this site may include an affiliate link. This does not effect our editorial in any way.

Todays Highlights
How to See Google Search History
how to download photos from google photos