Tutorial: Creating a Mathcad
Web Site
This short tutorial on building a Mathcad Web Site is excerpted from
the Author’s Reference in Mathcad, under the Help menu. Topics include:
Education appropriate templates are provided and explained at the end
of the tutorial.
Introduction to Mathcad-Generated Web Sites
Mathcad is known for the ease with which math equations, text, and graphics
can be combined in a single document. For authors and publishers, these
documents can form the basis of a typeset, formatted, mathematics-based
Web site for online distribution. Mathcad documents can be exported as
HTML, with a variety of options for displaying equations and graphs. Documents
are then viewable by anyone with a standard web browser (Netscape 4.7
or greater, or IE 5.0 or greater). In addition, all documents exported
by Mathcad can be read back into Mathcad for further calculation.
Special Features of Mathcad Generated Web Sites
Mathcad makes it easy to publish mathematics online, formerly an arduous
task involving the creation of many images and complicated markup by hand.
When you use Mathcad to generate HTML pages, the following features apply:
- Every equation retains information about its content, not just how
it looks on screen; this means you can read the documents back into
Mathcad as if they were native .mcd files, with all calculations intact.
- Because HTML documents behave like Mathcad documents within Mathcad,
it's easy to edit them: just open the .htm version and edit in Mathcad,
then Save As… or Save As Web Page… in HTML format again.
- Embedded images and hyperlinks will be preserved as you go from Mathcad
to the Web. Links to .mcd files in Mathcad will be converted to links
to .htm files in HTML.
- Anyone can browse your documents.
- HTML documents can include any additional markup, Javascript, or
other Web features you wish to create in the exported document. We recommend
you use HTML templates for additional content, so this content will
be preserved as you bring documents in and out of Mathcad.
The following sections discuss the steps to create your own Mathcad Web
Sites.
Images vs. Presentation MathML
Two formats are available for storing equation regions: you can choose
images, which are viewable by everyone but require additional files, or
presentation MathML in one of several versions, which will require a MathML
renderer or a browser which is capable of rendering MathML. In either
case, content MathML is stored in the file, so it can be read back into
Mathcad.
What is MathML?
MathML is the math markup language developed to the XML standards of
the W3C. MathML markup can exist in the same document with standard HTML
for text and graphics. Mathcad will do all the HTML and MathML markup
for you, based on the equations, text, and graphics in your existing Mathcad
document. You can even apply an export template, if you choose, that creates
the navigation, headers and other stylistic elements for a Web site.
If you wish to use presentation MathML for equation display, you and
your readers will require a MathML renderer. Some browsers can also render
MathML natively, for which you'll have to use the inline MathML option.
Check www.mathcad.co.uk for information
on rendering options.
Creating Mathcad Files for HTML Export
First, create the Mathcad worksheets that, when exported, will comprise
your Web site. Place all the worksheets into a folder designated for your
Web Site. When you are naming files, you may wish to use some organized
naming scheme, such as topic0.mcd, topic1.mcd, topic2.mcd, etc…,
and retain these names when you export to the .htm versions of the file.
Some of the sample templates included with Mathcad use Javascript to keep
track of files in the site, but require them to have sequential naming
structures such as this.
To create a consistent look for your worksheets, you can create and use
templates and text styles. Note that Mathcad templates
are used for setting styles within Mathcad, and are different from HTML
templates that are used to create HTML navigation and wrappers for HTML
content. The use of Mathcad templates to set styles in your document is
recommended, as these styles will be translated to an inline Cascading
Style Sheet in the output HTML document.
When you are using an HTML template, you will have to use relative layout
in your documents, as selected in Preferences on the “HTML Options”
tab. Mathcad regions are exported into an HTML table that tries to maintain
horizontal and vertical positioning between regions through rows and columns.
The more consistent you are about aligning regions to several well-defined
vertical guides, the quicker and cleaner this export will be. We suggest
you use Guidelines every 1.5 inches or so. See Mathcad Help on aligning
regions and using the Ruler guidelines.
Once you have created your worksheets, you can hyperlink documents for
your Web site.
Tip: If you want to include data from a data file in
a worksheet, you should insert an input table and import the data into
it. This will ensure your Web page is readable when it comes back into
Mathcad. Refer to Mathcad Help on Importing Data from a Data File for
information on importing data to an input table.
If you are using Referenced Files in your worksheets, be sure to save
the Referenced File as HTML as well, so it goes along with your project.
References will be turned into hyperlinks on export. Note that collapsed
Areas will not be visible or accessible in a Web browser, but the information
within them will be retained if the page is read back into Mathcad.
Tip: You may edit your HTML pages as Mathcad worksheets
right in Internet Explorer. Simply choose Edit with Mathcad Application
from the File menu, make your changes, and update the
page, all within the browser window.
Adding Hyperlinks Between Files for
HTML Export
You can insert hyperlinks to Mathcad files from each of the topics in
a Mathcad table of contents, or from specific areas in individual files,
to allow users to quickly browse the contents of your documents. Mathcad
hyperlinks are exported as .htm anchor links in standard HTML markup.
Be sure to export all linked and referenced documents, or these links
won’t have a file to point to.
Note that in order for hyperlinks to export meaningfully to HTML, you
must choose the “Use Relative Path” box in the Insert Hyperlink
dialog. It is also best to specifically select a few important words or
phrases for the link, rather than linking from a whole region. When links
are displayed in HTML, you’ll find whatever text you chose rendering
with color changes and underlining, so choose your link text carefully.
After creating the Mathcad worksheets, aligning them properly, linking
them together, and creating a table of contents, if necessary, you may
wish to create an HTML Template file to specify any HTML wrapping for
your exported documents.
Creating an HTML Template File
HTML templates are used when you save a document as HTML. You can extend
the collection of templates by creating your own. For example, you may
want to create a template for a Web site that contains navigation buttons
in the header and footer, images or dates in certain places, or you may
want to apply an external CSS style sheet in the head of every Web file.
A sample HTML template is provided in the templates directory.
To create a new template:
- Open a new file or the existing sample template file in any text
or HTML editor.
- Make sure the following comment regions are in your file:
In the document <HEAD> tags:
<!-- #BeginEditable "Title" -->
<title>sample title goes here</title>
<!-- #EndEditable -->
<!-- #BeginEditable "HTMLheaders" -->
META tag information written here
<!-- #EndEditable -->
<!-- #BeginEditable "HTMLstyles" -->
Cascading styles written here
<!-- #EndEditable -->
Be sure to fill in a title between the title tags. This title is only
overwritten when you specify a new title in the Save As Web Page dialog
box. If you do not specify a new title, the template title tags will
be used.
In the document <BODY> tags:
<!-- #BeginEditable "HTMLcontent" -->
HTML Content from Mathcad worksheet written
<!-- #EndEditable -->
- Add any additional HTML markup you want to appear on every page you
export to HTML.
- Save the file with your chosen template name and an .mlt
extension.
Your template is browsable from the HTML Options tab in the Preferences
dialog box.
Setting your HTML Output Preferences
When preparing to export Mathcad documents as HTML, you’ll want
to set a preferences for formatting and images, and select your output
template, if desired. The Preferences dialog box is displayed by choosing
Preferences… from the Tools menu.
Click the “HTML Output” tab to set HTML export choices.
Equation Export
Choose to display your equations as images or MathML. If you choose images,
equation regions will be saved according to the image choices set for
the document (see below). If you choose MathML, select whether it will
be wrapped in <OBJECT> tags for display with IBM techexplorer, or
if it will be placed inline with the HTML as additional markup. The second
option requires a specialized browser that reads MathML tags. The first
requires an Active-X component to be downloaded and installed on the browser.
Image Export
You can set the format for image export to JPEG or PNG. PNG is a “lossless”
format that often results in clearer images for graphs and drawings, while
JPEG images are often smaller and usually compatible with older browser
versions. Note that all Mathcad objects that are not equations (graphs
and data tables in particular) cannot be expressed as HTML. These objects
are exported as images.
Layout Style
You can choose whether a document will use relative or absolute positioning
when exported to HTML. If the Save layout as option is set to “Relative”
your Mathcad regions will be output into an HTML table which attempts
to retain relative horizontal and vertical placement between regions.
This makes it possible to edit the HTML document outside of Mathcad to
include additional HTML-navigation links, images, etc., as all positions
of text and math on the page will reflow depending on what comes before
them. Relative layout must be selected to use HTML templates.
If you check the fixed layout radio button, each HTML expression will
be precisely positioned on a Web page, mimicking the original Mathcad
document as precisely as possible, but making it difficult to add new
items to the page outside of Mathcad. Choice of template will be ignored
in this case.
When you are satisfied with your choices, you can save your files as
HTML. You can also set these preferences at save time by choosing Save
as Web Page from the File menu.
Note: Changes to your template file will only affect
future Mathcad documents saved out as HTML, it won’t retroactively
change files already saved.
Finishing your Web Site
To check your finished Web Site:
Save all Mathcad documents to be included in the site as HTML files, making
sure that the file names are what you expect them to be given any interdocument
hyperlinks or scripting in your templates.
Open the first page (probably called index.htm or default.htm) containing
your table of contents, and click around to the other pages on your site
using your hyperlinking structure. You should find all links correctly
translated to .htm files, and all content from your templates inserted
around the HTML from your Mathcad documents.
Correct any filenames, template problems, or alignment problems for Mathcad
regions that aren’t exporting as expected.
That’s it, you’re done. You can put your .htm files, and
their associated image directories, on any internal or external Web server.
|