スマホ用のサイトを別に制作すると手間がかかる為、レスポンシブにCSSを切り替えたい場合に使用します。

例： 
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=2,user-scalable=yes"> 

width
width=device-width（Media Queries*で分岐する場合の記入方法）
width=device-768px

initial-scale
initial-scale=1
初期ズームの倍率の指定。上記の場合は1倍。

maximum-scale
maximum-scale=2
スマホの画面をピンチした時の最大拡大倍率。上記は最大2倍。

user-scalable
user-scalable=yes
ユーザー側でピンチで拡大できるかできないかの設定。yesかnoで指定。 

*Media Queriesとはブラウザの表示領域やデバイスの画面サイズなどによって、反映させるスタイルシートを切り替えられるCSS3から導入された機能のことです。