It's all about optimization

3.0.3 Avoid "overclassing"

You don't need to put a class name on every element. Beginning CSS designers will often define a class and apply it very liberally, forgetting that styling using semantic tag names is usually more efficient. Experienced CSS designers prefer to define styles for semantic HTML elements, then use those elements properly rather than have everything wrapped in classed <div>s.

Using element names will almost always save bytes and make your code cleaner. Although sometimes it will add some extra weight to your CSS file, the amount of code saved in your HTML is (usually) worth it.

Example One

In the "before" example, we define a class in each <li> element.

BEFORE

to optimize, we remove the class attribute from the <li> elements and instead use a "#menu ul li" selector to reference the same elements.

AFTER

negabytes gained in this example: 94 characters