Pop up windows

A feature used in many websites is the provision of pop up windows. Pop up windows allow additional information to be appear in a separate window on the page.

This feature was experimented with on some of the pages when designing the MacRobertson's Round Australia Expedition online exhibition. Pop up windows can be useful for providing small amounts of additional information in a small window rather than linking to a full sized additional page on the topic however some browsers such as Internet Explorer on XP and versions of Mozilla Firefox can block the use of javascript or warn web page users that there is a pop up window each time the page is loaded. This becomes extemely annoying so it was decided not to use this feature on the site.

Pop up window example - provides an example of the use of a pop up window plus the code used to create it.

Some points to consider if planning to use pop up windows:

• Javascript is usually used to create the pop up window and to provide control over the size and design of the window although a basic effect can be created with html


• On the page containing the pop up window the script information can be added to the head section between script tags


• In the body of the page, additional code is added to the link code to enable the pop up window to appear


• Punctuation is important


• If pop up windows are to be used on a number of pages an external javascript page can be created and saved for example as popup.js - reference to the javascript page (src="popup.js") is made in the script tag section in the header


• Because not all browsers cope with pop up windows, html code is normally included in the javascript to produce a direct html link to the page containing the information if the pop up window is not going to work


• It is useful, in the pop up window, to include information about closing the window either as text or by using additional javascript to produce a close button

There are a number of pop up window tutorials available online. Below is a selection:

Popup windows - the basics
(includes explanation of each section of code)

How to make a pop-up window

The perfect pop-up

Popup windows

Tool Tips or Screen Tips

In many websites when the curser hovers over a link a small box displays a message. This message is called a tool tip or a screen tip.

The image map on the title page of the Round Australia Expedition online exhibition uses tool tips to indicate the location of the links to the eight sections of the expedition description.

The tool tip is created using the title attribute within the image tag.

An example would be title="map showing route of the expedition".
The alt attribute (alternative text) in some browsers will also provide a box displaying a message. This occurs in Internet Explorer but not in Mozilla Firefox. Alternative text is designed to be used to describe an image when the image is not displayed on the web page.

An example of the use of alternative text.

If the aim is to display tool tips on a web page it is recommended that both the title attribute and the alt attribute are used.

The following article - The Title Attribute - provides further information http://webdesign.about.com/od/htmltags/a/aa101005.htm

Image maps

In the Round Australia Expedition online exhibition a map of Australia showing the expedition route is used as an image map to provide links to the eight stages of the expedition.

An image map allows links from selected sections of an image to be made to different destinations.

Photoshop was used to determine the co-ordinates of the different sections wich were to be included in the html code. There are also specific image mapping programs available to determine co-ordinates.

As there are problems providing code in the blog, as the blog wants to turn the code into an image etc, it will be necessary to go to the actual web page to view the code and locate instructions for use of the code.

Go to the Round Australia Expedition online exhibition and locate the page containing the image map - http://210.15.209.254/RAE/RAEtitle.html

Place the curser on the webpage, avoiding the actual image that forms the image map, and click the right mouse button.



If the browser used is Internet Explorer click View Source to view the code that makes up the html page.

If the browser used is Mozilla Filrefox click View Page Source to view the code that makes up the html page.

Scroll down the page until you find the text - Begin image map - and further down the page the text - End image map.

The code for the image map is located between these two tags.

Information about the use of each section of the code is also provided.

Online exhibitions continued

Story-boarding this online exhibition was relatively straight forward. The main section is the story of the expedition which is divided into eight stages - Melbourne to Adelaide, Adelaide to Perth, Perth to Broome etc. A number of pages cover each stage and much of the story is told using images from the albums. In the early stages of the trip only a few photographs were taken but further into the trip a number of images were taken of sites of interest. In this case a link to a separate page provides more detailed information about the town or event.

The introduction section provides background information about the expedition and also information about material used for the online exhibition.

The daily reports section provides access to the actual reports made by the expedition party regarding the journey and can be read in stages or searches can be made for specific information using the Advanced Search option of the database in which the pages of the daily reports are stored.

