hello,
finished this assessment, here’s a fiddle link.
i’m not sure, whether i got the quote at the very end right.
should it be any different?
nevermind.
- i thought, i had to finish the assessment before starting the “introduction to html” guides.
- i can quite simply look at the examplary solution for this assessment.
thanks anyway, great site!
@R2D2 Hi there, and thanks for sending in your code!
This is mostly really good; I just noticed a couple of small bits that could be improved:
-
It is better to use
<strong>rather than<b>for bolding text — the first one actually semantic meaning (emphasis), whereas the second one is mostly presentational. -
In the following bit, you use a double
<br>to makea line break:
<p>Dear Eileen, <br> <br>
Thank you for your recent application to join us at the University of Awesome's
science faculty to study as part of your <abbr title="Doctor of Philosophy">PhD</abbr>
next year. I will answer your questions
one by one, in the following sections.
</p>
This is not a very good use of markup, and it would be better to put “Dear Eileen,” in its own paragraph.
- When you are citing a quote, you need to wrap the quote in a quote tag (a
<q>if the quote is inline, or a<blockquote>if the quote is a whoel block). So for example:
<p>University of Awesome motto: <q>Be awesome to each other.</q>
<cite > -- The memoirs of Bill S Preston, <abbr title="Esquire">Esq</abbr></cite>
</p>
Hi! Check my code please:
!!css-file->body {
max-width: 800px;
margin: 0 auto;
}
.sender-column {
text-align: right;
}
h1 {
font-size: 1.5em;
}
h2 {
font-size: 1.3em;
}
p,ul,ol,dl,address {
font-size: 1.1em;
}
p, li, dd, dt, address {
line-height: 1.5;
}
html->
Dr. Eleanor Gaye
Awesome Science faculty
University of Awesome
Bobtown, CA 99999,
USA
Tel: 123-456-7890
Email: no_reply@example.com
20 January 2016
<p align="left"><strong>Miss Eileen Dover</strong><br>
4321 Cliff Top Edge<br>
Dover, CT9 XXX<br>
UK<br></p>
<h1>Re: Eileen Dover university application</h1>
Dear Eileen,
Thank you for your recent application to join us at the University of Awesome's science faculty to study as part of your PhD next year. I will answer your questions one by one, in the following sections.
Starting dates
We are happy to accommodate you starting your study with us at any time, however it would suit us better if you could start at the beginning of a semester; the start dates for each one are as follows:
- First semester: 9 September 2016
- Second semester: 15 January 2017
- Third semester: 2 May 2017
Please let me know if this is ok, and if so which start date you would prefer.
You can find more information about important university dates on our website.
Subjects of study
At the Awesome Science Faculty, we have a pretty open-minded research facility — as long as the subjects fall somewhere in the realm of science and technology. You seem like an intelligent, dedicated researcher, and just the kind of person we'd like to have on our team. Saying that, of the ideas you submitted we were most intrigued by are as follows, in order of priority:
- Turning H2O into wine, and the health benefits of Resveratrol (C14H12O3.)
- Measuring the effect on performance of funk bassplayers at temperatures exceeding 30° (86°F), when the audience size exponentially increases (effect of 3 × 103 > 3 × 104.)
- HTML and CSS constructs for representing musical scores.
So please can you provide more information on each of these subjects, including how long you'd expect the research to take, required staff and other resources, and anything else you think we'd need to know? Thanks.
Exotic dance moves
Yes, you are right! As part of my post-doctorate work, I did study exotic tribal dances. To answer your question, my favourite dances are as follows, with definitions:
- Polynesian chicken dance
- A little known but very influential dance dating back as far as 300BC, a whole village would dance around in a circle like chickens, to encourage their livestock to be "fruitful".
- Icelandic brownian shuffle
- Before the Icelanders developed fire as a means of getting warm, they used to practice this dance, which involved huddling close together in a circle on the floor, and shuffling their bodies around in imperceptibly tiny, very rapid movements. One of my fellow students used to say that he thought this dance inspired modern styles such as Twerking.
- Arctic robot dance
- An interesting example of historic misinformation, English explorers in the 1960s believed to have discovered a new dance style characterized by "robotic", stilted movements, being practiced by inhabitants of Northern Alaska and Canada. Later on however it was discovered that they were just moving like this because they were really cold.
For more of my research, see my exotic dance research page.
Yours sincerely,
Dr Eleanor Gaye
University of Awesome motto: "Be awesome to each other."" -- Bill S Preston, Esq
Hi @Finira, and welcome to MDN! Thank you for submitting your work.
Unfortunately, because of the way Discourse “works”, it is hard to test it, because most of the HTML has been rendered out into your forum post.
To make this easier, can you put your work into a shareable, online editor like codepen, or jsfiddle, or glitch?
Many thanks.
Hi! 
I would be glad if someone reviews my attempt at this assesment and checks back with further tips / improvements.
I am looking to improve my HTML skills, so even the slightest tip would be helpful.
The code on CodePen.io
Thanks in advance
Hi there @saa-d, and welcome to our community. Thanks a lot for sending in your assessment code.
I’ve had a look over it, and am very pleased to say that this is pretty much perfect; I can’t findany specific improvements to suggest. Well done on some great work!
1 Like
Thank YOU for the warm welcome! Pleased to be here
I am happy you reviewed it, it means a lot to me, you motivated me to keep on going learning!
<!DOCTYPE html>
Dr. Eleanor Gaye
Awesome Science faculty
University of Awesome
Bobtown, CA 99999,
USA
Tel: 123-456-7890
Email: no_reply@example.com
20 January 2016
Miss Eileen Dover
4321 Cliff Top Edge
Dover, CT9 XXX
UK
Re: Eileen Dover university application
Dear Eileen,
Thank you for your recent application to join us at the University of Awesome's science faculty to study as part of your PhD next year. I will answer your questions one by one, in the following sections.
Starting dates
We are happy to accommodate you starting your study with us at any time, however it would suit us better if you could start at the beginning of a semester; the start dates for each one are as follows:
<li>First semester: 9 September 2016</li>
<li>Second semester: 15 January 2017</li>
<li>Third semester: 2 May 2017</li>
</ul>
Please let me know if this is ok, and if so which start date you would prefer.
You can find more information about important university dates on our website.
Subjects of study
At the Awesome Science Faculty, we have a pretty open-minded research facility — as long as the subjects fall somewhere in the realm of science and technology. You seem like an intelligent, dedicated researcher, and just the kind of person we'd like to have on our team. Saying that, of the ideas you submitted we were most intrigued by are as follows, in order of priority:
<ol>
<li>Turning H<sub>2</sub>O into wine, and the health benefits of Resveratrol (C<sub>14</sub>H<sub>12</sub>O<sub>3</sub>.)</li>
<li>Measuring the effect on performance of funk bassplayers at temperatures exceeding 30°C (86°F), when the audience size exponentially increases (effect of 3 × 10<sup>3</sup> > 3 × 10<sup>4</sup>.)</li>
<li><abbr title="HyperText Markup Language">HTML</abbr> and <abbr title="Cascade Style Sheets">CSS</abbr> constructs for representing musical scores.</li>
</ol>
So please can you provide more information on each of these subjects, including how long you'd expect the research to take, required staff and other resources, and anything else you think we'd need to know? Thanks.
Exotic dance moves
Yes, you are right! As part of my post-doctorate work, I did study exotic tribal dances. To answer your question, my favourite dances are as follows, with definitions:
<dt>Polynesian chicken dance</dt>
<dd>A little known but very influential dance dating back as far as 300<abbr title="Before Christ">BC</abbr>, a whole village would dance around in a circle like chickens, to encourage their livestock to be "fruitful".</dd>
<dt>Icelandic brownian shuffle</dt>
<dd> Before the Icelanders developed fire as a means of getting warm, they used to practice this dance, which involved huddling close together in a circle on the floor, and shuffling their bodies around in imperceptibly tiny, very rapid movements. One of my fellow students used to say that he thought this dance inspired modern styles such as Twerking.</dd>
<dt>Arctic robot dance</dt>
<dd>An interesting example of historic misinformation, English explorers in the 1960s believed to have discovered a new dance style characterized by "robotic", stilted movements, being practiced by inhabitants of Northern Alaska and Canada. Later on however it was discovered that they were just moving like this because they were really cold.</dd>
</dl>
<p> For more of my research, see my <a href="">exotic dance research page</a>.</p>
<p>Yours sincerely,
<br>
Dr Eleanor Gaye
</p>
<p>University of Awesome motto: <q cite="">Be awesome to each other.</q> -- <em>The memoirs of Bill S Preston, <abbr title="Esquire">Esq</abbr></em>
Hi there @Nick_S. This looks like it is probably good, but I can’t mark it very easily because most of the code has been rendered inside the discourse post. Best way to make it easier to mark would be to put it inside an online code playground type app like codepen or glitch, and then give me the URL.
Thanks!
@Nick_S ok, thanks!
This is mosly looking pretty good. I just had a few bits to comment on.
This bit isn’t needed:
<br>
<p>20 January 2016</p>
<br>
Instead, it’d be better to just put <p>20 January 2016</p> on its own line, below </address>. The paragraph element will create its own space above and below; the <br>s are only for creating line breaks inside a paragraph.
Eileen Dover’s address could also be placed inside an <address> element.
In this bit here:
<p>Dear Eileen,
<br>
Thank you for...
It’d be better to get rid of the <br> and place the two separate bits of text in separate paragraphs.
Your dates should be wrapped in <time datetime=""> elements. Have a look in the docs to find out how to use these.
- This bit:
<em>The memoirs of Bill S Preston, <abbr title="Esquire">Esq</abbr></em>
Would be better wrapped in a <cite> element, which semantically describes where the quote comes from.
OK, thanks @Finira! This is looking mostly good; I just had a few small bits to bring up:
This line:
<time datatime="2016-01-20">20 January 2016</time>
Would be better put inside its own separate paragraph, below the <address>. You shouldn’t use two <br>s to separate out a paragraph.
There’s a few issues with this bit:
<p align="left"><strong>Miss Eileen Dover</strong><br>
4321 Cliff Top Edge<br>
Dover, CT9 XXX<br>
UK<br></p>
a. This could be placed inside an <address> element, as it’s an address.
b. you don’t need the last <br> at the end of the paragraph; the paragraph creates space above and below it anyway.
c. The align="left" attribute shouldn’t be used - it is a non-semantic presentational attribute, and the effect should be achieve with CSS instead (text-align: left). Plus the text is aligned left by default anyway.
The following
3 × 103 > 3 × 104
needs <sup> elements on the second 3 and the 4 — they are exponentials.
<p>For more of my research, see my <a href="http://example.com" title="Exotic dance"> exotic dance research page</a>.<br>
<br>
Yours sincerely,<br>
<br>
Dr Eleanor Gaye<br></p>
Again, use separate paragraphs to separate out lines, not double <br>s.
<blockquote>
<p>University of Awesome motto: <cite>"Be awesome to each other."</cite>" -- <cite> Bill S Preston</cite>, <abbr title="Esquire">Esq</abbr></p>
</blockquote>
Not a bad attempt, but the whole block is not the quote. Instead, you should change <cite>"Be awesome to each other."</cite>" to Be awesome to each other. — this just marks up the actual quote in an inline quote element, plus the browser will then automatically add the correct quote marks in.
Mozilla, thank you for this HTML tutorial, first of all. Here i begin my adventure to the code
letter edit lesson: https://github.com/tonybarracuda/letter-markup/blob/master/index.html
Hi there @Cyborger! Sorry for missing this one; I’ll answer you now.
This is not looking too bad at all; here’s a few points where you could improve:
- Don’t use presentational elements like
<i>and<u>; if you want to get a pure visual effect on a page, you should use CSS (which this bit of the course doesn’t teach!). To get the italic text on the address, wrap the address in an<address>element, which is the best semantic element for that job. - As I said above, use
<address>for the addresses, not paragraphs. You also don’t really need the extra wrapping<div>— you could just put<address>around the address, a<p>around the<time>element, then include theclass="sender-column"on the<address>and<p>elements. - Always separate different paragraphs into individual
<p>elements. Don’t split them with<br>. - I am not sure what the
onclick="return false"is for
- The motto should be structured more like this:
<p>University of Awesome motto: <q>Be awesome to each other.</q> -- <cite>The memoirs of Bill S Preston, Esq</cite></p>
The <q> automatically adds the quote marks, so you don’t need to put them in, and the <cite> automatically adds the italic style.
Apart from that, it is looking good!
Hello @tonybarracuda! Thanks for sending your code in!
This is looking really good; I had a few comments, but nothing major:
-
class="sender-column1"needs to be updated toclass="sender-column", to work with the originally provided CSS. - Wrap the addresses in
<address>elements, not<p>. - You are missing
<time datetime="">elements from some of the dates. - You have a bit of junk in the last line —
</e,>
hello, mate. Thank you for showing me my mistakes.
sender-colum1 , i jusy played with css.
what i have not understand proprely, which are you talking about? Should it be the one before the last row or beginning first column on the right of the page?
Thank you
Sory, I don’t know what you mean by this Which one of my points does this refer to?