Design comparison
Solution retrospective
Hi community, Second challenge today - finished. I'm quite proud of myself. I wanted to do the challenge in less than hour and I accomplished it.
Process
- I only used HTML, CSS and vanilla js for this challenge. I used mobile-first approach for styling.
- I fetch advices from Advice Slip JSON API
Community feedback
- @gregoriofrancisco99Posted almost 2 years ago
Hello, Joana. Your solution looks amazing. Didn’t have the time to go for this challenge yet, but you just inspired me. 😅 Okay, let’s get to business, now.
Took a look at your html, and I think you should switch the h1 and p tags one for each other. Because as far as I can understand, headings are, for the user, some kind of directions of what kind of content he can find in a certain section, and that should be short and explanatory as “Advice #117”. 😊
This my only suggestion. Loved your solution. ❤️ And remember... keep coding 💻
Marked as helpful0@joaskrPosted almost 2 years ago@gregoriofrancisco99 Thanks :) I was actually thinking about switching the h1 and p tags while I was working on this challenge. I decided to use <h1> for advice text as it seemed more important than the number so I treated it as the main subject of the whole page. However, I see your point. “Advice #117” seems like a "header" for the advice. And it makes a lot of sense to use <h1> for it! I will consider switching them 😊
I'm happy I could inspire you and can't wait to see your solution! Keep coding ❤️
1
Please log in to post a comment
Log in with GitHubJoin 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