Plz review and give feedback of my first tribute page

[mamtamukherjee1987]

Hello,
please review my first tribute page and give some suggestions .I m new in this field.
https://codepen.io/mamtamukherjee1987/pen/OJRrmRL?editors=1100

thanks

[bbsmooth]

Hey there, one thing that immediately stands out is that the red text on that pink background is very hard to read. You need more contrast between the font color and the background in order to be accessible. You can check your contrast levels at https://webaim.org/resources/contrastchecker/.

[mamtamukherjee1987]

hi thank u for suggestion .i changed background color .Now see that is okay
https://codepen.io/mamtamukherjee1987/pen/OJRrmRL?editors=1100

[bbsmooth]

Technically it is still failing accessibility requirements (the ration is only 2.6:1). Did you verify that the colors you are using are accessible using the link I provided? Your problem here is that red and pink are very similar colors so you are going to need a very dark red and a very light pink in order to make them accessible.

[mamtamukherjee1987]

Hi ,now i change colors according to that website u gave .plz check now .
https://codepen.io/mamtamukherjee1987/pen/OJRrmRL

[jwilkins.oboe]

Congrats on finishing your first project!

I am glad you were able to fix those last two failing tests since the last post.

A few things from me.

For codepen, you don’t need to include the doctype,head and html tags.
If you need to include links for the head than there is a section on codepen for that.

Remember that ids need to be unique and should only be used once.

        <p><a id="tribute-info" href="https://en.wikipedia.org/wiki/Mahatma_Gandhi" target="_blank">Role in World War I</a></p>
        <p><a id="tribute-info" href="https://en.wikipedia.org/wiki/Mahatma_Gandhi" target="_blank">Champaran agitations</a></p>
        <p><a id="tribute-info" href="https://en.wikipedia.org/wiki/Mahatma_Gandhi" target="_blank">Kheda agitations</a></p>
        <p><a id="tribute-info" href="https://en.wikipedia.org/wiki/Mahatma_Gandhi" target="_blank">Salt Satyagraha (Salt March)</a></p>

Also, it is important to get in the habit of formatting your code. Codepen has a tool for that.

Lastly, you misspelled tribute link so none of these styles are taking effect.

#tuibute-info {
    color: red;
    font-family: cursive;   
}

Hope that helps!

[mamtamukherjee1987]

Thanks again next time i will keep in mind.