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

Advice generator app using vanilla CSS

@Jorge-PMarin

Desktop design screenshot for the Advice generator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


I would appreciate your feedback.

Community feedback

Ivan 2,630

@isprutfromua

Posted

Hi there. You did a good job 😎

keep improving your programming skills🛠️

your solution looks great, however, if you want to improve it, you can follow these recommendation:

				**HTML**

Write Code Comments. It’s best practice to write human-readable code. Tried to comment your block of code. It will help you or any other developer to refactor the piece of code blocks.

Use only one <h1> element for one code sheet. It is important to avoid using more than one <h1> element for one code sheet. Having only one <h1> element on a web page is vital for Search Engine Optimization (SEO). It helps search engines understand what a web page is all about (the main idea of a web page). In your case, you are constantly updating the title, which is not correct. If the design does not include the main title, it can be hidden with the visually hidden class

				**CSS**

Use a CSS reset . By default, browsers don’t apply the same default styling to HTML elements, a CSS reset will ensure that all element have no particular style. For example: css-reset

Don’t use @import . The @import directive is much slower than the other way to include stylesheets into a html document:

<link rel='stylesheet' type='text/css' href='a.css'>
<link rel='stylesheet' type='text/css' href='font.css'>

I hope my feedback will be helpful. You can mark it as useful if so 👍 it is not difficult for you, but I understand that my efforts have been appreciated

Good luck and fun coding 🤝⌨️

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