Moonlight PAC edition 第70号 2009.9.22発行
編集、発行:Moonlight PAC編集委員会
本号のトピックス
★次期TOPページ正式稼働/デザインと使い勝手を大幅刷新
★短期連載企画「CSSとJavaScript−その可能性と問題点−」第1回
★作品投稿について/PAC運営委員会
★次期TOPページ正式稼働/デザインと使い勝手を大幅刷新
 かねてから稼働準備を進めてきた次期TOPページは、2009年8月1日付で正式稼働を開始しました。経緯はニュース速報で既報ですが、改めて詳述します。
 2009年4月発行の号外で発表した構想では、(1)アンケートを実施する(2)結果によっては旧TOPページを次期TOPページと入れ替える形で存続する−としていましたが、本業多忙でアンケートの準備もままならないまま先送りし続けて3カ月以上経過したため、これ以上先送りするのは次期TOPページの準備に費やした時間や労力と考慮すると好ましくないこと、これまでの経験からアンケートを実施しても傾向を把握出来る程度のサンプル(回答数)を得られる見込みは薄いことから、(1)のアンケート実施を取りやめて(2)の旧TOPページと次期TOPページの入れ替えは実施することを決定し、実行した次第です。

 次期TOPページ−以降「新TOPページ」と呼称を変更しますが、旧TOPページと比較して大きく様変わりしています。
 まず外観ではプルダウンメニューの採用により、各グループやコンテンツを集約しています。芸術創造センターは開設以来tableタグによるレイアウトを採用してきました。芸術創造センター開設の1999年から数年は一般家庭のネット環境がまだまだ不十分であり、限られた接続時間でより多く閲覧されるには凝った装飾やインターフェースより高速表示させること、すなわち1つのHTMLファイルで文字情報を中心にする手法が最適でした。また、芸術創造センターではデザインやグラフィックに関する知識や技術が乏しく、美麗なアイコンやイメージを揃えられなかったことも大きな要因です。
 ここ数年でネット環境は著しく向上し、100Mbps以上で常時接続という環境も珍しくなくなりました。一方でtableタグによるレイアウトは馴染み深いものの、変更に限界を感じていました。フリーのソフトウェアやイメージの充実により、アイコンやイメージは開発環境がかなり安価に揃えられるようになり、作成も容易になってきました。アイコンやイメージの大量使用はWebページを表示するための通信機構からすると好ましくないものには変わりありませんが、工夫により少量のイメージで視認性と利便性の高いレイアウトやインターフェースを作成することも可能になったことで、代表的なGUI(Graphical User Interface)の1つであるプルダウンメニューを採用しました。

 ファイル構成は、HTMLファイルであるindex.htmlを基軸に、複数のCSSとJavaScriptを読み込ませています。HTMLファイルは文字情報に専念して、レイアウトはCSSで行うスタイルを採用し、JavaScriptでHTMLを動的に書き換え、連動して該当部分にCSSが適用されることによりプルダウンメニューを実現しています。
 ブラウザ開発元やGoogle、IBM、Appleなど海外大手情報産業メーカーが参加するWebページ標準化団体W3CのWeb標準化勧告では、HTMLで文字やイメージなどを記載してCSSでレイアウトを決定する分業化を推進する観点から、fontなどいくつかのタグが非推奨とされています。本号発行時点で草案作成が進められているHTML 5ではこの方針がさらに進むことは確実であり、芸術創造センターも開設以来採用してきたtableタグによるレイアウトからHTMLとCSSの分業への転換が必要と判断しました。
 さらに、一時は景観やセキュリティの観点から敬遠され「冬の時代」を過ごしていたJavaScriptが、Google Mapなどを通じてHTMLやCSSを動的に書き換えてWebページの表示を変更するAjax(Asynchronous Javascript+XML)に必須の技術として再び脚光を浴びるようになりました。プルダウンメニューはJavaScriptを使用することでブラウザのみで実現可能であり、JavaScriptは開発時も閲覧時も別途プラグインを用意する必要がないため、FlashではなくJavaScriptを採用しました。

 TOPページは開設10周年を迎えた2009年に刷新出来ましたが、他にも多数のファイルがtableタグ使用によるレイアウトなど従来の手法のまま存在しています。TOPページだけ刷新しても他のファイルがそのままでは統一感がありません。圧縮ファイルの構成分も含めると優に4000を超えるファイルすべてにCSSを適用し、各グループやコンテンツのインデックスの視認性や操作性を向上するのは非常に時間のかかることですが、新TOPページと同様に各作品、各グループやコンテンツのデザイン統一を図っていきます。変遷の記録として、見映えの統一が必要な作品以外はCSSを適用しない可能性も勿論あります。
 開設以来おそらく初めての大幅な模様替えを進めるMoonstone Stuio芸術創造センターをよろしくお願いいたします。(主幹Moonstone/Web技術チーム/芸術創造センター運営委員会)
