Design comparison
Solution retrospective
I have one question that should I add class or id to every html tag.
Community feedback
- @danielmrz-devPosted 11 months ago
Hello @jahanzaib-jazy!
Your solution looks great!
I have a couple of suggestions for improvement:
- In order to make your HTML code more semantic, and since that is the main title of the screen, replace the
<h3>
with<h1>
. Unlike what most people think, it's not just about the size and weight of the text.
π The
<h1>
to<h6>
tags are used to define HTML headings.π
<h1>
defines the most important heading.π
<h6>
defines the least important heading.π Only use one
<h1>
per page - this should represent the main heading/subject for the whole page. Also, do not skip heading levels - start with<h1>
, then use<h2>
, and so on.- Also, still about semantic HTML, replace your
div.post
withmain.post
.
All these tag changes may have little or no visual impact but they make your HTML code more semantic and improve SEO optimization as well as the accessibility of your project.
I hope it helps!
Other than that, great job!
Marked as helpful0 - In order to make your HTML code more semantic, and since that is the main title of the screen, replace the
- @RevazSologhashviliPosted 11 months ago
Using class or id tags in HTML actually depends on what you want to create or how you plan to style it. If you want to apply the same style to multiple elements, such as all list items, you can use the same class for all of them. However, you canβt use the same ID for multiple elements since IDs must be unique. With classes, you can also apply multiple styles to a single HTML tag, like class="color-red bg-black".
If you want to apply unique styling to an element, then you can use IDs. IDs are also used for navigation within a webpage. For example, <a href="#idName">Go to this Part</a> allows you to navigate to the section of your website identified by the specified ID.
Remember, IDs have a higher specificity than classes in CSS, meaning that if there are any conflicting styles between classes and IDs, the styles defined under the ID will override the others. Also, while classes can be used multiple times within a document and can be applied to multiple elements, IDs are unique and each one can only be used once within a document. This uniqueness makes IDs very useful for JavaScript manipulation.
Marked as helpful0@RevazSologhashviliPosted 11 months agoSo itβs not necessary to add a class or id to every HTML tag. Classes and ids are used for specific purposes:
Classes are used when you want to apply the same styling or behavior to multiple elements. They are also helpful when you want to target elements with JavaScript.
Ids are unique identifiers for elements and should be used when you want to style or manipulate a single, unique element.
You should only add classes or ids when you need to reference the element in your CSS or JavaScript. Adding them to every tag can make your HTML unnecessarily complex and harder to maintain. Itβs best to keep your code as simple and clean as possible. π
Marked as helpful0@jahanzaib504Posted 11 months agoThanks a lot. It was really helpful.@RevazSologhashvili
0
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