Responsive Web Design Projects ; Build a Tribute Page

Hello ,
I have just finished my first project and I am wondering if you could possibly provide me with your feedback. This would help me improve the quality of my work in the next projects .
Kind regards,
Malek

Hey, you linked youtube video, not codepen. :slight_smile:

Sorry , here is th right one : https://codepen.io/malekhammou/pen/MZLmgG

There is some issue with one of the images you are using, this one:
https://cdn.pixabay.com/photo/2016/03/26/05/19/fractal-1280084_1280.jpg
You use it in this section:

body{
  background-image: url(https://cdn.pixabay.com/photo/2016/03/26/05/19/fractal-1280084_1280.jpg);
  opacity:100%;
}

It looks like host site for it does not allow its usage like this, because this is how it looks to me:


I fixed it ,I used Cloudinary for media storage.

I like general look, but there are 2 main issues I see:

  1. Text boxes on sides from his portrait are floating and do not have any kind of outliner that will help reader to focus attention on it. I would consider adding some kind of very transparent overlay under the text perhaps. Title of those parts also looks weird, with Synopsis :, what purpose is there in “:”? It is also bit to far from text under it imo.
  2. Design is not responsive, and if you reduce width of browser it all becomes jumbled mess.

1 Like

Floating boxes issue stems from the fact that the design is not responsive , isn’t it ?

Ah, no, maybe I was not clear enough about what I mean.
Second issue is about how text is positioned, as in location issues.
But first one where I say about it “floating” is visual issue, not positional, it other words, how it looks. It is hard to focus on text when it just floats in middle of nowhere like that, not positionally, but visually, because aside from text being there, nothing draws viewer attention to it, specially with portrait taking so much of attention.
Also, this text under portrait is black and is barely visible:
The genius mind at the age of 47.