「山椒魚戦争」サイト掲載2006/08/26 20:22

「別世界」コーナーに、サンプルサイト「山椒魚戦争」を掲載しました。

元々このサイトのホームページは、CSSを使ったページレイアウトの見本として、職業訓練校での授業のために制作したものです。「標準モード」対応のブラウザ(IE6/7, FireFox1.5)などで、縦方向に伸縮するレイアウトをCSSで組む方法を、検証するためのものです。

それに対して、ただ骨組みだけのページではつまらないと思い、先頃制作した「アンドリアス・ショイフツェリ」関連の内容を、掲載記事に流用しました。また、ページのテーマに合わせ、CorelDRAW, PHOTO-PAINT X3Web用画像も追加しています。

今のところ、サイトといっても1ページしかなく、他のコンテンツを制作するかどうかも決めていません。まあ、しかし、学校の生徒に見せるだけではもったいないので、「別世界」コーナーに掲載した次第です。

山椒魚ポスター追加2006/08/19 03:06

先に掲載した「アンドリアス・ショイフツェリ」に、ポスターをもう一枚追加しました。

山椒魚を、もう少し描き込み、ポスターのテーマを変えてみました。

追伸

アンドリアス・ショイフツェリの原画を、ポヴォンドラ氏の切り抜きより発見しました。(8月19日午後11時)

ポスター風作品掲載2006/08/17 15:33

「展示」コーナーに、山椒魚「アンドリアス・ショイフツェリ」のポスターを掲載しました。

CorelDRAW X3で、テクスチャ塗りつぶし、ビットマップパターン塗りつぶし、スマート塗りつぶし、フィレット/スカラップ、エンボス効果、等高線効果、透明効果、ドロップシャドウ効果などを利用して、描いています。

ビットマップ効果風に見える部分もありますが、PHOTO-PAINTなどは使っていません。

プレゼンテーションデザイン掲載2006/08/05 23:55

「展示」コーナーにプレゼンテーションデザイン「トラストDE」を掲載しました。

プレゼンテーション用資料のデザインを念頭に、CorelDRAW X3で制作したものです。

サイト管理ソフト変更2006/06/21 21:30

Microsoft Windows Vista Beta2より先に、次期Officeアプリケーション「2007 Microsoft Office System Beta2」も公開されていますが、その一員にWebサイト作成アプリケーション「SharePoint Designer」が含まれています。

Microsoft SharePoint Designer 2007

このアプリケーションは、当サイトの作成に使用している「FrontPage 2003」の後継版です。しかし、その名称に「SharePoint」を冠しているので、Microsoft社のWebサーバ「SharePoint Server」にFrontPageよりもさらに特化した製品なのかと思い、使用を躊躇していました。

何故なら、最近の私はWebサイトの構築に当たって、Internet ExplorerMicrosoft社の独自拡張技術よりも、XHTMLCSSの標準になるべく準拠することを目指しているからです。もちろんそれは、Microsoft社自身がIE7などで同様の姿勢を強めていることが前提にあります。また、職業訓練校でWeb系の講義に係わっていることも、背景にあります。まあ、何よりもCSSでデザインしたページは、合理的かつ作り易いので、その方法を追求していくと「標準準拠」を考慮するようになるわけです。

そんな中で、技術的によく知りもしないSharePoint Server向けのアプリケーションを使うと、標準から外れてしまうかもしれないと危惧したわけですが、いずれにしてもFrontPageはなくなってしまうので、Beta版ということもあり、試しにSharePoint Designerを使ってみました。

その結果、懸念を払拭するどころか、標準準拠のWebページを作成するにあたって、非常に便利なツールであることがわかりました。第一にSharePoint Designerは、CSS2.1の管理が非常に容易になった点が挙げられます。外部CSSファイルで二重にリンクさせたものも、きちんと読み込んでくれるほか、「作業ウインドウ」を使ってグラフィカルに管理できるようになりました。

第二に、HTMLソースの構文チェック機能が向上した点が挙げられます。私は、多くの場合HTMLソースコードを直接編集しますが、SharePoint Designerの「コードビュー」では、タグの閉じ忘れ等を確実に表示してくれるほか、指定した標準のスキーマ(例えばXHTML 1.0 Transitional)に対するエラーも強調表示され、その理由もヒント表示されます。

こうした機能を利用することで、標準準拠のコード記述が楽になります。基本的な操作体系は、FrontPageを踏襲しているので、アップグレードユーザーであれば習熟も容易です。現在、当サイトの作成は、SharePoint Designerに切り替えました。

Microsoft Expression Web Designer

ところでMicrosoft社は、「Expression」というシリーズ名で、ドローソフト(買収した「Expression」の新バージョン)「Graphic Designer」、Flashなどのグラフィカルコンテンツ作成用「Interactive Designer」、そしてサイト作成用「Web Designer」を開発中です。これらは、Adobe社の旧マクロメディア製品群「Fireworks」「Flash」「Dreamweaver」にそれぞれ対置させた、本格的Webサイト構築ツール群のようです。そして、Expression Web Designerは、標準準拠の「Webデザイナー」向けサイト作成アプリケーションとされていますが、現在公開されている英語Beta版を試してみたところ、基本的な機能と先に挙げた操作性は、SharePoint Designerとほぼ同じでした。

つまり、SharePoint Serverによるサイト構築の必要がなく、一般的なWebサーバ向けのサイトを対象とするなら、Expression Web Designerを選ぶことになるのでしょう。ただ、Expression Web DesignerBeta版は、今のところ英語版しかありません。このため、日本語版のSharePoint Designer Beta2を使っておくことで、Expression Web Designerに“慣れてしまう”ことができます。

