Matthews Carmen PDF Form Design
Matthews Carmen PDF Form Design
Carmen Matthews
AccessU
May 15, 2018
Table of Contents
Introduction ......................................................................................... 1
Planning Your Form: Formatting the Source Document .............................. 3
Content ............................................................................................3
Font Selection and Size ...................................................................... 5
Layout..............................................................................................5
Using Tables for Layout ...................................................................7
Color ................................................................................................9
Convert from Word to PDF ................................................................... 10
Formatting the PDF............................................................................. 12
Delete the Existing Tags ................................................................... 13
Add the Form Fields ......................................................................... 15
Set/Verify Form Field Properties ........................................................ 16
Add Tags to the Document................................................................ 21
Run the Accessibility Full Check ............................................................ 22
Perform Manual Accessibility Tests........................................................ 25
Keyboard ........................................................................................ 25
Screen Reader................................................................................. 26
Change Reading Options for Large Files ........................................... 26
Set PDFs to Open in Acrobat Pro or Reader ............................................ 29
Change Internet Explorer Settings for PDF Files...................................... 29
Conclusion ......................................................................................... 30
References .......................................................................................... I
Introduction
We accept that a preference for PDF forms over other types of electronic
forms may be controversial. We recognize that PDF’s:
2The Set PDFs to Open in Acrobat Pro or Reader section in this document
gives you the steps to set the defaults on your computer.
3https://helpx.adobe.com/acrobat/using/create-verify-pdf-
accessibility.html#make_PDFs_accessible
4 https://www.adobe.com/accessibility/products/acrobat/creating-accessible-
forms.html
The items in this section are best finalized now to save you time later. You
don’t want to discover any errors after you’ve got the whole document
tagged. When that happens, you have to essentially start over and all that
time is lost.
Content
• Asks only for the information you absolutely need. In the words of
UI/UX Designer, Ken Lee-Sanekata, “Take away as many form fields
as possible, until you can’t, and then you try some more.” Really
consider how the form is used and what its purpose is before
committing to 50 form fields when 10 would do the job.
• Has good flow. Information and form fields should appear in a logical
order that does not jump around. For example, instructions typically
appear before a user is supposed to act; they are of little help after
someone has already filled out a field. Address options generally
appear in order of street, city, state, zip. Putting information out of
order increases cognitive load. If there is no logical order to a
selection of items, use alphabetical order.
o Text fields are used where the field entry can vary widely.
Examples include names, addresses and descriptions or
explanations. Ensure the field is large enough to contain the
desired entry.
Ensure the font selections and sizes in the source document are readable.
We recommend using 12-point Verdana for most content, though many
other fonts are considered accessible. Headings should use bigger, bolder
choices to make them stand out.
Layout
• Has adequate space to contain all the answers expected for each
form field and prevent scrolling. This is especially important for forms
that will be printed. Acrobat does not have expanding form fields like
Word does. To save yourself time, test this in the source document
prior to converting to PDF. We recommend a minimum of:
The flip side to this is not giving too much space for the size of the
expected input. You don’t want a 40-character form field to hold
something that’s a set number of characters like a date.
The best way to create a paper form that has a consistent and logical layout
and that flows predictably is to use a layout table. The table will be removed
after conversion to PDF so typical table concerns are not an issue.
• If your entire form is a table, use the top row of the table for the
logo, form title, and other information, such as the date. If you are
using paragraphs for the document title and instructions, use the top
row for the first table section heading.
• Use blank spaces to get the exact layout you want. It’s visually
pleasing when similar items line up both vertically and horizontally, if
possible.
Color
It’s worth noting that even if your source document is fully accessible, it
won’t always convert as intended, so some items may need tweaking
anyway. Follow the steps below to convert your source document to PDF.
2. In the middle top of the window, you’ll see a place to put the file
name. Under that is a dropdown (Figure 4, item 1) to select the file
format. Select PDF (Figure 4, item 2) from the dropdown.
This section applies to all PDF forms, whether they were converted from
accessible source documents or were already PDFs. The following tasks will
be performed (or at least verified) in the PDF.
If you are unfamiliar with using Acrobat Pro, the Acrobat User Guide
workspace basics page5 will help.
PDF forms start off a bit differently than the average PDF document. Prior to
adding form fields, it is best to delete the tags from the document. Then,
after your form fields are added, you can add all the tags at once and
everything will be in the correct order. If you edit the original tags, then tag
the form fields, all the of your work will be overwritten.
The steps to do all the above tasks can be found in the sections below.
5 https://helpx.adobe.com/acrobat/using/workspace-basics.html
1. In the Tags pane, right click on Tags (Figure 5, item 1) and select
Delete Tag (Figure 5, item 2) from the resulting dropdown.
1. In the right pane, select Prepare Form. The Prepare Form screen
will appear. Note: If Prepare Form is not in the right pane, go to
Tools, then select Add under the Prepare Form icon.
2. Select the document you want to add form fields to then select
Start.
3. Acrobat will add form fields based on the layout of the document.
Form fields will not always be where you want them. There may be
extra fields or missing fields.
• To delete an extra field, right click on the field and select Delete
from the resulting menu. We recommend deleting extra fields
first, so that you don’t accidentally waste time formatting a field
you don’t need.
• To add a missing form field, select the type of field you want
from the Prepare Form ribbon (Figure 7) at the top of the screen
then click on the place in the document where you want the field
to appear. Common field selections are:
Time-saving tip: Add all of your text fields first, then use the tips in
the next section to set all the properties for these fields. After all like
properties are set, go back and add in check boxes, radio buttons, or
dropdown lists and format as needed.
4. Check the order of the form fields in the Fields pane of the Prepare
Forms tool. Drag any out of order fields to the correct place.
At a minimum, every form field must have a tooltip set for it in the
properties. Acrobat will automatically set the tooltip based on the label next
to the field, but we still recommend verifying the correctness of the
properties of each one.
1. Double click on the desired form field to open the Properties window
(Figure 8). The name of the window will change depending on the
type of form field. The example below shows properties for a text
field, so the window is named Text Field Properties.
a. Set the form field to Read Only (Figure 8, item 2). We often do
this for the signature fields of forms that are signed physically
then say something like “Signature, print and sign form” in the
tooltip.
b. Set the form field as Required (Figure 8, item 3). Note that this
setting will make the boxes around these fields red while you are
in Prepare Form mode.
3. On the Appearance tab (Figure 9), set the font that responses will
appear in. We do not recommend using the Auto font size, as this
allows the text to shrink to a point where it is unreadable. We
recommend 12-point Verdana (Figure 9, items 1 and 2).
4. On the Options tab, set how you want the field to handle text.
a. Leave the alignment (Figure 10, item 1) Left if the form field
entry will be text. Set the alignment Right if the form field entry
will be numerical.
d. Select Scroll long text (Figure 10, item 4) if you wish to allow
the user to enter more text than will fit in the input field and the
form will be used electronically. If the form is to be printed, any
words that scrolled will not show on the printed version. We
recommend turning this selection off, unless the form will never
be printed.
Time-saving tip: Once the Properties window is open, you can leave
it up and select other form fields to view their properties. This saves
you many clicks along the way.
Another time-saving tip: For form fields that have similar properties,
such as those on the Appearance and Options tabs, you can select
more than one form field and set the properties for all of them at
once.
We rarely use options on the Format tab on fields that hold items such as
dates or phone numbers. If you choose to limit the format of form entries,
you should let users know by providing that information both visually (in the
source document prior to converting) and in the tooltip of the field. An
example would be a tooltip that says “Date signed: 2 digit day/2 digit
month/2 digit year” or “Date signed: dd/mm/yy” with a label such as “Date
signed: (dd/mm/yy).”
After all form fields have been created, you will add the accessibility tags
back to the document. Be sure you are happy with all form field
configurations before proceeding, since going back to correct them after the
tags are created can sometimes have unpredictable results.
In the Tags pane, right click on No Tags available (Figure 11, item 1) and
select Add Tags to Document (Figure 11, item 2) from the resulting menu.
Tags will appear in the Tags pane.
Tags not only set the order the document is navigated in, they determine
how content is read by screen readers. It is imperative that the tags in your
document correctly reflect the function a given item (text, image, table, etc.)
has and that the tags are in the correct order.
The Accessibility Full Check is a tool you can use to ensure you didn’t miss
any key accessibility aspects. It will not catch everything in the document,
which is why we encourage you to learn and apply all the accessibility
concepts prior to running the check. However, it is a nice addition to the
accessibility process and we encourage you to run it on all your documents.
To run the Accessibility Full Check:
4. Results will appear in the left pane (Figure 12). Anything that is in
bold is an issue. The number beside the item is the number of issues
found. If you have done everything in this manual, you should only
have two issues in bold.
Two issues will always be bold in the checker results: Document >
Logical reading order and Document > Color contrast. Both of these
must be checked manually. Once you have checked them, right click
on each and select Pass.
5. Use the expander beside each bold issue to expand view each item.
You may need to expand more than once (such as Alternate Text >
Figures alternate text – failed to see the list of figures without alt
text).
6. Once you get down to the root list of issues (the bolded items do not
have expanders), you can right click on each for guidance on how to
fix it. For simple things like alt text and document title (often referred
to in class as document properties), select Fix and a window will
open for you to edit those items. For more complex issues such as
table headers, you can select Show in Tags panel and follow the
instructions in previous sections here to fix the issue.
7. When you feel each of your issues are fixed, right click on each and
select Check Again. You should complete the document with no
issues showing in the check.
Even when you follow all of the accessibility rules, things can still be wrong
in the document. It’s a good idea to do a quick manual test of each form
prior to calling it final.
Keyboard
Generally, you can just tab through the document to navigate through all
the links and form fields.
Refer to Keys for navigating a PDF6 if you’d like more information about
keyboard use.
Screen Reader
Testing PDFs with JAWS is not generally required. As long as you’ve taken all
the steps outlined in this guide to make the PDF accessible, you can usually
feel comfortable that the document is accessible. However, if you have
access to JAWS, it’s a good idea to go ahead and give the PDF a final check
with JAWS and make sure everything behaves as expected. JAWS will
automatically read an entire document if you open JAWS then open the
document. This is the easiest way to test. If the document is not read
automatically, press Insert + Down Arrow.
You will also want to confirm the labels for all form fields are announced
properly by JAWS when you use the Tab key to move from field to field.
Refer to Accessing PDF Documents with Assistive Technology7 for more tips
and keystrokes.
When reading large PDF files, JAWS will sometimes act in unexpected ways.
Depending on your PDF settings, JAWS might only read a single page at a
time. When this happens, you will not be able to use some JAWS features
effectively. For example, you cannot use JAWS heading navigation to move
through the document, since JAWS is only looking at one page at a time. Or,
if a list or a data table spans more than one page, you may not be able to
use the JAWS list or table navigation features as you would expect.
6
https://helpx.adobe.com/acrobat/using/keyboard-shortcuts.html#keys_for_navigating
_a_pdf
7
https://www.adobe.com/content/dam/acom/en/accessibility/pdfs/accessing-pdf-sr.pdf
To avoid these issues, you will want to configure your PDF software – either
Acrobat Reader or Acrobat Pro – to read the entire document instead of only
the currently visible pages.
The Downside
If you set your Acrobat software to read the entire document, it may take
longer for JAWS to process it. For very large documents, this may take
several seconds or even a minute.
In those cases, you might want to reset your configuration to read only the
visible pages. If the PDF file is well structured, you may be able to use the
PDF bookmarks to navigate the document rather than depending on the
headings.
Below are the steps to set Acrobat Reader DC to read the entire document:
Below is a more advanced way to configure the Read the entire document
option. This method works for both Acrobat Reader and Acrobat Pro DC.
You may have noticed another option in the Page vs Document combo box
called For large documents, only read the currently visible pages. This
option gives you a little more control over when JAWS will process the entire
document and when it will read only the current visible pages.
If you select the For large documents, only read the currently visible
pages option, you will also need to set the option called Minimum number
of pages in a large document. Once you set both of those options, JAWS
will only process the entire document if it is less than the number you
specified in the Minimum number of pages field. If the number of pages in
the document exceeds that threshold, JAWS will read only the currently
visible pages.
If you choose this more advanced option, you must remain aware that some
documents will act differently than others. The most noticeable difference is
usually that the JAWS heading navigation feature works in some smaller
documents, but not in larger documents.
Go to Make Acrobat or Reader the default owner of PDF files on Windows 108
for the steps to change this setting.
8
https://helpx.adobe.com/acrobat/kb/not-default-pdf-owner-windows10.html
5. Select the Disable button which turns off the add-on so it does not
open PDFs in the browser.
Conclusion
9
accessibility@twc.state.tx.us
References
Babich, Nick (2016, July 30). 10 Rules for Efficient Form Design. UX Planet.
https://uxplanet.org/10-rules-for-efficient-form-design-e13dc1fb0e03
Lee-Sanekata, Ken (2017, November 19). 3 Best Form Design Practices for
your design process. UX Planet. https://uxplanet.org/3-best-form-
design-practices-for-your-design-process-383510b31613