Further sections of the website will include information about MacPherson Robertson and also about his confectionary business using a selection of images from the boxes of glass negatives in the MacPherson Robertson archive.

The further information section will include a bibliography and websites relating to MacPherson Robertson.

The design of the online exhibition was kept relatively simple using tables. The background colour is the same for all pages but the colour of the borders is changed for each section of the expedition. A cascading style sheet is used to control the uniformity of print style and size throughout the site. A small version of the MacRobertson map is located in the top left hand corner of each page and serves as the link back to the home page.

On the home page there are two options for navigating the following pages - a map of the expedition containing links to the beginning of each stage and hyper text links to each stage beneath the map.

The information about the expedition is progressively being added to the web pages and database following the timeline of the original journey 80 years ago. The first stage was added on 12 April, the second stage on 18 April etc. The additional stage links become 'live' as each new stage is added.

For this project choosing the material to use and to leave out was a major consideration. Especially in the initial stages time was spent carrying out additional research for the project especially checking background information about people met during the journey and events described.

When it came to putting the material together a number of options were tried. Initially the story was summarised with images but increasingly the text of the daily reports was used to tell the story using the words of the participants. That is when the decision was made to make the complete text of the journey available in a database and use the images and a summary of the text to tell the story in the main section of the online exhibition.

Checking the content is an ongoing process, especially checking that the hyperlinks link to the correct pages. The pages have been read and reread to try and eliminate typing and other errors. Misspelling the word expedition in the main heading and then cutting and pasting the error for multiple pages was an initial embarasing error. At least it is easier to make minor alterations in an online exhibition than in a traditional exhibition.

A major challenge when designing anything for the web is that those viewing the pages use different browsers and often change the settings on their computers resulting in different sized print on the screen. The pages were checked in Internet Explorer and in Mozilla Firefox browsers and a number of alterations were required before the pages would work as required in both browsers. It is rather disconcerting to view pages that work well on one computer screen not looking as designed on another screen (even using the same browser) because the screen settings have been changed from the default.

Online exhibitions

Online exhibitions are a useful way of telling a story. They can be an adjunct to an exhibition held in a physical space or can be a separate entity.

Like any exhibition there are a number of tasks to be undertaken:

• Planning
• Resources available


• Research


• Story board


• Designing the pages


• Putting it all together


• Checking the end product

MacRobertson's Round Australia Expedition 1928 is an online exhibition recently added to the Royal Historical Society of Victoria website. This project has evolved over the past two years. It has been developed to commemorate the eightieth anniversary of the expedition, consisting of two trucks, an oldsmobile and 12 men, which left Melbourne in April 1928 for a five month journey around Australia.
The RHSV collection includes an archive of photographs, papers and memorabilia relating to the business and other interests of MacPherson Robertson. The collection includes albums of photographs taken during the expedition as well as typed notes and newspaper articles providing information about the five month journey.



Using the information from these resources the story of the expedition, the challenges faced by the expedition party and their view of the often remote parts of Australia visited is portrayed in this online exhibition.
Photographs from the albums were scanned. Normally images for Internet projects are resaved as 72 dpi jpg images but as the original images were small, for this project they were resaved as150 dpi jpg images for Internet use. A thumbnail program - Easy Thumbnails - was used to ensure all the images were no wider or longer than 350 pixels.
The story of the expedition was told from two sources - a carbon copy of daily notes on the progress of the expedition prepared for MacPherson Robertson and newspaper cuttings reporting on the expedition published throughout Australia.
As the typed notes were blury and we only had an old elementary entry OCR program transcriptions were made of the notes and the entries for each day were entered into a database (DB/TextWorks). Report forms were created so that the records could be read chronologically. When there was an image that related to the daily record it was included.


The RHSV is able to publish DB/TextWorks databases online but if there was not that facility it would have been possible to save sections of the records as html files to include in the online exhibition.
Information from the notes and the newspaper articles were used to provide a summary of the expedition and together with the images tell the story of the journey in html pages.