前の日記で延々と(笑)、私の体験を書きましたが
その際、調べて参考にさせていただいたサイト様のリンクをはっておきます。
私たち外注、またはフリーのデザイナーが知っておくべき事項。
取引先が言ってくるであろう事項など
自分自身だけでなく、相手にとってどういう法律があり
また、自分のためにどういった法律があるのか、知っておくのはとても大切なことだと思います。
お互いが尊重しあい、良い関係を保つために
諦めず、互いに納得する方法を見つけられる手助けになりますように・・・。
著作権法・著作者の権利
http://www.houko.com/00/01/S45/048.HTM#s2
著作権法・著作人格権
http://www.houko.com/00/01/S45/048.HTM#s2.3.2
著作権法・著作に含まれる権利の種類
http://www.houko.com/00/01/S45/048.HTM#s2.3.3
著作譲渡契約書のポイント
http://www.geocities.jp/gut_expert/kei-transfer.html
著作委託契約書のポイント(通常、HP作成依頼などは譲渡ではなく委託になります)
http://www.geocities.jp/gut_expert/kei-commission.html
業務委託契約や請負契約における、著作権の取り扱い
http://blogcopyrightguide.seesaa.net/article/5028921.html
クリエイターデザイナーの方へ
http://izu-office.blogdehp.ne.jp/category/1184484.html
デザイン事務所経営者の方へ
http://izu-office.blogdehp.ne.jp/category/1184486.html
ホームページ製作者の方へ
http://izu-office.blogdehp.ne.jp/category/1184483.html
役務の委託取引における優越的地位の濫用に関する独占禁止法の指針
http://project.epzhplab.com/p_3_copyright.html
http://www.icnet.or.jp/kakonokiji/16ekimukaisei.html
JAGDA
http://www.jagda.org/cf_fee.html
ライツマネージド
http://stockphoto.jugem.jp/?eid=101
事務の派遣社員が会社でイラストを描く場合の著作権放棄について
http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1412224014
現在フリーランスのデザイナーとして活動させて頂いていますが
フリーとは名ばかりでw 実際には外注スタッフ、外注デザイナーとして
Webデザインやコーティングのお仕事をしています。
今から書くことは、契約書についての私の体験ですが
書くのは、他のデザイナーさんが個人で制作会社などから
外注スタッフとして契約する場合に、気をつけておかなければならないことで
私の経験が他の人の役に立つかもしれない、という思いです。
また、これから書くことは私から見た一方的な意見ですので
相手側からみれば、また違った意見もあると思います。
ですので、1つの意見、として読んでください。
まだ仕事を初めて期間が短く実績も少ないため
お声をかけていただいた方々に感謝しつつも
その中の1つに契約書についての疑問点があったので
見直しのお願いをしました。
直接私が見直すキッカケとなったのは、同じ依頼者A氏より
数回お仕事を請けたことがある、私の友人でもあるBさんのデザインが
私のところに回ってきたことがキッカケです。
この案件については、ヘッダ・フッタ・ナビなどがあり
トップページが完成しておりました。
しかし、その他のページのコンテンツ内容はまだ制作されておらず
私に情報を渡すので、コンテンツ内容を入れて欲しいといったものでした。
そういった、他の方がデザインしたものを中身追加するというのは
今までにもありましたが、それは依頼者A氏自身がデザインしたものを
私に手を加えて、いい感じに改変して欲しい、中身も追加して欲しいというものだったので
いつものように、誰がデザインしたのか?と聞いたところ
私の友人Bさんの名前を挙げました。
私としてはどうして私に言うのか疑問でしたが
友人のBさんが断ったか、また時間がなく手の早い私に言ったのかと思っていました。
しかし、その案件を見たら、どう考えても書き出しにくい・・・・。というか無理。
これは本当に友人Bさんのデザインなのか?と思えたので聞いたところ
依頼者A氏が手を加えたとのこと。
では、書き出しを考えてデザインしたのか?と聞きましたが
「考えなかった」というお答えでした。
びっくりしましたが、依頼者もデザインの経験はかなり少ないので
仕方ないかと思い、私が書き出しやすいように改変後、中身コンテンツをつくることになりました。
帰宅後、Bさんに連絡し、本来どういうデザインだったのか
どこをどう変えて、あんな変な変形になったのかが知りたくなり
お願いして最初のデザインを見せてもらうことにしました。
デザインを見てみると、まったく違うものになってたのがわかりました。
基本的な使用している色は同じですが、トーンが違うし
形も変な変形ではなく、書き出しやすいデザイン。
それにまったく印象が違ったものになっていました。
Bさんの話では、データ提出後はその仕事は終了となっていて
私のところに来て、私が聞くまでこの改変を知らされていなかったそうなのです。
私はこのことを目の当たりにし、あまりに違うものだったので
私が同じことをされるととても嫌だと感じたこと。
また、同じ依頼者A氏と仕事をしている限り、私もデータ提出していたので
同じことをされる恐れがあると思い、契約書を見直したのです。
契約書にはその著作について下記のように書かれていました。
****************************************************
<成果の権利及び知的財産権の帰属>
本件業務に基づき乙(私)が甲(依頼者)のために作成した成果物
(中間成果物も含む)及び役務の提供の結果、発生した著作権及び
その他の無体財産権は、本件業務事前に乙が既に保有するものを除き、すべて甲に帰属し
その権利は乙から甲に無償で譲渡されるものとする。
前頁の規定に従って乙から甲に譲渡される権利は、著作権法第27条(翻訳権、翻案権等)
及び第28条(2次的著作物に関する原著作者の権利)に規定される権利を含むものとする
乙は成果物に対する著作者人格権の権利を行使しないことを合意する
乙は、甲の書面による承諾を得るか、もしくは別途合意をしなければ
成果物の全部あるいは一部及びその複製物を保有し、利用するものはできないものとする。
****************************************************
私には何の権利もなく、また中間成果物に関しても無償で提出。
改変されても文句は言えず、またサイト制作時に描いた主要となるようなキャラクターについても
何の権利もありませんでした。
これではあまりに酷い、一方的だと思ったので、見直しをお願いした、というのが経緯です。
私からお願いした契約は以下のものです。
1)著作者人格権は私が保持。(特約はなしにしたい。)
2)元データをお渡しする場合には相応の料金請求したい。
(デザインこそ、努力とアイデアの塊なので・・・)
3)著作権はインターネット上に公開する目的での使用権と
公開や更新に伴う変更(改変権)のみを譲渡。
4)制作物を自分が作ったと公開したい。 (自サイト実績に載せるため)
5)複数出して採用されなかった案に関しては、全て私帰属にしたい。
6)サイト制作上、作ったキャラクターなどのイラストについて
二次的著作物の利用に関する原著作者の権利を譲渡しない。
7)著作権を全て渡す場合には、見合った料金のお支払いをお願いしたい。
依頼者A氏からの返事では、時間がかかるが契約書を見直し
お互いが納得できるものを作ろうというよいお返事が来ましたが、その中で
依頼者自身の基本的考え方にも触れられていました。
それは、
1、日本の現状の著作権法は紙の時代にできたものであり、
デジタルを想定していない。
2、発注者の考え方として、「ホームページは買ったものであり所有権は発注者にある」
3、発注者の立場に立てば自分のHPを自由に変えられないと言うのは、まったく不合理。
4、依頼者が顧客と結ぶ契約も私と同じものを使用。
契約に詳しいクライアントからは良心的な契約であるとの評価を得ている。
というようなものでした。
実際お会いしてお話しましょう、という話になりましたが
私の考えでは、依頼者A氏の基本的考えというものが
納得できるものではなかったですが、こちらにも著作権というものの知識が不足していたので
お会いするまでに、私の主張を補助する資料なども揃え席につきました。
私の考えでは
依頼者の言う
「発注者の考え方として、「ホームページは買ったものであり所有権は発注者にある」」というのが
「買ったものは俺のもの。何しょうが勝手」というものであり
それはイコール、手を加えてもいい、という考えですが
私としては、買っているのは、あくまで「インターネット上でHPを公開する権利のみ」で
著作物はそういう性質ではない、というものをご理解いただきたい、と思ったのです。
またA氏は
「発注者の立場に立てば自分のHPを自由に変えられないと言うのは、まったく不合理。」
ということを主張していますが、実際に以前、あるクリニックのホームページのリニューアルの依頼を
受けたときに、元の作成者が著作権を盾に拒んだことがあるそうです。
私としてはリニューアルならば、それまでのサイトデザインを破棄して
新しくデザインするべきで、元デザインを変形し、他のもののように見せて
リデザインするなどはそんなことをしようとするから拒否されて当たり前だと思うのです。
ましてや、他のデザイナーにそれをやらせるようなら言語道断だと思いました。
(元デザインを使って、他のデザイナーに頼もうとしてたのかは不明です)
でも、A氏は「では、サイトのロゴや、住所、中の文言などちょっと変えたい時でも
その製作者にいちいち連絡し、クライアントに確認し、というような面倒な作業工程をふまなければいけないのか?
そんなことにお金を払わなくてはいけないのか?それではあまりに、クライアントに不合理だ」と仰いました。
私はそのための案も提示していましたが
それでも、その「ちょっとした作業」というものが私たちの「更新料」となり
それが仕事なのだとお伝えしましたが、ご理解いただけませんでした。
私の提示した追加案は
1.ヘッダ・フッタ・ナビボタン・タイトル画像・ロゴ・背景色及び背景画像等の色調変更可能。
ただし、トーンは同調のもので。
2.ヘッダ・フッタ・ナビボタン・タイトル画像・背景画像などの大きさ(幅及び高さ)の変更可能。
※書き出し時やコーティング作業に考慮。
ただし、変形(パスのアンカーポイント追加や、劣化の伴う画像の著しい変形)は不可
3.ヘッダ・フッタ・ナビボタン・タイトル画像・背景画像などの効果は保持。
4.名前・住所・電話などの基本的情報変更の場合、変更可能。
画像の場合、フォントは同じもの(もしくは似ているもの)を使用。
著作人格権の中の、同一性保持についての中にも
「著作物の性質並びにその利用の目的及び態様に照らしやむを得ないと
認められる改変」が認められている。
5.サイトのデザインや内容、クライアントの仕事の内容に変更ない場合でサイト名のみ変更の場合は変更可能。
画像の場合、フォントは同じもの(もしくは似ているもの)を使用。
著作人格権の中の、同一性保持についての中にも
「著作物の性質並びにその利用の目的及び態様に照らしやむを得ないと
認められる改変」が認められている。
6.ロゴ差し替えの場合、変更可能。
7.キャッチコピーや、その他文言を変更可能。
画像の場合、フォントは同じもの(もしくは似ているもの)を使用。
8.サイト制作時に発生したイラストは、大きさ変更可能。
これで十分対応できるものだし、わたしとしては譲歩したつもりでした。
が、それでも法律にかなり明るいA氏はその「ある程度」とか「やむを得ない場合」とか
そういったあいまいな表現が、互いにその認識に相違があった場合
もめる元だと考え、契約書を変えるけれど、それには膨大な時間と手間がかかり
1つ1つの可能性のある事柄について、取り決めを行うべきだと言われました。
例えば・・・・クライアントがHPを作りました、というようなサイトをコピーしたものを
クライアントの店舗などに掲示した場合、その場合は2次的著作物の利用を制限していると
そのコピーさえもダメなことになる。だから、そういった細かいこと1つ1つを取り決めようと・・・。
正直、ここまででもうんざりしていました。
それだけ長い契約書になるんだ・・・・と。
もう契約書のことは諦めかけていましたが、それでもデータについては
渡すと勝手に改変されそうなのでwそれだけは阻止したいと
データについて無償提出は拒否。提出はデータ料金を請求、と言いました。
今までお仕事させていただいて、データも求められるまま提出していましたが
データ料込みの価格ではなく、作業料と考えて適正なお値段でした。
でもこれにも納得していただくことができず
A氏曰く、「凄い凝ったデザインでも、あまり凝ってないデザインでも同じようにお金を出すのか?」
「凝ってないものにはお金は出せない」
「美術品でも、有名なものは高価な値段がつくが、そこらへんの小学生が書いた絵に金を出すのか?」と。
私の考えでは、もちろん有名なデザイナーさんになれば価格も跳ね上がりますが
それはデザイン料。
上手い下手、加工が凝る、凝らない、センスのある、なしに関わらず
データを渡すことは、著作権ごと渡すということにもなるので
払って当たり前なのだ、と申し上げたにもかかわらず、やはり納得いただけませんでした。
その他にもいろいろ話しましたがすべてのことについて平行線でしたが
A氏は時間はかかるがいい契約書を作ろうと前向きでした。
私はすっかりうんざりした気分になっていて、もうお仕事はお断りしたい気持ちでしたが
メールで「ぜひ、引き続きお仕事をお願いしたい」と来ており
私だけの意見では聞き入れてもらえないと思い、他のデザイナーさんのご意見もお伺いしました。
現在私が通っているスクールの講師は現役のデザイナーさんですので
その方たちに事情を話し、それが普通なのか、
そういわれたら、どうしたらいいのかなど聞きました。
講師にはその依頼者と、今後どう付き合っていきたいかによる、と言われましたが
いろいろ意見を聞いて自分なりにも考え以下のような
メールをA氏に送りました。
**************************************************************
あれからいろいろ考えまして、また講師の意見を聞いたりしておりました。
私なりにいろいろ考えたのですが、依頼者がAさん、ということもあって
悪用される恐れがないこと、また初めの契約の時点で
デザインにこだわる場合とそれほどこだわらない場合に分けるというのは
不可能のように思います。
というのは、Aさんからのデザインのたたきをもらって
それを改変したりする(○○様や、▲▲様のような)作業については
あれは私のデザインではない、と思っていますので
どう改変しようとこだわりなどはないのですが
自分のデザインについてのこだわる、こだわらないについては
そのサイトにもよりますし、クライアント様からの注文にもよりますし
その時々で変わってくるものだと思うからです。
ですので、サイトデザインについては今後はデータも含めお渡ししますが
採用されたものについては他の案件(サイト)で使用しない、とだけ記載してください。
そんなことはないのはわかっていますが
例えば頂いた案件としてデザイン後、採用、データ提出されたものが、他の案件に使われていたり
名前を変えてコピーされていたのでは困るので
頂いた案件で、使用することを書いて下さったらそれでいいです。
ただ、数件案件を出して採用されなかったものに関しては
私の帰属のままにしておきたいですし、その時点ではデータはいらないと思います。
例えば、あるサイト制作の依頼が来て
私が数件のデザイン案を出したとします。
それを提出、クライアントが思案する、という段階ではデータはいらないはずです。
GIFやJPGで書き出してお渡しすればいいだけのことですから。
その中で1つデザインが決まったらそれで進行すればいいのですし、
そのデータが欲しいならお渡しします。
それなら、他のデザイン案は私の帰属のままにできると思います。
それと、自分のHPをたちあげるつもりでいますので
私がデザイン、またはコーティングしたお仕事に関して
私がやりましたよ、と公開できるようにして欲しいです。
もちろん、サイト制作時にはそんなことはしませんが
サイト公開後は私が制作した実績として記載したいので
その部分を認めていただきたいです。
あとはもういいです。
ただ、製作中、もしくは制作前の段階で、キャラクターを作る
もしくは、クライアントからの要望が多く、結局何度も手直しして
作ったようなイラストやキャラクターについては
それはまた別問題ですので、それはイラストとしての契約が必要になると思います。
イラストと、サイトデザインでは扱いが違うというのは
一致した意見でしたので、そのあたりはご理解いただけると思います。
私が常々不思議に思うのは、なぜ一人の人に最後まで任せないのか?ということです。
○○さまに関しても、あれはBさんが元デザインだったはずです。
修正があったり、あがってきたものに不満があるのなら
こうして欲しいと要望するなり、もっと加工して欲しいというなりして
彼女にデザインをやらせることもできたはずです。
でも、実際はデータ買取でAさんが手を加えましたよね。
その中身は私がやりました。
デザインは美術品でも家でもなく、デザイナーにとってはアイデアの塊です。
それがたとえ、凝ったものではなかったとしても、
またセンスのある、なしに関わらず、本人にしてみれば
頭を抱えて悩んであげたものなんですね。
それを、勝手にデータを買い取ったからと言って好き放題にするのは
傲慢だとさえ思うのです。
例えば、アイデア商品のようなものです。
よくスーパーなどで売っているアイデア商品ですが
手にとってみれば、なんでもない商品でも、また高価な部品を使っているわけでなくても
そのアイデアこそが命なんですね。言うなれば私たちデザイナーがアイデアをの命としてるのと同
じです。
それを見てこんなの私にでもできると思ったり、それを勝手に改変して売るのは
コロンブスの卵で、おかしいと思うのです。
世の中には模造品がありますが、公開されたサイトデザインを他の人が見て
真似ることはやめさせることは無理だと思いますが
アイデアの塊であるデータを元に、勝手に改変するのはどうなの?と思うわけです。
サイト名が変わるとか、ロゴが変更されるとか
そういった問題ではなく、デザインしたものが変わってしまって自分で変えるのは納得の範囲ですが、
自分がクライアントから、また依頼者から「変えて」と言われたわけではなく
自分のしらないところで変えられるのは、ある程度は許容しても、
「どうして自分に変えさせてくれなかったんだろう?」と思って当たり前だと思うのです。
Bさんのデザインについても、なぜ彼女にしてもらわなかったのか、それが疑問でした。
また、講師のCさんと、Dさんに聞きました。
やはり通常データは渡さない、というお話でした。
ただ、クライアントによっては欲しいといわれれば渡す、と仰っていましたが
それでも、1枚絵で渡すとか、改変できないような形にする、とのことでした。
なぜ、そうするかはおわかりいただけると思いますが
それが企業秘密だからです。
どんな効果でどういう風にしたのかは企業秘密なんですね。
例えば、Aさんの立場が仕出し屋さんだったとします。
お客さん(クライアント様)から注文があり、自分のところでやろうとしました(社員デザイナー
)
けれど手が足りないので、外注して工場や、それ専門業者に頼んだとします(外注デザイナー)
その外注したものが届き、お客さんにお渡ししましたが
お客さまからの注文で、もっと味付けを濃くして欲しいだとかの注文があったとします。
そうしたら、通常はAさんの仕出し屋さんが、その外注業社にそのクライアントの意向を伝え
そのようにしてもらいますよね。
でも、Aさんのデータが欲しいと言われることは、その品物のレシピをくれと言ってるのと同じ
なんです。
こっちで味付けし直すから、レシピを欲しいと言ってるのと変わりないのです。
レシピは外注の商売道具です。
それが簡単に作れるものだろうと、手間隙かけたものだろうと関係ありません。
そのレシピを渡して勝手に知らぬところで変えられるのは抵抗があって当たり前だし
また、1枚絵や、改変できないような加工にしているのならともかく
どんな効果を使ってるのか、どう加工しているのか
それがどんなに大したものでなくても、コーダーさんに渡ればそれを見られてしまいます。
コーダー専門でされてる方もいるのは、いますが、大抵はコーダーもデザインはなさると思います
。
元データを渡すということは、改変されても文句は言えない覚悟だし
その企業秘密を公開することになるので
レシピを渡す料金=データ料別、ということになるのだと思います。
Aさんのご意見では、じゃ文言やサイトの変更の時には
クライアントに迷惑というか、手間がかかるし、いちいち料金を払うのか?と
言うようなことをおっしゃっていましたが
講師曰く、それが「更新料」として発生するものだし
継続的にそのクライアントとお付き合いしようと思うとそうなる、当たり前のことだとも聞きまし
たし
私もそう思っていました。
ただ、中には全権買取、という形で進めるクライアントもいるのはいるので
そうなれば、価格はデータ料込みということになるし
また、外注デザイナーがそのクライアントとどのようにつきあっていきたいか
仕事を継続的にもらえるかによって違ってくる、とは仰っていましたが。
それに全権買取となれば、「あなたはもう、用なし」と言われてるのと同じことなので
更新料が望めないならば、高めに言うこともありうる、とのことでした。
でも、私としてはこれからもお仕事を継続できるなら全権買取でもかまわないと
思っていますので、一番初めに書いた分だけお約束いただければいいと思っています。
しかし、fla(Flashの元データ)についてはまた、取扱が別のようです。
これは他の知り合いのデザイナーにも聞きましたが講師2人と同じ意見でした。
お三方曰く、flaファイルは他のサイトデザインなどとは違って、タイムラインがあります。
これこそがプログラムとなるわけです。
Aさんも、忘れてしまいましたが、どこかのプログラムについての話をされていましたよね。
システムは渡しても、その大元であるプログラムは絶対渡さないと。
あれと同じなんだと思います。
例えば、同じタイムラインを使って、はめ込んでいるものを変更して
他のものに変えてもそれはわからないんですよね。
だから、flaデータに関しては、どの方も絶対渡さないし
通常、提出も求められない、と仰っていました。
もし最悪渡すとしても、元データ料金を請求するのは当然だと。
その価格についても制作料の1.5~2倍でも安いくらいだと聞きました。
Aさんがこの業界の当たり前、普通は知らないけれど、と仰っていましたが
その業界に現在属していらっしゃるわけですし
その業界でご商売をされているのですから
「普通」や「当たり前」を全否定することはできないと思います。
私は友人だから言うのではありませんが
Eさんがデータの提出を求められ、データ料金を請求したのは不当ではないと思っています。
ただ、最初の契約時にデータを渡すことをお約束されていたのなら話は別ですが
彼女に聞いたところ、契約書には中間成果物の帰属については書かれていましたが
メールで先にswfでの提出でよい、と聞いていたと聞きました。
ならば、提出しなくてよい、と彼女は思っていたので、データの提出を求められ
アクションスクリプトを多用したわけでもない、と安くお売りしたのだと思いますよ。
ながくなりましたが、私の意見は初めに書いたものと、Flaについての取り扱いです。
・flaファイルについては基本的に提出はしない。
・サイトデザインの採用されたものに関しては、そのサイト様だけに利用すること。
・デザイン案として数件提出し、採用されなかったものに関しては私の帰属のままにしておくこと
。
・サイト公開後、私が関わった案件に関しては私の制作物として公表してもよいこと。
・またキャラクターや、クライアントから要望があったイラスト、制作過程で何度も修正を求めら
れたイラストに関しては
別途取り扱い。
これを了解していただければいいと考えていますので
A様の方でご検討よろしくおねがいします。
**************************************************************
最後に出てくるEさんですが、彼女も私の知り合いで
A氏からFlash案件をもらい、先にメールでswfだけの提出だけでよいか確認したところ
データの提出を求められたので、安く請求額を申し出たところ
予算がないとの理由で、値切られましたが彼女はそれを承知し契約書にサインをしました。
しかし、私との話し合いの席で、自分はデータごともらえるものだと思っていたのに
データ料金を請求され、びっくりした。
もう頼むと言ってあったので頼んだけれど、あんなふうに言われるのなら
あの人にはもう頼めない、と言っていたのです。
私はその場で、当たり前ですよ。彼女の方が正論だと言いましたが
それも納得いただけなかったので、Flaファイルについてもメールで書きました。
少し腹も立っていたので(笑)、酷い言い方をしていますが
それでも正論だと思っていたし、私がかなり条件を譲歩したので
これで納得してくれないなら断ろうと考えていました。
A氏から来た返事には公開についてのことが書かれていました。
他の要求は認めてくださいましたが、公開はクライアントの許可を得た場合のみとなっていました。
それはいいのですがその中で文中に下記のように書いてありました。
◇◇(私)さんのようなデザイナーにとってはデザインが命でしょう。
私にとってはクライアントが命であり財産です。
ですから、クライアントの信頼を失うようなことは絶対に避けたいのです。
これは私が懇々、切々とメールで言ったので
ご理解いただけた証拠なのかもしれません。
ただ、そう思うのなら、なぜ席に着いたときにそれをご理解いただけなかったのか
クライアントの利益ばかりを考えて、私たちの利益をそっちのけ。
A氏がクライアントがいて食べさせてもらってるように
私たちもデザインや、コーティング技術で食べているのに。
まだこの返事はしていませんが当分の間はA氏からのお仕事はお請けするつもりです。
A氏はデザイナーから制作会社を立ち上げた方ではなく
業界のことをしらないままされたのが問題だったのかもしれません。
今後は私も対応策を考えてはいますが
お仕事をぜひとおっしゃっていますのでいろいろ考えた結果です。
ただ、こういった著作権に関して、まったくの知識がなく
今回のことでかなり勉強になりました。
自分の身は自分で守ろうと強く思った出来事です。
長々とお付き合いいただきありがとうございました。
【追記】
次の日記にて、参考にさせていただいたサイトさまのリンクを貼っておきました。
Voxに普通のリンクではなくて更新状況がわかるブックマーカーがないかなーと探しておりました。
前から他のブログではBlog PeopleのTBP(トラックバックピープル)を使っていましたので
それを貼ったのはいいんですが、デザイン崩れまくり(笑)
仕方ないので見にくいですがプルダウンタイプにしたら大分マシになりました。
で、他のブログさんで最近よく見かける「あわせて読みたい」。
かわいいし、便利かなーとか、おもしろそうだなーと登録もいらないので
サイドバーに貼ったら全然ダメでした・・・。_| ̄|○
使えないVox。
こんな時にHTMLカスタマイズできるといいのですがね、Voxはそれがない。
残念ながら外してしまいました。
他によいサービスないかな・・・。
プルダウンは更新状況が見にくいのですよ。
TBPは便利なんだけど、これじゃ威力を発揮しないよね。
画像を背景にしてtext-indentでマイナス表示で、テキストを飛ばし
そこにアクティブなリンクを貼った場合、FireFoxでは、マイナス表示した先まで
破線が伸びて表示されてしまう。
その破線をなくしてしまう方法。
a{outline:none;}
これを追加すればOK。
コーディングを行う際、ブラウザごとの表示の違いを調整するために
ブラウザが持っている「バグ」を逆手に取って利用する方法俗にCSSハックと呼ばれているものです。
ハックには良いハックと悪いハックがありますが、実は使いたくないというより
ハックについての知識があまりありません・・。
実際あまり使わないので仕方ないんですが、それでもどうしても書式も、文法も間違いないのに
言うことを聞いてくれない(ほぼIEなんだけど。)時には知っておくと便利。
チームで作業する場合や、他の方がコーティングしたものを触る機会がある方など
知識としては入れといた方がよいかな、とは思います。
CSSハック・お役立ちリンク
marginを使った場合。
<dl>
<dt>ケーキ</dt>
<dd>洋菓子の一種</dd>
<dt>まんじゅう</dt>
<dd>和菓子の一種</dd>
</dl>
.dt{
width: 100px;/*dtの横幅*/
margin-top: 7px;/*行間隔*/
}
dd{
margin-top:-12px;/*マイナス指定で上に上げる*/
margin-left: 100px;
}
/*ineheight指定なしの場合。
line-height指定する場合はdt、dd それぞれの line-height 値の半分を足した値をマイナス */
他にもfloatを使ったものや、positionを使ったものがある。
以下、参考リンク様
img要素にaltを入れておくと、マウスを乗せたときにそのimgの説明として
altに書かれた文字がポップアップされるため
altは説明のためのものだと認識している方がいますが、そうではありません。
本来「alt」属性は
「画像、フォーム、アプレットを表示できないユーザエージェントのために、
代替テキストを指定する。代替テキストの言語は、lang属性で指定する。」
となっています。
画像非表示や、視聴覚障害のユーザー、音声ソフトを使用しているユーザー
また、何かの障害で画像が正しく読み込めなかったときに、画像の代わりに表示される
代替テキストです。
では、title属性はというと
「この属性は、当該要素に関する助言的情報を提供する。 」とあり
title属性を設定すると、視覚系か非視覚系かを問わず、
ユーザに対してその性質を知らせることができるのです。
ですから、altはMozillaやOperaではポップアップされず、title属性がポップアップされるようになっています。
たとえば
<img src="img/logo.gif" alt="Webなないしょ話" title="Webなないしょ話にようこそ" width="○○" height="○○" />
上記の場合、画像が表示できない、もしくは画像非表示環境の場合
altで指定した「Webなないしょ話」というのが画像の代わりに代替テキストとして表示され
title属性で指定した「Webなないしょ話にようこそ」という文字がポップアップされ
ユーザーに対して補助的な役割を果たします。
IEではalt属性とtitle属性が共に存在する場合は、 title属性値をポップアップするようになっていますので
両方指定しておくと良いと思います。
また、title属性は大半の要素に対して使用できますが、個人的にはあまり全部に入れてしまうと
ポップアップがうっとおしく(笑)なると思うので、img要素に入れることと、他は大事だと思われる見出しに入れておく程度で
いいのではと思っています。
alt属性、title属性について書きましたが
altについてはimg属性に指定する場合「必ず入れておかなければいけない要素」です。
もし意味のない、飾り的なimgについても「alt=""」と空白にして、ダミーテキストや
「青い線」など不要なものは書かないようにしてください。
フルスタイルシートで正しくサイトを作ろうとした場合
いくつもの壁に当たると思います。
それはやり方がわかないといった類のものではなく
こういう場合はどうすべきなのか?と言ったようなものです。
「正しい」と書きましたが、その「正しい」というのが、何に対して正しいのか
また、サイトを作る、ということ自体サイトを訪れてくれる外部に向けての情報発信でもあります。
ですので、訪れてくれるようにする必要もあるでしょうし
デザインも、それぞれの好みといったこともあります。
それらを考慮しながらWebサイトを作ることも必要ですし、またそれらがフツーになってきているからではなく
Movable TypeなどのブログツールやCMS(コンテンツ・マネジメント・システム)も
デフォルトからCSSレイアウトに基づいてページを生成するものが多いためキチンとした知識として
Web標準が必要になってきます。
<Web標準>
Web標準とは「はてなダイアリー」では以下のように記載されています。
「主にW3CやOASIS、IETFなどの標準化団体が規格化した技術仕様をWeb標準と呼ぶ。
またそれらの仕様に準拠したWebづくりの動きを指すこともある。
狭義ではWebデザインにおいて、HTMLを正しく使いCSSで視覚表現を制御する手法のことである。」
とあります。
砕いて言うと、W3Cなどが提唱する技術仕様(HTMLやCSS)で
どのブラウザでも正しく表示されるようにWeb作りをしていこうということです。
前記にわからない場合があるとかきましたが
W3Cの勧告通り作っていたとしても、1つのやり方ですべてが通用するわけではない
Web自体が進化途中。ということが一番の原因なのかもしれません。
例えば、h要素に画像を挟むことはありなのか。
ロールオーバーのCSS化でインデント、マイナス指定は?
メニューは文章構造的にリストなのか、段落なのか。
パンくずリストはリストなのか・・・・などなど。
h要素の画像配置や、ロールオーバーのCSS化はインデントマイナス表示で(もしくはディスプレイの非表示)
それはどこでもよく議論されていることですし、まだ結論は出ていませんが
どの視点からサイトを作るのかによって違ってきます。
デザイン優先なのか、SEO優先なのか、ユーザビリティ、アクセシビリティ
さまざまな観点から判断し、クライアントの意向も配慮しつつ
デザイナーが考えていくべきことなので、どういったやり方が他にあるのか、ということを
知っておくことはとても大切なことだと思います。
参考サイト
正しいHTMLやCSSを組む上で必ず理解しておかなければならない要素です。
<ブロックレベル要素>
ブロック要素は見出し、段落など文書を構成する基本要素となるものです。
ブロック要素の中には、別のブロック要素やインライン要素を含むことができますが
逆にインライン要素の中にブロック要素を置くことはできません。
※ブロックレベルに属する要素タイプでも、p要素タイプのようにインライン要素しか持てないものもあります。
ブロック要素は、ブラウザでの表示に際してもひとつの「ブロック(通常改行を伴う表示上のまとまり)」として扱われます。
解説によっては改行を伴う要素という言われ方をされますが厳密には正しくありません。
ブロック要素の例としては、見出し要素(h1~6)、段落要素(p)、リスト要素(ul、ol、li、dl、dt、dd)、テーブル要素(table)、
div要素(div)、ブロック引用要素(blockquote)、アドレス要素(address )、hr要素(hr)などがあります。
<インライン要素>
インライン要素は、主にブロックレベル要素の内容として用いられるもので
文書の構造を構成するというより、ブロックレベル要素内の特定の部分になんらかの役割や機能を持たせる要素です。
例えば、アンカー要素(a)や特定の語句を強調する要素(em、strong)などです。
l※多くのブラウザでは、em要素が斜字体、strong要素が太字体で表示されますが
ブラウザによっては違う表現をする場合があります。
これらは字体を指定する機能ではなく、重要性を強調するための要素なので間違えないようにしてください。
スタイルシート(以下、CSS)は装飾を行うための規格だといいましたが
ここでは記述の時に気をつけたい点をいくつか書いておきます。
CSSの記述は「 セレクタ{属性:値;} 」という方法で書かれます。
私もたまに手打ちをしていて間違いますが、必ずセミコロンとコロンを忘れないようにしないと
その記述は反映されませんので注意が必要です。
また、値には(px、%、em)も必要ですので忘れないようにしてください。
<セレクタについて>
セレクタには3種類あり、タグとIDとクラスです。
ID、クラスについては
IDはそのファイル内で1度しか出てこないスタイルに対して使うもので
クラスは何度でも使えます。
ですので、レイアウト用はIDで、デコレーションはクラスでやるとわかりやすいですが
厳密な使用方法などはないので、初めの慣れないうちはクラスのみでされてもいいと思います。
タグについては、HTMLで使うタグのことです。
代表的な例ではhがよく解説などで触れられていますが、hだけではく、p、a、table、tr、td、strongなどにも適用できます。
<属性と値について>
属性(プロパティ)と値については、非常に細かい設定ができるCSSですので
そのプロパティにも沢山の種類があります。
使用ソフトによってはヘルプ機能もあるので全部を暗記する必要はないですが
私がよく利用するリファレンスサイトを記しておきます。
>rerunさんコメありがとうございまし... read more
on 著作権の個人的なお話。