Math Typesetting for the Internet

Math Expressions as GIFs:
Step-by-Step Instructions

Table of Contents || Math In Web Pages || Simple Methods || GIF Pro/Con

For a collection of 991 bit-mapped, 12-point, transparent GIFs of mathematical letters and symbols, in the public domain and suitable for display on a Web page, see Norman Megill's GIF Images for Math Symbols.

Note: some of the instructions below may be Macintosh-specific.

  1. Typeset the Expression
    Use an application that can represent mathematical notation. For example, I use Equation Editor, which can be optionally installed along with Microsoft Word. Here are some other choices:

    • MathType
      The full-featured parent product of Equation Editor. For Windows and Macintosh.
    • MathEdit
      K-Talk Communications has developed this equation editor for Windows.
    • TeX
      Among mathematicians, the preferred application for producing well-formatted print material. Difficult to understand if you haven't used it before, but very flexible.

  2. Convert it to a GIF
    How you do this depends on how you did the typesetting; the point is to get a transparent-background GIF with your expression on it. Here are a few methods for accomplishing the task:

    • Check the "Save As..." Options in your Typesetting Program
      Depending on the typesetting software you've used, it may be possible to save the expression as an image file within the program. MathType 3.5, for instance, allows you to save equations as GIFs. If this is not an option, you might be able to:

    • Copy to Clipboard and Paste into Graphics Program
      I use Clip2GIF, a shareware program which you can download from the Forum Internet Software page, among other places. I copy the equation to the clipboard in Equation Editor and then convert the clipboard to a GIF with Clip2GIF (making sure that Options - Transparent Background - White is checked). If this doesn't work for you, you can always:

    • Take a Screen Shot
      If you can manage to display the expression on your monitor just the way you'd like to see it on the web, you can take a screen shot and convert the cropped image to a GIF with a graphics program.

    • Options for TeX Users (UNIX-based)
      Assuming you've created a TeX document to display some relatively short mathematical expression (and not the entire text of what you wish to be your web page), the easiest tool to use is the textogif converter, which does exactly what it says. If, on the other hand, you want to convert an entire LaTeX document into HTML, use LaTeX2HTML.

  3. Place GIF on Web Page
    View the GIF in your web browser to make sure it looks the way you want it to. Ideally you want an image that (1) is easily read, (2) has a transparent background, and (3) is about the right size, according to your standards. The last thing to do is include the GIF in your web page with an image tag. Here's an example:

      This image....
      [-b+-Sqrt[b^2-4ac]]/2a coded as follows...
      <img alt="[-b+-Sqrt[b^2-4ac]]/2a" src="images/quad.gif">
      Some people may view your page without images, so it's important to use the alt tag to describe what's in your GIF. For more information about HTML code involved in embedding images in web pages, please see the Bare Bones Guide to HTML.

[Privacy Policy] [Terms of Use]

Home || The Math Library || Quick Reference || Search || Help 

© 1994- The Math Forum at NCTM. All rights reserved.