AtelierKanae トップページに戻るbit-edge - WEBクリエイターのためのサイト -What's New? - 新着情報・お知らせ等 -for Beginner - 初心者の方はまずこちらへ -Works - アトリエ鼎の制作物 -Garage - ガレージ -
for Beginner - 初心者のためのエリア -
仕切り線

コンテンツリスト
Webサイトリフォーム入門

ch.01準備はOK?

ch.02コンテンツは質が命

ch.03デザインCheck

ch.04タグはどうなってる?

ch.05最後はおさらい

初心者向け厳選リンク集
リスト終了
大見出し:Ch.4タグはどうなってる? Ch: I II まとめ
前のページに戻るpage7/21次のページに進む
仕切り線

分かりやすい構造にする

メンテナンスのためにタグが無い状態でも中身がわかるようにページを構成しましょう。

どんなにレイアウトにこだわったり動きをつけたりしても、文書の内容はHTMLのレベルでは直線的に並んでいるだけです。こったページを作るとページの構造は断片的になってしまうことがよくあります。

そうなる前にタグを全部取った状態でも文書として通用するように構成を組みましょう。基本的にはデザインの章で定義した「コンテンツ・ナビ・その他」でまとめておくと良いでしょう。

これをやっておくと、HTMLが読みやすくなりメンテナンスも容易です。アクセシビリティも向上しますのでぜひやっておきましょう。

構造の例

<DIV>
ナビゲーション
</DIV>
<DIV>
コンテンツ
</DIV>
<DIV>
その他
</DIV>

このように直線的に組んでおくと便利。


コメント(<!-- ここにコメント -->)を使って更新のヒントやブロック分けの仕切りを埋め込んでおくのも有効な方法です。

うっかりやってしまいがちなのが、全角の空白です、ブラウザでは空白と認識してくれませんので十分注意しましょう。ちゃんと入力したはずなのに認識されない場合は全角の空白を疑って見ましょう。

※古いブラウザでまともに表示させるためにタグを改行なしでくっつけたりすることもありますが、これからのブラウザではそのような事は無いので気にしなくて大丈夫です。


次はスタイルシートの使い方です>>

仕切り線
前のページに戻るpage7/21次のページに進むCopyright 1999-2002 Ateiler Kanae. All rights reserved.