WWWサーフィンをしていると、見苦しいテキスト配置になっているページも散見されます。
どれもこれも、訪問者にとっては、文章が読みづらいですよね。せっかく文章そのものの内容がよかったとしても、読んでもらえない原因となります。
雑誌や書籍を考えてみて下さい。文字の開始位置が１行ごとにバラバラなんてことはありませんし、文章が続いているのに、無意味な改行が入っていると言うことはないですよね？この症状は、FrontPage Expressやホームページ・ビルダーを使って作成したページによく見られます。いずれのソフトも、「HTMLエディタ」で、書いたままのとおりにページを作ります。
で、ページを作成するときに、ソフトの横幅に合わせてご丁寧に改行を入れちゃうんですよね。たいていは、フルスクリーンの状態で作成しますから、作成環境が１０２４×７６８の解像度だったら、横幅１０２４ピクセルに合うようにという感じで作ってしまうのです。
要するに、作成者側が日頃使っている環境に合わせて、ブラウザの端で改行するような設定にしてしまうと。
→実例を見てみる （別ブラウザが開きます）
でも、訪問者側の環境は様々で、実際に見てみると・・・本来改行しなくてもいい位置で文章が改行されていて、読みづらい文章になっているのです。
この症状を出さないためには、「プレビュー時にブラウザの大きさをいろいろと変更してみる」というのが有効です。日頃の環境だけでチェックするだけでなく、いろいろと環境を変えて見て下さい。
もし、症状が出ている場合は、HTMLのソースをみて、不要な<br>タグを取り除いて下さい。
ちょっとしたことで、見栄えが大幅に改善されるかと思いますよ。
これも、「無意味な改行入れまくり」同様、HTMLエディタで作成したページに見られます。
タイトルとかをセンタリングするのは効果的です。 しかし、本文を横幅指定もなしにセンタリングしてしまうと・・・、これまた、読みづらいページの出来上がり。
なぜなら、センタリングは段落単位でするからなのです。
→実例を見てみる （別ブラウザが開きます）
文章全体がセンタリングされているせいで、文章の開始位置はてんでバラバラ状態となり、読みづらくなります。
この症状を出さないようにするには、 「見出し以外のセンタリングはしない」というのが一番有効です。
どうしても、文章全体をセンタリングしたい？そういう方は、以下のいずれかの方法を使って下さい。
この時の幅は、％で指定するなら、６０〜８０％ぐらいが見やすいです。ピクセルで指定するなら、６００ピクセル以内に抑えること（低解像度の訪問者への配慮のため）。
スタイルシートを使う場合、margin:3% 15%; もしくは left-margin:15%; right-margin:15%; というように左右のマージンを指定します。この例だと、左右に１５％ずつの余白をつけることとなり、本文は、７０％の幅でセンタリングされて表示されることになります。
余白を指定するときに、ピクセル指定は絶対にしないように！！ピクセル指定でやってしまうと、低解像度で閲覧していたり、ブラウザを小さくしていると１行あたりの文字数が激減してしまって、最悪の場合、１行に１文字しか表示されないという状態にもなりかねません。
幅に関しては、width:70%; や width:35em; のように指定します。意味は、前者がブラウザの幅に対して70%で文字を折り返す、後者が１行３５文字で文字を折り返すということです。センタリングは text-align:center; で行います。（ただし、この方法はInternet Explorer6,MacIE5,Netscape6の標準モードでは通用しません。）
ただし、35emとしていても、実際には、プロポーショナルフォント（MS Pゴシックなど）を使っていると、１行あたりの文字数が行ごとに違ってきます。１文字ごとの横幅が違いますからね。ですので、emによる指定は目安として考えておくのが無難です。
この症状は、スタイルシートを使って、フリーレイアウトもどきのページを作っている場合に見受けられます。もしくは、ホームページビルダー６のどこでも配置モードで作成したページに見受けられます。
見栄えをよくするために使っているハズのスタイルシートなのに、かえって見苦しいページ作りの原因になっているのです。
原因として考えられるのは・・・
この症状を出さないようにするには、「無意味な改行入れまくり」の対策同様、「プレビュー時にブラウザの大きさをいろいろと変更してみる」ことで、いろんな環境でどのように見えるのかを確認して下さい。スタイルシートを使っていますので、Internet Explorer と Netscape での確認もしておいて下さいね。
もし、これらの症状が出てしまっている場合は、多少見栄えが犠牲になるかも知れませんが、ピクセル指定をやめて、％指定にするようにすれば、ブラウザの大きさ変更による影響は受けません。
自分が思ったとおりに表示して欲しいからって、トップページに推奨環境を書こうなんて甘い考えは・・・絶対に捨てて下さい。自分の技量をわきまえずに、中途半端なテクニックを使ってサイトを作るのは、危険ですよ。
リンクに関してはご自由にどうぞ。