このサイトをつくる坂本衛は、ホームページ（WEBページ）制作に関してまったくのド素人でした。しかしながら、ご自分でホームページをつくる方に役立ちそうなことを考えないでもなく、また、プロがつくっているにもかかわらず実に読みづらい 
掟やぶり ページの多いことが気になるので、このサイトの制作方針（サイトポリシー）を掲げて参考に供することとしました。
ですから以下は、自分でホームページをつくる素人さんで、とくにヒマだという方だけお読みください。もちろん、ほとんどすべての役所や企業、さらには放送局のホームページのように、読みづらいページをつくり続ける「プロ」の方が読んでもかまいませんが。プロならば、このページに書いてあることくらい踏まえて当然です。
|
≪このページの目次≫ |
（１）坂本衛の仕事のうち、放送を中心とするメディアに関する論考や発言を掲載し、テレビの知られざる実情を伝え、テレビと付き合っていくうえでのヒントを提供する。
（２）仕事ばかりでは肩が凝《こ》るから、息抜きのページとして東京・神楽坂に関する情報を提供する。
（３）サイトは人に見てもらうものだが、万一見る人がなくても、いくつかメリットがある。第１に自分の原稿やその他データのバックアップができる。第２に自分の仕事の整理がつき、覚えや索引代わりになる。第３に自分の仕事を客観視できる。これらのことはもっと強調されてしかるべきだと思う。
※この項目について補足。（２）については、多くの人には、サイトにアップしない仕事に関して何もやっていないように見えてしまう（坂本が書く原稿のうち当サイトに出しているものは、文字数で1割以下、ギャランティの割合でいえば、ここ数年はせいぜい5％以下）。（３）については、サイトにアップするために体裁を整えると、内容の薄い原稿でももっともらしく見えがちである（筆者は仕事柄、どんな原稿でも客観的に読む訓練を積んできたつもりではあるけれども、つねに自戒が必要だと思う）。以上はデメリットでもある。
（４）更新情報に日録メモをあれこれ書き込んでいくうち、一種の日記のようなものを続けるハメに。日々の出来事に反応して自分の考えをまとめること（それも、人に見せる前提で短時間に、論理的に書くこと）のメリットは大きいが、これは当初のサイトのねらいにはなかった。結果的に、サイト運営でもっとも重要と思われる「できるだけこまめに更新すること」（ときどきサボるけど）につながった。雑誌むけの原稿だけでは、そう頻繁《ひんぱん》に更新できない。
（５）一度サイトに出したページは、基本的に削除せず、膨らませていく。誤りがあっても、その箇所にお詫びや修正を書き込むことで対応する。いい加減なことを書かないという自戒のために。
（１）「表紙→いくつかのメニュートップページ→それぞれの論文その他コンテンツページ」という３階層を基本とし、主要コンテンツには表紙から２クリックでたどり着くことができるようにする。実際には表紙といくつかのメニュートップページは同じ階層にある。なお、メニュートップページとはカテゴリートップページ、本でいえば「目次つき章とびら」のようなページのこと。ナビゲーションのための親ページでもあり、各部屋（子ページ）に通じる「踊り場的なページ」といってもよい。
（２）サイトの構成をわかりやすくするため、ページ数をなるべく増やさない。たとえば１年分のコラムは１ページに収めるようにし、ページのサイズが大きくなっても、階層を深くしたりページを分割したりしない（この点、縦に長いページをつくらないという最近のホームページづくりの傾向には反する）。
（１）ページの横幅を固定せず、読み手側でブラウザ（閲覧ソフト）の幅を自由に選べるようにする。言い換えれば、読み手が１行あたりの文字数を自由に選べるようにし、どんな幅で見てもレイアウトが基本的に崩れないページにする。
（２）読み手側で文字の大きさを自由に選べるようにする。どんな文字の大きさで見てもレイアウトが基本的に崩れないページにする。
（３）特定の用途であれば使ってもよいと思うが、フレームは使わない。フレームには、分割によって画面を狭くする、表示に時間がかかる、検索エンジンにうまく対応できない、見た目通りに印刷しにくいなど欠点が多すぎるからである。
（４）すべてのページに共通の基本デザインを採用し、サイト全体の統一感を出す。これによって新しいページを作るときテンプレート（ひな型）が使える（または既存のページを流用して部分的に上書きし、別名で保存できる）ので、ページごとにデザインする手間を省くことができる。同じ画像（読者のパソコンのキャッシュに取り込まれる）を使い回すので表示も速くなる。更新の日付・ナビゲーションのリンクなどが全ページで同じ場所にあることは、読者にとっても便利である。すべてのページに、次のものをテキスト表示する。画像でなくテキストを使うのは、アクセシビリティへの配慮と、検索ロボットに対応するためである。
※ただし、図表を表示する一部のページでは、画面を広く使うために総目次のテキスト表示を省略している。
※サイトマップのページにあるサイト内検索は、Googleを使い www.aa.alpha-net.ne.jp 内で、「入力されたキーワード」と「Mamoru SAKAMOTO」を“and検索”することによって実現している（これ以外にうまい方法があるのかもしれないが、知らない）。
※トピックパスは、ページを垂直（上下）方向にたどるには便利だが、水平（横）方向にたどるには不便。いったん親ページに戻って別の子ページを探すような手間が必要だからだ。そこで、連続する子ページ同士では「前ページへ ｜ 次ページへ」という形式のナビゲーションをつける、関連する別ページへの参考リンクを掲げるなどが必要である（気がむけばそうしている）。
※サイト内・同一ページ内リンクの基本は、「飛ばしたら飛ばし返す」（必ず戻るリンクをつくる）ことである。たとえばページ上部にそのページの目次を配置し各節に飛ばすリンクを設けるときは、各節から目次に戻るリンク（上へ）を設ける。文章中に文末脚注に飛ばすリンクを設けるときは、脚注を読み終わって読んでいた箇所に戻るリンク（戻る）を設ける。
（５）すべてのページからサイト管理者へメールを送ることができるようにする。
（６）使う色数は本文・背景・リンクその他の３系統で数色（原則としてセーフティーカラー216色から選ぶ）にとどめ、落ち着いたサイトにする。また、読みやすさを考慮し背景は白（輝度が強すぎると思う）でなく、白に近いグレーとする。文字と背景にはモノクロ画面でも読むことのできるコントラストをつける（弱視者とモノクロで印刷して読む人への配慮。この点、本文のリンクの緑色がやや薄すぎるような気もするが、いかがなものだろうか。カーソルを載せれば太字になるわけだが）。もちろん、216色にこだわりすぎるのはナンセンスである。写真は216色で表示するのか、という話になるからだ。
（７）リンクは原則として、サイト内に飛ぶ場合は同じウィンドウに、サイト外に飛ぶページは新しいウィンドウに表示する。もちろんサムネイル（小さな写真）をクリックして大きな写真を出すという場合は除いて、の話。なお、アクセシビリティの観点からは「むやみに新しいウィンドウを開くべきでない」とされるが、この原則には反する。サイト外に飛ぶページはあくまで当サイトにとっての参考であり、それを読むために読者が別のサイトに移るのは、返って読者に不便ではないかと思うからである。
そもそも多くの人びとが使うWindowsというソフトウエアは、むやみに窓を開くことが「売り」であって、「インターネット接続時だけは新しい窓を開くな」というのは、ちょっと違うだろうと思う。インターネットに接続せずWindowsを使っているとき、設定画面などで新しい窓がむやみに開くが、誰もそのことをおかしいと指摘しないではないか。それどころか、筆者のパソコン（Windows Me時代の話）では、起動時にローカルディスクCとDのフォルダ（両方または一方）やMedia Playerの窓がむやみ勝手に開いたり、あるいは開かなかったりもする。Nortonと何かが干渉しあう現象らしく、いくつかの技術サポートによれば起動タイミング変更だの手動起動だのと面倒くさそうなので、邪魔にならない場所に小さなウインドウを開くようにして、自分で閉じていた（笑）。
（１）表紙は、事実上の標準画面サイズになりつつあると思われる（注：2003〜2004年頃の話）17インチCRT／15インチ液晶画面で、ほぼ正方形に表示したとき、縦方向にも横方向にもスクロールバーを出さず、つねに表紙全体を一覧できるようにする。なお、標準的なブラウザの上部にツールバーなど３行分を表示する場合を想定している。
（２）表紙は、できるだけ軽いページにする。
（３）表紙には、「ページのデザインについて」の（４）に加えて、次のものを表示する。
（４）「日録メモ風の更新情報」のボリュームがどんどん増えていくため、表紙が全然軽いページになっていないのは問題だ。
（１）初出の多くは縦書きで「一九九九年」のような表記だが、なるべく横書きに適した「1999年」のような表記に訂正する（まだ訂正しきれていないけれども）。
（２）読みやすさに配慮し、原文ではつながっていても、段落ごとに一定の空白を設ける。メールは読みやすいように数行書いたら空白行を入れるしきたりになっているが、なぜみんなホームページでは空白をつくらないのだろう？
※なお、この項目は当初「段落ごとに空白行（改行）を入れる」と書いていたが、これはスタイルシートへの理解がまるでなかったころの誤った記述。本来ならば本文は段落ごとに<p></p>で囲い別途スタイルシートで間隔を開ける指定をすべき（現在はそうなっている）だが、当初は深く考えず全文を<p></p>で囲い段落ごとに末尾に<br><br>と書いていた。誤りに気づいたときには、ページ数が膨大で、しかも本文以外の複数の箇所に<p></p>があったため、修正は容易でなかった。素人は最初からスタイルシートについてじっくり学ぶべきであると思う。
（３）初出原稿は読者がある程度限定されるが、ホームページではさまざまな読者が想定されるから、難しい漢字にルビをふる。ルビのふり方は青空文庫にならって《》に入れる。
（４）原則として初出の論文を掲載する新聞・雑誌などの販売期間（店頭に並ぶ期間）中に、その論文をサイトにアップすることはしない。著作権者の自由だという見解（池田信夫）を聞いたことがあるが誤解。これは著作権の問題とは関係なく、新聞・雑誌社などと執筆者（著作権者）が交わす雑誌執筆契約がどの範囲までをカバーするかという問題である。なお、執筆契約が事前に書面で交わされることはまずなく、通常は「書いてほしい」「わかった」というやり取りだけだが、これは常識的な慣行に従った契約と見なされる。新聞・雑誌は、掲載した論文を含む編集著作物を販売して執筆者に支払う原稿料を得るのだから、契約上、新聞・雑誌社は執筆者に、競合する雑誌・新聞・WEBサイトなどに合理的な一定期間にわたって掲載許諾をしないよう求めるのは当たり前である。「合理的な一定期間」は、新聞・雑誌では次の号に置き換わるまでの販売期間と考えるのが妥当だろう。
≪参考≫青山総合法律事務所・内藤篤弁護士の見解（近著「エンターテインメント契約法」
原稿から抜粋引用）
雑誌の掲載、ことに単発のそれに関して契約書が締結されることはわが国ではまずないと言ってよかろう。従って、ここで「雑誌掲載契約」と称するのは、主として黙示の契約としての雑誌掲載契約をいかなるものとして解釈すべきか、という問題である。これは一般に非独占的な出版許諾契約であると解されているようである。 （中略）また単発の作品掲載は非独占的な出版許諾ではあると言ったが、少なくとも、それは著作者が「競合する他の雑誌や新聞などに合理的な期間にわたり掲載許諾をしない」という不作為義務を負う体の限定的な独占性を、出版社としては享受しうるものではあろう。たとえば、作家がA誌に作品を発表後まもなくして、B誌に同一作品を掲載したというような場合、A誌としては限定的な独占性を理由として作家にクレームをつけることができると考えるべきである。
（１）ホームページというのは、どうつくってもまずまずそこそこ表示される。みんながみんな厳格なルールに則《のっと》ったホームページをつくるわけではない以上、ある程度の誤りは無視したり都合よく解釈したりして問題なく表示するように、ブラウザに柔軟性を持たせてあるからだ。だからどうつくってもよいともいえるわけだが、実はある制約を設けたほうがつくりやすい。ホームページを記述するタグには多くの種類がある。あれこれ覚えて使いこなすのは面倒くさいが、たとえば30種類しか使えないと決まっていれば話は早い。そのような制約として、HTML4.01文書またはXHTML1.0文書をつくる、カラーは５色しか使わない、すべてのページの左肩に○○を必ず表示する、いちばん下に△△を必ず表示するなど、自分なりのルールを事前に決めてしまうとよい。制作や管理がたいへん楽になる。
（２）ホームページの見映えにはスタイルシート（CSS＝Cascading Style Sheets。それも外部スタイルシート）を必ず使うべきである。テーブルを駆使してレイアウトを工夫するなど、労多くして効少なく、しかも重い。当サイトの旧バージョンには２段組のページがあるが、ハッキリいって最低だった。
【付記】「スタイルシートを使って構造（意味）とデザイン（見映え）を分離せよ」（HTMLによる文書構造に対し、CSSで見映えを制御せよ）といわれる。基本的にはその通りなのだが、実は何も考えずにそう言い切れるほど、問題は単純ではない。たとえば、当サイトでは抹消線をスタイルシートで制御しているが、その部分を通常の手順でコピーしようとする（マウスの左クリックで範囲指定のうえ、右クリックでメニューを出してコピーを選ぶ）と、抹消線はコピーできない。たとえばこんな感じ。これは少なくとも読者には不便な話である。抹消線は「ある部分を否定する」という明確な意味をもっているが、それを見映えでしか制御できない（つまりは分離のしようがない）ケースがあるわけだ。リストでも頭につく中黒（小さい黒丸）はコピーできない。ならばリスト化せず各行の頭を「 ・」（２字空白＋中黒）として改行するという考え方も、一概には否定できないように思われる。
（３）ホームページの読みやすさ、ホームページのつくりやすさ、ホームページの構造や記述の明解さや正しさ、ホームページの軽さ（サイズの小ささ）、ホームページの管理のしやすさは、すべて連動していることに気づくべきである。読みやすいページは、構造や記述がシンプルで正しく、したがって制作も管理も楽で、軽い。読みにくいページは、構造や記述が複雑で誤りも多く、したがって制作も管理も面倒で、重い。
（４）W3CのCCS検証、W3CのHTML検証、Another HTML-lintのHTML検証は極めて有効であり、ぜひ利用すべきである。経験的にいえば、Another HTML-lintで満点ならW3Cでもまず認証されるが、W3Cで認証されればAnother HTML-lintでも満点とは限らない。だからまずAnother HTML-lintが指摘してくれるエラーを減らすのが合理的だ。もちろん満点にこだわりすぎるのはナンセンス。Another HTML-lintで満点でも、ホームページのつくりが構造的に正しくない、あるいは好ましくないケースはよくあるからだ（たとえば当サイト）。もっともド素人のレベルでは、「ホームページの記述を修正した結果、Another HTML-lintで以前より高得点がついた」なら、それは「正しいホームページにより近づいた」と単純に信じ、喜んでよい。ド素人が信じるに足る「正しいホームページの指針」は、そう多くないほとんど存在しないからである。
なお、Another HTML-lintに関して「採点基準が曖昧」「100点を取るのは非常に困難」「50点程度が目安」「Yahoo!など大手サイトがマイナス点なのだから、マイナスで構わない」などの声があるようだが、全然わかっていない言い訳にすぎず、大ウソ。当サイトのほとんどのページからわかるように、ヤル気があって手間さえかければ100点は取れるし、マイナス点より、あるいは50点よりも、100点のほうがよいことに議論の余地はない。
【付記】Internet ExplorerとNetscapeのどちらにも対応させるためには、構造的に正しくない記述がどうしても必要であるように思われる（が、間違っているかもしれない）。なお、ホームページをつくるうちに誤りに気づいたが、ページ数が多くて修正がたいへんという方（筆者もそうだった）には、次のソフトを強くおススメする。 複数のHTML&テキストファイル内を一括置換 TextSS
（５）筆者が2003年に制作を手伝った次のサイトは、当サイトとまた違った雰囲気なので、ぜひご参照願いたい。 偏屈庵通信（小林道雄ホームページ）
（６）初心のうちは、さまざまなサイトをのぞき、気に入ったものを真似するか、参考にするとよい。たとえば当サイトの≪総目次≫は、次のページを参考にした（もちろん、もっとよいものに改良してある）。 W3C Membership Benefits
（７）余計なお世話だが、次のようなことに注意するとよい。
（８）次のページのリンクも合わせて参考にしていただきたい。 ホームページ制作の素人（本人）むけリンク集
（１）情報サイトとして、情報量が多すぎる。または、テキストサイトとして、テキストが多すぎる。
（２）テキスト以外の遊び部分が少なすぎる。写真やイラストも、余白すらも少ない。
（３）縦に長く「重い」ページが少なくない。
（４）よく、突然に、更新が途絶える。
（５）専門誌に掲載した原稿をはじめ、難しいコンテンツが多い。解説や脚注をつければ、よりわかりやすくなると思うが、時間が取れない。
（６）チェックできないリンク切れが、数多くある。
（７）閲覧者を、きちんと分析していない（近々改善を予定）。
（８）サイト管理者へのメールの出し方がわかりにくい（同）。
すべてを疑え!! MAMO's Site
＜ジャーナリスト坂本 衛のサイト＞
Copyright © 2002-2009 [ 
Mamoru SAKAMOTO] All rights reserved.
