Southern College Kolej Selatan 南方学院

Final Examination

Semester 2 / Year 2011

COURSE : INTERNET APPLICATION COURSE CODE : CSIS1013 TIME : 2 1/2 HOURS DEPARTMENT : COMPUTER SCIENCE LECTURER : TEE CHENG SIEW Student’s ID : Batch No. :

Notes to candidates: 1) The question paper consists of 6 pages and 3 parts. 2) Part A consists of 3 questions. 3) Part B consists of 2 questions. 4) Part C consists of 1 question. 5) Answer Part A in answer booklet. 6) Submit answer of Part B and Part C in softcopy. 7) Answer all questions.

INTERNET APPLICATION

1 / 6

Part A (30 marks)

1. Sketch the output based on the following HTML code: (6 marks)

(a) <frameset rows="16%,84%"> <frameset cols="50%,50%"> <frame src="tl.htm" name="tl"> <frame src="tr.htm" name="tr"> </frameset> <frame src="bottom.htm" name="bottom"> </frameset> (b) <frameset rows="16%,84%"> <frame src="top.htm" name="top"> <frameset cols="50%,50%"> <frame src="left.htm" name="left"> <frame src="right.htm" name="right"> </frameset> </frameset>

2. Write HTML code to display the output as following: (12 marks)

INTERNET APPLICATION

2 / 6

3. Write HTML code to display the output as following: (12 marks)

Text area: row=5 and column=30

INTERNET APPLICATION

3 / 6

Part B (40 marks) Based on the information given, write the HTML code to display the output as illustrated in Figure 1 and Figure 2.

1. a) Table properties: border=10, cell spacing=8, cell padding=8, border color=#F88017 and #C35617

b) 1st and last row properties: background-color: #FBB117; text color: white; bold text c) Insert 3 images: food1.jpg, food2.jpg, food3.jpg. Set width and height to 100. d) Insert 4 link: Link 1= www.link1.com, Link 2= www.link2.com , Link 3= www.link3.com, Link 4= www.link4.com (20 marks)

Figure 1

Insert images

Color: #C35617

Color: #F88017

- Background color: #000000

- Special character: &hearts;

Insert Links: Link 1 to Link 4

INTERNET APPLICATION

4 / 6

2. a) Table properties: bold text, border=5, width=450, border color=#000000, cell spacing=0, background color=#488AC7

b) List of departments: Accounting, Sales and Marketing, Customer Services, Quality Control, Research and Development, and Administration.

(20 marks)

Figure 2

Background color: #5CB3FF

Apply <font> tag, size=1.5

Background color: #5CB3FF

INTERNET APPLICATION

5 / 6

Part C (30 marks)

Located in Salt Lake City, Doc-Centric is one of the nation’s leading manufacturers of personal and business copiers. The annual shareholders’ convention in Chicago is approaching. The report will be posted on the company Web site before the convention so that shareholders can review the company’s financial data. Create the website based on the provided information as following:

1. Create file business.htm. Use this document as frameset for the entire web site. a. Create a frameset containing two columns. (1 mark) b. The 1st column frame should 280 pixels wide and the 2nd frame should occupy

the remaining space in window. (1 mark) c. Create two rows of nested frames in the 1st column frame. The 1st row frame

should 110 pixels wide and the 2nd frame should occupy the remaining space in window. (2 marks)

1st row frame: display contents of head.htm. Name the frame “logo”. 2nd row frame: display contents of map.htm. Name the frame

“usemap”. d. The 2nd column frame: display contents of report.htm. Name the frame

“reports”. (1 mark) e. None of border to display. (1 mark)

2. Create file head.htm. Insert an image file dcclogo.jpg and the 250 widths and 70 heights. Set the background color as light grey. (4 marks)

3. Create map.htm. Insert an image file map.jpg and the 243 widths and 143 heights (1 mark). Formatting the image file as an image map. (2 marks)

Image map properties: a. Shape=poly, alternative text= West,

coordinates=11,19,11,60,28,87,59,101,90,99,86,20,12,18; link to dccw.htm. (3 marks)

b. Shape=poly, alternative text= Midwest, coordinates=87,19,89,75,140,78,159,65,164,71,172,61,172,53,157,19,140,16,86,19; link to dccmw.htm. (3 marks)

c. Shape=poly, alternative text= South, coordinates=91,77,91,101,75,101,111,128,125,108,134,114,149,109,168,134,182,129,170,105,193,80,184,65,171,75,159,66,141,79,93,77; link to dccs.htm. (3 marks)

d. Shape=poly, alternative text= Northeast, coordinates=216,25,224,38,213,48,211,61,198,61,193,75,184,63,171,73,167,68,175,57,172,51,195,34,205,34,214,24; link to dccne.htm. (3 marks)

Direct each link to the reports target, so that the contents of each .htm document will display in the reports frame. (2 marks)

Excellent in HTML code (3 marks)

INTERNET APPLICATION

6 / 6

(a) Figure: The default access view of the Web Site

(b) Figure: The view once click on purple area

**Notes: There will be showed difference displayed view once click on difference color areas.

___________ 000 ___________