@haquanq
Posted
Hello @Joewanaaa
This is my opinion on how you can improve this solution:
- Page must have one
mainlandmark (read more here)) which means wrap the mot important content of the page inside it. - Consider using more semantic markups instead of
div(avoid usingdivwhen ever possible, i will explain later) such assection, article, figure,... . For example, you can choosesectionorarticle` to wrap the card (depend on what context you want to provide - is it a section or article?). - You are using headings wrong, the size of the title is irrelevant to the heading order but it rather depend on your content flow (normally you should start from
h1toh6and not skipping any level - such ash2toh4). Page must have oneh1to give the title of the page. - You should keep your HTML structure clean and avoid unnecessary
divwrapping. Often,divshould be used for styling purposes such as changing it's child elements layout (ex: using flexbox), you can leave child elements as it is or if the content represent as child-content you should find a proper HTML markup to wrap it (a list or section, article??) and make sure to provide a proper heading level.
Have a nice day and happy coding!!!
Marked as helpful
@Joewanaaa
Posted
@haquanq Thank you so much this is much appreciated! This is noted and will update my code applying your feedback :)
@Joewanaaa
Posted
@haquanq hello, I tried updating my HTML, would you be so kind to give me a new feedback on this one? Thank youuu!
@haquanq
Posted
@Joewanaaa you have already used article for the card and then there is a section to wrap it's content which make h1, p belong to the section not article, hence it makes article meaningless.
You can use div instead of section which makes these texts belong to article or consider not wrapping them inside any element at all.
@Joewanaaa
Posted
@haquanq I thought divs are non-semantic element?
@haquanq
Posted
@Joewanaaa yes, it is just a way to replace section in your case, for me i would remove it.
