Common HTML errors

Here is some advice about avoiding errors frequently made by CSC 104 students in past years.
  1. Be sure you understand the semantics of <html>, <head>, <body>, <title>, and their closing tags. <title>..</title> goes inside <head>..</head>. All actual document text goes inside <body>..</body>, including the document heading. And yes, you need a <title>. In each of the two files.
  2. Be careful to use the correct structure and nesting. The <head>..</head> tags enclose non-body elements only, which at this point is just the <title>..</title> bits. Then <body>..</body> occurs outside the <head>..</head> tags, and all of the visible text occurs within <body>..</body>. In particular, the <h1>..</h1> stuff goes inside the <body>..</body> tags, not inside <head>. See some CSC 104 web pages for examples, although be warned that CSC 104 web pages are not always as "pure" (with respect to using only structural tags) as you are required to be for this assignment.
  3. The primary heading is <h1>, not <h2> or any other number.
  4. You can't have multiple <body>s. I've seen some students end up putting in </body> tags before the end of the document text to try to fix other problems; and those other problems have generally been the failure to close some other tag. That is to say, if it looks like a spurious </body> is helping you, look for errors in other tags, or an opening tag (such as <h1>) without its corresponding closing tag (i.e. </h1>). You can't have multiple <body>s.
  5. Your URL references from surfing.html to browser.html and from browser.html to surfing.html must be relative. Don't put in the entire absolute URL with http://www.cdf...., or worse still a file: URL, or your web pages won't work when they are copied to different computers or different directories. Just use a simple relative file path name such as "surfing.html".
  6. I recommend against composing your HTML file in Microsoft software. Microsoft uses non-standard character codes, outside the ASCII standard or any other standard, and then when you copy such text files to non-Microsoft systems they look wrong. Try your web pages in the lab, not just on a web browser at home.
  7. Please pay heed to the restriction that you must use only structural tags. The appearance-oriented tags have their uses, but the current assignment is to use structural tags only, and to leave the formatting to the web browser. The web browser user can adjust their own fonts and window size and spacing; don't put in tags to specify where the line breaks are, and don't choose your tags based on how the fonts come out in your personal web browser because your user might be using a different web browser. Separate things with the <p> tag, but that's the limit of the tweaking you should do based on appearance. Resizing the web browser window will change where the line breaks are.
  8. You will be graded on your HTML file, not on what the web browser does with it. Make it tidy and clean, just like a Python program or other text file. You don't have to format it in fancy ways, you just have to avoid making a mess. Look at the file with 'cat' in a terminal window, and see that the lines aren't too wide to look right, that the tags aren't all over the place, etc. And don't misspell words or omit punctuation.
  9. Know the meaning of the tags you are using. Don't use a tag because it produces the desired appearance, because it might look different in a different web browser. Use a tag because it has semantics which you know and which are relevant in the place you are using it.
  10. Check your web pages in "lynx" to make sure that your images have appropriate alt text where possible.

[Assignment three questions and answers]
[main course page]