★短期連載企画「CSSとJavaScript−その可能性と問題点−」第1回
 今回からの短期連載企画では、芸術創造センターのTOPページ新装とも深く関係があるCSSとJavaScriptをテーマとします。コーディングの事例やサンプルなど技術的な事例は専門の書籍やWebページに譲り、ここではCSSとJavaScriptの概要や長所短所、問題点や展望などを紹介・言及します。(Web技術チーム)

 まずCSS(Cacading Style Sheet:スタイルシートと同意)から述べていきます。CSSはWebページの見栄えを統一する手法として導入されました。本来OSや言語の相違を超越して情報を共有することを目的にWebの概念が構築され、その具現化のためにHTMLが成立しました。しかし、文字情報を主体として考案されたHTMLは、情報通信網の性能向上に伴う画像を含めるとWordなどワープロソフトによるドキュメント文書より見劣りが否めません。
 また、HTMLが条件分岐やループを伴わない言語形態(非手続き型言語)であるため、ファイルの先頭から最後まで一直線でブラウザが解釈・表示します。そのため横方向へのレイアウトが困難で、Webページ制作者はtableタグによるレイアウトを使うことで対応しましたが、変化への即応が面倒になります。込み入ったレイアウトになるとタグに情報が紛れて捜索に時間を費やすことが多くなり、即応性が要求されるWebには重大な支障となってきました。

 そこで導入された概念がCSSです。CSSはHTMLとは別にレイアウト情報を定義するファイルで、テキストのみで記述されます。記述の基本は以下のとおりです。
     クラスやIDの名称 {(属性:パラメータ);<属性:パラメータ>;}
