Hi there,
I’ve just finished the first project today and would be happy if someone gave me feedback about it. I tried applied elements of visual design, flex, and grids.
While viewing your page in FF, go to the View -> Zoom menu and activate ‘Zoom text only’. Then while holding the Ctrl key down scroll your mouse wheel to make your text size bigger. It won’t take long until you see things breaking. Basically, you can’t assume what font size your viewer will be using when looking at your page and so you should make sure it responds nicely to at least a 200% font size increase.
Also, you’ll notice that the two paragraphs directly under the image at top do not increase in text size as you scroll the mouse wheel (same with the text in the timeline and the text next to the top image). You are basically setting a max text size on the user. You should allow the user to view the page at whatever text size they need. To fix this, do not set the font size with viewport units, use em units instead.
Your text in the quotes and timeline does not have enough color contrast and is thus not accessible. Get rid of the opacity so that it is actually white text on black background.
All of your images technically need alt text. I would say that the images in your quotes are decorative and do not add any additional content, so you can safely make the alt text blank. Or, you could change them to CSS background images (which is probably the preferred method). Your top image does convey some information (e.g. he wore number 24) so add some good descriptive alt text there. For more information on alt text see:
2 Likes
Thank you, I really appreciate your review. I’m going to work with it.
Regards