I am a web developer for almost 2 years now and I am still learning new things every day, but since my knowledge gets bigger, I came across some fundamental question and couldnt find a good discussion about it.
How do you name your DIVs, IDs, Classes? Do you give them specific content related names? (i.e. <div id="google_map">)
Or do you name them related to their position on the site? (i.e. <div id="content_top_bar">)
And do you do this in your .css the same way?
I hope you get what i am trying to find out. I guess there is no “true” answer anyways, but I would like to know some opinions, so that I can decide what option to take and keep working with it in the future.
HTML should be used as semantically as possible, so your classes and IDs should be named for their content, not for their style, or their position within the site (these things should be able to change without effecting your HTML.
For example, if you name a
<div id="left-sidebar">and then later decide you’d like to move that element, the id no longer would semantically represent the element. Conversely, if you named a<div id="navigation">or<div id="article">they would still represent the element, regardless of their placement or styling on the page.