Week 1 Practical

For the first week of COM311 we were all tasked with recreating a basic site using HTML. The site itself consisted of a basic form element and table displaying some data. The following links display the finished HTML 4.01 Transitional Valid HTML Site and the Site Validation result for it:

Week 2 Practical

For the second week of COM311 we were all tasked with developing last week's site to make use of XHTML. The following links display the finished HTML 1.0 Transitional Valid XHTML Site and the Site Validation result for it:

Week 3 Practical

For the third week of our HTML and XHTML practical work we have been tasked with developing the XHTML file with accessability in mind. The finished piece, and corresponding W3C Validation, can be viewed at the below links:

In addition to the above piece of work we also have a quiz to complete to demonstrate our understanding of the XHTML coding standard. Below you can find my answers.

What does XHTML stand for?
1. EXtreme HyperText Markup Language
2. EXtensible HyperText Marking Language
3. EXtensible HyperText Markup Language
4. EXtra Hyperlinks and Text Markup Language
XHTML is a Web standard
1. True
2. False
What is correct XHTML for a horizontal line?
1. <hr>
2. <hr />
What is the correct XHTML for a paragraph?
1. 
2. 
3. 
4.
What is correct XHTML for a line break?
1. <break/>
2.  
3.
What is the correct XHTML for an attribute and its value?
1. WIDTH="80"
2. width="80"
3. WIDTH=80
4. width=80
All elements in XHTML must be closed
1. False
2. True

Is this correct XHTML?

							<ul>
							<li>Coffee</li>
							<li>
							Tea
							<ul>
							<li>Black tea</li>
							<li>Green tea</li>
							</ul>
							<li>Milk</li>
							</ul>

Yes
No

Which elements are mandatory in an XHTML document?
1. doctype, html, head, and body
2. doctype, html, head, body, and title
3. doctype, html and body
What XHTML code is "well-formed"?
1. A short paragraph
2. A short paragraph
3. A short paragraph
What are the different DTDs in XHTML?
1. Strict, Transitional, Frameset
2. Strict, Transitional, Loose
3. Strict, Transitional, Loose, Frameset
All XHTML tags and attributes must be in lower case
1. False
2. True

Change the following HTML file to be in XHTML. Circle all changes needed and write in the changes:

HTML Code with highlighted errors before converting to XHTML

Errors in the document above, when used as XHTML, that I have spotted consist of the following:

No XML Version Statement
No DOCTYPE declared
HTML missing extra declarations
Meta tag missing closing "/"
Meta tag charset is ISO (personal preferance)
Link tag lacking closing "/"
Img tag missing closing "/"

Valid version:

								<?xml version="1.0" encoding="utf-8"?>
								<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
								<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
								<head>
									<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
									<title>Starbuzz Coffee</title>
									<link rel="stylesheet" type="text/css" href="starbuzz.css" />
								</head>

								<body>
									<div id="header">
										<img src="images/header.gif" alt="Starbuzz Coffee header image" />
									</div>
									<div id="main">
										<h1>QUALITY COFFEE, QUALITY CAFFEINE</h1>
										<p>At Starbuzz Coffee, we are dedicated to filling all your caffeine needs through our quality coffees and teas. Sure, we want you to have a great cup of coffee and a great coffee experience as well, but we're the only company that actively monitors and optimizes caffeine levels.</p>
									</div>
								</body>
								</html>

Week 4 Practical - JavaScript

This week we had to play around with JavaScript. I'm not all that well versed with basic JavaScript, being more accustomed to jQuery, but I am pleased overall with the results I achieved. Below are the links to the work I completed.

Week 5 & 6 Practical - JavaScript Functions

This week carries on from where things left off with Week 4's practical work. This week we went further down the path of JavaScript undertaking processes for us, and developing our use of functions within JavaScript.

Week 7 & 8 Practical - JavaScript Form Controls

This week takes my learning JavaScript into a new field, that of handling and formatting form data, as well as displaying it.

Below you will find the two pieces of this week's practical work.

Week 9 Practical - JavaScript Ad Rotator

This week we had to create a JavaScript Ad Rotator. We had to find and use our own images. For mine I chose to use Coffee Shops.

JavaScript Ad Rotator

Week 10 Practical - JavaScript Dates, Times, Postcodes and Regular Expressions

This week we had to create use JavaScript to display dates and times. We also had to use JavaScript, with Regular Expressions, to validate and format Postcodes.

Week 11 Practical - JavaScript Cookies

This week we had to create and manage cookies created using JavaScript.

JavaScript Cookies