Please critique my "XHTML Basics" exam [Archive]

Click to See Complete Forum and Search --> : Please critique my "XHTML Basics" exam

JazzcatCB

12-12-2005, 12:28 PM

I want to create a training resource for web developers. I am creating a site named the "Web Authoring Exam." The exam below is for "XHTML Basics." The point of the exam is to have exam-takers actually write code to solve the problems, rather than selecting from multiple choice. Would you please look over each problem and each solution and let me know:

1) If a solution is wrong
2) If a solution could be coded more efficiently
3) If a problem's wording is incorrect or misleading'
4) If I have missed a coding problem that belongs in the "XHTML Basics" category (note: tables will be covered under an "XHTML Tables" category).

Please note that while there are better solutions to these problems using CSS, this exam is strictly for XHTML. There will be another exam for CSS.

Thank you for your help.

Problem 1. Create a paragraph containing the text: “A lie gets halfway around the world before the truth has a chance to get its pants on.” (Sir Winston Churchill).",
Solution: "A lie gets halfway around the world before the truth has a chance to get its pants on.",

Problem 2. Create a headline in the largest available size containing the text: “Extra Big Headline!”",
Solution: "<h1>Extra Big Headline!</h1>",

Problem 3. Create a hyperlink pointing to “www.someurl.com” and containing the text: “Cool Link!”",
Solution: "<a href=\"http://www.someurl.com\">Cool Link!</a>",

Problem 4. Create an e-mail hyperlink pointing to “wchurchill@downingstreet.com” containing the text “Send e-mail to Winston Churchill (posthumously).”",
Solution: "<a href=\"mailto:wchurchill@downingstreet.com\">Send e-mail to Winston Churchill (posthumously).</a>",

Problem 5. Enclose the text “I'm gonna ace this test!” inside of comment tags.",
Solution: "",

Problem 6. Create a paragraph containing the text “Learning HTML is fun!” Make “HTML” boldfaced and “fun!” italicized.",
Solution: "Learning HTML is fun!",

Problem 7. Create the following text colors and have them apply to your entire HTML document:\n
- text: #9932CD,\n
- hyperlink: #FF0000,\n
- visited link: #00FF00,\n
- active link: #000000.",
Solution: "<body text=\"#9932CD\" link=\"#FF0000\" vlink=\"#00FF00\" alink=\"#000000\">",

