Hey @Grishmita 👋🏻
I have couple of suggestion on how to fix accessibility, HTML and also some other issues.
- Your
<div class="grid-container">...</div>
should be<main class="grid-container">...</main>
and<div class="attribution">...</div>
should be<footer class="attribution">...</footer>
. These will fix most of your accessibility issues. The other one related to heading, in your code headings should decrease gradually. Meaning of, start fromh1
and then go down toh2
and so on. Don't forget to generate a new report once you fix the issues. - To fix the website's HTML issue, I'd suggest swapping
<section>
s with just<div>
s for a couple of reasons. Generally,<section>
is used to separate a bigger section in a website, for example if a website's layout has a review section, image gallery, etc., you get the point. Besides that if you use<section>
you have to have some type of headingh1-h6
. <h1> Get <a>insights</a> that help your business grow.</h1>
here, I'd suggest changing<a>
with a<span>
tag, since<a>
tag is used for links and in this case there's no link attached to the word.- In the code below, you should change
<h3>
to<p>
, since it's not really a heading.
<div>
<h3> 10k+</h3>
<p>COMPANIES</p>
</div>
I hope this was helpful 👨🏻💻 Other than those semantic issues, your grid layout looks great, Cheers 👾
Marked as helpful
2
Grishmita• 105
@Grishmita
Posted
@kens-visuals Thank you so much for guidance .I'll keep that in mind for sure.thanks
0