Tharun Raj• 1,250
@Code-Beaker
Posted
Hi there, congratulations on completing this amazing Junior project. You've done a great work with this one! 🎉
I would like to share some of my thoughts regarding your solution that might help you improve it.
- The navigation links should be wrapped inside an anchor tag(
a
). This gives a better meaning and also serves the purpose of a link. Same thing for the mobile navigation. - Use the correct order for the usage of heading(
h
) tags. Headings should only decrease by one level.
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
...
- To use different images for the desktop and mobile views as suggested by the challenge, you can use
srcset
. Currently, you're using CSS to toggle the image files for different screen sizes.
<picture>
<source srcset="folder/desktopImageFile.png" media=("min-width: 50rem")/>
<img src="folder/mobileImageFile.png"/>
</picture>
Here's a detailed tutorial from Envato Tuts+ on this topic.
- I encourage using more classes for your elements to make styling easier and faster.
Overall, you've done a great job and it works as expected.
I hope this helps you. 😊
Marked as helpful
0
Thin Yu Shwe• 480
@ThinYuShwe
Posted
@Code-Beaker Thank you for your suggestion! I will try to fix them!
1