初心者のためのホームページ作り 第105号

初心者のためのホームページ作り

メールマガジン「初心者のためのホームページ作り」でお伝えした内容を、「復習」の意味で掲載しています。テキストのみのマガジンと違って、実際のサンプルや画像を交えて解説していますので、理解が深まると思います。

なお文中、疑問点や分からない点がありましたら、ご遠慮なく当方まで メールにてご質問ください。

<第105号> 今週のおさらい
             毎週金曜日配信 What's New 2004年11月12日
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
   ■ 正しい文法のために  最終回 --- 読者の質問から
   CSS講座 第23回 --- 印刷スタイルシート
正しい文法のために --- 読者の質問から
今回は正しい文法作成の最終回として、今までの解説を踏まえて読者からの質問を中心に解説します。HTMLは単純なマーク付けによる文書作成が主体となっていますが、単純が故の奥の深さがあります。
W3C標準のすすめ
Webの標準化を制定する機関 W3Cの勧告する HTML仕様は、現在存在するすべての Web閲覧ソフトウェア (ブラウザ)で実装されています。
つまり、W3Cの仕様に従って作成された HTMLドキュメントは、どんな銘柄の閲覧ソフトでもその情報を正しくレンダリングできるということになります。
私は W3C信奉者でもなく、会員でもなく、あるいは回し者でもありません。しかし、世界中で情報を正しく共有できるということを考えれば、W3C標準仕様は無視できないばかりか、まさに尊重すべきことでしょう。
W3C公式サイトでは、Web標準化の膨大なドキュメントが掲載されており、誰でも自由に閲覧し利用することができます。特に、次世代の新しい標準化に向けての数々の草案は、一見に値します。 (記事がすべて英語なのはシャクだが・・)
閲覧ソフトの銘柄によるレンダリングの違い
ブラウザ銘柄による HTMLドキュメントのレンダリングの違いはどうしようもありません。なぜならば、標準仕様ではタグの表示方法を決定していないからです。つまり、表示に関してはソフトウェア依存となります。
レイアウトを主体としたドキュメントでは問題になる場合もありますが、本来 HTMLは、ある要素のマーク付けを主眼としており、全体が論理的な構造を要求しているに過ぎません。
そこで、レイアウトを主体とした「スタイルシート:Cascading Styelsheet」を発表した経緯があります。これによって HTMLドキュメントから見栄えを分離しつつ、作者のレイアウトデザインを、満足させようとしています。
スタイルシート実装の違い
ブラウザ銘柄によるスタイルシートの実装が異なるのは残念なことです。普及率の高い MSIEは、実際のところまだまだ貧弱です。
しかし、重要なことはレイアウトではなく作者が発信する情報が正しく伝わるか否かです。スタイルシートの実装が不備なために情報が伝わらないとなると、それはもう一度コンテンツを見直す必要があります。
大切なことは、スタイルシートがなくても十分に情報を伝えられる構文であることです。その意味でも、HTMLそのものが論理的な構造になっているかが問われます。
ツリー構造
HTMLドキュメントが論理的な構造で作成されたとき、各タグの配置はツリー構造となるのが理解できます。ツリーは、要素の親子関係が成立し、ソースは人間にも理解可能となります。
これは非常に重要なことであり、特に更新時やメンテナンスなどの作業が大幅に向上します。その意味では、タグを省略せずに書きたいものです。
作成した HTMLドキュメントが世界中のどんな環境でも正しく閲覧できるためにも、基本はしっかりと抑えたいところです。HTMLの理念を理解したドキュメントこそがそれを達成できます。
CSS講座 --- 印刷スタイルシート
Webページを印刷するとき、その出来上がりは環境によって大いに異なります。異なるシステムやハードウェアによってバラバラです。
そうした状況の中で、印刷用のスタイルシートは作者が意図する印刷を提供します。ただし、残念ながら多くの閲覧ソフトでその機能を実装されていないのが悲しいところでもありますが・・・。
以下の表は、印刷に関するスタイルシートの属性と値の一覧です。
印刷出力メディア向けのスタイルシート
属性 機能
page-break-before
改ページの設定
auto 改ページの制御をしない
alway 要素の直前で改ページ
avoid 改ページの禁止
left 見開きの左に設定
right 見開きの右に設定
page-break-after
改ページの設定
auto 改ページの制御をしない
alway 要素の直後で改ページ
avoid 改ページの禁止
left 見開きの左に設定
right 見開きの右に設定
page-break-inside
改ページの禁止
auto 改ページの制御をしない
avoid 改ページを禁止する
orphans
最下部の段落行数
数値 段落の行数を指定
window
最上部の段落行数
数値 段落の行数を指定
marks
トンボの設定
auto トンボを設定しない
crop コーナートンボの設定
cross センタートンボの設定
size
用紙の向きとサイズの設定
auto 印刷先の初期値に依存
portrait 縦向きの用紙
landscape 横向きの用紙
数値 横幅と高さを指定
page
印刷範囲の適用
auto 印刷先の初期値に依存
名前 印刷ボックスの名前を指定
page-break-beforepage-break-after属性
ある要素の直前、または直後に改ページをするかどうかを指定します。初期値は autoで何も制御しません。MSIE、Opera などで実装しています。
page-break-inside属性
この属性で指定された要素の途中の改ページをコントロールします。基本的にはブロックレベル要素に対して適用します。初期値は印刷状態で改ページしたりしなかったりします。
orphanswindow属性
印刷領域が中途半端なとき、その最上部、あるいは最下部で最低限必要な行数を設定します。それぞれ段落要素で指定します。初期値は2行となって医師増す。
marks属性
製本時に祭壇知る目安となる線、いわゆるトンボをコントロールします。トンボはコーナートンボとセンタートンボがあり、値をカンマで区切って同時に指定することも可能です。初期値はトンボの設定を行いません。
size属性
印刷する際の用紙の方向とサイズを指定するために利用します。初期値は閲覧者の印刷環境に依存します。
page属性
あらかじめ @pageで印刷の領域 (ページボックス) に名前をつけて定義したときに、その領域を利用する場合に、特定の要素に名前を呼び出して使います。初期値は印刷の環境に依存します。


This page is Valid HTML 4.01! 初版公開日 2004年10月29日
Copyright(C) 2002-2004 banban@scollabo.com