Building on my guest post, Tracking Flash Interaction with Google Analytics, I posted my first real post, Tracking outgoing clicks with Google Analytics. Its a quick and dirty way to track what links people are clicking on when leaving your site. This insight is key if your bounce rate is high or your page views/visitor are low and you want to figure out where your loosing visitors.

From the local USTA tennis district office to ebook publishers to fellow college web workers, I’ve shared my process for improving the usability and accessibililty of PDF files.

With the hopes that what I’ve learned will help others who publish PDF files, I’ve highlighted ten tips I use for creating accessible and usable PDF files. Not intended to be an extensive how-to tutorial, the tips I’ve outlined here will get you started in the right direction for creating friendly PDFs from Microsoft Word and Adobe InDesign.

The article focuses on document preparation before the PDF is created, as well as processing the PDF further in either the full version of Acrobat 8 or Acrobat 9. There’s not a lot of information on managing tables or forms in PDF files, just some basic advice to move you toward creating a better PDF experience for your users.

I’m hoping the article will encourage further discussion, but hope the discussion doesn’t head in the “PDF sucks” debate. While it’s a valid debate, my interest in publishing this article is to provide tips and suggestions for those web workers looking for solutions in creating usable and accessible PDF files. There’s a list of resources at the end of the article for additional information about PDF files.

1. Use a structured source document
   A properly structured source document is key to creating an accessible PDF file and essential to meeting Section 508 compliance in the United States. The structure within the source document allows PDF files be tagged, which means it has a logical defined order. Headings, tables, images, and paragraphs in a tagged PDF file can be easily identified by the user. A tagged PDF file also contains information about its reading order.

   To add structure:

   In Microsoft Word, use Word styles to format text. For example, use styles to create headings (Heading 1, Heading 2, etc.), rather than selecting text and making it bold. Add ALT text to all images so text can be read aloud by screen readers. Use “Insert Table” to create a table rather than using tabs and spacing to layout a table. Check Andrew Kirkpatrick’s (Adobe’s Senior Product Manager for Accessibility) excellent Reference Card for Accessible PDF Creation from Word for detailed tips on styling Word documents.

   In Adobe InDesign, several methods can be used to structure a document, including manually tagging content, deriving structure from styles, and mapping styles to specific tags. To view the structure of a document, select View > Structure. Mark and hide printing artifacts, text and content so they won’t display when the PDF document is reflowed for a different display, such as a mobile phone or large monitor.

   Check Andrew Kirkpatrick’s Accessibility and Adobe InDesign CS3 (PDF) for further details on adding structure.

   As with Microsoft Word, ensure all images have ALT text. Adobe’s InDesign CS4 Accessibility Overview has additional information on InDesign’s accessibility.

