My tribute page - Feedback highly welcome!

Hello!

I’ve just finished my tribute page and I’d love to hear your feedback about it! Any criticism and/or suggestion is very much appreciated!

This is my first project ever, I started from zero as I do not have any knowledge about programming (I was able to read some html back in the day, when I needed to adjust the template of my blog, but nothing more). I admit that the first time I tried working on this project I didn’t have a clue about where to start and I went to read the example page code to see just what to write and where! I did a lot of back and forth to the curriculum and Google because I didn’t remember all that I studied… but I guess experience comes with practice?

I’m quite satisfied with the result but, for the love of me, I cannot make columns resize to fit the screen when opening the page on mobile while the header shrinks just fine!

Also: could you please let me know if the link to Facebook works for you? Again, no way to make it work (I found a similar thread on the forum, I guess it’s due to the name of the page which is not the actual name FB redirects to… because I can reach FB without problems on my browser)

Also also: English is not my native language, please let me know if something sounds off!

Thank you! :blush:

Tribute-page project

I did a lot of back and forth to the curriculum and Google because I didn’t remember all that I studied…

You mean googling things? Absolutely. No one can remember all of this stuff. The most important skill a developer has is knowing how to google things.

Also also: English is not my native language, please let me know if something sounds off!

I didn’t notice. Your English is fine.

As to the page, the looks…

It looks pretty good. One thing I don’t like is the justification, stretching the text out to fill the line. I’ve never been a big fan of it anyway (it makes it more difficult to track your line while you’re reading it) but in this case, because the font is so big and there are relatively few words on each line, you get weird gaps in between the words.

For the code…

<! DOCTYPE html>

There should be no space after the “!”.


				<figcaption id="img-caption">A pensive pirate</figcaption>
				<figcaption id="copy">(&copy Daniele Bossoletti)</figcaption>

I don’t think a figure is suppose to have more than one figcaption. And the copyright symbol should have a semicolon at the end, not &copy but &copy;


No, the FaceBook link did not work for me.


Still, I couldn’t find too much to complain about. Good work. Have fun on the survey form project.

Very nice for your first project ever. I think the one thing I would focus on here is responsiveness. Try narrowing your browser as far in as it will go and see what happens. My advice would be to restyle the page starting at this narrow width. Make sure everything looks nice and no horizontal scroll bar. This will be your base CSS. Then you can gradually widen your browser and when you think you finally have enough space you can add a CSS break point and rearrange things.

Your page looks good @amanitha. 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.
  • 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.
  • As mentioned, make your page responsive. Remember, the R in RWD stands for Responsive
    • There’s a horizontal scrollbar on smaller screens (see screenshot)