背景パターン・アイコン研究所 SUCHARAKA.JP

▼パターンを創ろう！

• パターンの概念
• 平面を充填しよう
• 平面充填の応用
• 特殊な充填

▼アイコンを創ろう！

• アイコンの概念
• ピクトグラム
• UIデザイン
• 色による誘導
• アイコンを使おう

ホームページを制作する時にあると助かる素材サイト（アイコン、イラスト、写真、背景）。素材紹介サイトみたいなものは結構見かけますが自分がよく使っている商用利用可の無料素材サイトや、利用の際の注意点、用語解説なんかを紹介していきたいと思います。
※ご利用の際は必ずご自身の目でライセンスや利用規約をご確認ください。サイトごとに利用規約も異なります。当サイトは一切の責任を負いかねます。

楽してプロっぽいサイトを作る

どんなにセンスのいい人でも素材が悪ければだっさい、素人っぽいホームページしか作れません。逆に、どんなにセンスがなくても何だか凝っているアイコンやイラスト、背景なんかを指定してあると割とプロっぽく見えたりするものです。

でも、いい素材を使って作ろうと思うとどうしてもお金がかかるでしょう？そう思ってはいませんか？最近では懐の広い人もいるもので、高品質にもかかわらず無料で加工や、商用利用が可能なものが結構あります。

そんなわけで、グラデーションがかかってたり、影がついてたり、綺麗に写ってたりする画像を使ってあなたも見栄えの良いサイトを作りませんか？

クリエイティブ・コモンズ・ライセンス

さぁ、かっこいい写真を使ってかっこいいサイトを作るぞ！と思って探していたら海外サイトに行き着いた。みたいな方もいっぱいいらっしゃるかと思います。

そこでまず行き当たるのが『クリエイティブ・コモンズ・ライセンス（CCライセンス）』だと思います。

クリエイティブ・コモンズ・ライセンスとは

クリエイティブコモンズ（Creative Commons）は、Web上で公開されている文章・映像・音楽・画像などの作品を利用する際、その作品の利用条件をわかりやすい形で表現しようというプロジェクトのことです。

CCライセンスはインターネット時代のための新しい著作権ルールの普及を目指し、様々な作品の作者が自ら「この条件を守れば私の作品を自由に使って良いですよ」という意思表示をするためのツールで、作者は著作権を保持したまま作品を自由に流通させることができ、利用者はライセンス条件の範囲内で再配布やリミックスなどをすることができます。

ライセンス（全4種）

CCライセンスは、一連のライセンス（利用承諾条項）を定義したもので、4つのライセンスオプションの組み合わせによって権利の範囲を設定できます。

表示(Attribution, BY)

作品のクレジットを表示すること

非営利(Noncommercial, NC)

営利目的での利用をしないこと

改変禁止(No Derivative Works, ND)

元の作品を改変しないこと

継承(Share Alike, SA)

元の作品と同じ組み合わせのCCライセンスで公開すること

これらの条件を組み合わせてできる基本的なCCライセンス（ライセンスオプション）は、ぜんぶで6種類。権利者は、自分の作品がどのように流通してほしいかを考え、必要に応じて適切な組み合わせのライセンスを選ぶことができます。

ライセンスオプション（全6種）

1. 表示　（Attribution） 　
   　原著作者のクレジット表記をすれば、二次加工して配布したり、商用利用してもよいですよ。
2. 表示＋改変禁止　（Attribution-No Derivative Works）
   原著作者のクレジット表記をして、かつ一切加工していないそのまんまであれば配布してもよいですよ。
3. 表示＋非営利＋改変禁止　（Attribution-Noncommercial-No Derivative Works）
   原著作者のクレジット表記をして、かつ一切加工していないそのまんまで、かつ非営利目的なら配布してもよいですよ。
4. 表示＋非営利　（Attribution-Noncommercial）
   原著作者のクレジット表記をして、かつ非営利目的なら、加工したものを配布してもよいですよ。
5. 表示＋非営利＋継承　（Attribution-Noncommercial-Share Alike）
   原著作者のクレジット表記をして、かつ非営利目的で、かつ原著作者と同じライセンスで配布するなら、加工したものを配布してもよいですよ。
6. 表示＋継承　（Attribution-Share Alike）
   原著作者のクレジット表記をして、かつ原著作者と同じライセンスで配布するなら、加工したものを商用利用してもよいですよ。

厳選素材

写真

stock.xchng

http://www.sxc.hu/
40万点の素材配布サイト。ライセンスは 写真個別ページの右側「Usage」から確認できます。要会員登録ですが、高品質の大きい画像がたくさんあります。

igosso

http://www.sxc.hu/
無料で商用利用可能なフリー素材を"世界中で利用されてい写真共有サービス「flickr」"から検索できるサイト。

アイコン・イラスト

Styraise.com

http://styraise.com/
国内サイト。PNGとPSDで配布。Photoshopのチュートリアルも有り。

Iconfinder

http://www.iconfinder.com/
69123個のフリーアイコンから検索できるアイコン検索専門サイト。

背景・テクスチャ

Ftg

http://ftg.projectdd.jp/
Fireworksのテクスチャ300種。国内サイト。シンプルで使いやすいです。

Kaliber10000

800個以上の背景パターンを入手できるサイト。ドロップダウンメニューの「View by name」から全種類を閲覧可能です。