2. Save/export document as tagged PDF
   In Microsoft Word, assuming Adobe Acrobat has been installed on the same computer, Adobe adds an additional option in the Word ribbon/menu bar for its PDF Maker plugin to create PDF files. The PDF Maker plugin has numerous conversion settings for accessible documents.

   In Word 2007, the Acrobat option is added to the ribbon; in Word 2003, the Adobe PDF option is added to the menu bar. Again, check Andrew Kirkpatrick’s Reference Card for Accessible PDF Creation from Word for detailed information on the conversion settings for Word 2003 and Word 2007.

   Note for Macintosh users: PDF Maker is not available in Word 2008, and conversion settings in Word 2004 are not the same as the Windows Word version. From my own personal experience, creating tagged PDF files in Macintosh Word is problematic.

   To modify the PDF Maker conversion settings, select either Acrobat or Adobe PDF from the Word ribbon/menu bar. In Word 2007, select Preferences from the Create Adobe PDF group. In Word 2003, select Adobe PDF, and select Change Conversion Settings.

   The instructions below assume Acrobat 8 or higher version has been installed; note that Acrobat 7 does not have the same advanced conversion setting options.

   Here’s a quick list of the conversion settings to change in the PDF Maker:

   1. In the Settings tab, enable:
      1. Fully functional PDF
      2. Add Bookmarks to Adobe PDF
      3. Add Links to Adobe PDF
      4. Enable Accessibility and Reflow with tagged Adobe PDF
   2. In the Security tab, if security permissions are enabled
      1. Enable text access for screen reader devices for the visually impaired
   3. In the Word tab, enable:
      1. Convert cross-references and table of contents to links
      2. Convert footnote and endnote links
      3. Enable advanced tagging
   4. In the Bookmarks tab, enable:
      1. Convert Word Headings to Bookmarks

   Select OK to save the settings. In Word 2007, select Create PDF from the Create Adobe PDF group. In Word 2003, select Convert to Adobe PDF from Adobe PDF, and save the document.

   You can also use the Adobe PDF icon that appears in the Quick Access Toolbar in Word 2007 and in the Word 2003 menu bar to quickly save a document as a tagged PDF file. If you use the icon, ensure that all your conversion settings have been modified, or the document will not be saved as a tagged PDF file.

   Note: Print to PDF in Word does not produce a tagged PDF file; it strips out all tagging.

   In InDesign, select File > Export > Save as Type > Adobe PDF. The Export Adobe PDF dialog box will display, with seven panel options in the left column. Here’s a list of the settings to change in the Export Adobe PDF dialog box:

   1. In the Compatibiity panel, select Acrobat 7 (PDF 1.6)
   2. Select the Options panel, enable:
      1. Optimize for Fast Web View – organizes PDF information so the first pages of a PDF file can be viewed while the remaining document is downloaded
      2. Create Tagged PDF
      3. View PDF after Exporting
   3. Select the Include panel, enable:
      1. Bookmarks
      2. Hyperlinks
   4. Select the Output panel to change the color space for screen display
      1. In the Color Conversion drop-down menu, select Convert to Destination (converts the colors to the destination specified in step 2)
      2. Change Destination option to sRGB IEC61966-2.1, which allows non-Acrobat applications to open the PDF file and ensure colors look good without color management. According to InDesign CS4 One-on-one, the sRGB color space is the best color space for identifying a computer monitor’s display capabilities.
      3. Change Profile Inclusion Policy to Include Destination Profile so the color profile is embedded in the PDF file
   5. Select Export

   For applications that produce untagged PDF files, tags can be added automatically in a full version of Acrobat (Advanced > Accessibility > Add tags to document) after a PDF has been created. Be aware that using Add tags to document will remove any existing tags in the PDF file. Also, as of November 2008, documents created in Quark cannot be saved as tagged PDFs; tags will need to be added.

   For PDFs created from scanning images, in a full version of Adobe Acrobat select Document > OCR Text Recognition > Recognize Text Using OCR and then add tags using a full version of Acrobat.

   In the last few months, I’ve discovered two word processing applications that create tagged PDF files: NeoOffice and the newest version (as of October 2008) of OpenOffice. I have not used either of these applications. Perhaps someone who has created a tagged PDF from NeoOffice or OpenOffice can comment on the results?

   To check if a PDF file is tagged, open the document in Adobe Acrobat or Adobe Acrobat Reader. Select File > Properties > Description. Check that the Tagged PDF option in the Advanced pane is enabled.

   The following steps, steps 3 to 8, are completed in a full version of Adobe Acrobat; Adobe Acrobat Reader cannot be used.

3. Add title, author, subject and keywords
   Make it easy for users to know what the PDF file is about and who or what organization authored the file. Be aware the title is almost always displayed in search engine results.

   Select File > Properties > Description

   1. Title – add a meaningful title
   2. Author – brand your PDF file with author/organization name
   3. Subject – what the document is about
   4. Keywords – keywords for the document
   5. Select OK

   

4. Add bookmarks
   Bookmarks act as a table of contents in a PDF file, allowing users to quickly navigate a PDF. Who has time to scroll through 36 pages in a PDF file to find chapter 3? For PDF files larger than two pages, add bookmarks to the file.

   If you followed step 2 (save/export document as tagged PDF) bookmarks will automatically be created from the source document. If the Word source document contained a table of contents, the table of contents will display in the Bookmarks pane.

   To create bookmarks, open the Bookmark Panel (View > Navigation Panels > Bookmarks or select the Bookmark icon in the navigation pane). Use one of the following methods:

   1. Add bookmarks based on document structure – the easiest method!
      1. If the PDF file is tagged, you’re in luck! Use the structure to create the bookmarks automatically
      2. In the Bookmark pane, select the Options menu
      3. Choose New Bookmarks from Structure
      4. The Structure Element dialog box displays – select the elements you want to convert
      5. Select OK
   2. Create bookmarks from selected text in the PDF file
      1. Use the Select tool from the Select and Zoom toolbar
      2. Select text you want for the bookmark
      3. Select the New Bookmark icon on the Bookmarks pane toolbar or in the Options menu, select New Bookmark to add the text
   3. Add blank bookmarks and fill them in manually – most time consuming
      1. In the existing bookmarks, click the location above where you want to add a new bookmark
      2. Select the New Bookmark icon on the Bookmarks pane toolbar or in the Options menu, select New Bookmark
      3. The bookmark will be created with the default text “Untitled”
      4. Enter the text for the bookmark
