回答編集履歴
2
メディアクエリで端末判定する是非
test
CHANGED
|
@@ -46,4 +46,38 @@
|
|
|
46
46
|
|
|
47
47
|
|
|
48
48
|
|
|
49
|
+
### メディアクエリで端末判定する是非
|
|
50
|
+
|
|
51
|
+
|
|
52
|
+
|
|
53
|
+
> メディアクエリによってUA検出をしているような使い方を多く見受けるので混同していました。
|
|
54
|
+
|
|
55
|
+
|
|
56
|
+
|
|
57
|
+
古くはスマートフォンの解像度が低かった為に「低解像度の端末はスマートフォンである」と決め打ちする手法が採用されました。
|
|
58
|
+
|
|
59
|
+
現在はスマートフォンでも高解像度の端末があり、タブレット端末も普及してきた為、解像度でモバイル端末を判定できなくなっています。
|
|
60
|
+
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
そもそも、デスクトップPCでもウインドウサイズを変更すれば、メディアクエリの恩恵を受ける事が出来ますので、解像度から端末を判定するのは方法論として間違っていると考えます。
|
|
64
|
+
|
|
65
|
+
スマートフォン用UI、PC用UIで区分けする基準は「タッチパネルを持っているか」だと思いますが、現在のデスクトップPC用のブラウザでは、`window.ontouchstart` プロパティが存在する為、機能検出するのは困難です。
|
|
66
|
+
|
|
67
|
+
(現在はPCにもタッチパネルが搭載される時代なので、ブラウザが持つ機能で差別化できません)
|
|
68
|
+
|
|
69
|
+
現在、採用される事の多いUA認識で強制的にUIを決定する手法は、スマートフォン/タブレット端末でPC用UIを望むユーザのの利便性を損なうデメリットがあります。
|
|
70
|
+
|
|
71
|
+
以上の理由から「自動的に端末別にUIを決定する」のは現実的ではなく、ユーザが任意のUIを選択する方法を用意するのが理想だと考えています。
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
|
|
75
|
+
- メディアクエリで解像度別にUIを用意する
|
|
76
|
+
|
|
77
|
+
- トップページは「UA検出でPC用UI/タッチパネル用UIにリダイレクトする」or「PC用UI/タッチパネル用のリンクを設けて、ユーザが任意のUIを選択できるようにする」
|
|
78
|
+
|
|
79
|
+
- ユーザが任意のUI(PC用UI/タッチパネル用UI)を選択できるように、全ページで「PC用UI」「タッチパネル用UI」のリンクを設置しておく
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+
|
|
49
83
|
Re: MG1986JP さん
|
1
縦向き/横向き
test
CHANGED
|
@@ -1,3 +1,7 @@
|
|
|
1
|
+
### メディアクエリとUA検出
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
1
5
|
「メディアクエリ」と「UA検出」は対立するものではないと思います。
|
|
2
6
|
|
|
3
7
|
|
|
@@ -26,4 +30,20 @@
|
|
|
26
30
|
|
|
27
31
|
|
|
28
32
|
|
|
33
|
+
### 縦向き/横向き
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
メディアクエリには、モバイル端末の「縦向き」「横向き」で表示を切り替えられるメリットがあります。
|
|
38
|
+
|
|
39
|
+
デスクトップ用モニタでも、モニタアームを利用して縦向きで利用している方がいらっしゃるようです。
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
|
|
43
|
+
- [メディアクエリ 縦向き 横向き - Google 検索](https://www.google.co.jp/search?q=%E3%83%A1%E3%83%87%E3%82%A3%E3%82%A2%E3%82%AF%E3%82%A8%E3%83%AA+%E7%B8%A6%E5%90%91%E3%81%8D+%E6%A8%AA%E5%90%91%E3%81%8D&ie=UTF-8)
|
|
44
|
+
|
|
45
|
+
- [モニタアーム 縦向き - Google 検索](https://www.google.co.jp/search?q=%E3%83%A2%E3%83%8B%E3%82%BF%E3%82%A2%E3%83%BC%E3%83%A0+%E7%B8%A6%E5%90%91%E3%81%8D&ie=UTF-8)
|
|
46
|
+
|
|
47
|
+
|
|
48
|
+
|
|
29
49
|
Re: MG1986JP さん
|