Validation: - If it didn't validate, you were awarded a very low mark. Indentation: - I asked that the source be laid out nicely with good indentation. If it wasn't, you lost marks. The image: - Some of you made the URL over-complicated. The image was in the same folder as mk.html. Therefore, src="mk.jpg" suffices. You do not need to 'go up' only to 'come down' again, like this: src="../lab1/mk.jpg" - One of you used the "file://" scheme: src="file://public_html/cs1109/lab1/mk.jpg". I told you to *never* use the "file://" scheme in a web page. It shows you don't understand how the web works. - Use a descriptive alt text. alt="image" or alt="mk" or alt="mk.jpg" or alt="" are not acceptable. Imagine reading your alt text to someone over the phone - if it helps them to visualise the image, then it's a good alt text. - For me, this image belongs in the header - although I didn't penalise other decisions if they were sensible. The header - If you didn't have
, you lost marks. - I think it should contain the image, the name of the organization (Mammy's Kitchen) and the slogan (Handy Hints from the Mammy). But if you included the next heading (Inside this issue) and the nav, then that's OK. Headings: - An hgroup is used to group consecutive headings - but only if they 'belong together'. The name of the organization (Mammy's Kitchen) and its slogan (Handy Hints from the Mammy) is a good example. Another example might be a 'title' (Web Design) plus 'subtitle' (An Introduction). For me, there were *no* other hgroups in this exercise. - Headings (h1, h2, h3, h4, h5, h6) do not need extra markup. For example, if you wrote

Message from Mammy

or

Message from Mammy

, what was the purpose of the b or strong tags? - Even worse is to simulate headings, e.g.

Message from Mammy

. Many of you did this for the different news articles (Facebook, Wine tasting, Pregnant, Graduation, TV dinners). These were headings

, not keywords . (True, *within* the articles, there were keywords for which you need to use : social networking, wine tasting, pregnant, internship, event). - Look at mojitos.html (or any other example I've ever shown you). If you use
and
correctly, then you do not need h2, h3, h4, h5, h6. Instead, the headings are all h1s. (The *only* exception was the slogan in the hgroup earlier, which was an h2.) And h1s should be *in* the section or article, like this:

...

...

They shouldn't be outside the section or article, like this:

...

...

I explicitly drew your attention to this at the end of the two labs! - Worse than that, some of you even seemed to think that it made sense if the only thing in a section was an h1, like this:

...

...

The whole point of a
is to *group* things together. The table of contents (TOC) - The task was to convert the MS-Word document into a Web page. So the TOC should have become a nav. Then the nav should contain links that 'jump around the page'. - The nav gathers together all the stuff to do with navigation. So the heading (Inside this issue) can also be inside the nav, like this: You don't need to put the nav itself into an extra section, like this:

Inside this issue

em and i: - The em tag is for emphasis which changes the meaning - for contrast. There was only one em in this page: the people at Mammy's Kitchen love Facebook. - The i tag is when you want to distinguish the names of things from the rest of the text. You didn't need it on the names of people and places. But the name of the organizations (Mammy's Kitchen, McDonald's) and the TV programme (Come Dine With Me) are good examples. - All the foreign language phrases (petit fours, le vin, Salmonella, porkolt) needed the i tag too. - The i tag is also used for technical terminology. You may not agree, but I therefore think that we would use i, not em, in the sentence "Please like us!" lang: - At the start, you need - it's good to include the language. - Then later you needed for "petit fours" and "le vin" - You could also have Salmonella enterocolitis - it's Latin. - And you could have pörkölt - you're told that it's Hungarian. strong and b: - The strong tag is for importance. The b tag is for keywords and key-phrases. - is needed only once in this exercise: You must pay in advance. - I have already mentioned that you would use for keywords/keyphrases within the news articles (social networking, wine tasting, pregnant, internship, event). Character references: - You needed a character reference (ö) to get the 'o' with umlauts and it's best to use one (€) to get the euro symbol. - Several of you used character references for a lot more of the punctuation, e.g. the apostrophes. There's nothing wrong with this, but it is overkill. These are regular enough characters that they should not cause problems. The table: - Most of you did a good job - you got the table right. Well done. - However, some of you wrote , in which case you mixed presentational stuff into the HTML. This was bad - but it also wasn't needed because I gave you a stylesheet which put borders on the table. Layout: - If you included
tags (or lots of extra

tags)in order to break the lines at the same place they were broken in the MS-Word document, then you misunderstood the exercise (it wasn't about layout) and you committed the sin of trying to achieve a presentational effect in your HTML. (The lab sheet even told you not to do this.) The footer: - The copyright notice is smallprint (hence the tag is needed) within the footer. - Some of you included the 'Serving Suggestion' in the footer. That's not right. The serving suggestion is part of the recipe section. - Others of you included the footer in the recipe. It should be separate. : - Some of you omitted the end tag. Sections and articles - These were not done well. - Leaving them out was obviously very poor. - Using only sections, but no articles was also poor. There are five little stories (Facebook, Wine tasting, etc.), which were clearly articles. - I've already mentioned that putting the heading (h1) outside the section/article, instead of inside it, is also not right. - Some of you wrappped the whole page in an article or section. I don't think that's correct. - There were four main chunks: Message from Mammy, What's Cooking, Autumn Workshops and the recipe. I chose to make use

for these, but you weren't penalised if you made them articles. - Within the What's Cooking chunk, we have two sub-chunks (News from us, News from you) - these were clearly sections. - Similarly, within the recipe, there were three chunks (Ingredients, Instructions, Serving suggestion) - again, clearly sections. Finally... - Type http://www.cs.ucc.ie/~dgb/courses/pwd/solutions/mk.html into your browser to get my model solution. Compare the source of mine line by line with yours.