5. Initial view
   When the PDF file is opened, display the title of the PDF file in the title bar and the bookmark panel in the navigation pane.

   Titles such as htraindal.doc aren’t very descriptive to users compared to “How to Train Your Dalmatian”. Having the PDF open with the bookmarks visible gives the user a quick summary of the contents of a PDF. Otherwise the user won’t know that bookmarks exist!

   Select File > Properties > Initial View

   1. In the Layout and Magnification section
      1. In the Navigation tab, select Bookmarks Panel and Page
      2. In Page layout, select Default
      3. In Magnification, select Default
      4. In Open to page, select 1
   2. In the Windows Options section
      1. Keep all checkboxes unchecked
      2. In Show: select Document Title
   3. In the User Interface Options section, uncheck all checkboxes
   4. Select OK

   

6. Specify the reading language
   Set the document language so screen readers can switch to the appropriate language for the user.

   Select File > Properties > Advanced

   1. In the Reading Options section, for the Language option, select the appropriate language from the menu.
   2. Select OK
7. Correct the reading order
   For each page, the reading order defines how the content is read on that page. To view the reading order for a specific page, select Advanced > Accessibility > TouchUp Reading Order.

   The TouchUp Reading Order dialog box displays, with gray numbered boxes surrounding content. The numbers on each box indicate the order in which the content will be read. If the order is not what you expect, or you need to modify figure or table tags, or add alternate text descriptions to images, use the TouchUp Reading Order tool.

   If numbered boxes don’t appear when the TouchUp Reading Order dialog box is open, the PDF file is likely not tagged. More information on TouchUp Reading Order and how to change/edit order can be found at WebAIM.

8. Use PDF Optimizer
   The PDF Optimizer provides many settings for reducing the file size of the PDF file; downsizing graphics, discarding objects, cleaning up settings are just a few of the settings.

   Creating an accessible PDF file with a small file size can be challenging, since adding accessible features to a PDF file increases the file size. Below are the settings I use to optimize PDF files; creating a custom setting in the PDF Optimizer that fits your requirements may be the best solution.

   Select Advanced > PDF Optimizer

   1. Enable the following sections
      1. Images
      2. Fonts
      3. Discard Objects
      4. Discard User Data
      5. Clean Up
   2. In the Make Compatible with section, change compatibility to Acrobat 7
   3. In the Images section, for Color Images and Grayscale Images
      1. Change the compression to JPEG2000 (available to any user with Acrobat 7 or Acrobat Reader 7 version or above)
      2. Set quality to medium. To avoid text and image blurring, set the quality to lossless for screen shots and manuals
      3. Change Downsample pixels/inch to 96 pixels/inch for any image over 100 pixels/inch
   4. In the Discard Objects section
      1. Enable Discard all alternate images
      2. Enable Detect and merge image fragments
      3. Enable Discard embedded page thumbnails (newer Reader versions can create thumbnails on the fly)
      4. Enable Discard embedded print settings
      5. All other settings should be disabled
   5. In the Discard User Data section, enable all settings except Discard document information and metadata
   6. In the CleanUp section, enable all the checkbox settings
   7. In the Object compression options, select Compress entire file
   8. Select OK

   

   Once you have configured the optimization settings, you don’t have to type them in for each PDF file. Use the Save button to save your custom configuration so you can use it for the next PDF file.

9. Enable Adobe Reader features
   Users often want to add comments to PDF files. Enabling Adobe Reader features allows Adobe Reader users to add comments, as well as fill in form fields, without having to purchase the full Acrobat product.

   Select Advanced > Enable Usage Rights and select Save Now

   Note: enabling Adobe Reader features restricts editing content as well as inserting and deleting pages in the PDF file.

10. Check accessibility
    You’ve followed the steps to create a PDF file, but how do you know if the file is accessible, or if you have some additional changes to make?

    Select Advanced > Accessibility > Quick Check to see if the PDF is tagged. For more information, select Advanced > Accessibility > Full Check for a detailed report on what is missing in the PDF as well as recommended changes to the PDF file such as adding ALT text to images, tagging headings, etc.