Problem 8. Create a paragraph containing the text “To see him act is like reading Shakespeare by flashes of lightning.” (Samuel Taylor Coleridge). Make the word “lightning” blue (#0000FF).",
Solution: "To see him act is like reading Shakespeare by flashes of lightning.",

Problem 9. Create a paragraph containing the text “I am enormous!” in the largest available font size.",
Solution: "I am enormous!",

Problem 10. What tags turn preformatted text on and off?",
Solution: "<pre></pre>",

Problem 11. Give your page a background image named “someimage.gif.”",
Solution: "<body bgimage=\"someimage.gif\">",

Problem 12. Give you page a background color of #FFCCFF",
Solution: "<body bgcolor=\"#FFCCFF\">",

Problem 13. Create the following quote: “You should never name an animal which is not yours to keep, or which you intend to eat.” (Deborah Boliver Boehm). Indent it on both the left and right sides.",
Solution: "<blockquote>You should never name an animal which is not yours to keep, or which you intend to eat.</blockquote>",

Problem 14. Create a paragraph containing the text “However, if you must name an animal you intend to eat, 'Snack' is a fine choice.” (myself). Place a line break after each comma.",
Solution: "However, if you must name an animal you intend to eat, 'Snack' is a fine choice.",

Problem 15. Create a headline in the smallest available size that contains the centered text “Once you label me, you negate me.” (Soren Kierkegaard).",
Solution: "<h7 align=\"center\">Once you label me, you negate me.</h7>",

Problem 16. Create an image located at “images/someimage.gif” and right justify it.",
Solution: "<img src=\"images/someimage.gif\" align=\"right\" />",

Problem 17. Now center the image in problem 16.",
Solution: "<img src=\"images/someimage.gif\" align=\"center\" />",

Problem 18. Create a numbered list. The first item should be “I know XHTML.” The second item should be “That roXXors.”",
Solution: "<ol>\n<li>I know XHTML.</li>\n<li>That roXXors.</li>\n</ol>",

Problem 19. Create a bulleted list. The first item should be “Candy is dandy.” The second item should be “But liquor is quicker.”",
Solution: "<ul>\n<li>Candy is dandy.</li>\n<li>But liquor is quicker.</li>\n</ul>",

Problem 20. Display the text “I'll soon the be smartest programmer in the known universe.” indented to the right by using an unordered list element Then display “Thanks to the Web Authoring Exam.” indented even further to the right.",
Solution: "<ul>I'll soon the be smartest programmer in the known universe.</ul>\n<ul><ul>Thanks to the Web Authoring Exam.</ul></ul>",

Problem 21. Display a border with the value of 5 around an image located at “images/someimage.gif.”",
Solution: "<img border=\"5\" src=\"images/someimage.gif\" />",

Problem 22. Display an image located at “images/someimage.gif” left justified and display the text “This text floats right” floating along the right of the image."
Solution: "<img src=\"images/someimage.gif\" align=\"left\" />This text floats right."

Robert Wellock

12-12-2005, 01:02 PM

Problem 1: use either <q> or <blockquote> with cite not a very good example of text to use. Something like: The Dark God of XHTML sees all would be more suitable.

Problem 2: assuming default rendering then yes the h1 has the highest priority.

Problem 3: Forward Slashes (I assume you used \ because of the forum).

Problem 4: Probably removing the slashes.

Problem 5: Yes.

Problem 6-7: one way but not elegant.

Problem 8: one way but not elegant and I am not sure about the blue name.

Problem 9-12: one way but not elegant.

Problem 13: Well, it should not be purely used for indentation.

Problem 14: Yes.

Problem 15: one way but not elegant.

Problem 16-17: No, where is the alt=""

Problem 18: I am the Wizard of Frobozz

Problem 20: No it shouldn’t be used for indentation.

Problem 21: refer to 16-17.

Problem 22: refer to 6-7.

Problem 23: Answer; yes Robert is the XHTML Master and all should bow down before him…

It’s using some really bad old techniques that CSS should be used for other than that some of it made sense.

the tree

12-12-2005, 01:05 PM

Edit, Robbie beat me to it.

Problem 1. Create a paragraph containing the text: “A lie gets halfway around the world before the truth has a chance to get its pants on.” (Sir Winston Churchill).",
Solution: "A lie gets halfway around the world before the truth has a chance to get its pants on.",That's not really complete is it?<q>A lie gets halfway around the world before the truth has a chance to get its pants on.</q> (<cite>Sir Winston Churchill</cite>).

Problem 2. Create a headline in the largest available size containing the text: “Extra Big Headline!”",
Solution: "<h1>Extra Big Headline!</h1>",Although by default higher level headings are bigger in graphical browsers, thier size doesn't really have anything todo with the markup.

Problem 3. Create a hyperlink pointing to “www.someurl.com” and containing the text: “Cool Link!”",
Solution: "<a href=\"http://www.someurl.com\">Cool Link!</a>",

Problem 4. Create an e-mail hyperlink pointing to “wchurchill@downingstreet.com” containing the text “Send e-mail to Winston Churchill (posthumously).”",
Solution: "<a href=\"mailto:wchurchill@downingstreet.com\">Send e-mail to Winston Churchill (posthumously).</a>",Don't forget title attributes.<a href="http://someurl.com/" title="Some page title">Cool link!</a>

<a href="mailto:wchurchil@downingstreet.com" title="Send an e-mail to Winston Churchil (posthumously)">E-mail Winston Churchil</a>

Problem 6. Create a paragraph containing the text “Learning HTML is fun!” Make “HTML” boldfaced and “fun!” italicized.",
Solution: "Learning HTML is fun!",That's not semantic at all. Learning <abbr title="Hyper Text Markup Language" style="font-weight: bold;">HTML</abbr> is fun!

Problem 7. Create the following text colors and have them apply to your entire HTML document:\n
- text: #9932CD,\n
- hyperlink: #FF0000,\n
- visited link: #00FF00,\n
- active link: #000000.",
Solution: "<body text=\"#9932CD\" link=\"#FF0000\" vlink=\"#00FF00\" alink=\"#000000\">",What are you trying to make? A webpage or a time machine?<style type="text/css">
body{
color: #9932cd;
background-color: #fff;
}
a:link{color:#f00;}
a:hover{color:#ff0}
a:visited{color:#0f0;}
a:active{color:#000;}
</style>

Problem 8. Create a paragraph containing the text “To see him act is like reading Shakespeare by flashes of lightning.” (Samuel Taylor Coleridge). Make the word “lightning” blue (#0000FF).",
Solution: "To see him act is like reading Shakespeare by flashes of lightning.",<blockquote>To see him act is like reading Shakespeare by flashes of lightning. <cite>Samuel Taylor Coleridge</cite>

Problem 9. Create a paragraph containing the text “I am enormous!” in the largest available font size.",
Solution: "I am enormous!",Since when was there a largest avaliable font-size?I bow before the greater fonts!

Problem 11. Give your page a background image named “someimage.gif.”",
Solution: "<body bgimage=\"someimage.gif\">",

Problem 12. Give you page a background color of #FFCCFF",
Solution: "<body bgcolor=\"#FFCCFF\">",Once again, web page or time machine?<style type="text/css">
body{
background: #fcf url('someimage.gif')
}
</style>

I could go on but I'm getting hungry.

felgall

12-12-2005, 01:33 PM

That did say XHTML didn't it. The answers look more like the obsolete HTML 3.2.

JazzcatCB

12-12-2005, 01:38 PM

Robert: thank you for taking the time to critique my exam. I have some questions for clarification:

1. Please pardon all the \" quotes. I created these strings for PHP, and I had to escape all of my quotes. I was too lazy to remove them all :P

2. Nearly all of my problems involve quoted text. I know that technically, <q> should be used and <cite>d, but do you think I could get away with simple paragraphs? I am concerned that quoting and citing each passage will involve too much work for the exam-taker. What do you think?

3. When you state that something is "not elegant" do you mean because it is not CSS? Please be aware that the purpose of this test is to test the takers knowledge of XHTML only. CSS is covered in another test. If you mean that it is not elegant XHTML, then I would appreciate it if you could show me how it would be written more elegantly. Thanks.

4. Problem 13: By saying that it should be indented on the left and right sides, I am only trying to describe a <blockquote> without actually using the <blockquote> tag in the problem or using the words "block quote" (a dead give-away). Can you think of a better way to describe <blockquote> without giving it away?

5. Thank you for pointing out the lack of alt="". I will definitely correct that.

6. I know that CSS is better, but this exam only covers XHTML. CSS is covered in another exam.

*bows down before Robert's XHTML mastery* You rock dude! Thanks!

JazzcatCB

12-12-2005, 02:06 PM

Tree:

Thank you for taking the time to critique my exam. I have a few quesions about the points you made.

That's not really complete is it?<q>A lie gets halfway around the world before the truth has a chance to get its pants on.</q> (<cite>Sir Winston Churchill</cite>).
You're right. Using <q> and <cite> would be more complete. I will add them to the problem descriptions.

Although by default higher level headings are bigger in graphical browsers, thier size doesn't really have anything todo with the markup.
Would it be more accurate to re-phrase the problem with "use the highest heading level" rather than "largest available size?"

Don't forget title attributes.<a href="http://someurl.com/" title="Some page title">Cool link!</a>

<a href="mailto:wchurchil@downingstreet.com" title="Send an e-mail to Winston Churchil (posthumously)">E-mail Winston Churchil</a>
Thank you for pointing out this out. I will definitely include it.

That's not semantic at all. Learning <abbr title="Hyper Text Markup Language" style="font-weight: bold;">HTML</abbr> is fun!
Well, I'm pretty sure the "style" attribute is CSS, right? CSS belongs in another exam. As for , arrggh. That opens up a can of worms, because there are two possible ways to correctly solve the problem, either by using or or using or . I'll have to ponder this one.

What are you trying to make? A webpage or a time machine?<style type="text/css">
body{
color: #9932cd;
background-color: #fff;
}
a:link{color:#f00;}
a:hover{color:#ff0}
a:visited{color:#0f0;}
a:active{color:#000;}
</style>

Once again, CSS is covered in another exam. This exam is strictly for XHTML solutions.

Since when was there a largest avaliable font-size?I bow before the greater fonts!
Am I mistaken in believing that "7" is the largest available size for the HTML size attribute?

I could go on but I'm getting hungry.
Thanks for your input.

JazzcatCB

12-12-2005, 02:08 PM

fellgal:

Could you please be more specific? In what way does my code fail to comply to XHTML standards? If you are referring to the lack of CSS, please be aware that this exam does not cover CSS, just XHTML.

ray326

12-12-2005, 02:09 PM

You shouldn't be testing someone on presentation in the context of mark up and you definitely shouldn't be couching answers in the context of deprecated tags and attributes. I've got an encyclopedia from the early 20th century that defines "uranium" as "a worthless grey metal" but I certainly wouldn't expect that to be an acceptable answer on a "basics of the elements" test.

Charles

12-12-2005, 02:38 PM

That did say XHTML didn't it. The answers look more like the obsolete HTML 3.2.XHTML 1.0 transitiional is supposed to look like HTML 3.2. With one exception, XHTML has exactly the same elements as HTML. It's the underlying syntax that's different and that makes it incompatable with HTML and HTML browsers.

felgall

12-13-2005, 02:53 PM

XHTML 1.0 transitional is supposed to look like HTML 4.0 transitional not HTML 3.2. All of the tags that are deprecated in HTML 4 are deprecated in XHTML 1.0. Use of deprecated tags in the answers indicate that the earlier version of HTML is what is expected since deprecated tags should be avoided as much as possible even with transitional specifications that allow them. A person should have a thorough knowledge of a subject before trying to produce any sort of quiz/exam on that subject.

felgall

12-13-2005, 02:58 PM

Am I mistaken in believing that "7" is the largest available size for the HTML size attribute?

There is no tag in correctly coded XHTML. The transitional specification accepts it only because there may be older web pages converted from XHTML 3.2 to XHTML that have not had all of the font tags correctly replaced with the appropriate stylesheet commands yet.

Font size is part of the presentational info that is defined using stylesheets. XHTML provides the <link> and <style> tags and style= attribute for specifying font sizes.

dera

12-13-2005, 10:58 PM

shouldnt this be posted
http://webdeveloper.com/forum/forumdisplay.php?f=10

spufi

12-14-2005, 05:00 PM

shouldnt this be posted
http://webdeveloper.com/forum/forumdisplay.php?f=10

Moved to HTML since it fits the topic better than general.

Jeff Mott

12-14-2005, 10:07 PM

The first thing to note, JazzcatCB, is that despite how (X)HTML is commonly (mis)used, (X)HTML is about defining document structure, not appearence. With that in mind I will move on to specific questions.

1) As others have pointed out, proper markup means that the text should be properly quoted and cited. To avoid this issue simply don't choose text that is a quote.

2) Size implies appearence. XHTML is not about appearence. Ideally an author should not consider how a page may appear when writing the markup. That is the job for CSS later.

3) Another poster criticized the lack of a title attribute. However, the title attribute is not required or even necessary.

6) Bold and italics means appearence and has no place in XHTML. Such elements are included within the specification only for backwards compatibility reasons. Nor should they simply be replaced by STRONG and EM elements. These elements carry structural meaning and are not to be used for how visual browsers might render them. Imagine orating the sentence to another person. If you feel a word should be stressed then enclose it with the emphasis (EM) element, or strong emphasis (STRONG) if more appropriate. Remember that italics and bold are only default renderings. With CSS you may decide that emphasized text be displayed with an underline, or that strong emphasis be displayed in red and uppercase.

7) Again, these attributes exist in XHTML purely for backwards compatibility reasons. While you may make the user aware that they still exist they should know that these attributes are now considered bad practice. Similarly, since they are a bad practice you probably shouldn't spend much time, if any, teaching how to use them and instead focus on current good practices.

8) FONT is included for backwards compatibility and is now one such bad practice.

10) PRE included for backwards compatibility. Its function has been replaced by CSS. Remember (X)HTML markup should never be associated with a visual rendering.

11) BGIMAGE is not an HTML attribute. BACKGROUND is what you meant to use. The BGIMAGE attribute was fabricated by Microsoft for Microsoft during the browser wars years ago. However, BACKGROUND is yet another attribute included for backwards compatibility reasons and is discouraged.

12) BGCOLOR included for backwards compatibility.

13) Indentation should not be used as part of the description of the blockquote element. Large quotations should be marked up as BLOCKQUOTE regardless of whether you want the text indented or not. It is the job of CSS to control the visual rendering.

15) See #1 for comments about referring to size. Beyond that, H6 is the lowest level heading, not H7. On another note, any heading level should not be chosen for how it might appear in a visual rendering. (X)HTML defines a logical document structure. The first, and primary heading in the document should always be H1. If you want this text to appear bigger or smaller then use CSS. Any immediate subheadings under H1 should always be H2, again using CSS to control the appearence.

16) Others already mentioned that the required ALT attribute is missing. The text value of this attribute is what you would want to see if the image cannot be displayed. The ALIGN attribute is for backwards compatibility and is discouraged.

20) As with the BLOCKQUOTE problem, lists should not be used because of any side effect rendering. CSS should be used to control any visual appearence, including indentation. (X)HTML defines document structure. Lists should be used if, and only if, the text it encloses is in fact a list. Additionally, a list without at least one list item is a syntactic error.

21) ALT attribute is missing. BORDER is included for backwards compatibility only and is discouraged.

22) ALIGN is included for backwards compatibility only and is discouraged. ALT attribute is missing.