So-netブログオーナーに捧ぐ#2 iPhone専用CSSの怪奇現象にはご注意を!

ジョブス.jpg
Apple iOS や Google Android のみなさんは、デザインが崩れますので、ここをタップして、PC版モード選択をお願い致します
 [がく~(落胆した顔)][失恋][もうやだ~(悲しい顔)]
 あなたのブログに奇々怪々なCSSを導入していませんか?!

間違って
「 iPhone 専用のCSS 」を 設定していませんか?!

 Google検索で「 iphone.css 」で検索すると、「 iPhone 用に自動的に切り替わるCSS 」なる記事がブログなどで掲載されています。 みなさんは安易に、ご自分のブログにインストールしていませんよね。(微笑)

実はこの記事にだけは特殊なCSSを

 実は、この記事にだけ特殊なCSSを書き込んでいます。 パソコンで接続されておられる場合は従来と全く変化無しですので、どうぞご安心ください。 このCSS、とあるサイトで配布している「 iPhone専用CSS 」を、そのまま配置しています。
media="only screen and (max-device-width: 480px)"
 上の様な条件のCSSを埋め込んでいるのですが、利用されるハードウェアーの画面の横幅が「 480ピクセル以下なら 」上書きしてしまうCSSであって、この記事にのみ書き加えています。 パソコンで接続していると何ら変わらないと言う意味において、つまり目には見えませんが、 iPhone でこのページを表示すればデザインが変化します。 So-net ブログの場合だと、折角のサイドバー関係が遥か下に移動してしまってデザイン全体が崩壊してます。 「これはイカン!」です。 480ピクセル以下の端末って、iPhone だけでは無いですよね。 480ピクセル以下の端末から訪問される方の一部をスポイルする記事になってしまいました。 これは「おうマイごっど!」でありまする。 iPhone で接続するための以下のQRコードは、このページです。(笑)

cmanjp_20140605150037.gif

 この様に、オーナー自身はパソコンのブラウザーから投稿しているので気にも留めないかも知れませんが、実際に iPhone で訪問された方は「 何だっ?! 」ってことになっていませんか?

FireMobileSimulator を利用してチェックしましょうか?

 これはパソコンのブラウザーを、Webサーバーに対して例えば「私は、どこも携帯電話ですけど・・・」と偽装申告するソフトです。
 自分のブログが、スマートフォンや文字端末の「携帯電話」で、どの様に表示されているかをチェックしてみては如何でしょうか?

非表示にするこのブログで気にしたこと

 このブログの前に4本の So-net ブログで失敗し捨てました。(爆笑)
  • わたしは目が悪い
  • iPhone を使いたいけど画面は小さい
  • iPhone を横に傾けて横長の画面にして
  • 文章の一行の左端から右端までを画面いっぱいに表示拡大しても字が小さいから
  • 文字が読めるように、本文文字の拡大機能を搭載し
  • Lightbox な PopBox も iPhone で機能するし
  • MP3 も iPhone で楽しめるようになったし
 こうなると、パソコンの画面用CSSと、iPhone専用CSS の画面を変更せずとも、So-netブログ標準のCSSを変更することなく、全く同じCSSで充分であると実感しています。 くれぐれも、デザインが崩れる一方の「 iPhone 専用 CSS 」に手を出すのは、お気をつけ願います。
 結局は、 iPhone からブログに接続すると、余計に見辛くて、読めないから、キャラクター端末モードで観るしか無いなんてことにならないように、ブログのデザイン(的確なテンプレート)を選択しましょう。

非表示にするあなたが、これからブログを始めるなら・・・

  1. モバイルとパソコンと、シームレスなCSSでも表現できる的確なテンプレートを選ぼう
     わたしは、Sonetブログの標準CSSを何ら変更していません。
  2. 画像は超軽量な小さなサイズ、少ない容量のサムネイルを貼り付けよう!
     画像は軽量重視! 初回訪問時だけでなく、再訪問時でも、画像データーの交信で足を引っ張りません。
  3. 画像をクリック(タップ)すれば、大容量オリジナル画像を、ページを移動させないで表現しよう! PopBox を推奨します。
     オリジナル大容量画像を表示できます。 あくまでも訪問者の意思でクリック(タップ)しなければ何ら通信は開始されません。 ブログページ全体の表示完了までのスピードを落とさずに、オリジナル画像をも表現できます。
  4. MP3音源も、訪問者がクリック(タップ)したら初めてプレイヤーを出現させよう!
     FLASH `LAYER だって重いです。(微笑) まだ新型「JavaScript関数」が完成していませんが、単一MP3音源の表現は完了です。 同じコンテンツで、パソコンのブラウザーでも、iPhone でも、同じMP3音源を楽しめます。 目下「ジュークボックスを iPhone でも提供する」点で改訂中です。(笑)
  5. 動画も、訪問者がクリック(タップ)したら初めてプレイヤーを出現させよう!
     これなんですよね。 既存の iPhone のアプリに渡す手順を模索中です。 パソコンのブラウザーに FLASH PLAYER って標準装備ですし、 Linux (Puppy) のブラウザーでも同様ですので、 MediaBoxAdvance で全て表現できています。 問題は FLASH PLAYER が大嫌いな iPhone です。 少し考えます。(泣;)

つまり、軽快に表示を終了するも、中身は薄くはないブログを目指そう!

※ So-net ブログが遅いですから・・・・・ (笑)