Code Sleuth Heaven!
[rule=“100%”]Orange[/rule]
Here is the third Spot the Error Competition. (If you missed the first two, you can find them here and [URL=“http://www.sitepoint.com/forums/showthread.php?870609-quot-Spot-the-Error-quot-Competition-2-Olympic-Edition”]here.)
The quoted text below (a mock forum question) has quite a few coding errors in it. All you have to do is spot as many errors as you can and list them in your reply. This mock post was cunningly crafted by our own xhtmlcoder, who has a knack for posing curly conundrums and tricky traps for the unsuspecting! Some of the errors below are trickier than others (and some are just plain mean!) so there’s a lot of scope for you to be a real sleuth and show off your coding expertise.
There is extra credit for explaining why something is an error. The winner will be the person who spots the most errors, or who gives the best explanation of what the errors are. (So don’t be discouraged if someone beats you to it. Just give a better explanation.)
xhtmlcoder himself will be the judge of this competition, and the prize for the winner will a free SitePoint ebook.
Remember that this is just for fun, and lively debate is welcome! Good luck!
K guys, as of March 12th, xhtmlcoder is going to assess the entries so far to pick a winner, but feel free to keep the thread going.
[rule=“100%”]Orange[/rule]
So, here is the pretend post. How many errors can you spot?
[quote=““Spot the Error””]
Hello SitePointers!
I am learning markup but I am having problems with my code on two web pages. Someone here said it has lots of errors and they said something about “poor semantics” (I don’t really understand what they meant with regards to that strange term; “semantics”?). I would like those errors explaining to me and fixing as I am a newbie. Please help.
Thanks in advance, Stanley Tweedle
Search Page code:
<!-- Copyright (C) 2012, Frobozz Training. All Rights Reserved. -->
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="frobozz.css" type="text/css"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN"
"http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<Title>
Frobozz Training: Search Course Database
</title>
<link rel="stylesheet" href="frobozz.css" type="text/css" />
<style type="text/css">
body {
background-color: grey;
}
/* This section commented out for testing
div { margin:100px } /* main section*/
p {
margin: 0 1em
}
finished testing
*/
</script><style type="text/css">
th {
color: silver;
}
</style>
</head>
<body>
<img src="Logo" title="This a Great Logo" alt="This a Great Logo">
<div id="box1">
<div id="_content">
<h2>
Course Search Page
</h2>
<p>
Below is a Course Search form enabling you the user to
search our database on see how many students have
enrolled on any of our courses which can be selected
via the dropdown menu:
</P>
<form action="search.php" method="get">
<div>
<label>Search Places Available by Subject: <select>
<option>
Basic IT
</option>
<option>
Web Page Design L2
</option>
<option>
Web Page Design L3
</option>
</select></label> <input type="submit"
values="Search..." />
</div>
</form>
<h2>
Table of Search Results
</h2>
<table>
<tr>
<td>
<th>Course Name</th>
<table border="1" summary="Results Table">
<tr>
<h2>
Course Code
</h2>
<th><b>
<acronym title="Maximum">Max</abbr> <abbr title="Number">no.</abbr></b>
</th>
<th>
<abbr title="Number">No.</abbr> enrolled
</th>
</tr>
<tr>
<td>
Basic IT
</td>
<td>
BIT01
</td>
<td>
30
</td>
<td>
18
</td>
</tr>
<tr>
<td>
Web Page Design L2
</td>
<td>
WEB02
</td>
<td>
20
</td>
<td>
15
</td>
</tr>
<tr>
<td>
Web Page Design L3
</td>
<td>
WEB03
</td>
<td>
16
</td>
<td>
9
</tr>
</table>
</td>
</tr>
</table>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing
elit. Mauris sodales, lacus quis vestibulum faucibus,
velit purus lacinia erat, eu suscipit felis urna ut
sapien.
<p>
</p>
Lorem ipsum dolor sit amet, consectetuer adipiscing
elit. Mauris sodales, lacus quis vestibulum faucibus,
velit purus lacinia erat, eu suscipit felis urna ut
sapien.
</p>
<div class="footer">
<p>
[<a href=".../home.htm"
title="Return to Home Page">Return Home</a>]
</p>
<p>
<b>
Copyright &#copy; 2012, Frobozz Training. All Rights
Reserved.
</b>
</p>
<div />
</div>
</div>
</div>
</body>
</html>
Feedback Page code:
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="frobozz.css" type="application/javascript"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN"
"http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>
Frobozz Training: Feedback Page - E-mail Contact Form
</title>
<link rel="stylesheet" href="styles.css" type="text/css" />
<script language="JavaScript" type="text/javascript" />
</head>
<body>
<div id="1box">
<div id="content">
<h2>
Course Feedback Page (Contact us by E-mail Form)
</h2>
<p>
If you would like further information on the courses
offered by <strong <!-- class="important"-->>Frobozz
Training</strong>; please feel free to contact us via
e-mail, we also welcome feedback on this website, so
why not contact us about any enquires today.
</p>
<h6>
Contact Us about Course Details:
</h6>
<br />
<form method="post"
action="mailto:example@@example.com"
enctype="text\\plain">
<fieldset>
<legend>Enter your Contact Details:</legend><br />
<label>Your Full Name:<br />
<input name="name" type="text" placeholder="First name"
alt="Please enter your Fullname so we know how to address our responses." />
<br />
<br />
</label> <label>Your E-mail Address:
*<br />
<input name="email" type="text"
alt="Please enter your e-mail address so we can respond to your feedback." />
<br />
</label><br />
<label>Your Comments: *<br />
<textarea name="message" rows="1O" cols="64"></textarea><br />
</label> (*) denotes a required field.<br />
<br />
<input type="submit" value="Send" />
</fieldset>
</form>
<div class="footer">
<p>
[<a href="home page.htm" alt="
Return to Home Page">Return Home</a>]
</p>
<p>
Copyright © 2012, Frobozz Training. All Rights
Reserved.
</p>
</div>
</div>
</div>
</body>
</html>
[/quote]