テキストボックスを設定する際の落とし穴

Webデザインには、あなたの知らない「落とし穴」がたくさん。大きなものから小さなものまで、それが及ぼす影響はさまざまだ。カンペキだと思っているあなたのサイトも、実はすでに暗い穴の中かも・・・。

　メールフォームなどをつくる際、＜form＞タグでテキストボックスなど設定することがある。これはメールソフトを使わず、Webサイト上から簡単にメールを送ることができるうえ、メールアドレスがふつうには見られないようになっているので、企業サイトなどで使っていることも多いだろう。

　しかし、レイアウトするにあたってMacintoshとWindowsでは見え方が異なるということを忘れてはいけない。【1】はMacintoshで確認しながらテキストボックスの長さを設定したものだ。ちなみに1行テキストボックスのサイズを45に設定し、複数行テキストボックスのサイズを50に設定している。ここできれいに見えていると安心してそのままオープンしてしまうと、Windowsで見た場合にボックスの大きさが異なり、表のラインが大きく崩れていることがある【2】。制作の際はWindowsとMacintoshのふたつの表示のされ方を確認をしながら制作しよう。

　Macintoshを基準に考えると、Windowsで見た場合は1行textboxは短く、複数行textboxは長く表示される傾向にある。

解説：Ni-Ma

（※本文中、及びキャプション内で使用している「＜」、「＞」は、全角になります。ご注意ください。）