Cards in Bootstrap

Hello there 👋. Congratulations on job well done! 🎉 🎉 🎉

• I would like to make some suggestions concerning your code that I might be of help.

HEADINGS ⚠️:

• This solution generated accessibility error report: Page should contain a level-one heading. This is due to the lack of a level-one heading <h1>.

*Headings provide structure to a webpage. It helps Search engines and Users to determine the most important piece of texts in a webpage.

• Every webpage must have at least one h1 element identifying and describing the main content(text) of the page.

• Headings in a webpage should only increase or decrease by one. your webpage contains a <h4> and a <h6> elements (elements decrease by 2). **Would recommend you change the <h4> to an <h1> Cause that's the main heading of the page, and the <h6> to a <p> cause its just the description of the component and not a heading.

HTML 🏷️:

• This solution generates accessibility error report: "All page content should be contained by landmarks". This is due to a non-semantic markup, which causes a lack of landmark for a webpage.

• So fix this by replacing the <div class="container"> element with the semantic element <main> along with <div class="attribution"> into a <footer> element in your index.html file.

• What is meant by landmark ?: They are use to provide a more precise detail of the structure of our webpage to the browser or screen readers. We make use of sematic elements to provide landmarks to our webpage example includes <main>, <aside>, <footer>, etc., instead of relying on generic elements like <div> or <span>.

• Every webpage should contain one <main> element and it should include all content directly related to the page's main idea, there should only be one per webpage.

Image ⚠️:

• This solution generated HTML validation report: Bad Image value.

• to correctly display your image in the browser change the src from src="images\image-qr-code.png" to src=".\image-qr-code.png"

• I would recommend you to create an image folder in your project and move the image to the folder and the add .\ Infront of the images i.e src=".\images\image-qr-code.png"

Well done for completing this challenge 👍

I hope have been of help, Please feel free to ask any question

Happy Coding 🎉