Creating Your Own Web Page

For any web site, the back-end files are composed of a combination of HTML, Javascript, and CSS. This web site hides the Javascript and CSS, so all you need to consider is the HTML code. Moreover, this web site's files each consist of three parts, the header, the CONTENT, and the footer. To make your own web page, you insert only the CONTENT. The details of the header and the footer are hidden, and are accounted for by entering single lines at the beginning and end of your HTML file.

Thus your HTML file will look like



<!--#include virtual='/cgi-bin/get_header' -->

CONTENT

<!--#include virtual='/cgi-bin/get_footer' -->


where CONTENT is HTML content. For example if you enter these three lines into a file and call the file sample.html, then the corresponding web page will look like this.


If you have several inter-related web pages, such as index.html, teaching.html, research.html, etc.html, you may wish to insert navigation links at the top of each page. For example the code

<center>
<p>
<a href="index.html">Home</a> |
<a href="teaching.html">Teaching</a> |
<a href="research.html">Research</a> |
<a href="etc.html">Etc</a>
</p>
</center>
produces the link header

Home | Teaching | Research | Etc


You may insert arbitrary \(\LaTeX\) in the CONTENT (see the link under Toolbox). Do not insert CSS in the CONTENT, use the minimal HTML tags in their stripped-down versions:

headings: <h1>...</h1>, <h2>...</h2>, ...
paragraph: <p>...</p>
bold, italic: <b>...</b>, <i>...</i>
font: <font>...</font>
ordered list: <ol> <li>...</li> <li>...</li> <li>...</li> </ol>
unordered list: <ul> <li>...</li> <li>...</li> <li>...</li> </ul>
table: <table> <tr> <td>...</td> <td>...</td> </tr> <tr> <td>...</td> <td>...</td> </tr> ... </table>
anchor: <a href='...'> ...  </a>
center: <center> ... </center>

Avoid using <br>, using this tag breaks the context-independent nature of HTML, i.e. a line will be broken whatever the window dimensions, leading to badly-formed pages. Also do not use the tags <html>, <title>, <body>, <div> as they are already in the included header. See Wikipedia for more information on HTML tags.