まあ、頑迷な“クリエイター”は石に嚙り付いてもDreamweaverを選ぶのでしょう。しかし、IllustratorではなくCorelDRAWを選択できるような見識の広い方は、SharePoint DesignerExpression Web Designerを使ってみる価値はあると思います。

関連リンク

Windows Vista向けサイトデザイン変更2006/06/17 12:52

Windowsの次期OSWindows Vista」の一般向けBeta2が公開されています。

Vistaには、新しい標準フォント「メイリオ」が付属し、インターフェイスもこのフォントを使うようになっています。「メイリオ」の特徴は、文字デザインそのものが、美しさと読みやすさを兼ね備えているだけでなく、「ClearType」に対応しているので、液晶ディスプレイでもきれいにスムージングされた表示になります。

当サイトも、この「メイリオ」での表示をチェックしてみましたが、従来標準で使用していたプロポーショナルフォントの「MS Pゴシック」とは字詰めが異なるため、メイリオでは1行に入る文字数が少なくなり、結果としてページ全体での行数が増えてしまいます。当サイトの多くのページは、高さを固定しているため、文末がページ内に収まりきらなくなるところが出てきました。

これは、Macintosh環境で表示した場合にも起きることなのですが、今まではMac相手なので、適当に処理していました。しかし、これからのWindowsが対象であり、しかもメイリオの美しさは捨てがたいので、メイリオでの表示に合わせてページの高さを調整することにしました。

現在、ほとんどのページで、文末が切れてしまうことはありませんが、一部、見逃しているところがあるかもしれません。まあ、それはそれとして、Vista Beta2を使っている方は、メイリオでの表示と美しさを確認してみてください。

なお、従来のWindows環境、すなわち、メイリオフォントがインストールされていない環境では、MS Pゴシックで引き続き表示されます。その際、文末に若干の空きスペースができてしまいますが、気にしないでください。

IE仕様変更への対応2006/04/04 00:42

IE6,7 Active X仕様変更の概要

遅ればせながら、Internet Explorer 6及び7Active Xコントロールに対する仕様変更に対応しました。

この仕様変更は、特許に関する司法上の問題を回避するため、FlashムービーなどのActive Xコントロールを使って表示するオブジェクトに対し、一度クリックして有効化する手順が追加される」、というものです。現状では、Internet ExplorerActiveX更新プログラム(KB912945)」をインストールする、もしくはInternet Explorer 7 Beta2(3月20日版)を使用すると、この仕様変更が適用されます。

なお、KB912945Windows Update等ではまだオプション扱いになっていますが、いずれ更新プログラムとして適用されることになります。

具体例

例えば、Flash画像内にリンクボタンを組み込んでいる場合、そのボタンをクリックする前に、Flash画像全体を一度クリックしなければなりません。

C.D.R.サイトでは、サイトのロゴがFlash画像になっていて、これをクリックするとホームページ(index.htm)に戻れるようにしています。この仕様変更が為されると、2回クリックしなければホームページに戻れません。

他にも、関連ページのリンクや、展示コーナーのリンクにFlashを使っていますが、リンクボタンのFlash画像を、有効化のために一度クリックしなければならないという操作は煩雑ですし、インターフェイスとしては使い辛くなってしまいます。

回避策

仕様だから仕様がない――というわけですが、従来どおりの操作性にする“抜け道”として、Flash画像のHTMLコード(objectもしくはembedタグ)を、外部Java Scriptファイルに記述して読み込ませる」、という方法が推奨されています。当サイトも、リンクを組み込んであるFlash画像は、すべてこの方法に切り替えました。

リンクを組み込んでいない、純粋に画像としてのFlashに関しては、もう面倒なので、そのままにしてあります。ですから、こうした画像を拡大表示するような場合は、一度クリックして有効化し、それから右クリックでメニューを表示してください。

「質問」コーナー一時休止2006/03/12 14:30

私用により2006年3月13日(月)~3月19日(日)までの1週間は、「質問」コーナーで質問を頂いても、回答は3月20日(月)以降になります。ご了承ください。

サイトデザインの一部変更2006/02/26 16:16

C.D.R.サイトのデザインは、主としてCSS(スタイルシート)を利用していますが、そのCSSJavaScriptで操作する方法を少し勉強したので、ホームページにいくつか“仕掛け”を作ってみました。

元々は、Macintosh環境での表示問題を解消するために、こうしたスクリプトを試していました。和文プロポーショナルフォントを使わないMacでは、字間(言語間)が開いてしまい、結果として行数が増え、文章がボックス内に収まらなくなっていました。行間はCSSで指定しているので、これを変更し調整を図ったのですが、その過程で、スクリプトでCSS属性の値を直接変更できることに今更ながら気づき、ついでに応用してみたという次第です。

私自身はデザイン系の人間なので、スクリプトの類は苦手です。しかし、そういった系統の学校に仕事で関わっているため、見て見ぬふりをするわけにもいかず、このC.D.R.サイトを練習台にしています。Mac環境への対応も、本来はどうでもよいことなのですが、勉強の一環として対処してみました。

CDGS X3 新機能と機能拡張2006/01/18 23:51

CorelDRAW」コーナーCorelDRAW Graphics Suite X3新機能/機能拡張」を追加しました。

とりあえず、これらのポイントをテキストのみの記事にしてあります。後日、キャプチャ画像を付け加える予定です。