HTML

Chinese Film HTML Exercise

In order to get you comfortable with HTML paths and basic styling, I have made up the following exercise for you.

Before we begin, please let me note here that the text of the exercise comes from an article I wrote for Pacific Rim Magazine when I was a student many, many years ago. So some of the content might seem a bit ancient.

Useful background information to peruse before starting this exercise: filepaths explained.

Here are the files you will need (zip archive).

When you open up this zip archive, you will find a folder called chinesefilm. Inside that folder you will find two folders: images and textfiles.

Inside the chinesefilm folder, make two new folders. Call one hongkong and call the other one mainland.

Now download the basic_html5_template file. Double-click if the archive didn’t unpack automatically. This should make a file called basic_html_template.html. Rename it to index.html and put it inside the chinesefilm folder.

Your Task

Make a six page site. On the top level of the site you will have the following:

  1. an index.html file
  2. a folder called hongkong (inside of which will be hongkong.htmlwongkarwai.html, jackiechan.html, andchowyunfat.html).
  3. a folder called mainland (inside of which will be a file called mainland.html).
  4. the images folder that I gave you.

The title of each page will be Introduction to Chinese Film, followed by a unique page identifier (for example, Introduction to Chinese Film: Wong Kar-Wai).Each page will have an H1 with the following text: Art & Mayhem: Two Sides of Chinese Film.Then there’ll be a photo. Give the pages the following photographs:

  • index.html = chungking.jpg
  • hongkong.html = wkw.jpg
  • mainland.html = gongli.jpg
  • wongkarwai.html = fallen_angels.jpg
  • chowyunfat.html = cyf.jpg
  • jackiechan.html = rumble.jpg

After that, put the text in. In the files I give you’ll find a folder called textfiles. Copy and paste the text into the respective html files. Respect the paragraph breaks of the original text.After the text, put the following links:

index.html: hong kong | the mainland
hongkong.html: home | the mainland | chow yun-fat | wong kar-wai | jackie chan | mainland.html: home | hong kong

Finally, add a link to the Chinese Movie Database: http://www.dianying.com/en/Make sure that all the links work before you publish the site.

FTP the site to the following URL:http://mylinux.langara.bc.ca/~YOURID/chinesefilm

Standard

One thought on “Chinese Film HTML Exercise

  1. Pingback: Publishing: Electronic Communications « wrmf.ca

Comments are closed.