AtelierKanae トップページに戻るbit-edge - WEBクリエイターのためのサイト -What's New? - 新着情報・お知らせ等 -for Beginner - 初心者の方はまずこちらへ -Works - アトリエ鼎の制作物 -Garage - ガレージ -
for Beginner - 初心者のためのエリア -
仕切り線

コンテンツリスト
Webサイトリフォーム入門

ch.01準備はOK?

ch.02コンテンツは質が命

ch.03デザインCheck

ch.04タグはどうなってる?

ch.05最後はおさらい

初心者向け厳選リンク集
リスト終了
大見出し:ch.03デザインCheck Chk: I 1 2 3 II 4 5 まとめ
前のページに戻るpage7/25次のページに進む
仕切り線

Check2 レイアウト

4.配置やサイズが変化する可能性を想定していますか?

配置やサイズが変化する場合を想定しましょう

・画面(ウィンドウ)サイズ
・文字(文章などの)サイズ
・コンテンツ部分が膨大になったとき
・スクロールして初期表示位置では無いとき

以上の要素がよく変化しやすいものです。そういった変化に対応しろというものではなく、できるだけ対応し、できない場合のデメリットも十分理解しておいてほしいということです。


画面(ウィンドウ)サイズ

サイズ変化の例解説図
サイズ変化の例

先ほども触れましたが、訪問者のPCや端末の画面の大きさによって、表示する画面やウィンドウの大きさが小さくなったり、果てしなく大きくなったりすることがあります。ここでは、リアルタイムに変わる場合や、細かい点での変化を想定するということです。

たとえば、JavaScript等を用いてサイズ変更可能不可能なウィンドウを作ることができますが、そのサイズが画面より大きくなってしまった場合や、フレームの固定エリアのサイズが大きすぎて、コンテンツ部分がつぶれてしまったりなど、閲覧が困難なエリアができてしまいます。

固定エリアや固定ウィンドウ、つまり「固定(またはサイズの絶対指定)」のあるデザインにはこういったトラブルがあることを認識しておきましょう。

文字(文章などの)サイズ

文字サイズ変化の例解説図
文字サイズ変化の例

訪問者のPCや端末の持っているフォントの種類や、訪問者が見やすくするために文字の大きさがデザインしたときとまったく違ってしまうことがあります。

たとえば、画像でぴっちりと枠のように囲んだ中のテキストなどは、ちょっとサイズが変わっただけで枠が崩れたり、テキストが読めなくなったりしてしまいます。他にも、一行あたりの文字数が変わってしまうことで読みにくくなることも注意することが必要です。

ひとつの解決法として、スタイルシートで文字サイズを固定する方法などがありますが、「文字が小さくて読みにくい」と思っている人には迷惑になって逆効果です。(注、純粋な画面拡大機能のあるブラウザやOSなどをつかえば、ピクセルベースの画像が拡大されますが閲覧は維持できます)

コンテンツ部分が膨大になったとき

たとえばCGIを使った掲示板のように、訪問者側で情報が入力できるものの場合、長文などが入力されることを想定していないとデザインが崩壊することがあります。

膨大なコンテンツが入ることが想定される場合にはしっかりと準備し、CGIなども対応しているものを用いるようにしましょう。

スクロールして初期表示位置では無いとき

今見ているこのページについて見てみましょう。このあたりまでスクロールしてくると、ナビゲーションの要素が見えない場合があります。たいした問題にはなりませんが、初期位置にまでに戻るリンク等細かい気配りをするのもいいでしょう。


次はCheck3 ナビゲーションです>>

仕切り線
前のページに戻るpage7/25次のページに進むCopyright 1999-2002 Ateiler Kanae. All rights reserved.