+ 10

How to keep track of every id and class in html?

Let's say I have a big (200+ lines of html/css) code. I have to give a lot of id(s) and classes. How to properly name everything so that you remember what is that certain html element id/class? (I've been naming things like... name1, name2, nameA, nameB, but it gets confusing because of the numbers, letters, or similarity.

12th Feb 2020, 9:41 PM
🍇 Alex Tușinean 💜
🍇 Alex Tușinean 💜 - avatar
6 Answers
+ 5
Using name1, name2 etc will be confusing . but you can do this 1. Use real names for your Id, if there's an input that saves value, then the id should be "input_save_value" and if there's another that remove data, then it could be "input_remove_data" using the same syntax by starting every related tags with their tag names or 2. Open the site on your browser, click on the element directly and inspect
12th Feb 2020, 10:23 PM
Mirielle - avatar
+ 4
name them according to their function or purpose. use long names to describe them precisely, keep whatever naming convention you chose consistent across the whole code. group similar parts of your code in blocks. sketch a design of your page before you start writing it... etc.
12th Feb 2020, 10:34 PM
Bahhaⵣ - avatar
+ 2
Ko given the right one. use real time name instead of code name if they are multiple use add number to it's suffix... Can understand what I am say?
13th Feb 2020, 6:02 PM
+ 1
Just give a comment section in each id or class
14th Feb 2020, 1:46 PM
Timotius Simanjuntak
Timotius Simanjuntak - avatar
Personally I always name classes after the utility it provides. For example: If I have a div-element that contains multiple buttons that perform actions with my content, I'd name the class "action-container". Furthermore I would refrain from using id's. while they give you a lot of utility for stiling individual elements, they also lead to a lot of duplicated css properties.
14th Feb 2020, 8:01 AM
e90d0e_red - avatar
just use real name
14th Feb 2020, 11:31 AM
code kid
code kid - avatar