Web Development - Semester 1, 2004 Examination

Question 1

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Question 1</title>
    <link rel="stylesheet" media="screen" href="default.css" />
    <script type="text/jasvascript" language="javascript" src="standard.js">
    </script>
</head>

Briefly describe each element listed within the <head> element above.
What other code should appear in the <head> elements. Give an example and briefly describe its purpose.
What is the primary purpose of XHTML in a Web document?
What is meant by the terms logical markup element and physical markup element with respect to how the browser renders them in XHTML documents?
Why is XHTML code considered desirable over HTML code?

(6+3+2+2+2=15 marks)

Question 2

In order to achieve a corporate look and feel for a website, it is commmon to use XHTML templates which have a standard (corporate) design such as a banner across the top and a navigation bar on the left of each web page at the site. Describe a method of achieving this other than using frames.
Identify the primary difference between relative and absolute Universal Resource Identifiers (URI). Your answer should indicate situations where it is preferable to use relative URIs rather than absolute URIs. Include a simple example of both URIs.
What is the purpose of the following XHTML code and specify where is it located in the document.

<base href="http://extremedesigns.com.au/interactive" />

(5+3+2=10 marks)

Question 3

The following frameset diagram has a title bar (source titlebar.html) that occupies 15% of the vertical space of the window, a list of internal navigation links (source - navbar.html) and a destination frame (initial source - start.html) which occupy 20% and 80% of the horizontal space respectively.

Title Bar
Navigation Bar	Destination Frame

Clicking links from the navigation bar will cause the page to be loaded into the destination frame.

Write the complete frameset document to the above specification
Write the XHTML code necessary (ie. a single anchor element) which will cause a link from navbar.html to load into the destination frame.
Write the XHTML code necessary (ie. a single anchor element) which will cause a link from navbar.html to replace the frameset. Do not use Javascript for this.

(6+2+2=10 marks)

Question 4

Supply well written XHTML code to generate the following Web Page. The page contains an image ‘feral.jpg’ (180x120pixels). The email address is n.mcewan@latrobe.edu.au and the ‘home’, ‘history’ ‘photos’ and ‘ movies’ links are hypertext links to feralracing.html, racehistory.html and two named anchor tags (photos & movies) within multimedia.html respectively. The NHRA online link is a hypertext link to http://nhra.com.
This web page makes use of only one table and has a background image ‘ yellowCudaBG.jpg’.
NOTE: This page does not contain any CSS definitions or JavaScript code. There is no need to include the XML declaration, the DTD declaration or reference to the XML namespace in your code.

(20 marks)

Question 5

Given the following Cascading Style Sheet definitions, answer the following questions.

External (myStyles.css): p.box { background-color:#ffcccc; border" thin solid !important; }
embedded definition: p.box { background-color:white; border-style:dashed;}; p em {color:red !important;}; em { color:teal; }
inline: <p class="box" style="font-color:blue;">Style sheets are for presentation</p>

What type of selector is the definition in myStyles.css
List and briefly describe the other types of selectors. Use examples to define the selector and demonstrate their implementation.
How will the text in the paragraph container appear when rendered?
Describe the difference between the CSS definitions for em above. Give examples of how each may be used and how the text would be rendered.
What is the pupose of <span> and <div> elements and how are they different to each other?

(1+5+2+3+4=15 marks)

Question 6

Write a complete web page which requires the user to input a month number. When the user presses a button labelled " determine month number", the name of the month will be displayed in a box on the current webpage. Should the user enter an inappropriate month number, an appropriate message will be displayed in the box where the month name appears. If there is no entry for the month number when the button is pressed, a dialog box must appear which indicates that an entry must be made.

NOTE: This web page is not processed by another web page

There is no need to include the xml declaration, doctype declaration or reference to the XML namespace in your code.

(15 marks)

Question 7

Write the Javascript necessary to dynamically generate a table containing three columns. The first column has a numeric value (X), the second column has the inverse of the value (ie 1/X), and the third column has the square root of the the value in the first column (ie Math.sqrt(X)). Assume that the number of decimal places is determined by Javascript.