WEB制作者のための32個のブックマークまとめ（part2）*ホームページを作る人のネタ帳

WEB制作者のための32個のブックマークまとめ（part2）

スポンサードリンク

前回ご紹介した
今押さえておくべきWeb制作に役立つ37個のブックマークまとめ
と一緒にあわせて使うとより強力になるかもしれません。

前回の記事のあとにみつけた32個のブックマーク集です。

WEBツール

CSS Dock Menu

マックのドックのような動きをするインターフェイスタブをあなたのページにつける事が出来るツール。動きが滑らか。

Dynamic Page Flip v2 from shift+control

本をぺらぺらとめくるようなイメージギャラリー。
これはかなり見た目インパクトが強い。
画面中央左の『Download the source files』のところで無料でダウンロードできる。オリジナルのカタログもつくれそう。
ためしに使ってみたけど、RSSパーサーと組み合わせると、ページにRSS受信も出来た。アイデア次第でなんでもいけそうですよ。

10 Free CSS Graph Resources

無料のCSSグラフライブラリ10選。
一つだけチュートリアルつくってます。
Ajax・CSS・PHPで簡単に棒グラフが作成できる『Ajax MGraph』
棒グラフ表示をお求めの方に。

Dynamic Ajax Tabs in 20 Lines

20行で使えるAjaxタブインターフェイス。（phpspot開発日誌）

~~YouTubeのサムネイル画像をクリックするとそのページ内で動画を開く~~Ajax
YouTube

YouTubeのサムネイル画像をクリックするとAjaxによって同一ページ内にムービー再生用テーブルが生まれる。
かなり素敵。
（2007年10月23日削除処理：アダルトサイトになってました（苦笑））
追記、ようやく普通のサイトのアドレスを見つけました・・・。
http://videobox-lb.sourceforge.net/

同一ページ内にイメージでもサイトでもなんでも呼べるAjaxライブラリ

これは上のYouTubeのさらにすごいものだ。
色々なサイトに使えそう。
あとは使いどころをアイデアで勝負ですね。

2.0式反射効果をJavascriptにやらせるライブラリ

上のような反射効果を、Javascriptにやらせてしまおうと言うライブラリです。
あらかじめJavascriptを読み込んでおけば、imgタグにclass="reflect rheight30 ropacity60"と付け足すだけで反射効果が得られる。rheight30が画像の高さでropacity60が画像の透明度です。

お気に入りの画像を立体的なドット絵にしてくれるサービス

しくみがどうなっているかわからないけどとにかくすごい。
ドット絵の画像を作り出してくれます。

背景用のストライプを生成してくれるジェネレータ

ちょっとした操作で背景用のストライプを生成してくれる。
英語だけど操作が簡単なので誰でも使えそう。

６つのフェイスが選べるページをめくるような間隔のライブラリ
上で紹介したページめくりライブラリよりも、硬い本のイメージですね。

Yellowpipe - HTML converter: HTML to PHP, HTML to Javascript, HTML to ASP
PHP、HTML、Javascript、ASPをそれぞれ変換できるサービス

アイコン

Icons, Buttons and Templates | Smashing Magazine

もうめちゃくちゃすごいアイコンまとめ。

2007年上半期人気無料アイコン配布ページ３１個のまとめ。その数17000個以上
私のアイコンまとめ。

ユニークなアイコンが異常なクオリティの高さを誇るアイコン集サイト『WEBSITEICONS』
ユニークで面白いものが多い。
商用は禁止っぽいですね。

PhotoShop関連

virtualPhotographer

ボタン一つで画像に様々なバリエーションを加える事が出来るプラグイン。

Flaming Pear

多くのエフェクトをフリーで配布している。

Free plugins for Adobe Photoshop, Paint Shop Pro and Adobe Premiere

69個の独自エフェクトが使えるようになるプラグイン。

Top 50 Logo Design Tutorials

50個のロゴのチュートリアル。
勉強になりますね。

Free Plugins for Photoshop

フリーで使える色々なエフェクトプラグイン。
左のサイドメニューから選ぶと、ビフォーアフターでわかりやすく説明されている。
ちなみに上の画像のプラグインはこのページ

Ultimate Web 2.0 Gradients - FREE Download

PhotoShopで、簡単にWeb2.0風ボタンが作れてしまう無料グラデーションファイル。
インストール方法は紹介もとのデザインウォーカーさんでどうぞ。
DesignWalker

Ultimate Web 2.0 Layer Styles - Free Download

上のグラデーションファイルとは違い、レイヤーファイルとなっている。
ボタン作成はこちらの方が圧倒的に使いやすい。

テンプレート

Faux Column CSS Layouts

フリーで使える42個のCSSテンプレート。勉強用にも使える。

Open Web Design - Download Free Web Design Templates

前回紹介したときに比べさらに150ほど増えている。
全部で2300近くあるHTMLテンプレートサイト。無料で使えるのがありがたい。勉強の為には是非ともここがお勧めかも。
ダウンロード方法は以前私が書いた記事で。

フォント

500個のフリーで使えるフォント集

見ているだけでなんだか楽しいフォントが多い。
ただディズニー系はなんとなくグレーゾーンな気がしてならない。

9800個のフリーフォント集

上のABCDEFと並んでいる文字をクリックすると左側にどばっと出てきます。

人気フォントが探しやすいサイト

Amebaビジョンのように、フォントに対する良い悪いという評価がつけれるから人気フォントを探しやすい。
こういうアイデアは今後役立てていきたいものです。

フォント投稿サイト

投稿されたフォントは無料でダウンロード可能。現在12000以上のフォントがある。

テクニック

CSSを使ったテキストをデザインとして魅せるテクニック集:phpspot開発日誌
これは結構アイデア次第で使えそう。

PHPを使用してCSSの色をコントロールする - PHPプロ！ニュース
このあたりは覚えておいて損は無いかも。

Photoshopの無料シェイプを使って簡単にアイコンを作る方法
無料シェイプは結構使えますね。

新ブログ：ITクオリティもよろしく。
スポンサードリンク

はてなブクマ

私の他のブログの更新状況

RSS表示パーツ

» Photoshopちょいテク『惑星を作ってみよう』＋360度パノラマ画像も作れるように
» 最近、ブログを書いている途中に筆が止まる理由がわかった気がする
» ブログエントリ別に見る『注目度10の法則』
» 天才という言葉は、生きている人にいう言葉じゃない気がする
» まるでphotoshop！JavaScriptで実装するクールなカラーピッカー[prototype.js]
» 今後の期待度が高いphotoshopブラシまとめサイト『Quality Brushes for Photoshop』
» FLASHサイト作成インスピレーションの参考になるflashサイト7つ
» あの時、何気なく吸い始めた一本のタバコの値段が900万だと知ったとき
» jQueryサンプル公開後の反省会。みなさんからのアドバイスを5本サンプル化
» [追記]数百件先の画像まで一気に検索してしまうインターフェイスを搭載したfirefoxアドオン
» プロとアマの違いってぶっちゃけたったひとつ
» 一晩で覚えるjQueryの逆引き基礎サンプル7つ
» あなたは大丈夫？知らず知らずのうちに感じている10のパソコンストレス
» よごれた感じのフォトショップチュートリアルとブラシ
» 第2回web開発者インタビュー。マチウケメール便開発者『開発環境はeclipseです！』