mobile - モバイル デバイスで Web サイトのデザインをテストするにはどうすればよいですか?

Question

900 x 600 の固定背景画像を使用してサイトをデザインしました。コンピューターでは問題なく表示されます。PDA デバイスではどのように表示されますか? PDA 用に個別に設計する必要がありますか?

自分のサイトが携帯電話から効率的に閲覧できるかどうかを確認するにはどうすればよいですか?

私は何をすべきか？

Answer 1

• Operaの「小画面」ビューを使用してみてください（[表示]> [小画面]）。これは、モバイル画面をシミュレートするというかなりまともな仕事をします。Opera自身のサイトで試してみてください。ハンドヘルドで表示しているとき、または小画面モードに切り替えたときに起動する「ハンドヘルド」タイプのスタイルシートを使用していることに注意してください。

• GoogleのAndroidSDKを無料でダウンロードしてテストできます。

• iPhoneでテストするには、 iPhoneテスターを参照してください。右下には、iPhoneをワイドスクリーン状態に回転させるためのボタンがあります。

• OpenWavePhoneSimluatorは優れているはずです。

• mobiオンラインエミュレータを試すことができます。

• Windows Mobile 5.0 SDK for Smartphoneには、「WindowsMo​​bile5.0ベースのスマートフォンデバイスエミュレーターのイメージとスキンファイル」が含まれています

• 最後に、いくつかの一般的なガイダンス：WebコンテンツのアクセシビリティとモバイルWeb：障害を持つ人々とモバイルデバイスの両方がWebサイトにアクセスできるようにする

Answer 2

ブラウザー検出の代わりに、ハンドヘルド デバイス用の代替スタイルシートを提供できます。と

<link rel="stylesheet" href="small.css" type="text/css" media="handheld">

利点は、サイトのバージョンが 1 つしか必要ないことです。違いはスタイルシートにあります。追加の css が 1 つ必要ですが、ブラウザー検出では、サイト内のすべてのページの異なるバージョンが必要になります。欠点は、すべてのブラウザーmediaがスタイルシートの属性をサポートしていないことです。しかし、最新のブラウザーはそうしており、そのサポートは拡大しています。

興味のある方は、A List Apart の記事をご覧になることをお勧めします。

ところで、まだ css を使用していない場合は、選択した問題の解決策に関係なく、すぐに切り替えてください。CSSロック！

Answer 3

Blackberryシリーズのマシン用のデバイス エミュレーターも入手できます。

Answer 4

まあ、ブラウザの種類をチェックするために何らかの検出 JavaScript をそこに投げ込んでから、モバイル デバイス用にフォーマットされた別のサイトにリダイレクトすることができます。これは、ほとんどのサイトの標準のようです。

例:

• Digg.com
• Twitter.com
• Google COM