「クラスやIDの名称」は任意で、{}内は改行も可能です。「属性とパラメータ」は最低1度記述するのが普通ですが、何も書かなくてもエラーにはなりません。2つ以上書くのは任意で、初期設定もしくはブラウザの解釈で自動的に決定されます。一般にはC言語など他のプログラム言語の記述を模倣して、以下のように記述されることが多いです。
     クラスやIDの名称 {
       (属性:パラメータ);
       <属性:パラメータ);
     }

 IDはまだしもクラスいう概念はHTMLのみ習得してきた人には馴染みのないものですが、C言語など構造化言語と呼ばれるプログラム言語では普遍的な概念の1つです。クラスとは簡単に言うと、「階層構造を形成すること」です。たとえば特定の<p>タグ−1つの例としてunique1という属性(""で囲われる内容)のみに「太さ2px(pxはピクセルでCRTの解像度と同じ単位)で色が緑(カラーコード#00ff00)」を適用して、別の<p>タグ−unique2には「太さ5pxで色が赤(カラーコード#ff0000)」を適用したい場合、CSSを以下のように記述します。
     p.unique1 {border: 2px #00ff00;}
     p.unique2 {border: 5px #ff0000;}

こうすることで、<p>タグは以下のような階層構造が構築されます。
     <p>タグ┳(クラスを持たない<p>タグ
          ┣unique1属性を持つ<p>タグ
          ┗unique2属性を持つ<p>タグ

これと以下のようなHTMLファイルと組み合わせることで、「枠線の太さ2pxで色が緑」の文字列「文字列のサンプルその1」と「枠線の太さ5pxで色が赤」の文字列「文字列のサンプルその2」が出来上がります。
     <p class="unique1">文字列のサンプルその1</p>
     <p class="unique2">文字列のサンプルその2</p>

 クラスの概念は、タグで表示状態を変更するHTMLの機能を拡張するものと理解すれば良く、IDを1つ1つ割り振るよりすっきりしたソースが記述出来ます。(続く)
★作品投稿について/PAC運営委員会
 投稿規程を設けて以来一度も投稿作品の受付がありませんが、当ページでは作品投稿を歓迎しております。規定に関しては投稿規程をご覧戴くとして、ジャンルはオリジナル小説、二次創作作品、ファンタジー、恋愛・・・。著作権侵害やマナー違反のもの以外は、既存のグループ以外の作品も受け付けています。新規ジャンルで複数回数の投稿が確約されるのでしたら、新規グループを立ち上げます。

 「作品は投稿したいけど、このページはどうも敷居が高い」とお思いの方、ご心配は無用です。Moonstone主幹も暗中模索の状態から投稿を始め、それが進展して自分のページ立ち上げに至ったという経緯があります。「始めの一歩」は誰にでもあります。その「始めの一歩」をこのページで踏み出してみませんか?それがきっかけでネット作家として名を馳せることも決して夢ではありません。必要なのは貴方の作品とほんの少しの勇気です。

 「こんな作品じゃ人前に見せられない」と不安になる気持ちも分かります。しかし、価値観で左右される命題において、賛否両論が生じるのは必然的です。非難や否定を恐れず、自身の制作スタンスを堅持して作品をネットを介してこの世に送り出して欲しい、と願わずにはいられません。当ページがその足がかりになれれば幸いです。皆様からの投稿をお待ちしております。(芸術創造センター運営委員会)
編集後記
・2009年の衆議院総選挙で、自民党は1955年の結党以来維持してきた衆議院第1党の座から陥落した。所謂55年体制と言われた政党では先に野党の社会党が瓦解したが、それに続くものだ。議席は100議席台を確保したものの従来の支持基盤=集票マシンが相当崩壊した。「自民党をぶっ壊す」と勇ましく登場した小泉政権下で自民党の全国規模の有力集票マシンであった郵政ネットワークを破壊してしまったことが大きい。挙句、自民党は選挙における禁断の麻薬−一度手を出したら崩壊するまで続けざるを得なくなる創価学会票に手を染めた。自ら支持基盤を破壊し、更に創価学会票に依存することで、自民党は自ら崩壊したとも言える。
・一方、政権を獲得した民主党で「国民目線の政治」が可能かどうか甚だ怪しい。政権公約=マニフェストにおいては廃止や見直しを明記した後期高齢者医療制度や労働者派遣法の成立に、民主党は賛成した。その反省もなく過去の判断と正反対の行動を明記したところで、後期高齢者医療制度や労働者派遣法の背後にいる財界の意に反する政治を遂行するとは期待しない方が良い。民主党もまた、自民党と同様選挙権を持たない財界から政策の評価を受けて評価に応じて政治献金を受け、政党助成金に手を染める身なのだ。
・今回もマスコミ主導による「どちらか」を選んで政治が変わるとする政党選択の構図が見事に成立した。その背景には多数の死票が出て得票数より多い議席を獲得できる小選挙区制があることは明らかだ。その小選挙区制もマスコミが「改革派」「守旧派」という「どちらか」を選択させる構図を描き出して成立に手を貸した。日本の政治の混迷やそれによる国民生活への甚大な影響の元凶は、マスコミにあると言って過言ではない。(M)

このホームページの著作権一切は作者、若しくは本ページの管理人に帰属します。
Copyright (C) Author,or Administrator of this page,all rights reserved.
ご意見、ご感想はこちらまでお寄せください。
Please mail to msstudio@sun-inet.or.jp.