Skip NavigationDesign Science: How Science Communicates
Products Solutions Store Support Reference Company View Cart
 
 
TechNote #68: Last modified: 11/1/16

Publishing Documents Containing Equations on the Web


The information in this document applies to:

MathType 6.x (Windows & Mac) Adobe Acrobat (Windows and Mac)
Microsoft Word 2002 and later (Windows)
Microsoft Word 2011 (Mac)

Issue

There are a number of different ways to distribute documents containing MathType equations over the internet. This document enumerates your options and analyzes the pros and cons of each.


Reason

There are a number of competing technologies for distributing documents on the World Wide Web. In order to choose an appropriate method, you should consider whether the documents will be viewed in browsers, printed out, or both, whether you are comfortable with complex methods which provide greater control or prefer simpler solutions which yield more basic pages, and what requirements you can comfortably impose upon the people viewing your documents. 


Solution

This document will discuss some of the current methods for publishing documents containing equations on the web. This document does not explain how to create documents for web pages. The focus here is to present the advantages and disadvantages of each method so you can make a more informed decision before committing to a specific method. The methods discussed are:

  1. Using a Word document file
  2. HTML Translators
  3. GIFs, HTML, and Cascading Style Sheets
  4. Adobe Acrobat PDF documents
  5. MathML
  6. TeX

Word document file

OVERVIEW

Microsoft has created a plug-in that allows Internet browsers that support plug-ins, such as Microsoft Internet Explorer and Firefox, to display Word document files directly in the browser window.

PROS

  • Formatting of the document is retained throughout.
  • Equations size correctly regardless of display resolution.
  • Equations display and print out correctly at any resolution.

CONS

  • End user must be using a browser that supports plug-ins.
  • Plug-ins/viewers must be downloaded and installed before the process works.
  • If end users do not have the fonts that were used in the creation of the document, the operating system substitutes in a different font, causing the document and equations to display and print incorrectly.
  • The Microsoft Word viewer plug-in does not support embedded font extraction.

ANALYSIS

While Word itself supports the ability to embed and extract fonts that are stored directly into a DOC file (see our technical notice regarding embedding fonts for more info), the Word plug-in viewer does not. This will result in the display and printout of the equations to be incorrect if the person viewing the DOC file does not already have all the fonts used in the creation of the document (in most cases, if you haven't given them the fonts, they won't have them). In this case, attempting to view the DOC file in the plug-in viewer will produce undesired results. Otherwise, if you know that your audience has all the appropriate fonts used in the creation of the DOC file, this is one option that works fairly well.


HTML Translators

OVERVIEW

Many word processors (such as Microsoft Word, Corel WordPerfect, etc.) allow authors to save their documents to HTML format so that they can place these documents on the web to be viewed in web browsers directly.

PROS

  • Quick and easy translation of a document into HTML format that requires very little HTML knowledge.
  • Equations get converted to GIFs automatically.

CONS

  • Vertical alignment of equations in relation to the text is not retained. Inline expressions get positioned too high.
  • Word processors may not convert MathType equations to GIFs properly.
  • GIFs display on multiple monitors at different DPI (dots per inch) will cause the GIF to either expand or shrink in size.
  • Equations will no longer be editable as the conversion process from equations to GIFs will remove all the necessary information needed to edit them in MathType.
  • GIF files are low resolution which, if printed, results in poor print quality.

ANALYSIS

If your main goal is to have the largest number of browsers be able to display the equations quickly, this is the option you will want to consider. But do note that what is gained in speed of creation is lost in the formatting of the end result. While this method allows anyone to create HTML documents that can then be posted on the Internet, the formatting changes that occur as a result of HTML's lack of support for vertical positioning make this a viable option only for those users who construct their documents with display equations. Display equations sit on lines by themselves, rather than in-line with surrounding text. There are other alternative methods that will deal with formatting issues below.


GIF, HTML, and CSS

OVERVIEW

Another way to create web pages is to actually type the document in HTML using a text editor. MathType can save an expression to as a GIF file and create the HTML image <IMG> tag and attributes that will allow you to insert the GIF equations into your HTML document. While the content of the tag is user-definable in MathType's Web and GIF Preferences menu, an example of what the default settings generate when you paste it into your text editor appears below for an equation saved as a GIF named QUAD.GIF:

<IMG SRC=QUAD.GIF HEIGHT=44 WIDTH=128>

Using HTML along with CSS (Cascading Style Sheets), an HTML author can deal directly with the issue of vertical positioning. MathType supports the ability to include various tag information that will aid in the creation of the CSS tag information. An example of what this output would look like would be:

<IMG SRC=INTEGRATION.GIF STYLE="POSITION:RELATIVE; TOP:21.7PT" HEIGHT=88 WIDTH=256>

PROS

  • GIF translation is always correct (no spacing or font substitution problems).
  • The GIF files that MathType generates can be reloaded into MathType for future editing.
  • Equations display properly in any browser on any platform simply because of the fact that the GIFs are supported by all major browsers..
  • Precise vertical alignment is obtainable via CSS.

