Nazewnictwo w CSS Opcje

[Evinek]

Witajcie.
Napisze krótko i na temat.
Jak nazywać lub inaczej, jak robić tagi w CSS i HTML.
Mój problem jest w stylu (przykład):

index.html

[HTML] pobierz, plaintext 
<div class="articles">
	<div class="article">
		<h2>Tytuł</h2>
		<p>Lorem ipsum...</p>
		<a href="article.html">Czytaj dalej</a>
	</div>	
</div>
[HTML] pobierz, plaintext 

article.html

[HTML] pobierz, plaintext 
<div class="article">
	<h2>Tytuł</h2>
	<p>Lorem ipsum...
	Bla bla bla</p>
</div>	
[HTML] pobierz, plaintext 

Wszystko opakowane oczywiście w:

[HTML] pobierz, plaintext 
<div class="container">
	<div class="header"></div>
	<div class="content">
		<!--Tutaj wcześniejszy kod z tamtych plików-->
	</div>
	<div class="footer"></div>
</div>
[HTML] pobierz, plaintext 

Póki co tworze takim sposobem i jakoś działa:

[CSS] pobierz, plaintext 
.articles .article h2 {/*kod dla index.html*/}
.article h2 {/*kod dla article.html*/}
[CSS] pobierz, plaintext 

Jakieś lepsze sposoby lub pomysły? Chciałbym aby kod był jak najbardziej przejrzysty i aby ktoś inny nie miał problemu aby raz dwa się połapać.

[!*!]

Witajcie.
Napisze krótko i na temat.
Jak nazywać lub inaczej, jak robić tagi w CSS i HTML.
Mój problem jest w stylu (przykład):

Stosuj HTML5 i się go trzymaj. Nie ma sensu pisać dziś jakichś otagowanych bzdur (IMG:style_emoticons/default/wink.gif)
BODY sam może być kontenerem. Jako "podstrony" ładujesz do tagu <section> w tym article i po sprawie.
Później w CSS masz przejrzyste:

[CSS] pobierz, plaintext 
header{}
header nav{}
section article{}
section aside{}
footer{}
[CSS] pobierz, plaintext