Tribute Page Complete

Code Feedback
1

I finally completed my tribute page challenge. I would truly appreciate some constructive criticism. I’m still learning and trying to find my more artistic side to enhance my learning experience. Any help would be greatly appreciated.

2

Hi,

The shadow effects are nice and bring some volume. I like it.

A couple of things:

  • Name your codepen, don’t leave the random letters given by codepen

  • Alignment of your Title Adele Queen of Pop, it is too low

  • Break down the layout of your page, it is way too packed with text and it looks even more stacked when you look on other devices. ( you can check the rendering on different view ports on Chrome by using the developer tools and then once it is open you see a black rectangle on the left, when you hover on it it says "toggle device tool bar

  • Why did you comment out all your css classes? I would suggest keeping your CSS separated from your html if only for your sake: you don’t have to scroll back and forth everytime you want to check your css for a class, it is better to leave them in the CSS part of the code editor instead of copying in the body of your page.

  • For all the Header content (link to css, scripts etc… Codepen has its own section as well as an already present Doctype html so no need for the hassle.

  • If you succeed at getting data from Google Analytics, let me know, last time I checked there was not any on my portfolio, it may just confirm that no one went to check it out though:)

  • The blue background could be lightened a little, bear in mind that people with eyesight problem may look at your page and if the contrast is not good enough they may not see your content correctly.

  • On the other hand the bright red for the link may be a bit overkill, I would suggest changing the link color to something less aggressive.

*Alt attribute for your picture should not be the title of your image but a description, it can be quite long something like “Portrait picture of the singer Adele in black and white”. It serves people who can’t see the picture for various reasons and search engines.

1 Like
3