SitePoint Sponsor

User Tag List

Results 1 to 7 of 7

Hybrid View

  1. #1
    SitePoint Enthusiast
    Join Date
    Feb 2008
    Posts
    66
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Creating a static, printable html form with "___" lines

    Hello,

    I have a form online that has fields written literally like the following:

    "Name: ______________

    Are you blah blah?''

    Yes [ ] No [ ]"

    A client would like the form to be left online in its current format. This means that the fields would not use input areas. Instead, the user would print the page and complete the form with a pen.

    From a screen reader perspective, are there any tips you can give to make the page more accessible?

    Thanks

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,107
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by tcguy View Post
    the fields would not use input areas. Instead, the user would print the page and complete the form with a pen. ... From a screen reader perspective, are there any tips you can give to make the page more accessible?
    Heh heh, from that perspective, a form would be better. How is a blind user going to fill in a printed form with a pen? A proper HTML form allows it to be done by anyone. Underline characters won't mean much when read out.

    It is possible to style a form to look like a printed form with underlines. Here's a nice example:

    http://huffduffer.com/signup/

    That's actually a form.

    Another option might be to use a printable PDF that can be filled out digitally. You can set that up easily in Acrobat. Not sure how accessible they are these days, but probably not too bad.

  3. #3
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,269
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    I have a PDF reader but you can't fill anything in with it. I would have to buy the Acrobat Suite. So someone wanting me to fill out their PDF had better be willing to go buy that for me :)

    Agreed with ralph that a real form is easiest to fill out. The huffduffer example is interesting: while they have lots of text outside form controls (meaning for example in JAWS and Window-Eyes it would be skipped entirely... and for some retarded reason they've put a blockquote in the form... wtf?), all the important information is within form controls and this could be filled out. Well, except for the show password thing... looks like it's added to the markup.. with Javascript?? Why? And try filling that form out with the keyboard.

    But our insurance company did similar: there was the online form you could fill out, but if you wanted to print and snail to us, there was an HTML form, which you could either fill out on the computer and then print, or just print. A print stylesheet turned inputs into

    input[type=text] {
    width: something in mm;
    background-color: transparent;
    border: solid #000;
    border-width: 0 0 1px 0;
    }

    and we added explanatory text to the print stylesheet (use black or blue pen etc) and removed the submit button and other web-form styling to make it look like our paper forms.

    For print this worked fine, except in Firefox because that browser has untold retarded Netscape bugs in it... not being able to print half a fieldset on a single page being one of them. If you have long fieldsets, tell users to use a better, modern browser like IE instead of Firefox :)

  4. #4
    Non-Member
    Join Date
    Feb 2012
    Posts
    892
    Mentioned
    10 Post(s)
    Tagged
    0 Thread(s)
    Well, I guess PDF forms may disagree. I'll send you one to fill up and you'd only need the Reader, no need for me to buy the whole suite for you. I'll even throw in some JS code for validation.

    But let me give the OP an advice you've given me before: just say it. That is, describe it, make it verbose, but hide the verbosity: http://webaim.org/techniques/css/invisiblecontent/ from normal users.

  5. #5
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,269
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by mitică
    I'll send you one to fill up and you'd only need the Reader
    does Reader run on Linux?

    We had Reader on all our Windows machines, but none of them could make any changes to our PDFs. The boss could, but he had the whole Suite, and thought everyone with Windows did.

  6. #6
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,786
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Stomme poes View Post
    does Reader run on Linux?

    We had Reader on all our Windows machines, but none of them could make any changes to our PDFs. The boss could, but he had the whole Suite, and thought everyone with Windows did.

    There are copies of reader available free for all common operating systems.

    You can't update the PDF itself using reader but if the PDF has a form defined within it to overlay the page then you can fill that out and save it as an FDF. You only need the full version of Acrobat (or an equivalent program) in order to create the overlay for the form.

    I used to use a PDF with form overlay for a club new membership application form so that those that wanted to could fill it out online before printing it already filled out and those that preferred could simply print it out and then fill it in by hand. It did involve having to copy all the form fields from the old form to the new one every time there were any changes so to reduce my workload I switched to using an HTML form to collect the information and then store the information as well as generating the PDF with the fields filled out (and a code number on the form to match it back to the stored info to save me having to retype it).
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  7. #7
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,269
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by felgall
    You only need the full version of Acrobat (or an equivalent program) in order to create the overlay for the form.
    Maybe the boss screwed that up when making the forms?

    Ah, someone found a solution using OpenOffice and ImageMagick: http://www.linuxquestions.org/questi...-linux-796720/

    I suspect Orca would be limited to how well it deals with OpenOffice more than anything... recently someone on the list was mentioning working with some new Adobe PDF reader for Linux, but ultimately he still ended up converting to text and opening the file in gEdit to really read it. https://mail.gnome.org/archives/orca.../msg00520.html

    This might also be of interest to the OP if PDFs will be used: PDF Accessibility Testing with JAWS, NVDA and Window-Eyes.

    The only speech-recognition software I know of is Dragon (Windows) and I have no idea how easy or hard it is to fill out a form on a PDF with Dragon compared to an HTML form. Or some other kind of form.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •