@ZenitsuAg
Posted
Hello Jude, you've done pretty well. Here are some tips to help you improve your code.
- Your image didn't load because you didn't upload the image folder to your repo.
- It's usually better to wrap the entire code inside a
main
tag for accessibility purposes. - Also, I see that you aligned the
h1
and thep
elements in the HTML file , it's much better to do all that in CSS using thetext-align
property and you can just set it tocenter
- And I really don't know how but you're missing the HTML boilerplate in your code. I mean
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
this stuff. This is a very important component of any modern website today.
Overall, you've done a great job.
Happy Coding :)
Marked as helpful
@JudeSavio
Posted
Thank you for response ZenitsuAg . I've made the said changes and it looks better now. Any other feedback is deeply welcome and appreciated.
Can you shed a bit more light on as to why we need to use a main tag to wrap the code?
@ZenitsuAg
Posted
@JudeSavio
The reasons why we need to use a main
tag to wrap our code are
- Accessibility: Assistive technology can use landmarks for quickly identifying and navigating to the document’s large sections. It is recommended to use the <main> element.
- Skip Navigation: Assistive technology users can skip large sections of repeated content using “skipnav” technique. This allows the user to easily access a page’s main content. If you add an id attribute to the <main> element, it will be the target of a skip navigation link.
You can read more here.
I hope this helps.
Happy Coding :)
Marked as helpful