ずっと、ページ作りばかりに凝っていたのですが、一番重要なのは文字についてです。まず、これを書かなくっちゃいけなかったのかも!コメントいただいたので、はたと気づきました(^_^;)今までの記事の中でちょこっと載せていたのですが、一応まとめておこうかなと思いました。

HTMLだけでも、テーブルという枠や色々なタグを使ってデザインをすることができます。CSSがこれだけ出てくる前は、HTMLのみでホームページは作られていました。

しかし、時代は流れたようで、HTMLとCSSで製作する方へ次第に移行してきたように思います。CSSとHTMLに分けるメリットは、CSSを変更するだけでデザインを変えられ、しかも複数のページのデザイン変更を一気にできるということ。

HTMLのみで作っていると、変えたい場所、ページを個々に変えなくてはならず、大変な作業でした。エキサイトではHTMLに<table>タグや<td>、<tr>といったタグが見られます。これは、メニューはサイド、ヘッダーは上という表組みのようなことをしています。ただ、本来HTMLとCSSで製作をするのは、極端に言うとHTMLタグには文字だけで、CSSで骨組みやデザインを変えることができます。ここでは、エキサイトに従って考えようと思っています。ながなが書きましたが、文字を変えるタグ、思いつくものを書きます。


【HTMLで変える、文字の色・大きさ】
文字のいろいろは、<font>というタグで変えられます。

[例]: こうするとここの色が変わるんです。
こうすると<font color="#cc0000">ここの色</font>が変わるんです。

[例]: こうすると文字の大きさが変わります
こうすると<font size="3">文字の大きさ</font>が変わります。
3の部分は、1が一番小さく、数字が大きくなると大きく表示されます。

[例]: 上記2点を両方つかったらこんなかんじ。

上記2点を<font size="3" color="#cc0000">両方つかったら</font>こんなかんじ。


【以上の3例をHTML/CSSを使って表現すると】
[HTML]
こうすると<div class="color">ここの色</div>が変わります。
こうすると<div class="big">文字の大きさ</div>が変わります。
上記2点を<div class="both">両方つかったら</div>こんなかんじ。
[CSS]
DIV.color{font-color:#cc0000;}
DIV.big{font-size:large;}
DIV.both{font-size:large; font-color:#cc0000;}


ここで、DIVの後の文字は絶対に決まっているのか?という疑問がわいたりしませんか?私は沸いたことがあります。決まった規則(リンクやリストなど)があるもの以外、自分が自由に決めるデザインの設定用の”旗”は自分で名前をつけられます。HTMLにつけた旗の名前と、CSSでその旗におけるデザインを決める場合、名前をきちんと共通にさえしていればいいです。

ここでいうならば、colorやbig、bothは私が勝手に決めましたが、きちんとHTMLとCSSの名前を使う部分は同じにしています。(同じにしなければ、CSSの指示が働きません。時折そういう失敗も)


こういうのを投稿していると、自分の文章力のなさにホトホトあきれます。。分かりにくいところ、コメントくださいm(_ _)m
また、これら文字の説明は、書き方の一例で、色や大きさなど変更したい部分については検索するとタップリでてきます。そうしてると、おもしろそうなタグも発見するので一度検索してみてください。