Windows Phone Tribute Page Feedback

Code Feedback
1

Hello everyone, I’m Ben and this is my first post on the forum and my first completed challenge so please be open with all criticisms and recommendations.

The completed challenge is the tribute page which I dedicated to the Windows Phone OS.

Here’s the CodePen Link: https://codepen.io/BenTechCode/pen/poyErmw

I used plain Html and CSS here with no JavaScript or other enhancements such as Bootstrap.

I did use some Google Fonts to make the page look more professional. I also wrote all the code in VS code before pasting the code into CodePen.

Can’t wait to see the feedback.

Thanks,
BenTechCode

2

Hey Ben,

nice to meet you! :slightly_smiling_face:

Congrats on your first project, great job so far! :clap:

My ideas:

  • all tests pass, awesome!

  • when you use codepen, you only have to add the code that belongs into the body; so you can remove this:

<html>
<link rel="stylesheet" href="TributePageCSS.css">
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital@1&family=Roboto+Condensed:ital@1&display=swap" rel="stylesheet">

For the links, you can go to Settings > HTML > Stuff for <head> and paste them there.

In your <main> you have a <head>...</head>, you also want to put the head's content into Settings > HTML > Stuff for <head>.

Your code now should look like this:

<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>

<main id="main">
  <figure>
    <div id="img-div">

  • after you removed this unnecessary stuff, you can get a code validation by pasting your HTML code into the body; you will see some small errors and I think you are able to fix them! :+1:

  • you can increase the readability of your code by:

    1. clicking on the small arrow on the right side of the code box and
    2. clicking Format HTML/CSS

  • when I decrease the width of my browser, the content gets squeezed; this is important for people who read your page on a smartphone

Screenshot_2020-08-21_09-02-12

  • on my wide screen, I’m having a hard time to read the content, because the lines are very long, font size and line height are rather small

Screenshot_2020-08-21_09-01-19
Screenshot_2020-08-21_09-01-191383×74 13.7 KB

So this seems to be a lot of stuff, but it’s totally normal that literally every website has room for improvements! :slightly_smiling_face:

Feel free to ask questions and keep up the good work!

1 Like
3

Thank you so much!

I really appreciate the advice I wrote the code in VS Code and Just pasted into CodePen to pass the challenge, but I’ll validate and format the code to Update it later. I’ll also clean up my CSS to make the content more readable.

Once again Thank you for Helping me be a better dev.

Best, Ben

1 Like