# Tribute Page Feedback and Error Checking

**URL:** <https://forum.freecodecamp.org/t/tribute-page-feedback-and-error-checking/465848>\
**Category:** I Built This\
**Created:** [June 20, 2021, 11:57pm UTC](https://forum.freecodecamp.org/t/tribute-page-feedback-and-error-checking/465848 "2021-06-20T23:57:25Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Maide](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/maide/32/219659_2.png) [@Maide](https://forum.freecodecamp.org/u/Maide)\
**Post date:** [June 20, 2021, 11:57pm UTC](https://forum.freecodecamp.org/t/tribute-page-feedback-and-error-checking/465848/1 "2021-06-20T23:57:26Z")

</div>

Hello, just finished my tribute page and ran it through W3. Still has some errors and would love some feedback on what the errors mean, Im a bit confused. Any feedback would be greatly appreciated.

> **[Tribute Page](https://codepen.io/Maibelleliz/pen/poeqoMz)**
>
> ...

---

<div class="post-metadata">

**Author:** ![Roma](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/roma/32/112899_2.png) [@Roma](https://forum.freecodecamp.org/u/Roma)\
**Post date:** [June 21, 2021, 12:50am UTC](https://forum.freecodecamp.org/t/tribute-page-feedback-and-error-checking/465848/2 "2021-06-21T00:50:19Z")

</div>

Welcome to the forums @Maide. Your page looks good.

> [@Maide](#):
>
> ran it through W3. Still has some errors and would love some feedback on what the errors mean

The first two errors (expected DOCTYPE and `head` missing child element of `title`) you can ignore. Codepen provides the boilerplate for you and those are included.  
Have you researched to find out what the other errors mean? The ability to read and comprehend error messages is a skill you’ll need to acquire as a developer.  
for instance,

1. `duplicate id` - an `id` must be unique within the document (this was taught in the lessons)
2. ` <figcaption="img-caption">` - `figcaption` is an HTML element, did you mean to have “img-caption” set to an attribute?

> [@Maide](#):
>
> Any feedback would be greatly appreciated.

- Part of my feedback would be to run your HTML code through the W3C validator. You’ve done that. Now correct those issues. Hope I’ve given you a start.
- Accessibility is about being accessible to all users. Review the [giving meaningful text to links](https://learn.freecodecamp.org/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text) lesson. For a more thorough explanation read [Web Accessibility in Mind](https://webaim.org/techniques/hypertext/link_text).
  - “ **fan site** ” is not accessible

I’m not the best at styling and don’t often comment on it but

- text stretching from one side of the screen to the other is hard on the eyes, especially on large screens. It’s better to have a container with less width
- also, the eye when reading goes from left to right. It’s tiring when the text is in the middle rather than the expected left edge

---

<div class="post-metadata">

**Author:** ![Maide](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/maide/32/219659_2.png) [@Maide](https://forum.freecodecamp.org/u/Maide)\
**Post date:** [June 21, 2021, 8:13am UTC](https://forum.freecodecamp.org/t/tribute-page-feedback-and-error-checking/465848/3 "2021-06-21T08:13:41Z")

</div>

Thank you! I’ll review the lessons for a refresher and improve the css portion.

---

<div class="post-metadata">

**Author:** ![Maide](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/maide/32/219659_2.png) [@Maide](https://forum.freecodecamp.org/u/Maide)\
**Post date:** [June 22, 2021, 7:18pm UTC](https://forum.freecodecamp.org/t/tribute-page-feedback-and-error-checking/465848/5 "2021-06-22T19:18:57Z")

</div>

Hi,  
I’ve gone ahead and fixed / modified the code. The only error I get is that figcaption is not allowed as a child element of div. Here is the section of the code:

1. `<figure>` `↩`
2. `<div id="img-div">` `↩`
3. `<img id="image" src="https://ent.trekcore.com/gallery/albums/publicity/archer/cast_archer_s2_02.jpg" alt="Captain Jonathan Archer looking solem, straight at the camera" class="center">` `↩`
4. `<figcaption id="img-caption">` `↩`
5. `Captain Jonathan Archer in uniform looking serious but friendly and captain like.` `↩`
6. `</figcaption>` `↩`
7. `</div>` `↩`
8. `</figure>` `↩`

I know it would be as simple as moving the figcaption outside the div but why cant it be part of the div?

---

<div class="post-metadata">

**Author:** ![kevinSmith](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/kevinsmith/32/72934_2.png) [@kevinSmith](https://forum.freecodecamp.org/u/kevinSmith)\
**Post date:** [June 24, 2021, 1:07am UTC](https://forum.freecodecamp.org/t/tribute-page-feedback-and-error-checking/465848/6 "2021-06-24T01:07:27Z")

</div>

> [@Maide](#):
>
> I know it would be as simple as moving the figcaption outside the div but why cant it be part of the div?

Not be snarky, but _ **because we say so** _. Or more accurately, because that is part of the HTML standard. Quoting from the [MDN docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/figcaption):

> The **`<figcaption>`** [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML) element represents a caption or legend describing the rest of the contents of its parent [`<figure>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/figure) element.

Right there it’s telling you that its parent must be `figure`. Then later:

> **Permitted parents** : A [`<figure>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/figure) element; the `<figcaption>` element must be its first or last child.

So, I guess the real answer is, because that’s what the people that designed HTML decided. It does kind of make sense though - it is attached to that `figure`, it is a caption of that `figure`… Why would we put it somewhere else, if for no other reason just to make it easy to tell to which `figure` it belongs.

---

<div class="post-metadata">

**Author:** ![kevinSmith](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/kevinsmith/32/72934_2.png) [@kevinSmith](https://forum.freecodecamp.org/u/kevinSmith)\
**Post date:** [June 24, 2021, 2:28pm UTC](https://forum.freecodecamp.org/t/tribute-page-feedback-and-error-checking/465848/7 "2021-06-24T14:28:55Z")

</div>

You asked me to take a look at your page…

All in all, it looks good. I see that you fixed some of the earlier comments - good.

I agree with the comments on the text width - like I said 50-75 chars is a good limit and you’re well beyond that. There’s a reason why newspapers don’t run their text lines from edge to edge but instead break them up into columns.

Also, at least the first image took a long time to load. In the real world, you’d probably work that photo down to something with a smaller file size. But there isn’t much you can do about in this case because we’re on codepen.

Just as a visual thing, I would probably round the corners a bit on the images and the “frames”. Even just a few pixels can make a big different, subconsciously. I just don’t like sharp corners.

But still, it looks good. Have fun on the Survey Form.

---

<div class="post-metadata">

**Author:** ![system](https://global.discourse-cdn.com/freecodecamp/original/3X/e/1/e1c433102e34b46dfaa3e15d13ab9a514b127078.svg) [@system](https://forum.freecodecamp.org/u/system)\
**Post date:** [December 24, 2021, 2:29am UTC](https://forum.freecodecamp.org/t/tribute-page-feedback-and-error-checking/465848/8 "2021-12-24T02:29:16Z")

</div>

Closed on December 24, 2021, 2:29am UTC

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.