Phew! That’s it. These ten tips will get you started on providing your users with a friendly PDF file that is easier to use. Automate the steps I’ve described above using batch processing in Acrobat (video) to make creating friendly PDFs even easier. Check out the resources for additional information on accessible and usable PDFs, including guides and tutorials.

My gratitude and thanks to Donna Baker, Bevi Chagnon from Community MX, and the helpful forum members and Adobe consultants at Acrobat Users for their patience in answering my ignorant questions about PDF files.

Resources

• Reference Card for Accessible PDF Creation from Word from Andrew Kirkpatrick
• WebAIM PDF Accessiblity – comprehensive PDF accessibility guide from Web Accessibility in Mind
• Adobe InDesign CS4 One-on-one – new book on InDesign CS4
• Adobe Accessibility – accessibility information on all Adobe products
• AcrobatUsers – articles, tutorials, and forums on all things Acrobat related
• Facts and Opinions on PDF Accessibility by Joe Clark
• Why PDFs Suck by Henny Swan, Web Access Centre, Royal National Institute of Blind People
• Creating Accessible PDFs (PDF, 859K) by High Tech Center Training Unit, California Community Colleges
• Accessing PDF Documents with Assistive Technology: A Screen Reader User’s Guide (PDF, 368K) – Adobe’s guide for using Acrobat Reader with Screen Readers

Deborah Edwards-Onoro is a web analyst, owner of Lireo Designs, a web development and consulting company, events officer for Michigan Usability Professionals’ Association and leader of Refresh Detroit.

Simple Instructions for Google Map on Web Page

U.S.A. is great! I’m not referring to the Land of the Free. My newly defined acronym U.S.A. refers to, what I believe, is the basis for user-friendly and robust web design and coding, and hopefully will soon be the common practice.

Let me explain. “Usability” is the science of making a website easy for people to use. “Standards”-based web coding (as set by the World Wide Web Consortium along with other groups and standards bodies) is the most modern coding technique and provides many advantages such as reduced bandwidth, improved search engine optimization (SEO), and easier maintenance. “Accessibility” refers to creating website content so that is available to any user (with or without disabilites), with any browser, platform, or connection speed. Thus, in the web development world, U.S.A. stands for Usability, Standards, and Accessibility; not United States of America.

Melting pot

Combining the U.S.A. techniques in web design produces high-quality code and a high-quality website. And doing so comes fairly easily since there is some cross-over between them. For example, using XHTML and CSS web standards to separate style from content also has positive aspects for accessibility and for SEO. Designing a site to be easy to learn and easy to remember is usually considered a usability trait, but also satisfies a requirement for web accessibility (for users with cognitive impairments). And the alternative text attritbute (usually referred to as the ALT tag) is a primary accessibility requirement, but also serves usability purposes for situations when images are not readily available such as text browsing, lowband internet connections, and when there are broken image links.

Working together

Let’s examine an example of U.S.A. working together. The Prices page on the Salon X-pressions website is a nice representation. The page contains web-standards code, as it validates to W3C XHTML Strict 1.0. In doing so, the heading tags and data lists are used appropriately and provides semantic code which is very important for accessibility as well as SEO. For usability aspects, CSS is used to format the (already organized) content into a clean and very readable page; the subheadings are easily scannable and the price listings are consistent throughout.

I feel so strongly about the U.S.A. approach, that I put it in the name of my web development company, CheckEngine USA. The “CheckEngine” portion is an analogy between maintaining a finely tuned car and a finely tuned website. The company develops new websites, but also targets updating existing websites, referred to as “web site tune-ups and overhauls.”

From sea to shining PDA

U.S.A. is necessary for the current and future web for several reasons. First, because there are so many choices on the web, people will opt for the sites they like, which are usually the sites high in usability factors. This is also why SEO is as important as ever, as people so often “Google” what they’re looking for and there is so much website competition existing today. Second, as communities and governments become more aware of the importance of web accessibility, more guidelines and laws will be enacted, to which the mainstream web developer will have to adhere (finally). The third reason is device independence–more and more devices such as mobile phones, PDAs, cars, and even appliances, are giving users the limited ability to surf the web. Implementing web standards and separating style from content gives a website much a better opportunity to be accessed by such devices.

God bless U.S.A.

U.S.A. stands for Usability, Standards, and Accessibility. If a website is developed with these practices, it will available to anyone with personal and technical limitations, and will be easy to use. Add some spiffy design and CSS and the result is a work of art, and something to be very proud of. Practice U.S.A., that’s my pledge of allegiance.