ホームページ制作日記 vol.6 -画面表示不具合解決編-

前回のブログに書いた画像表示の件は、
ホームページ立ち上げ当初からの問題だったのですが、
同時進行で問題になっていたのが、画面表示に関する問題です。

どのような問題だったのかというと、
ホームページを表示するディスプレイによって
ホームページの見え方(画像や文字の配置、スペースの広さなど)が
変わってしまうという問題でした。
具体的にいうと、ディスプレイの縦横比が4:3であるか、
16:9であるかで表示が違ってくるということです。

主にホームページを制作するときに使っていた、私の自宅のパソコンの
画面の縦横比が16:9だったので、この比率の画面を基準にして
ホームページを作っていたのですが、
ある日、初めて自宅のパソコン以外で、本社にあるパソコンに
ホームページを表示してみた時に、自宅のパソコンでは整然と表示されていた
文字や画像の位置が、大幅にずれて表示されることが発覚したのです。

本社のパソコンの縦横比は4:3なのですが、16:9の画面で表示する時は
横1列に3つの画像が並んでいたのに、
4:3の画面で表示すると画像の表示が2つと1つの2列に表示されたり、
書いてある文章の段落の位置も変わって、非常に読みづらくなっていました。

これはホームページ制作に利用したテンプレートの特性らしく、
表示する画面に合わせて横に伸びたり、縮んだりするので、
当然、16:9よりも横の広がりの少ない4:3で表示すれば、
左右から横にぎゅっと圧縮した感じになるので、
横に3つ分の画像スペースがあったのが、2つ分に圧縮されて、
あふれた1つの画像は下に押し出されるということになります。

ホームページ制作中には、このことに全く気付いていませんでしたので、
このことが発覚してから、慌てて4:3の画面を基準にして
画像の配置や文字・文章の位置を調整していきました。
ちなみに4:3基準で作ったものを、16:9で表示しても左右のスペースが
広がるだけで、画像や文字の位置に変化はありませんでした。

この問題は、HTMLタグできちんと画面表示を固定化するように設定すれば
解決出来たと思うのですが、私にそこまでの知識が無かったのと、
4:3基準への変更で十分に対応できたので、
今回はこのような形での対処ということになりました。

しかし、このままでは使用するディスプレイの種類によってホームページの
表示が変わるという不安定な状況であることには変わりないので、
立ち上げから2ヶ月も経たないうちに、どの種類のディスプレイでも
同じように表示されるホームページへの変更を決めたのです。


vol.7に続く・・・



vol.5へもどる・・・



"ホームページ制作日記 vol.6 -画面表示不具合解決編-" へのコメントを書く

お名前
ホームページアドレス
コメント