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

Responsive Landing Page - HTML, Sass, JavaScript, Yeoman, Surge

cgonz0 20

@cgonz0

Desktop design screenshot for the Ping single column coming soon page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

P
Matt Studdert 13,611

@mattstuddert

Posted

Hey! Great work submitting your first challenge solution. At the moment the live preview of your site isn't working because it's using http instead of https if you could update your live site URL to https://ping-landing-page.surge.sh then it will work 👍

I checked the page out though and it looks great! Here are a couple of small suggestions based on your code:

  • You've got a couple of img tags that currently don't have any alt attributes on them. If a screen reader comes across these it will read out the file path instead of a description of the image. So I'd strongly recommend always adding alt attributes.
  • The social icons you're using don't have any written text in the links, which also makes them inaccessible to people using screen readers. Here's a post I made on Twitter about accessible social icons recently that should help you out.

Interested to hear your thoughts on using Surge as well. Do you like it? I'll try it out soon on a project. I've never used it before.

Hope those tips helped! Keep up the great work 👍

0

cgonz0 20

@cgonz0

Posted

Thanks for the feedback, Matt! I'll fix those issues. I do like Surge -- it's the only web publishing tool I use at the moment, besides Github pages. I wonder how it compares to Netlify in terms of ease of use/simplicity?

0
P
Matt Studdert 13,611

@mattstuddert

Posted

No problem! I've never used Surge, but it looks like a nice service.

Personally, I love Netlify and also Now by Zeit. I'd definitely recommend playing around with them on future projects as well just to see how they function. They're both extremely easy to use and link to your GitHub repos.

0

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