Assessment : Marking up a letter


I am learning web development and looking for an assessment on an assignment - “Marking up a letter” (link -

I have done the work from my side and want it to be assessed.
I am looking for feedback on semantics as that was the most difficult part, what I felt.
My code is shared at : codepen link and jsfiddle link.

Please assess the work and provide feedback.

Hi @CNatka! Thanks for sending your code in!

This is looking pretty good — well done on some great work.

I had a few small things to bring up, but nothing major.

You’ve got the first address wrapped inside a <div>:

<div class="sender-column">

This isn’t terrible, but you could just delete the <div> and put the class="sender-column" directly on the <address> element.

  1. In this bit:
<p>Dear Eileen,<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="Doctorate of Philosophy">PhD</abbr> next year. I will answer your questions one by one, in the following sections.

“Dear Eileen,” would probably be better contained in its own separate paragraph, with the rest of it put in another separate paragraph.

Everything else is fine; well done!

thanks @ chrisdavidmills for your feedback.
I faced one more difficulty - deciding between “section” and “article” elements Any article or pointer on that could be helpful.

For this example, I don’t think you really need them at all; in general, this is a topic that a lot of people get confused about.

We have tried to provide a definition here:

In most simple cases where you just want a container element for a simple block of content, it doesn’t really matter.

With something more complex where you’ve got multiple containers, it depends on what content the containers have in them.

  • <article> is more for an item of content where you will have more than one, like blog posts, or news item summaries.
  • <section> is more for different areas of functionality, like a map, or a summary of your latest tweets, or an FAQ, or a section of contact information.

But even then it is open to interpretation.

I wouldn’t worry about it to much.

1 Like