メイン

Site製作 アーカイブ

2008年3月15日

Stickam、<embed>を<object>に

Stickamのブログパーツを持ってくる際に、embedをxhtmlに対応させる必要がありました。そのためにobjectへと変更したのですが、objectはIE6では使えません。そこで今回は以前書いた記事、アマゾンアソシエイト、<iframe>を<object>にを参考に、XHTML 1.0 Transitionalに対応させるための記述方法を書きます。

実用範囲についての注意

方法は以下に示しますが、その前に注意書きを何点か。

  • Strictに近づけるように書いたXHTML 1.0 Transitionalであること
  • XHTML 1.0 Strict、XHTML 1.1ではないこと
  • 僕の使用したブログパーツの表示形式以外にはそのままの流用はできないこと
  • &の文字を文字実態参照(&amp;)、もしくは数値文字参照(&#38;)に置き換えること

ここで3番目の流用できないところは、widthだったりheightだったりしますので、そこはにらめっこして考えてください。

実際の表示

今回は以下の表示形式に対応しています。

テンプレートと使用方法

テンプレートを貼り付けて起きます。

<p><!--[if IE]>
<embed src="ここに表示されているurlが入ります" type="application/x-shockwave-flash"
 width="340" height="290" scale="noscale" allowScriptAccess="always"></embed>
<![endif]-->
<!--[if !IE]><-->
<object data="ここに表示されているurlが入ります" width="340" height="290" type="application/x-shockwave-flash">
<param name="movie" value="ここに表示されているurlが入ります" />
<param name="scale" value="noscale" />
<param name="allowScriptAccess" value="always" />
</object>
<!--><![endif]--></p>

使用する際には前述した"&"を書き換える注意事項を踏まえたうえで、url部を2箇所とも同じものを記述してください。これによりIEエンジンのときのみiframeタグ、その他のエンジンではobjectタグが使用され、もう片方はコメントとして扱われます。それと、表示されるurlはStickamのブログパーツに関するページで表示されることと、見た目についても、Stickam側のサービスで変更をするので、くれぐれもhtmlで調整することの無いよう、気をつけてください。

あとがき

前回の記事を流用したものなので、必要以上の動作確認を行っていません。何か疑問などがありましたら、コメントしていただけると幸いです。

それより、このサイズでシンプルな見た目のものはないのかなー...サイトトップから浮いているよ...

2008年7月29日

Web:カンコさん運営「HariHari」のサイト制作

カンコさん運営のHariHariのサイトを制作しました。今回は制作を経て所感。

フリーサウンドを手がけているHariHariのトップは以下のリンクから。
HariHarihttp://kanko.ninja-web.net/

HariHariのトップ一部切り出し
サイトトップはこんな感じ。相手方のサイトの印象以前にテンプレート的に考案していたので、カンコ、という冬を連想させる配色には至れていません。

で、今回は小難しいデザインワークや、仕様上記をつけたところなどの技術的な話はありません。多少の面識を持つカンコさんのサイト紹介と、制作秘話についてです。

HariHari

カンコさんの作られたサイトHariHariは、なんでもはりはり鍋、のはりはりらしいです。だからといって鍋のサイトにしてもおかしいので、とりあえずはハンドメイドのような親しみやすい雰囲気を出そうとデザインしました。

なんだか2000年以前の海外の配色に思えます。あと何がハンドメイドらしいかって、色の不一致がげふんげふん。個人的な印象は、何もないところに放り出された感じ。

話を戻してHariHari。Soundのリンクから音楽を視聴、ダウンロードできます。カンコさんは若い頃音楽をやられていたようなので、曲作りには不便を感じていないようでうらやましいです。ここの「天気雨」はお気に入りです。

初期のフリーノベルゲームが好きなようなので、その頃を連想させるmidiサウンドは古き良きあの感覚と、現代に合わせられた音作りをしてくれそうです。サイト制作の件もあり、ノベルゲーム制作の際にはサウンドを用意してくれるとのこと。やったね!

2chでの作曲経験もあるカンコさんは、HariHari更新をゆっくりと続けるようなので、ツボにはまるサウンドを心待ちにしています。

制作秘話

秘密にするもなにも、サイト制作に当たった日数は一日だけ。自己への挑戦でした。

現状、Libertasも何もデザインされていない状態です。これに一区切りつけるために、(このニュアンスの許可はもらっています)習作として制作しました。すると身についている知識から漠然としているところまでがわかるわかる!実装に不安なところは妥協したこともあり、htmlやcssは少しも詰まりませんでした。デザインのほうがはるかに難しいです。

確かに、よくよく考えてみるとcssでのレイアウトは、経験の無い方ではホームページビルダーを使ったとしても難しいものに思えます。その分喜んでもらえました。やったね!

技術的なことを一つ言うとすれば、CMSを使わないなら、管理する人のhtml理解度に合わせて制作することも必要ですね。多少のバグを包容できるシンプルなサイトが重要そうです。

一日の集中で作れて、それがオリジナル。多少野暮ったくてもそれは嬉しいものに思えます。機会があったら別の方のサイトも作りたいなぁ。最も仕事じゃないので主観混ぜまくりで、クライアントほったらかしですが。興味のある方は連絡ください。

そんなこんなのサイト制作。僕のほうからもありがとうございました。

2008年8月14日

Web:Libertasデザイン変更に伴って雑感

僕自身のサイトをリニューアルしました。現段階('08.08.06)ではblog以外ですが、間違いなく完成するところまで来たので、備忘録、雑感などを書き留めます。

Libertasデザイン2
トップページの全体。白と余白を大事にするように気を使いました。そしてこれに絡めた話題。Webページのデザインってどうしたら出来るのか、クリエイティブな発想はどこから来るのか。今の自分のレベルで感じていた事はこんなこと。

Libertasとしての悩み

同人サイトとしての問題

僕のサイトはとりあえず同人サイト。同人サイトってことは、絵とかがあるわけです。色々な絵を描くはずですが、やっぱり健全な同人はエロがあって肌色があるわけです。そこで衝突が起きたのは、僕のサイトは大気を表現したデザインにしたかったこと。大気といえば空やら雲ですね。ってことはブルーです。しかしどうにも同人サイトにブルーは大敵だと思いました。

技術がないために写真加工は使えません。そのため、ブルーは直接色としてどこかに使用されます。考えたら、色の効果として冷静、鎮静効果があるために、エロにブルーを使うと、たぶん冷めます。冷静になってしまってエキサイトしてもらうことが出来なくなる。それじゃあ問題ありです。で考えた結果、大気の表現は止めよう、となりました。それに代わるレッドなら、たぶんエロい効果があるはずです。ほんのり温度を感じる、きっとエロい。エロいことはいいことだ。以上のことが同人サイトを作る際に感じたこと。

背景が白いことは面白みがないのか

同人サイトはどこ行っても白ばっかり。先に取り上げた問題に気がつく前は、こちらもどうしたらいいか悩みました。青がいいんだ、という思いは理詰めで行かないと納得してくれません。

結論を言うと、背景が白い方が汎用性が高い。当たり前の話ですけど、体感するのにこれだけかかるとは、素直じゃないです。

僕のサイトは、同人サイト兼blogサイト兼......と、何をしだすかわかりません。先ほどの問題のように、コンテンツカラーが反発する可能性もあります。不適合なコンテンツは別サイトを作ればいいのですが、そうも言ってられない大人の事情があります。無彩色の黒でも代替が可能ですが、黒い背景は目を疲れさせるWebコンテンツとしての問題が付きまといます。やっぱり白いほうがいいようです。もちろん文字とのコントラストを考えた上での話。

Portfolioサイトでは、白以外のあるカラーで統一して作成している場合が多くありますが、それも単品物のサイトだからでしょう。少なくとも今の僕の技量では、色を使うことは出来ません。白も白なりに難しいのですが。

製作最中の悩み

デザインに泣く

僕はデザインについて一般以上の知識を持ち合わせていませんが、今回の件を踏まえてデザインは気が狂うほど難しいと実感しました。それではデザインとは何か。Wikipediaを参照すると以下のようにあります。

デザインの語源はデッサン(dessin)と同じく、"計画を記号に表す"という意味のラテン語designareである。つまりデザインとは、ある問題を解決するために思考・概念の組み立てを行い、それを様々な媒体に応じて表現することと解される。

これを踏まえて、普段なんらかの創作をしているときにデザインをしているのか、といわれると非常に怪しいですね。『ある問題を解決するために思考・概念の組み立てを行う』、これはどう読んでもアタマを使う話です。思いつきではなく、目的へ向けた明確な思考プロセスがないと土台が弱い。ましてや専門の教育も受けていないので、今回は前回の色彩論の付け焼刃知識をベースに、数多のWebページを教科書として読み解いていきました。色彩論、個人的には十分に役に立ちました。

結果、文章レイアウトのパターンは以前から知っていたのですが、Webデザイン的にするべからず、と(暗に指摘しているように思えた)パターン、配色が見えてきました。この事はもう少し積み立てて確固としたものにして情報量を増すまで、言及は避けようと思っていますが、文章にしなければ理解しにくいことだと思えるので、いずれ挑戦してみたいです。

製作時間に泣く

納得の行くサイトを作るのに今回費やした時間は、直接的には7日間です。この期間はサイト作りと逃避のブラウジング以外何もしていませんでした。i Know!が遅れたりランニングにいけなかったりと、個人的には最低の期間。中のあたりは意識飛んでました。気がついたら完成、気がついたら2度目の月曜日。

しかし間接的には2年です。サイト製作を勉強したのが3年前、実際にサイトを構えようとCSSで本格的に組みだしたのが2年前。そしてサーバをレンタルしたのが1年半前。LibertasはTopデザインを2度過去に変えていますが、確かに実力が上がっていくのがわかりました。お絵かきみたいだ。

素人の考えですが、やはり勉強をしても頭でっかちなだけで、折角だから勉強ついでに、と実装したいことが目的にそぐわなくともやってみたくなります。あるところでは極端にユーザビリティを重視してみたり、はたまたモダンブラウザのみのレイアウトで構成したり。これらは一旦吐き出してしまわないと、どうにも我慢が出来ないもので、若気の至りと考えればいいのでしょうか、それを乗り越え、今回のデザインに到達できたわけです。その甲斐あって、考えがぐっと深まりました。それだけでもよかったのかもしれないです。

製作期間を支えてくれた音楽はこちらの二つ。アーティストBT含むTrance徐々に明るくなるHouse、どちらもニコニコ動画です。精神的にかなり助けになり、感謝も含めてBTのアルバム、ESCMを購入しました。そしてデザイン名を、ある音楽にちなんで『Fleming August』としました。二つ含めて個人的な感想はProgressiveですね。成長を予感させる音楽はいい。

その他製作期間中に思っていたこと等

すごいなと感じた大学生のサイト

二人しか捕捉していませんが、一人はfamiさんのサイトMOGSTYLE。こちらのデザインになったのはfamiさんが20になられた時のはずですが、しっかりとした作りでこれぞxhtml+CSS!といえるサイトをはじめて感じさせてくれました。これを二十歳で作るって......すげえぞ。最近は更新されていないのが残念です。

もう一人は『の』さん(かっこ付けでないと読み飛ばしてしまう)のサイトVERSION510。こちらも二十歳のときに作られたサイトのはずです。落ち着いた配色と、方向性のぶれないコンテンツは、『の』さんの人格を感じます。これを二十歳で作るって......すげえぞ。最近はVERSION510を離れ、別サイトの運営をはじめられているようです。そちらもコーディングが確りしていて、大人の作りでカッコイイ。

お二人ともアマチュアです。(前略)すげえぞ。こうやって並べるって事は、やはり意識しているからなのですが、依然雲の上。画像加工を含めて、レベルアップしていきたいです。Webデザインを意識して製作し、3年であのレベルに到達できるケースを何例か見ました。たぶん3年やれば到達できるんです、きっと。それに期待しながらアンテナを伸ばし続け、来年の冬には、僕ももう少しクールになりたいです。

2008年10月30日

初心者~中級者のMTによるサイト製作で抑えたい36の項目

今回、Carpediem!注意同人サイト)の製作時にお世話になったエラーやらバグやら、新しい設定についてまとめてみました。これらのおかげで、逐一調べて、悩んで悲鳴を上げていたわけですけど、解決方法の存在自体から疑って一つ一つ調べていくのは時間の無駄です。中には忘れただけできっかけさえあればすぐに思い出せる些細なこともあるでしょう。

以下に書いた注意事項は、Movable Type4で、MTがインストールされているディレクトリとは異なるところに、サブドメインとして新しいサイトを作ったときに引っかかった点からcssなどの一般的なことまで製作に関係した全てです。内容には、慣れている人ならしないであろう簡単なミスや、もっと効率のいいテクニックがあるかもしれません。以下の問題点は、特に僕のようにサイトを作るための(x)html、cssの知識はあるが、経験が少なく、またサーバの知識も少ない人向けであり、バグの特定がニガテだな、と感じている人が躓きそうな点をリストアップしています。素人的なミスにはエスパー回答していますので、頭ごなし的な表現もあります。少し挑戦的なタイトルですが、ありがちなミスをいちいち探す手間を省くために使用できると思います。

アマチュアweb製作者のレベルがよくわからないので、仮に何度もお世話になる内容があったら、どの点が役に立ったかや、省略しすぎで意味がわからないか、または、これは違うだろ等コメントを残してもらえると嬉しいです;)

