How can I enhance my code? How can I write my code including good practices? How can I make my code cleaner and shorter?
Muhammad Faraz
@Faraz74MughalAll comments
- @quijotexSubmitted over 1 year ago@Faraz74MughalPosted over 1 year ago
Hello there π. Congratulations on successfully completing the challenge! π
Enhancing your code, following good practices, and making it cleaner and shorter are key aspects of writing high-quality code. Here are some tips to help you achieve these goals:
- Use HTML elements that accurately reflect the purpose and meaning of the content.
- Use headings, paragraphs, lists, and semantic tags to structure your content hierarchically.
- Ensure your HTML code is accessible to all users. Use appropriate markup for images, provide alternative text for visual elements.
- Use consistent naming conventions, such as BEM (Block Element Modifier) or SMACSS (Scalable and Modular Architecture for CSS)
- Give your elements meaningful and descriptive class and ID names. This helps with code readability and makes it easier to style your elements with CSS.
- Combine selectors that share common styles to avoid repetition. This reduces the amount of code and makes it easier to maintain and update styles.
- Consider using CSS preprocessors like Sass or Less to take advantage of their features, such as variables, mixins, and nesting.
By following these practices and guidelines, you can write cleaner, more maintainable, and efficient HTML and CSS code for your projects. Remember to prioritize readability, modularity, and performance when developing your front-end code.
I hope you find this helpful π Above all, the solution you submitted is great !
Marked as helpful0 - @RicardoFuentes437Submitted over 1 year ago
What do you guys think about the responsiveness? What do you think about the visual aspect of the page? does it look good? What are some practices that you think can be improved?
@Faraz74MughalPosted over 1 year agoGood day. Thank you for completing the challenge successfully.
I have some additional suggestions for you regarding your code that I think you'll find very interesting.
HEADINGS :
This solution makes improper use of. <h1> Therefore, using level-one headings incorrectly can lead to serious accessibility issues. <h1> Every website must have a single h1 element identifying and summarizing the page's primary content. Users of assistive technologies can easily find the page's main content by using an h1 heading as a crucial navigational point. There is in this answer. <h1> element, that being this. <h1> Make remote work. </h1> you should preferably use. We want to make good use of it because it gives users of assistive technologies a crucial navigation point. Therefore, we want to add a level-one heading to increase accessibility by having screen readers read the heading aloud.
I hope you find this to be helpful.
Cheers to programming!
Marked as helpful0 - @acarfth35Submitted over 1 year ago
Hi , I have tried to use flexbox and im getting similar result as desired on desktop view but on mobile design i couldnt figure out exactly.My card fills all screen horizontally. Any feedback is appreciated. Thanks
@Faraz74MughalPosted over 1 year agoHello there π. Congratulations on successfully completing the challenge! π
I have other recommendations regarding your code that I believe will be of great interest to you. HEADINGS β οΈ:
This solution consists incorrect usage of <h3> so it can cause severe accessibility errors due to incorrect usage of level-three headings <h3> Every site must want only one h1 element identifying and describing the main content of the page. An h1 heading provides an important navigation point for users of assistive technologies, allowing them to easily find the main content of the page. In this solution there's <h3> element which is this <h3>Improve your...</h3>, you can preferably use <h1> instead of <h3>. Remember <h1> provides an important navigation point for users of assistive technologies so we want to use it wisely So we want to add a level-one heading to improve accessibility Example: <h1>Improve your front-end skills by building projects</h1> If you have any questions or need further clarification, and feel free to reach out to me. If you have any questions or need further clarification, you can always check out my submission and/or feel free to reach out to me. .
I hope you find this helpful π Above all, the solution you submitted is great !
Happy coding!
Marked as helpful0