@Mennatallah-Hisham
Posted
Hi TemitayoGold,
Congratulations on completing your first challenge👏
You did great 👍
Here are some suggestions to improve your code:
Centered Card
- you can center the card both horizontally and vertically using flexbox
.parent{
display:flex;
justify-content:center;
align-items:center;
}
Semantic HTML
- wrap your content in <main>,this element represents the dominant content of the <body>
- wrap your card in <article>
<main>
<article>
</article>
<div>
</div>
</main>
Headings
- each page should have one h1 tag,h1 helps the web understand the content. also skipping h1 may confuse assistive technology users.
<h1>Improving your front-end skills by building projects</h1>
ALT
- images should have descriptive alt text, which is important for SEO and screen reader users,alt="QR code linking to Frontend Mentor challenges"
Media Queries
- the most common media queries are 480px , 768px , 950px , 1200px . you may not use all of them or you may need more breakpoints depending on your design.
SEO
- you can add meta description for better SEO, it provides a brief summary of a web page
<meta name="description" content="..........."/>
here are some helpful articles:
Hope you find this helpful, Happy Coding
Marked as helpful