最初は、「handheld.css」を接続してPDA指向のスタイルを作成することで、通常「印刷」バージョンの場合と同じように取得できると考えました。 しかし、すぐに、CSSを使用してすべての問題を解決できるわけではないことに気付きました。 さらに、同じ「印刷された」ページを構築する原則は、通常、「これは隠され、これは隠され、これはここに転送され、これはそこにあり、これも隠されます。」 それにもかかわらず、モバイルデバイスを処理し、不要なトラフィックを読み込んで、最終的には表示しないようにしています...その結果、CSSスタイルだけでなくテンプレートも再定義する必要があるという結論に達しました。 実践するための小規模でシンプルなプロジェクトから始めました...
私の他のプロジェクトのToDoシートで、「PDAバージョン」という行は長い間埃を集めてきました。このプロジェクトはあまり人気がありませんが、多かれ少なかれ知られています。 それは単純で比較的小さく、私はそれから始めました。 知らない人のために、 basher.ruはあらゆる種類の異なる引用符からの引用符のアグリゲーターであり、独自の引用符のベースを持っています。 最近、彼は面白いqipステータスも収集します。 テキストユーモラスなポータル。
私の手には、640x480の解像度を持つFUJITSU-Siemens LOOX N560と、標準IE Mobileを含むWM 5.0が搭載されていました。 条件を書いた：
"（Isset（$ _ SERVER ['HTTP_UA_OS']）&& preg_match（ '/ windows ce / i'、$ _SERVER ['HTTP_UA_OS']）&& preg_match（ '/ windows ce / i'、$ _SERVER ['HTTP_USER_AGENT']） ）|| preg_match（ '/ iphone / i'、$ _SERVER ['HTTP_USER_AGENT']）”
Pocketテンプレートを使用し、ダンスに行きました...その結果、次のような結果が得られました。
それでは、始めましょう...ポータブルデバイスの主な利点は、開発者にとって大きな落とし穴でもあります=）小さな画面は多くのよく知られたテクニックとレイアウトスタイルを壊します。 たとえば、作成に数日かかったdiigのようなメニューは、pdaバージョンでは2 select =のように見えます（残念です。しかし、サイトのほとんどすべてのナビゲーションは最終的にselectに収束します。しかし、一方で、モバイルデバイスでは本当に便利です=）））
そして、「コラム」デザインについては、すぐに忘れることができます。 ここでは1列のみであり、2列または3列の列を想像することは難しく、これは正常です。 実際、ここのすべては見た目よりも少し単純です。 たとえば、私の場合、次のように置き換えられました。
#content{
width:80%;
}
#right{
width:20%;
}
に：
#content{
width:100%;
}
#right{
width:100%;
margin-top:10px;
}
またはそのようなもの。 もちろん、ポケットテンプレートのすべてのメニューのほとんどを削減しました。 多くの場合、彼らはブラウザの空白を占有するだけですが、ポケットに邪魔されます。 上で言ったように、display：none;を使用せずに削除しますが、テンプレートから物理的に切り取ります。
レイアウトやスタイルにほとんど触れずに、リーフレットを見るのは嬉しい驚きでした。
突っ込んだ-でも動作します。 次のステップはJSでした...
JSが主な落とし穴であることが判明しました。 たとえば、上記で説明したシステムでは、要素の親である子を取得し、スタイル、同じ属性「id」にアクセスできますが、className =（およびbasherの JS全体は読み取り/割り当てに基づいています）この属性。モバイルIEにはXmlHttpオブジェクトも存在しますが、classNameは存在しません。 モバイルロバ開発者のブログで、 「JSに新しいメソッドが追加されました」などのいくつかの投稿で「誇り」の参照が見つかりました。どうやら、私のシステムは古すぎます。つまり、プロセスではPDAの軸を更新するだけで十分ですが、 どうすればいいのかわかりません。なぜ、そして私のような人々は、彼らがサイトにアクセスしたときにOSを更新するように強制する必要がありますか？
残念ながら、上記の理由だけで、現時点ではAJAXで投票を実施していません。十分な時間がありませんでした。 おそらく週に仕事の後に時間があり、私はそれを終えますが、現時点では、サービスの「機動性」は確かに疑問視されています。 彼はモバイルレイアウトを見つけ、すべての機能を保持していましたが、引用を「投票」してページをリロードするたびに待機する準備ができている人は多くないと思います=（
理想的には、もちろん、AJAX投票投票だけでなく、接続の中断の可能性も考慮してください。 男はバスやミニバスに乗って、引用のためにスプーンで投票し、地下鉄を降り、ページをドラッグして投票し続けますが、接続は途方もなく消え去ります...これまでのところ、AJAXリクエストのステータスを確認し、タイムアウト時にCookieにその人の声を書き込むだけですこれらのCookieを読むために他のページに移動します。 ただし、これは今日のタスクではありません。
一般的に、モバイルデバイスでタイプセットすることは非常に興味深いものでしたが、それは非常に困難でした。 現時点では、ナビゲーションを正しく配置する方法、他のサービス要素を小さな画面に表示する方法、標準の要素（コンテンツなど）から分離する方法を想像できないため、難しいです。 あなたが何か考え、アイデアや生きている例がある場合-コメントを投げます。 小型のデバイス（640x480があり、残念ながら幸運にもわからない）、iPhoneなどで、モバイルバージョンのバッシャーがどのように見えるかを見るのも非常に興味深いでしょう。 誰かが同様の機会を持っている場合-コメントにスクリーンショットを投稿するか、メールでそれらを私に投げる： webmaster@basher.ru 。 一般的に-私はこの問題で助けてくれてうれしいです。 数週間のうちに、モバイルデバイスのレイアウトの機能についてより詳細に報告し、書くことを約束します。
レイアウトをお楽しみください！