今の時代、サイトを作るならスマートフォンの存在は忘れてはならない存在になっています。
「モバイルファースト」と言われるくらいに重要になっています。

そして、サイトを作る上でどの様にしてスマートフォンに対応させるかが問題になるのですが、簡単に分けると2つの方法があると思います。

1.画面サイズに合わせてCSSを読み込ませるレスポンシブ対応。

この方法はのメリットとしては、1つのサイトを全てのデバイスに対応させるので、更新する場合1つのページを更新するだけで済みますし、重複するページも出来ません。また、画面の幅を変えると可変するので、今時のサイトを体感出来ます。(笑)

デメリットとしては、レスポンシブにする場合、デザインに制限が出来ます。また、コードを非表示にしたりと無駄が出来たり、CSSの変更等も複雑になります。

2.スマートフォン用のサイトを別に用意する。

この方法のメリットとしては、完全に別に用意するので、デザインも自由に出来、HTMLもCSSもスッキリさせれます。

デメリットとしては、更新作業やHTML・CSSの変更等がある場合、二度手間になります。

私の場合、1の方法が多いのですが最近お気に入りの方法があります。
ズバリ、ハイブリッドな方法です。

3.ハイブリッド。

これは、1と2の方法の良い所取りの方法だと思っています。

以下は、WordPressで作られているサイトと仮定しての説明です。

まず、サイトにアクセスした時に、デバイスを判定します。
判定後、デバイスに応じたテーマを表示させます。
スマートフォンでアクセスがあると、PCサイトのテーマを親テーマとするならば、スマートフォンサイトのテーマである子テーマを表示させます。
子テーマは、PCサイトから変更が必要なテンプレートのみを用意しておきます。
そして、ここからがすごく重要で子テーマに足りないテンプレートは、親テーマから呼び出されます。
ですので、変更が必要な部分以外は共通のテンプレートになります

この方法だと1の方法のデメリットである、コードの無駄やCSSの複雑化が防げますし、デザインにもある程度自由がききます。
また、2のデメリットである更新やHTML・CSSの変更も共通部分が多ければ手間になりません。

ハイブリッドなサイト作りは、国産CMSの「a-blog cms」だと、さらに簡単に出来るようになっています。

主にCMSでサイト作成がされる場合の方法になりますが、私は有効な方法ではないかと思っています。