1~11:Movable Type4周りの注意事項

一からサイトを作るのが大変です
以前作ったMTのブログ複製を使うと楽かもしれません。ただし、カスタムフィールドが複製されず、しかも「既にあります」等といわれるバグがあります。それを加味して判断してください。
それでも複製するのであれば、カスタムフィールドの名前を変更して、その部分だけコピペすれば良いでしょう。
新しいサイト製作後のarchiveの設定
初期設定だと、rootにarchiveが吐き出されるために、ディレクトリが乱雑になってしまいます。MTの管理画面から変更しておいたほうが良いでしょう。途中から変更した場合は、先に生成したファイルを消しましょう。
MTのスタイルが正常に適用されない
修正方法はわかりませんでした。サブドメインから呼び出すと正常に動かないこともあるようです。このエントリで挙げたことを試しきれば直るかもしれません。
タグ、検索時にエラーが出る
mt-config.cgiはMT4では最初のブログの相対url(/mt/mt-static/)で設定されているので、絶対url(http://最初のドメイン/mt/mt-static/等)で書き換えておきましょう。
テンプレートが表示されない、灰色になる、変更できない
これは2パターンあります。上で設定した値が同じものを示していても、それぞれ異なった記述をしています。一貫性を持たせてください。
2つ目に、管理画面へのブラウザからアクセスのurlも一致さましょう。多分、wwwが欠けている、記述してしまっていることがあるはずなので弄ってみましょう。
テンプレート化を進めよう
headerやfooterは大抵の場合、別のページと互換が取れています。その場合は、グローバルテンプレートとして保存し、呼び出すほうが後々の変更が楽になります。このとき、シンプルに作るよう心がけないと、読みにくくなるので注意。
デザイン周りで何かおかしい
MTでテンプレート化しすぎると、divタグの対応が取れていない事が起こりえます。終了タグとの関係を確認したり、vaildか確かめてください。
cgiなどのディレクトリがサブドメインから指定できない
まずは元のドメインのurlを使って絶対パスで記述しましょう。このとき、ドメインをまたいで呼び出しができないことがあります。そのときは、シンボリックリンクができるサーバであるかを確認し、それの実装を考えてみてください。
MT4でタグクラウドが表示できない
書式も正しいのに、呼び出した結果が空で返ってくることがあります。タグクラウドのプラグインを使用していたらサーバから削除してみてください。呼び出しのタグが干渉している可能性があります。
MT4でgoogleのように、100件中10件表示、次の10件、などの分割表示をしたい
ブログで当たり前の表示ですが、MT4では初期設定では少々手間なようです。MT4.0でページ分割する - Kishunaを参考に、プラグインを入れましょう。
MTだけで設定したいのなら、検索結果ページのページ分割 | Movable Type 4 ドキュメントを読みましょう。
MT4で、検索は動作するが思うように表示できない
設定しだいではMTで管理する全てのブログが検索範囲に該当します。検索結果ページのカスタマイズ | Movable Type 4 ドキュメントを読んでみてください。

12~17:html周りの注意事項

設計を先に行おう
どんなに小規模のサイトでも、できる限りどこまでの実装になるのか判断を先に下したほうが絶対に楽になります。
特に気をつけておきたいのは2点。ページごとに異なる表示をするdivがどれだけあるかがひとつ。もうひとつは、MTで共通化できるのはどこまでか、です。上で示したとおり、多分headerとfooterは共通化できるはずです。
まず最初に、雛形をコメントだけで書こう
律儀に実践しきる必要はありませんが、内部のコードが作りきれていない場合、cgiが動くと困る等の理由で後々実装する場合、それらはコメント行で入ることを明記しておきましょう。そうすると忘れずに実装でき、その際にコメントを消すだけでいいのです。
IEでfaviconが表示されない
IEではfaviconの変換過程によっては表示されないこともあるようです。生成サービスなどを変えて作ってみましょう。
Firefox、safariでfaviconが表示されない
一度キャッシュされてしまうと、二度目の読み込みがなかなか行われていないのかもしれません。アップロードしたfaviconをリネームし、ファイルを指定しなおしましょう。
cgiが動作しない
属性を確認してください。また、そのディレクトリの属性も確認してください。
divが多くなってしまう
もしかすると、cssでdisplay:block;と指定することで必要がなくなることもあるかもしれません。
アップロードした画像が読み込めないのですが
localでは読み込めていたものが、webサーバで読み込まれないのは、拡張子の大文字小文字がhtmlの指定と一致していない可能性があります。

18~32:css周りの注意事項

cssの変更が楽な書き方
必要以上に親要素から指定すると、優先度が複雑になり後々の変更が大変になります。そのページのbodyにidを振ることで、別のフォーマットのページと干渉しにくくできます。
Style Resetをしよう
初期値ではブラウザのdefault cssで表示に差が出やすくなります。設定しておくと後々表示チェックが楽になります。
grobal.cssを作ろう
aの要素などは、たいていtext-decoration:underline;など、多用するものがあるはずです。そう予想されるものは、最初に指定しておきましょう。
cssがどのブラウザから見てもキャッシュから読み込まれる
キャッシュサーバを使用していることが考えられます。wilcomのMEGAPLUSなどがそれにあたります。
よくわからない人は、面倒かもしれませんが、cssをリネームし、htmlもそれに対応付けてください。
IE6で幅(余白)が狂う
floatで指定した方向へのmarginをやめてください。親要素で余白を確保するか、paddingで代替しましょう。
float以後が狂う
floatしたブロックの次の要素をfloatで右か左か指定してください。そうでなければ、clear:both;
それでも狂う
htmlが間違っているかも。vaildか確認してください。
要素の幅、位置を確認したい
その要素に、outline:1px solid red;と即座に書き込んでください。赤枠が表示されます。
上の通りに書いたけど動かない
!importを;前に書き込んでください。優先的に扱われます。それでも表示されない場合は、htmlの要素値かcssの指定が誤っています。動いたのであれば、現状cssの優先度が低く、他の指定に上書きされています。
フォントがおかしい
メイリオですか?フォントサイズと上下に確保されているピクセルが、従来のフォントと大きく異なります。cssによる装飾の際、border-bottom:1px solid;で不満があるのであれば、text-decoration:underline;で代用してください。
メイリオを使っている
フォントがインストールされていない場合、上の都合で表示されるフォントサイズやマージンが大きく異なる場合があります。確認しておきましょう。
タグクラウドのli要素の回り込みはどうやっているの?
display:inline;です。
fontプロパティは指定できるが、colorが指定できない
div等ではなく、直接aに指定してください。
IEで画像がぶっ飛ぶんですが
position:absolute;をやめてください。それを使わないでどうにかできないか考えてください。
IE6と他のブラウザで画像の色が違うような気がする
pngの色が変わって表示されている可能性があります。jpg、gifなど別の拡張子に変えてください。

33~36:その他製作について

cssの表示確認が面倒なのですが
firefoxのアドオンのWebDeveloperを使ってみてください。cssの記述と表示確認を同時に行えます。
たまに別のタブで読み込んでいると、読み込み完了とともに、エディタがリセットされることがあります。頻繁にコピペして保存してください。
画像が表示されないのですが
webで直接編集すると、background-imageが表示されないことが多々あります。ローカルでhtmlごと保存して、変更した後にアップロードしてください。
cssについて
MTでテンプレートとして出力するよりは、直接FFFTP等で保存したほうが早いです。
間違えてhtmlやcssを上書きしてしまいました。
もしあなたが複数のブラウザで表示を確認したり、ページ遷移を繰り返しているのであれば、そのページに戻り、ソースを表示することで復元できるかもしれません。

最後に

webを参考にするときも、それが問題と気がつくまでに時間がかかること、そして一つ一つの解法はあれど、問題と認識するたびに検索しなければいけないこと。それが僕は嫌いです。そのために、素人が素人に贈るテクニックがあってもいいはずと考え、本エントリを起こしました。一人の製作中に頻発するミスが、誰かのミスの答えとなれば幸いです。

2008年11月 2日

Web:新サイトCarpediem!、始めました!

絵用のサイトとして、新たに「Carpediem!」を制作しました。制作期間5日間のうち、前回までのミスから学習したことや、雑感などを書き留めます。

Carpediem!TOP
トップページ。必要以上に情報を載せないことに気を使いました。

いたずら描きから18禁絵までを今後掲載していくCarpediem!のトップは以下のリンクから。
Carpediem!http://carpediem.libertatem.org/

Carpediem!を作るまでの思考プロセス

着手前

本当はLibertas一本でやっていきたかったのですが、遅かれ早かれ、一般的な内容を扱うblogサイトと同人サイトの雰囲気は反発するな、と思っていました。それが最近になって、ついに別サイトを作ろうという強い意志に変わったので、制作し始めることにしました。

Libertasの規模の大きさから学んで、実力的に完成しきれないものは作りたくなかったことと、絵サイトに特化した(正確に言えば絵サイトにデザインされた)web制作というものを真剣にやってみようと思いました。

そのためにまず、自分で一からデザインして作ることをやめました。所詮僕程度のオリジナリティですから、気持ちを変えて他人のデザインから学んで、作り変えることで完成は出来ないだろうかと考えました。

次に絵サイトとしての目的を考えました。本来の目的のみの実装にすれば一つ目の目的も手間がかからないために達成できることもあります。(実際のところはまだ詰めれると思っているのですが......)絵サイトはシンプルであることが、もう何度も言っていますが重要であると考えています。ただ、簡素なだけといってしまうと例えば、画像を左そろえで列挙がありますが、あくまでも作る側の視点ではwebサイトとしては不完全に思えます。それは、ミスマッチした額縁に絵を飾っておくことと同義に思えます。理想としてはひとつのサイトとしての一貫性を維持しつつ、シンプルに絵を見せることが重要なはずです。

以上の2点が製作前に漠然と考えていたことです。

製作を始めてから

テンプレートはMovable Type4に付属してくる「tristan-blue-4.2」を使用することにしました。若干崩れていますが、外観は次のようになっています。
tristan-blue-4.2

最初見たときは、いまどきのblogから離れて、シンプルなものだと感じたので、これを使おうと思いました。しかし、htmlを見たところ7重のdivが出現。作り変えることにしました。そのほかにも問題がありましたが割愛します。

シンプルフォーマットで特に参考にしたのは、膣外射精さんの見せ方と、サイトで使われているテンプレートです。人によってはまんまパクリだろ、と思う方もいるかもしれませんが、それは後ほど説明。

実際に作り変えるに当たって、僕が直面した障害や、新たに技術的に用いたテクニックは「初心者~中級者のMTによるサイト製作で抑えたい36の項目」で列挙しましたので、それは省略します。

今回のデザインにあたって詳細

先に膣外射精さんのサイトとの差別化について。僕はあらかじめwebサイトとしての機能を充実させることを念頭においていました。そのために、画像へのアクセスを容易にするためにタグクラウドと検索を実装しました(実装といっても技術はさして必要ないので、デザイン上の取捨選択なのですが)。また、内部的な話ですが、本文として文字を表示することがない前提での製作をしています。所詮絵サイトだから、いっそ言葉は要らないだろうと、そう思い切ってやってみました。ただし、同人サイトとしての形も持たせるために、拍手返信のフォーマットは作ってあります。

いってしまえば上記のことだけでしか、表示の差はない、ともいえます。絵サイトのシンプルというのは、現状、タイトルと日付、その他小項目いくつかか��%

About Site製作

ブログ「Libertas」のカテゴリ「Site製作」に投稿されたすべてのエントリーのアーカイブのページです。過去のものから新しいものへ順番に並んでいます。

次のカテゴリはWeb小話です。

他にも多くのエントリーがあります。メインページアーカイブページも見てください。

Creative Commons License
このブログは、次のライセンスで保護されています。 クリエイティブ・コモンズ・ライセンス.