Hi! This is my tribute page for Free Code Camp! https://codepen.io/VictorGE/pen/JJOjVQ
Could you please give me some advice about what to improve? I think that making a Free Code Camp’s tribute was perfect for this challenge, but I’m open to any idea.
I like your use of background images–really sharp. However, there is a drawback to placing text over images and that is readability. It’s tough getting enough contrast between the text and the background images to make the text easily readable.
Here is an example from my just finished FCC Portfolio site to demonstrate the contrast difference when an image is darkened:
<img src="//discourse-cloud-file-uploads.s3.dualstack.us-west-2.amazonaws.com/freecodecamp/original/3X/7/e/7ed4141e3d8653ef9cf56c2241ee2bd01f7cd05f.jpg" width=“550”; >
The image on the left is unfiltered. It’s difficult to read the light colored text over the light areas in the background image.
The image on the right has a 30% black filter. I think the image on the right is much easier to read.
There are many ways to do this. My choice is Photoshop because I have spent much of the last 3 years in PS but there are probably online options, as well.
There are a few other things but I guess the biggest feedback for your site is to find a way to improve the contrast between your text and backgrounds. I hope you find this helpful.
Thank you so much mr manges! I never used photoshop or any image editor
but I understand what you said and I was thinking on some other ways to improve readability using images this way. I will try to find some way using css, but if I’m not able to do so I will do what you said!