タグのない場所では、このように標準サイズの文字で表示されます。しかし、利用者（ページを見る人）によってパソコンの環境はことなり、どんな人が見ても情報を等しく届けられるページデザインが重要です。
そのためには特殊なタグや機能を使わないことが基本です。特定のブラウザでしか機能しないものは、画面のデザインを壊すだけでなく、情報をも壊してしまいますし、利用者への不快感を与える原因にもなってしまいます。
もちろん、標準的なタグを使っていても、その使い方にも注意が必要です。特に文字の大きさや色には気をつけましょう。
CSSを使ってフォントの種類やサイズを指定するのがHTMLの規格としては最新のものですが、タグに取って代われるほど普及するには難しすぎると思います。
デザインで一番注意が必要なのは文字の大きさです。製作環境の文字サイズが必ずしも利用者の環境に適応しているとは限らないからです。
文字の大きさはモニタ画面の大きさ、画面の解像度、そして、ブラウザの設定によって変化します。そのため、固定されたサイズの文字を使うと、全体のバランスは崩れないものの小さくて見えなくなったり、逆にサイズが変わってしまうことで周囲のデザインを崩してしまうことがあります。
経験も重要ですが、2台のパソコンで確認したり、複数のブラウザを使ってみたり、ブラウザの表示の文字サイズを変えてみたり、ブラウザのウインドウサイズを変更してみるなどして、環境によるデザインの変化を確認しましょう。
タグ 表示 解説 テキスト タグなし。標準サイズ <h1></h1> テキスト
見出し
alignで行位置を指定できる
文字サイズはブラウザの標準設定に依存
文字は太字になる<h2></h2> テキスト
<h3></h3> テキスト
<h4></h4> テキスト
<h5></h5> テキスト
<h6></h6> テキスト
<font size="1" ></font> テキスト <font size="2" ></font> テキスト <font size="3" ></font> テキスト ブラウザの標準文字サイズ <font size="4" ></font> テキスト <font size="5" ></font> テキスト <font size="6" ></font> テキスト <font size="7" ></font> テキスト <font size="+1" ></font> テキスト 標準がsize=3なのでsize=4と同じ大きさになる <font size="+2" ></font> テキスト 標準がsize=3なのでsize=5と同じ大きさになる <font size="+3" ></font> テキスト 標準がsize=3なのでsize=6と同じ大きさになる <font size="+4" ></font> テキスト 標準がsize=3なのでsize=7と同じ大きさになる <font size="+5" ></font> テキスト 標準size=3なので、size=7よりは大きくならない
<font size>で標準を小さく設定した場合に有効となる<font size="+6" ></font> テキスト <font size="+7" ></font> テキスト <font size="-1" ></font> テキスト 標準がsize=3なのでsize=2と同じ大きさになる <font size="-2" ></font> テキスト 標準がsize=3なのでsize=1と同じ大きさになる <font size="-3" ></font> テキスト 標準size=3なので、size=1よりは小さくならない
<font size>で標準を大きく設定した場合に有効となる<font size="-4" ></font> テキスト <font size="-5" ></font> テキスト <font size="-6" ></font> テキスト <font size="-7" ></font> テキスト <font color="#FF0000"><font> テキスト 指定の色番号で文字を表示 <big></big> テキスト <font size="+1">と同じ <small></small> テキスト <font size="-1">と同じ <b></b> or <strong></strong> テキスト 太字。ボールド <u></u> テキスト 下線。アンダーライン <i></i> or <em></em> テキスト 斜体。イタリック <s></s> or <del></del> テキスト取消線 <sup></sup> テキスト 10m2 上付き文字 <sub></sub> テキスト H2O 下付き文字 <tt></tt> テキスト ブラウザの設定にある等幅フォントを使用します <!--テキスト--> テキストは表示されません。ソースの注釈に使います。
tips
ソースにテキストを記述する場合、ブラウザで表示したときに再現されない部分があります。
ソースを書くときに文章を改行しても、ブラウザでは改行はされません。必ず改行のタグをいれる必要があります。
半角スペースも１つだと表示されますが、2つ以上の半角スペースは１つとして扱われます。
これらの要素はソースの見やすさを整えるために有効です。また、tabを使っても整形できますが、ソースを表示するエディタによって若干のずれが生じます。
タグ 表示 解説 <h1></h1> テキスト
見出し
上下に1行分の空行が入る
align=left; center; right<h2></h2> テキスト
<h3></h3> テキスト
<h4></h4> テキスト
<h5></h5> テキスト
<h6></h6> テキスト
<p></p> テキスト
テキスト
テキストを囲むことで1つの段落を表す
上下に1行分の空行が入る
align=left; center; right<br> テキスト
テキストタグを記述したところで改行される。終了のタグはない <br clear="all"> 画像にalignを指定してテキストの回り込み設定をした場合に、解除するために使用する
align=all; left; center; right<div align="left"></div> 左寄せ <div align="center"></div> 中央寄せ <div align="right"></div> 右寄せ <center></center> テキスト 中央寄せ <pre></pre> ソースの改行や半角スペース、タブなどそのまま表示する <blockquote></blockquote> 画面の左右に余白を設けます。元々は注釈行のためのタグ <hr> 段落の間を仕切る水平線を表示