CONS

  • This process requires a strong knowledge of HTML and CSS syntax.
  • If CSS is used, you are limited to the scope of browsers that support CSS.
  • Depending on the resolution that the GIF is created at, the GIF display on multiple monitors at different PPI (pixels per inch) will cause the GIF to either expand or shrink.
  • GIF objects are low resolution files which, if printed, results in poor print quality.

ANALYSIS

With a good understanding of HTML and CSS, an author could make a document with equations look very much like the original document. While this method will allow users with a strong knowledge of HTML to deal with inserting equations into HTML code, this is not the best way to go for users who want to quickly produce documents through a word processor for viewing on the web nor does this method deal with the issues of display resolution.


Adobe Acrobat PDF format

OVERVIEW

Adobe Acrobat was created out of a need to be able to distribute documents to other users without the formatting issues that typically plagued users, such as font substitutions, lack of support for certain features, inability to view a file due to a lack on the recipients part to have the program that generated the file, considerations of display resolution, etc. Adobe produces a printer driver that allows the author to generate a file in PDF (Portable Document Format). The PDF file can then be placed on the Internet where users can then either view the document in their browsers if the browser supports the free PDF plug-in. Otherwise, the user can download the PDF and view it off-line using Adobe Acrobat Viewer, with can be downloaded for free. 

If you have questions about the PDF format, please visit Adobe's website.

PROS

  • Equations display correctly because formatting and text are all retained from the original document it was created from.
  • The Acrobat Reader and the Acrobat plug-in for Netscape and Microsoft Internet Explorer are free to download so anyone that is using a browser that supports plug-ins can view these documents without having to purchase additional software.
  • Ease of use in the creation of the PDF files.

CONS

  • End user must be using a browser that supports plug-ins or view files off-line.
  • Requires viewer or plug-in to be downloaded and installed before viewing.
  • PDF files are slightly larger and take slightly longer to download than other formats.
  • Content is not searchable via Internet search engines.

ANALYSIS

If your goal is to be able to display your document as close to the original as possible, this is the option to choose. Since Adobe has a plug-in for both Netscape Navigator and Microsoft Internet Explorer, the majority of Internet end users qualify to use the plug-in. However if your main goal is to serve all the various browsers that are available, using a word processor to convert documents to HTML or manually constructing the HTML documents with GIFs will work better.


MathML

OVERVIEW

MathML has been around since 1998, and allows for the markup of expressions that are then translated in the web viewer directly. An example of what a MathML code looks like in its raw form:

<math displaystyle='true'>
   <mrow>
      <mfrac>
         <mrow>
            <mo>-</mo><mi>b</mi><mo>&PlusMinus;</mo><msqrt>
               <mrow>
                  <msup>
                     <mi>b</mi>
                     <mn>2</mn>
                  </msup>
                  <mo>-</mo><mn>4</mn><mi>a</mi><mi>c</mi>
               </mrow>
            </msqrt>
         </mrow>
         <mrow>
            <mn>2</mn><mi>a</mi>
         </mrow>
      </mfrac>
   </mrow>
</math>

If you have any questions about this format, please go to the W3C committee website.

PROS

  • Formatting is handled automatically.
  • Faster download times due to lower overhead.
  • Plug-ins / viewers deal with converting MathML to WYSIWYG equations.
  • Proper vertical alignment when placed in-line with text.
  • Equations can be searched.

CONS

  • End user must be using a browser that supports plug-ins or MathML directly.
  • Plug-ins / viewers must be downloaded and installed before the process works.

ANALYSIS

Please see the W3C's list of software that supports MathML for a list of software that you can use with MathML.


TeX

TeX is another way to publish mathematics. Used mainly by high end publishing houses, universities, and government agencies, TeX was the first attempt to format mathematics within the electronic realm. An example of what a TeX expression looks like in it's raw form:

$$x={{-b\pm \sqrt {b^2-4ac}} \over {2a}}$$

Different translators/plug-ins will deal with the various versions of TeX in a web document differently. As time goes on, there will most likely be a growing number of companies that will produce these plug-ins. Your best bet would be to search the Internet yourself for the latest developments in this area.

PROS

  • Formatting is handed automatically.
  • Faster download times due to lower overhead.
  • Plug-ins deal with converting TeX to WYSIWYG equations.
  • Proper vertical alignment when placed in-line with text.
  • If you already have documents composed in TeX, minimal changes are required.

CONS

  • Requires that the author be familiar with the TeX language (for tweaking purposes).
  • End user must be using a browser that supports plug-ins.
  • Plug-ins / viewers must be downloaded and installed before the process works.
  • Some plug-ins only deal with one variation of TeX (Plain Tex, LaTeX, PCTeX, RevTeX, AMSTeX, etc.).
  • Plug-ins have their own problems with formatting TeX.

ANALYSIS

If you have documents that have already been converted to TeX that you do not want to modify, this would be your best approach. You will need to research which plug-in viewers are best suited for the flavor of TeX that the document is written in and then evaluate the end result that those plug-ins generate.


Top of page

TechNotes Home   |   TechNote Wizard   |   Contact us

Copyright ©1996-2018 Design Science, a Wiris company. All rights reserved.
Privacy statement
Follow MathType: