How to Link to non-HTML Resources with HTML5

Links can connect to virtually any kind of file, such as word processing documents, spreadsheets, PDFs, compressed files, and multimedia. Two typical uses for non-HTML links are software and PDF download pages.

File downloads

Non-web files must nevertheless be accessed via the Internet, so they possess unique URLs, just like HTML pages. Any file on a web server (regardless of its type) can be linked using a URL.

For instance, if you want your users to download a PDF file named doc.pdf and a Zip archive called software.zip from a web page, you use this HTML:

<h1>Download the new version of our software</h1>
<p><a href="software.zip">Software</a></p>
<p><a href="doc.pdf">Documentation</a></p>

You can’t know how any user’s browser will respond to a click on a link that leads to a non-web file. The browser may

  • Prompt the user to save the file.

  • Display the file without downloading it (common for PDFs).

  • Display an error message (if the browser can’t handle or doesn’t recognize the type of file involved).

Because you can’t know how a browser will respond, help users download files successfully by providing

  • As much information as possible about the file formats in use

  • Any special tools they need to work with the files

    • Compressed files: To work with the contents of a Zip file, the users need a compression utility, such as WinZip or ZipIt, if their operating systems don’t support Zip files natively.

    • PDFs: To view a PDF file, users need the free Adobe Acrobat Reader (or some equivalent, such as Nitro PDF Reader).

You can make download markup more user-friendly by adding supporting text and links, like this:

<h1>Download our new software</h1>
      <p> <a href="software.zip">Software</a> (1.2 MB compressed ZIP file)</p>
      <p><b>Note:</b>
            You need a zip utility such as
         <a href="http://www.7-zip.org">7Zip</a> (Windows) or
         <a href="http://www.maczipit.com">ZipIt</a> (Macintosh)
            to open a ZIP file.</p>
     <p><a href="doc.pdf">Documentation</a> (440 KB PDF file) </p>
     <p><b>Note:</b>You need the free
        <a href="http://get.adobe.com/reader/">Adobe Reader</a>
           to view a PDF file.</p>

The figure shows how a browser renders this HTML, and the dialog box it displays when you click the Software link.

image0.jpg

E-mail addresses

A link to an e-mail address can automatically open a new e-mail addressed to exactly the right person.

This is a great way to help users send you e-mail with comments and requests.

An e-mail link uses the standard anchor element and an href attribute. The value of the href attribute is the target e-mail address, prefaced with mailto:.

<p>Send us your
  <a href="mailto:comments@mysite.com">comments</a>.</p>

The user’s browser configuration controls how the browser handles an e-mail link. Most browsers follow these two basic steps automatically:

  1. Open a new message window in the default e-mail program.

  2. Insert the address from the href attribute into the To field of the message.

Unfortunately, web page mailto: links are a prime source of e-mail addresses for spammers. Creating a form to receive feedback is often a better idea; better still, use JavaScript encryption on the e-mail address. (For more info, see Steven Chapman’s great article “Hiding Your Email Address” on About.com.)

One safe way to provide an e-mail addresses is in the form: ed at edtittel dot com, knowing that people are smart enough to substitute @ for at and . for dot, and also knowing that address-harvesters usually aren’t that canny.

If you elect to use a form instead, be aware that this too can present security issues — always be sure to check your input, or take steps to avoid so-called SQL injection attacks. For more info, see Colin Mackay’s article “SQL Injection Attacks and Some Tips on How to Prevent Them” on the Code Project website.

  • Add a Comment
  • Print
  • Share
blog comments powered by Disqus
Advertisement

Inside Dummies.com

Dummies.com Sweepstakes

Win $500. Easy.