2

同じサイト用に2つの異なるWebページを作成しました。1つは電話デバイス用で、もう1つはデスクトップデバイス用です。主な理由は、Webページに多くのボタンがあり、電話を使用している場合、ボタンは電話の画面では非常に小さく見えるため、タッチするのが難しいためです。そこで、画面の解像度に基づいてユーザーをそれぞれのページにリダイレクトするJavaScriptを作成しました。

if ( (screen.width < 800) && (screen.height < 600) ) { 
    window.location = 'mobilesite';
} else {
    window.location = 'desktopsite';
}

しかし、私は新しい網膜ディスプレイについて心配しています。このアプローチはうまくいかないと思います。(私はそれをテストするための網膜ディスプレイデバイスを持っていません)

私の問題はサイズにあり、Android / IOS / KindleなどのOSにはないため、オペレーティングシステムに基づく差別化を使用しないことにしました。タブレット大画面で見栄えがするので、ユーザーにはデスクトップバージョンを使用することをお勧めします。

だから私は2つの質問があります:1.-網膜ディスプレイの解像度はブラウザの解像度に影響しますか?(または、ネイティブアプリケーションのみ)

2.- javascriptまたはjqueryクライアントサイドを使用して電話とタブレットを区別する別の方法はありますか?

また、IOSデバイスでのみこの違いを検出するようにスクリプトを制限しないことが重要だと思います。まもなく、他のブランドの電話でより高解像度のディスプレイになるでしょう。

ありがとう!

4

1 に答える 1

5

An Apple Retina Screen will report itself as if it has half the amount of pixels it actually has, because the browser does magic itself. If you want to detect a high-res screen, multiply by the pixeldensity.

Don't do a useragent check, because you'll be adding more devices every 2 weeks. And its breaking the web. Do feature checks or specific checks.

Oh, and you'll want to read into CSS3 Media Queries, in case you just want to show bigger buttons for mobile devices.

于 2012-10-17T21:39:50.307 に答える