Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

URL-Shortening-API-Frontend-Mentor-Challenge

#react#sass/scss
harshj11β€’ 50

@harshj11

Desktop design screenshot for the URL shortening API landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


Do share your comments and suggestions, Thanks :)

Community feedback

P
ApplePieGiraffeβ€’ 30,545

@ApplePieGiraffe

Posted

Hey there, harshj11! πŸ‘‹

Great job on this challenge! πŸ‘ Your solution looks good and responds nicely! πŸ™Œ

A couple of suggestions I have are,

  • Setting the alt text for the icons in the "Advanced Statistics" section of the page to be an empty string so that it will be ignored by screen readers. That’s because those elements aren't necessary or important to the content of the page and as a result don't need to be read by screen readers. That will help clear up some errors on your solution report.
  • Adding a max-width to the main wrapper or container element that holds the content of the page to prevent the design from stretching out to be too wide on extra-large desktop screens.
  • Turning the navigation links in the header and footer of the page into actual links by wrapping each of those items in a link tag. The social media icons in the footer page should be links, as well.
  • Making sure to add a heading element inside every section tag that you use (see your solution report). If there is no visible heading in the design, you might need to add one anyway, but hide it visually with CSS, or choose a different element altogether. πŸ˜‰

Hope you find these tips helpful. 😊

Keep coding (and happy coding, too)! 😁

Marked as helpful

1

harshj11β€’ 50

@harshj11

Posted

hello @ApplePieGiraffe , thank you so much for your valuable suggestions, I would surely work on them :)

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord