yoshiの気まぐれ日記

スノーボード関連のレポを中心に、日々の出来事や思った事などを超不定期&気まぐれに書いてます。 ホンマに気まぐれです・・・。

Attention!!
当blogの記事と無関係であったり趣旨に合わないコメント&TBは予告無く削除します。

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

WEBデザインの妥協点

スタイルシートもいろいろといじくってる間に、だいぶ分かってきました!
ネスケとOperaでの表示誤差も、無理やりではありますが、何とか解決できたし♪
ついでだから・・・って事で、さらに新しく「Mozilla Firefox」というブラウザも落として確認してみる。

ってか、俺は一体いくつブラウザを落としてくるんやろ・・・?(;´▽`A``
まぁ、表示できるブラウザは多いに越した事はないですけどね☆

Firefoxも初めはネスケ・Operaと同様、本文のレイアウトボックスに表示誤差がありましたが、ネスケ・Operaで誤差が解決すると共に、Firefoxでの表示誤差も解決しましたヾ(〃^∇^)ノわぁい♪


しかし、ここで新たな問題が浮上・・・orz


現在公開してる俺のサイトではスノーボーダーのシルエットを背景画像にしています。
そして、そのシルエットをJavaScriptを使ってランダムに表示できるようにしているんですが、これまた今考えているデザインではIEとそれ以外で表示誤差が出る事が判明Σ(゚口゚;

俺の理想では、ページ全体の背景には雪の結晶を使い、本文のレイアウトボックスの背景にシルエットをランダム表示させたいんですが、IEでは本文のボックスを基準にきちんと表示されるんですが、IE以外ではブラウザそのもの(おそらく親要素の<body>タグ)を基準に表示されてしまうのでシルエットが中途半端に途切れてしまうド━━━(゚ロ゚;)━━━ン!!
ウィンドウサイズによってはほとんど見えないなんてことも・・・

どうすりゃ良いものか・・・

そこで色々と対策を講じてみる。
まず、IEとそれ以外で表示を分ける案。
JavaScriptにはブラウザの種類を判別できる"navigator"というオブジェクトがあります。
それを使ってIEにはシルエットを表示させ、その他のブラウザは違う表示方法にする、もしくはキッパリあきらめて表示させない方向にしようと思っていたんですが・・・
調べてみると何とOperaとFirefoxはそれぞれIEとネスケをベースにした(?)ブラウザである事が発覚; ̄ロ ̄)!!
これじゃきちんと分けれないやん・・・って事でこの案はボツ(`ε´#)ぷっぷくぷ~

続いての案はシルエットを背景ではなく、画像そのものとして表示させ、ボックスをスタイルシートの"z-index"で重ね合わせるという方法。
これは試してはいませんが、な~んかHTMLソースがややこしい構造になりそう(-"-;)
って事で、なんとな~くボツ(笑)

3つ目の案はシルエットの表示位置を今よりも中心寄りにするという案。
ネスケなどを見ていて、ほんの少しだけ途切れて見えているのは意外とカッコ良いかも?と思い、この際シルエットが切れてしまうことには目をつむり、なるべく見えるように位置をずらす。
ただし、B/Sボードスライドのシルエットは雪面の部分が中途半端に途切れているので、これだけは修正を施す必要がありそうです。
これは結構良い案かも知れませんね♪

そして、最後の案。
この際、シルエットのランダム表示は諦める(爆)
これなら初めから何も悩む必要は無いですからね( ̄∇ ̄;)ハッハッハ
でも、これまで色々と頑張って考えてきたので、なるべく採用したくは無い案ですが、やっぱどこかで妥協点を探さないとダメなんでしょうね(^^;

とりあえず、3つ目と最後の案が有力でしょうか?
これを乗り越えればサイトデザインもほぼ固まってくると思います☆


そういや


うちのサイトに来てくれてる人たちはシルエット見てどう感じてるんしょう?
やっぱシルエットが邪魔で文字とか見づらいとかあるのかな?
スポンサーサイト

コメント

コメントの投稿


管理者にだけ表示を許可する

トラックバック

トラックバックURLはこちら
http://fsb.blog9.fc2.com/tb.php/109-98fc6f02
この記事にトラックバックする(FC2ブログユーザー)

FC2Ad

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。