Unsplash tribute page feedback

Code Feedback
1

Hi peeps!

I’d like som feedback on my first project. Thanks! :slight_smile:

https://codepen.io/knitbeard/full/bGgKryB

Regards,
Stian

2

Your page looks good @KnitBeard. Some things to revisit;

  • Codepen provides the boilerplate for you. It only expects the code you’d put within the body element in the HTML editor. (No need to include the body tags). For anything you want to add to the <head> element click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for <head>’ box.
    • For instance links to fonts go in the box labeled ‘Stuff for <head>’
    • Mentioning because you have elements out of order. Everything the browser renders belongs in the body element. Review this for an understanding of the HTML boilerplate tags.
  • Run your HTML code through the W3C validator.
    • There are HTML syntax/coding errors you should be aware of and address.
  • Do not use the <br> element to force line breaks or spacing. That’s what CSS is for.
  • Accessibility is about being accessible to all users. Review the giving meaningful text to links lesson. For a more thorough explanation read Web Accessibility in Mind.
    • “here” is not accessible
1 Like
3

Thank you for detailed and helpful feedback! I’ve tried to improve upon it. Would you mind taking a look at the revised code?

4

  • I would increase the overall font-size and line-height.

  • Increase the contrast just a bit by using a darker and/or more saturated blue color for the text. Not a lot, just a bit.

  • Use larger max-width values to create more legible sentences and likely split the about paragraph up into two paragraphs.

If you find yourself writing the same CSS in many places consider creating a shared class. If you give a parent element some styles make sure you take advantage of inheritance and do not redeclare styles when it is not needed. For inheritance think about which styles are the most logical to inherit. For example, your color properties. Does it make more sense to inherit the blue color or the red color? I would say the most common style is the paragraph style, not the headings styles so it makes more sense to inherit the blue color.

Good job, keep it up!

1 Like
5

Thanks! Great feedback. I’ve tried to improve it if you’d like to take another look.

6

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