Whether you use a selector by ID is absolutely a sign of bad style?

Personally, I don't see anything wrong with moderate use selectors by ID. For example, I always use the selector #wrapper or #container for the main content container, or container data-modal #modal. First of all, it emphasizes that this element should be on the page in the singular, and fraught with problems to anyone who wants to add another, violating, thus, a well thought-out structure.
Classes also emphasize the real possibility to use this element with this class again. And for some moments (like described above), it seems to me overrecruit in terms of architecture and semantics, like using strong instead of h1.

At the same time, against this type of selectors are trying to put arguments (habrahabr.ru/post/160177/) like:

id can be used on the page only once.
the class can be used as many;
most of the rules that apply to id can be scattered across multiple classes;
id in 255 times specific class;
This means that you will need to use 256 classes to the element, to outweigh a single id.

But that's why is used as a selector by ID to emphasize the behavior of the points 1 - 2! The remaining three paragraphs do not make sense, as for me...

So I would like to hear the opinions of experts)
September 26th 19 at 07:12
8 answers
September 26th 19 at 07:14
Solution
Ran article eyes. My opinion - a very delusional article. Clinical perfectionism in the development + own taste preferences to set as Canon... In the ID there is nothing nothing, well absolutely nothing wrong with that, especially considering you described the approach.

Although if you really want something can be subverted indefinitely. At the time, tried to build a web page using haml and scss modifier of severity in CSS. Managed to completely get rid of the classes and ID. Here only the code was like the wall of China long. It is necessary to you?

Moreover, with the development of the front (javascript) from ID to withdraw completely impossible. But in General, you have correctly described the principles of application of both, so do not mix Convention concise and readable code the idea of the divine section. Most importantly write, write and again write, the style as your and "right" is produced only with practice. And not always "how" require more than "as you want" ;)
September 26th 19 at 07:16
The one who speaks about avoiding the use of id selectors - clinical idiot with high self-esteem. Don't listen to these people.

Selectors classes and id's is the basis of the sample elements. Selectors by class is designed to define groups of elements. Selectors by id to identify the specific elements. The combination of these selectors allows you to select specific elements in certain groups.
September 26th 19 at 07:18
I would still strongly recommend you to use ID selectors in CSS for a simple reason.

Rendering engines, Gecko and Webkit in the formation of Reflow and Layout accordingly build indexes on ID exactly the same way as the class name. As the side effects - you can write about the same thing here, and the code will work that way. As for me, it is somewhat non-obvious behaviour that the styles apply to all elements with that ID, not just the first one.

Many developers, and novice designers confuse the concept of CSS and selectors with the peculiarities of the XML language. You have to understand that ID in the XML is a strict parameter which is used to build the index with BST, which allows you to quickly find the first occurrence of ID (the same happens in JS when you call document.getElementById("test")), but in CSS when building layout it's much less strictly. And it should be noted that the developers of the browsers have decided to do so, based most likely on the concept that designers often re-use the styles described for the selector ID.

Thus, from the point of view of performance "#" is no different from ".", at least in the modern WebKit and faerfoks. Now for the point of view of good practice.

I personally do layouts for almost ten years, and accurately determined that the work, when it comes to a stranger or connecting with someone else's area of responsibility (and the CSS is interconnected with the design of the layout area), nothing unique, not happen at all. If so, the identifier can be confusing.

In my practice, I always use IDs for those nodes, which are involved in JavaScript and the uniqueness of the role that I'm sure. Of course, there are also sometimes have to change, but much less than in CSS. But for visual display I always use classes, to have the full right not to write code again, if the designer wants to insert "the only one on the entire site header, it accurately anywhere else will not be" in another part of the page.

As far as the arguments about "more code", we can offer these fighters for a dozen characters to move to the template engines; or even learn the whole concept of BEM, then the code is significantly reduced.
September 26th 19 at 07:20
The meaning of that article (as I understand it) - try not to use id in CSS, only the classes. Without an id in the HTML to do, generally speaking, difficult (think about the label about the anchor (anchors)), and in JavaScript/jQuery getting an element by using a simple id selector should work much faster than using classes.
actually ajtishniki need for anchors and labels/forms. For registration they should not be used. That is possible, but very carefully. - kendrick67 commented on September 26th 19 at 07:23
September 26th 19 at 07:22
support. id is sometimes necessary and appropriate.
September 26th 19 at 07:24
The stupidity of some. Let us then DBMS will not use identifiers and because you can make selection according to certain conditions and to the same result. That's just running a query by ID is much faster. Same with id in the HTML. As for Javascript and CSS selectors by id are much faster. Only use them wisely. You very correctly noted the semantic rules for the use of id and class.
September 26th 19 at 07:26
It is believed that the purpose of css styles via #id runs much slower than via .class and it is better not to use #id for styling.
Nonsense, ID works faster. - kendrick67 commented on September 26th 19 at 07:29
September 26th 19 at 07:28
For myself, I long ago developed this technique:
- all that is associated with the style - CLASS
- where 100% is. JS then change CLASS to ID
- if the block style is repeated, but one of them should be hanged JS and CLASS and ID

... although looking recent projects - 2nd and 3rd paragraph use the unique classes ... and why?
... and remembered. Due to the use of different frameworks started sometimes just get in their styles and identifiers. Type in bootsrap modal - that went on unique classes.

Find more questions by tags CSSHTML