レスポンシブWEBデザインでの、mediaqueryごとの記述の仕方について。

レスポンシブで書く際に今まではPC向けのコーディングを行い
その後、@mediaの中にスマホの記述を行っていました。
（モバイルを先に書く場合もありますが）

----CSS----
@charset ’utf-8’;

//@mediaでくくらない
.hoge {
text-color:red;
}

@media(max-width:640px) {
.hoge {
text-color:blue;
}
}

----//CSS----
http://yomotsu.net/blog/2012/10/01/mediaquery-goodpractice.html
少し古いですが、上記の記事の方法2に近いです。
私の書き方だと、@media(max-width:640px)はパッチ的な
記述になります。ただ、PC向けの記述をmedia(min-width:641px)などで
くくるとコード量が増えてしまいます。

ベストプラクティスは何か考えているのですが、あまり情報がありません。
どのようなレスポンシブの書き方がオススメでしょうか。