Tribute Page "Salgueiro Maia"

Code Feedback
1

I tried using as much of what I could from the curriculum that fit the model tribute page. https://ricardombispo.github.io/tributepage/0.1/index.html

What do you think?

2

Hey!

  1. You passed all the tests - well done :slight_smile:

  2. I noticed you didn’t change things like font (font-family). Why not give it a shot? I think that acquiring some design/UI skills along side learning web-dev is pretty darn useful.

I used a style by a news organization called The Correspondent, was fun to try out something slightly customised, have a look.

  1. As far as the code side goes, looks like neat HTML and overall it achieves what you wanted I think?

  2. Have a look at using a [very] modern font-size CSS function. It allows you to set responsive font-size with a single line of CSS. Pretty near and has very good support for being rather new. Here’s a video that helped me.

Keep up the good work.

Griz

3

Welcome to the forums @ricardobispo. Your page looks good. Some things to revisit;

  • Do not use the <br> element to force line breaks or spacing. That’s what CSS is for.
  • Make the page responsive. On smaller screens tribute info is getting cut off and falling out of the container.
    • Remember, the R in RWD stands for Responsive
    • You can see what I mean by dragging the right edge of your browser to the left.
4

Version 2: https://ricardombispo.github.io/tributepage/
-> added new font, harmonized font-size use a bit, and used clamp function to slightly adjust it

-> removed Br, used css to create spacing

-> responsive width with no content getting cut off(so far as I can tell)

-> added a link to the previous version just for comparison sake

Thank you for the suggestions. They’re very welcome.

edit: noticed an issue on safari
When I load the page with the window at minimum width the site loads the info text at the correct minimum font size but doesn’t scale up when I increase the width of the window. In Chrome, it does.