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.
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.
Make a six page site. On the top level of the site you will have the following:
- an index.html file
- a folder called hongkong (inside of which will be hongkong.html, wongkarwai.html, jackiechan.html, andchowyunfat.html).
- a folder called mainland (inside of which will be a file called mainland.html).
- 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