Portable document format (PDF) Web Designing

PDF (Portable Document Format) is a technology developed by Adobe for sharing electronic documents. The remarkable thing about PDF files is that they preserve the fonts, colors, formatting, and graphics of the original source document. Ideally, a PDF document looks exactly the way it was designed, regardless of the platform, hardware, and software environment of the end user. It can be viewed on the screen or printed out to a high-quality hard copy.

PDF existed before the Web, but the two make great partners -- PDF is the ideal file format for sharing documents, and the Web provides a highly accessible network for distributing them. You can make any document into a PDF file and make it available from a web page. The advantage, of course, is that you have more control over fonts and layout, and the formatting is not limited by HTML.

Forms, documentation, and any other materials that rely on specific formatting are good candidates for PDF files. To use a classic example, the IRS makes tax forms available for download in PDF format so taxpayers can print them out at home without requesting them by mail or making a trip to the post office.

But PDF files are not totally static. They can contain links to online material and other PDF files. Adobe Acrobat 5 can even create interactive PDF forms which can be filled out, automatically updated, and submitted online. PDFs can also be dynamically generated based on user input.

With the control PDF offers over display, it's tempting to want to use it for all online material. It's important to understand that PDF is not a substitute for HTML, nor is it likely ever to be. But it is a powerful tool for sharing any sort of document electronically. It's like sending a piece of paper through the lines.

Viewing PDF Files

PDFs are viewed and printed via the freely available and widely distributed Acrobat Reader. Acrobat Reader is also available as a plug-in (called PDFViewer) or ActiveX control that is automatically installed with Internet Explorer and Netscape Navigator Versions 3.0 and higher on a variety of platforms including Windows, Mac, and Unix.

When a user clicks on a link to a PDF file from a web page, what happens depends on how the browser is configured. If the browser has the PDFViewer plug-in, the document displays right in the browser window; the plug-in adds a toolbar to the browser window for navigating through the PDF document. If the browser is configured to use Acrobat Reader as a helper application, the browser automatically launches the reader, and the PDF displays in the separate application window.

Without the Reader or plug-in, when a browser encounters a PDF file, it issues a prompt to install the plug-in, choose a helper application, or save the file to disk.

Creating PDF Files
The standard application for creating PDF files is Adobe Acrobat, which is in Version 5 as of this writing. This commercial product gives publishers the greatest control over PDF creation. When Acrobat is installed on a computer, making PDFs is simple. From an Adobe application, just open the document and export it to the PDF format. In Microsoft Office (Windows only), there is a PDF Maker icon right on the toolbar. To create a PDF from a non-Adobe application, print it to a PostScript file (choose "File" instead of "Printer" in the Print dialog box). Then open the PostScript file in Acrobat Distiller (part of the Acrobat package) and save it as a PDF file. In both scenarios, a dialog box appears, in which you can specify a large number of quality and optimization settings.

Once the PDF file has been created, it can then be opened in Acrobat for further finetuning and advanced settings.

The important thing to remember is that the PDF file needs to be optimized for web delivery, so be sure to check the "Optimized" box in whatever program you use to create your PDFs. Optimizing the PDF structures the document and the media it contains so that it can be delivered page by page. It also results in much smaller file sizes. When you save the PDF, be sure that you give it the proper .pdf suffix.

HTML for Adding PDF Files to Web Pages
There are two basic ways of calling a PDF file from a web page: linking to the file (or a specific page within it) and embedding it in the page like an image.

Linking to a PDF file

Creating a link to a PDF file is the same as linking to any other document. Just include the file name in the URL as shown in this example:

<A HREF="documentation.pdf">Link to PDF file</A>

The PDF file resides on the server like any other media file. Most modern server software is preconfigured to recognize the PDF MIME type (type application/pdf, extension .pdf).

Linking to a specific page in a PDF file

It is possible to create a hypertext link to a specific page in a PDF document, allowing readers to jump just to the relevant information without waiting for the entire PDF document to download. It's a useful feature, but a number of criteria must be met in order for it to work:

  • The server must support byteserving, a feature on web servers that allows them to deliver one page of the PDF file at a time. Byteserving is supported on the following servers: Microsoft Internet Information Server, Netscape Enterprise and Fastrack Servers, Apache, and Starnine Webster 3.0 (for Mac).
  • The user's browser must be Netscape Navigator or Microsoft Internet Explorer Version 3.0 or higher.
  • The user must have the Acrobat Plug-in or ActiveX control installed in the browser so that PDF files are displayed within the browser window.

Assuming all these elements are in place, it is easy to create the PDF and link to it. With the PDF document open in Acrobat, create a new destination at the page you want to link to and give it a logical name (e.g., section3). Add destinations with the Destinations palette (Window Choose àDestinations). Repeat for additional destinations. When you save the PDF file, be sure to check the Optimized checkbox. Optimizing the PDF file structures it page by page.

In the HTML document, make a link to the PDF file and the specific destination. The section name is separated from the file name by a hash symbol (#), as shown in this example:

<A HREF="article.pdf#section3">

Embedding a PDF file

A single-page PDF file can be embedded in a web page just like an image using the <img> tag:

<IMG SRC="directions.pdf" WIDTH="450" HEIGHT="400">

If a multipage PDF document is embedded in a web page, only the first page is displayed, without an Acrobat navigation toolbar. It is treated just like a static graphic. It is also advisable to list the file size of the file next to the link so users can make an informed decision whether to download it.

If the user clicks on the embedded PDF image, however, it launches the Acrobat Reader, where the multipage document is fully functional. This technique can be used to show a thumbnail of the PDF file before the file itself is opened.

Tips for Linking to PDF Files
As for any large media file, it is good web design etiquette to provide some indication of what users will get when they click on a link to a PDF file. The file format itself can be shown with a small PDF icon, by writing out the name of the file with its .pdf suffix, or by identifying the file type next to the link in parentheses, e.g., "link (PDF)".



Face Book Twitter Google Plus Instagram Youtube Linkedin Myspace Pinterest Soundcloud Wikipedia

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

Web Designing Topics