Skip to content | Change text size
 

Basic HTML for InterLearn authors

In creating your InterLearn materials you will need to know some basic HTML (HyperText Markup Language). Very basically, HTML uses pairs of "tags" or markers to enclose the text you wish to format. Each pair has an opening tag, followed by the text to be formatted, then a closing tag. Below are outlined some of the more important tags that you will need to use in creating your HTML fragments.

Formatting

Formatting effect

Tag

Example

Paragraph

All text must be enclosed within paragraph tags.

<p>The text forming the paragraph.</p>

"<p>This is the first paragraph in my story.</p> <p>This is paragraph two and follows number one.</p>" would appear as:

"This is the first paragraph in my story.

This is paragraph two and follows number one."

Bold

<b>text to appear bold</b>

"This text is <b>bold</b>." would appear as "This text is bold."

Italic

<i>text to appear italic</i>

"This text is <b>italic</b>." would appear as "This text is italic."

Bullet lists

<ul>
<li>first bullet point</il>
<li>second bullet point</li>
<li>last bullet point</li>
</ul>
  • first bullet point
  • second bullet point
  • last bullet point

Ordered lists - numerical

<ol>
<li>item number one</li>
<li>item number two</li>
<li>final item</il>
</ol>
  1. item number one
  2. item number two
  3. final item

Ordered lists- lower case alphabetical

<ol type="a">
<li>item number one</li>
<li>item number two</li>
<li>final item</il>
</ol>
  1. item number one
  2. item number two
  3. final item

Ordered lists- upper case alphabetical

<ol type="A">
<li>item number one</li>
<li>item number two</li>
<li>final item</il>
</ol>
  1. item number one
  2. item number two
  3. final item

Ordered lists- lower case Roman numerals

<ol type="i">
<li>item number one</li>
<li>item number two</li>
<li>final item</il>
</ol>
  1. item number one
  2. item number two
  3. final item

Ordered lists- upper case Roman numerals

<ol type="I">
<li>item number one</li>
<li>item number two</li>
<li>final item</il>
</ol>
  1. item number one
  2. item number two
  3. final item

Tags may be nested within one another, however you should always close tags in the order in which you opened them. For example the following paragraph:

This paragraph contains bold text, some of which is also italicised.

Would be written as:

<p>This paragraph contains <b>bold text, some of which is also <i>italicized</i></b>.</p>

Note that underlining is not included in the list of formatting options above. This is because the web uses underlining to represent a hyperlink. It is not good practice to use underlining as a formatting option as it can confuse users into thinking it may be a link, particularly for those who may not be able to distinguish between the colours on the page.

Symbols and Special Characters

HTML does not recognise multiple spaces between characters. This means that you cannot use spaces to simulate a tab or a table, set the distance between words, center or justify text. If you require more than once space in a row you will need to use the HTML string that represents a space. This and other HTML strings that may be of use are presented in the table below and a full list can be found at http://www.primeshop.com/html/jump3b.htm.

HTML String: Symbols

Represents

HTML String: Math

Represents

&nbsp;

non-breaking or blank space

&#43;

+

&amp;

&

&#45;

-

&lt;

<

&plusmn;

±

&gt;

>

&mult;

´

&quot;

"

&div;

¸

&reg;

â

&#61;

=

&copy;

ã

&#131;

¦

&#153;

ä

&#181;

m

&#37;

%

&frac14;

¼

&#64;

@

&frac12;

½

Hyperlinks

Another important part of html that you may wish to use is hyperlinks, or links to other documents. These are created as:

<a href="http://yourlink.com">the link text you wish people to click on</a>

You must include the inverted commas and the http:// in order for the link to work.

If you are providing links as references for students it is advised that the link text you wish people to click on is the web address itself. Then if the page is printed as a future reference the web addresses will still be identifiable. For example:

<p>Students can search the Monash University library catalogue by visiting the library’s web site at <a href="http://www.lib.monash.edu.au">www.lib.monash.edu.au</a>.</p>

Email links

Email links are a type of hyperlink so the format outlined above is followed. However in place of the web address you must type the following "mailto:email@address.com". So an email link to the Jo Bloggs hotmail account would be as follows:

<a href="mailto:jo.bloggs@hotmail.com">Email Jo Bloggs at Hotmail</a>
Return to Staff Documentation