Skip to content
OverviewSolutions
4
Comments
3
arpan62825
@arpan62825

All comments

  • arpan62825•60
    @arpan62825

    Hey, fantastic effort on this! You’re really nailing it. Just a few things I noticed that could make it even better…

    Using a <main> tag inside the <body> of your HTML is a best practice because it clearly identifies the main content of your page. This helps with accessibility and improves how search engines understand your content. I would put the links into a <ul> <li>, I would reduce the use of <div> tags as it is bad from a SEO standpoint. Also it is a convention to put a '#' in the "href" if there is no link attached. <a href="#">Example</a>

       <div class="card-links">
        <a href="">GitHub</a>
        <a href="">Frontend Mentor</a>
        <a href="">LinkedIn</a>
        <a href="">Twitter</a>
        <a href="">Instagram</a>
     </div>

    For future project, You could downloading and host your own fonts using @font-face improves website performance by reducing external requests, provides more control over font usage, ensures consistency across browsers, enhances offline availability, and avoids potential issues if third-party font services become unavailable.

    I hope you found this advice helpful! Keep up the great work, and don’t forget to dive deeper into the details. You’re doing amazing, and I can’t wait to see what you create next. Happy coding! 🚀

    Marked as helpful
  • arpan62825•60
    @arpan62825

    Nicely done, just add the font and add the hover effect, and you would be good to go.

    Oh and also try adding media-query for mobile phones

  • arpan62825•60
    @arpan62825

    you can use opacity rule to change the opacity of box-shadow.