WEBデザイナーのためのベストエントリ51個まとめ『2007年8月』

  • 2007/09/05
  • このエントリーをはてなブックマークに追加

スポンサーリンク

グラフィックデザイナー
2007年8月にヒットしたエントリやサイトの、WEBデザイナー向けまとめ。
一ヶ月もたてばブックマークも結構色々ノイズが入ってくるもので、ここで整理の意味も込めてまとめておきます。

SEO系や、モバイル系は別エントリに分離しないと、前回重くてアクセスが集中して見れませんと言われる方がいましたので、分離して書こうかと思っています。

IT/Web業界に強い転職サイトGreen

アイコン


Hazem Designs The Official site of Hazem Mostafa Graphic/Web Photography artist
FREEアイコン
FREEiconをクリックで見れるけど重いです。
その全てのアイコンがpngで出来ているため、使い道が多いかも。ライセンスについて見当たらないため、商用はお勧めできませんね。


Web 2.0 Badges - Useful collection of stylish web 2.0 badges and badge generator.
WEB2.0バッチ
web2.0デザインのバッチを生成するジェネレータ。
非常におしゃれなアイコンを手軽に生成できる優れものだ。


また新しいのが出た。ローディングイメージ作成のお供に『gif generator』
Ajax ローディング
Ajaxのローディングイメージ作成のジェネレータ2本立て。


faviconをオンラインで作れるサイト20選
faviconオンライン生成
faviconを、あくまでもオンラインで生成するサイトのまとめ記事。


Buy Stock Royalty Free Icons For Toolbar and Web
MacOsX
Mac OS X用アイコン。ロイヤリティフリーですね。


無料で使える人気アイコンまとめPART2*ホームページを作る人のネタ帳
CS3 アイコン
私の無料で使えるアイコンまとめのパート2です。


ブログ引退表明サービス
ブログ引退表明
ブログをやめるときに使うバッチまで配っているなんともユニークなアイデアサイト。引退するときの表明をする場として活躍される日がくるのかな?


はてな初心者マークを作った。
hatena
はてなの初心者マーク。上のブログ引退表明サービスからインスピレーションを受けたそうです。行動力がすごい。


煩悩是道場 - 自由に使えるアイコン詰め合わせ
アイコン
さらに上の初心者マークからインスピレーションを受けて作成されたというアイコンたち。かなりユニークです。



デザイン


Free Stock Photos at freerangestock.com - Totally Free Stock Photography and Textures!
Free素材
Digital Images: Free stock photos at Freerange stock - Lifehacker元ネタ(英語)
無料でダウンロード可能な画像配布サイト。かなりクオリティ高いものもある(ユーザー登録必須)



ANTEPRIMA FW07

ANTEPRIMA
Flashのお手本サイト。
読み込みが確かにストレスを感じてしまうのは否めないが、パネル操作感はすばらしい。



ニコニコ動画でのドット絵作成過程映像のまとめ

ドット絵の作り方
いわゆるドット絵が書きたい人はこちらから。


影の付け方いろいろ

影の付け方
その名のとおり、一つの画像で、色々な影の付け方を表現しています。
勉強のために一つ。


<InputDraw/>
お絵かきフォーム
お絵かきを、フォームで送信してしまうという荒業を導入できる。
非常にユニークな仕掛けを作れそうですね。


60 More Places to Get Design Inspiration - Online and Off
webdesign
60個ものwebデザインのインスピレーションを受ける。
途中からwebデザインではなくデザインのインスピレーションになるけど参考になりますね。


Top Rated - Free Stock Photos
フリー写真

著作権の放棄された、自由な写真集。
5000点以上の画像が無料で使える。


紙がやぶれた感じを表現するPhotoshopチュートリアルいろいろ
紙がやぶれた感じ
Photoshopチュートリアル。
なんでもない画像が、急におしゃれに見えてくるかもしれないテクニックですね。


Lifeandhealth | Life and Health
動物の書き方
動物の書き方大全みたいな感じ。
そこは丸なのか・・・とか色々勉強になりますね。


Creativity Spark From Masters Of Illustration
グラフィックデザイナー
グラフィックデザイナーまとめエントリ。
デザイナーの作品も羅網され、非常に参考になる。というかやっぱりデザイナってすごいです。


Photoshop Brushes, Adobe Photoshop Brushes Free Download
こちらはPhotoShopブラシ大全サイト。
100個以上収集されています。


角を丸くしてモテる
一応ジェネレータ。シンプルすぎるところが好き。
画像をアップすると角を丸くしてくれて、モテます。


Flash|Ajaxベストサイトセレクション20特集
はてブ数が少なかったために、見逃してしまった人がいるかもしれない。
Flash、Ajaxのどちらの制作者も、これは絶対に一度見ておくべきエントリ。

要チェックです。


Photoshop用ボブ・ブラシを使ってボブの絵画教室みたいな絵を描いてみる
これは見てもらう以外に説明のしようがないけど・・・。
ボブみたいな絵を描きたいという人は必見。


Photoshopぼかしフィルターの効果的な使い方
PhotoShopチュートリアル。
ぼかしフィルターでスピード感などを演出する方法。


[N] オンラインでフォーム作成「FormSpring」
オンライン上でフォームを作ってくれるサイトをレビューしてくれている。
残念な事に見えない画像があるけど、わかりやすい説明に感謝。


あの映画風の画像が簡単につくれるチュートリアル11選 | P O P * P O P
作り方という、知っていればそれだけで武器となるチュートリアル。


自分のサイトに貼れるドロップダウンメニューを作れる『NetworkBar Generator』
100SHIKIさんで紹介されていましたが、非常に簡単らしいです。
私はユーザー登録をおこなっていませんのでわかりませんが、一応メモ。


体を張ったちょっとセクシーな目の錯覚画像いろいろ
ペイントする女性
ペイントしている女性画像のまとめ。
どこからどこまでペイントなのか・・・もうわけがわからない。


404エラーをデザインする為のインスピレーション
404エラーをどれだけかっこよく見せるかのお勉強に一つ。
ちなみにErrorDocumentを絶対URLで書くのはやめようよで、404エラーの正しい設定方法が記載されていますので参考までに。


スーパー風シールメイカー
本当にそこらへんのスーパーのシールのような画像を生成するジェネレータ。
面白いです。


Worth1000.com
レトロデザイン
現代の商品をレトロに表現しているデザインのまとめ。
これは本当にすばらしい。一度は絶対見るべきだと個人的に思う。



Ajax JavaScript


Scrollovers - A New Way of Linking
ホバーリンクの作り方。
マウスを乗せるとくるりんと表示が変わる。結構面白いので一度サイトで体験してみると良いかも。


文字を隠すように貼るシールを表現するJavaScript*ホームページを作る人のネタ帳
クイズなどにも使えそうなJSライブラリ。


半透明の角まるツールチップを表示するJavaScript
透明なツールチップ。prototypeを使用しているようですが、ダウンロードに含まれるそうで、使いやすそうですね。


Webの検索ボックスをカッコよくする方法
確かにかっこいい。
これは試してみたい。


Webデザイナーのためのコードスニペット125選『125 Code Snippets for web designers』
レビュー記事。
Ajaxのコメントフォームやチェックボックスを画像を使ってカスタマイズする方法などをまとめているけど、英語が苦手な方はきつかもしれない。私も含めて。


ウェブに激しく使えるインタラクティブなインターフェース集『Welie』 | 100SHIKI.COM
カテゴリーごとにどういったインターフェースデザインが有効かをまとめてくれている。



CSS


Download free CSS templates - Free CSS Templates
フリーCSS
フリーで使えるCSSテンプレート。
ステルスデザインが多く使われているので、見ているだけでも参考になるデザイン多数。


JavaScriptを使わないスターレイティングの作り方
星型レイティングの作成方法。JavaScriptを使わないで設置するためのマニュアルがここに。サーバーへの登録方法などが無いのが残念。



モバイル系


チームラボが考えると、ケータイはどうオモロくなる?
つい最近、早稲田と協力してインターネット全体から独自クローラーを使って検索可能な不動産情報検索『いえーい』などをリリースしているチームラボ。
「コミュニケーションという本来の目的を忘れるようなものにしたい。『街を育てたいから○○さんにメール打たなきゃ』というようになったら面白い」(猪子氏)

勉強になります。


携帯サイト作成のためにも使えるPHPのライブラリ
携帯サイトを作るというときは参考にしたいライブラリ。



web開発のお勉強


WordPressでAdSenseを使うときに便利なプラグイン ベスト10
プラグインを利用することで、広告をランダムに表示したり、複数のアドセンスアカウントを利用したり、インライン表示したりできます。
収益を上げるためにも、また複数人数でブログを運営するためにも、覚えておきたいプラグインばかりです。


AptanaでWebページ作成はここまでできる!(1/3)
ドリームウィーバが有料で、Aptanaが無料といわれるくらい有名なweb開発ソフト。
これについてのインストールから、作業方法までレクチャーされている。非常に参考になりますよ。


サイト価値を最大化するためのトップページ設計術~4パターンの訪問者を想定して作る
大体3ヶ月に一回はこれと同じような記事が上がってくる。
何度でも目を通しておいて損は無いトップページの設計術。


離脱率90%は当たり前!?最後の難関『入力フォーム』の離脱を改善する
いわゆるフォーム離脱者をいかにして取り込むかというところに焦点をあわせている。
・せっかく入力フォームにたどり着いても、遷移元のページに戻ってしまう
・プライバシーポリシーのページに遷移し、そのまま入力フォームに戻らない
・ナビゲーションをクリックし、そのまま入力フォームに戻らない
・フォーム入力中に、何らかの理由によってページ離脱してしまう
・フォーム入力完了し送信するも、エラーとなって面倒で離脱してしまう
この5つの回避方法。


既存サイトのデザインのコピーが簡単にできる
既存サイトデザインをコピーするためのエントリ。
良いか悪いかとかの話は別で。


検索条件の入力画面で配慮したいインターフェース例 (ユーザビリティ実践メモ)
検索条件画面を元に、実践して調査した結果のレポート。


チラ見せでマウスオーバーを誘うインターフェース
ちら見せ→マウスオーバーのテクニック。
よく考えてみると、表示できる領域は限られているわけだから、こうしてちょっとだけ見せてマウスオーバーと言うのはなかなかいいアイデアだと思う。


ユーザーがページのどこをクリックしたか解析するツール[to-R]
だいぶ前に紹介はしていましたが、今回は、そのサイトのわかりやすい使い方レビューサイト。
かなり前に試したときにはFC2が外部から画像やCSSを読み込ませるのが一回しか許可しておらず、CSSが適応されていない状態で見れましたが・・・。今はどうなんでしょう。


FLASHのサイトは見やすいし内容が分かりやすいし好感が持てる
FLASHがすばらしい!という記事に対する2ちゃんねるの反応。FLASH作成前の参考までに。


リリースwebサイト


BCCKS / ブックス - Preview版 - BCCKSはカンタンにwebの「本」が作れるサイトです
本
web文章を、わざわざ本のように見せてログるサイト。
なかなか奇特なサイトかと思ったけど、見てみると普通のweb文章や画像が、ちょっと素敵に見えるのが不思議。



スポンサーリンク

トップへ戻る

Twitter版のネタ帳では毎週月曜~金曜までWeb屋さんに役立つ色んな情報や単なるネタまでをつぶやいています。

関連するエントリー

コメント

この記事にコメントする人はクリック

コメントポリシーをお読みください
管理者にだけ表示を許可する

あれはんどろ これで新たにサイトを作ってみます

画像を使わずにカッコいいCSSをつくるというコンセプトで色々なテンプレートを集めてギャラリーにしているものを見つけました。

ここで拝見する記事からも、これからはシンプルが好まれるような気がします。いや、個人的にシンプルが好きなんですが。

このまとめ集を参考にさせてもらいながら、自分でテンプレートを作ってみy法と思います!

ではでは。

2007/09/08 Sat 01:31| |

トラックバック

この記事にトラックバックする人はクリック

links for 2007-09-05

Infosketch プライベートWiki。Google Gear...

気になる記事の書き出し帳:2007-09-05 18:29

WEBデザイナーのためのベストエントリ51個まとめ『2007年8月』

2007年8月にヒットしたエントリやサイトの、WEBデザイナー向けまとめ。 一ヶ月もたてばブックマークも結構色々ノイズが入ってくるもので、ここで整理の意味も込めてまとめておきます...

ちーこさんの独り言:2007-09-09 21:39

FC2Ad

広告


IT・Web業界の求人なら転職サイトgreen(グリーン) ホームページテンプレート、WordPressテーマ、Facebookページテンプレートならクラウドテンプレート ネットマーケティングとは│ネットマーケティング検定 SEOコンサルティング&SEO対策 無料レスポンシブWebデザインテンプレート 広告主募集

あわせて読みたい
フィードメーター - ホームページを作る人のネタ帳

人気の記事一覧

あなたのブログの再訪問者を増やす50の方法

私の経験から感じた事を書き記します。全てが全てその時々で、正しいとは限りませんが、一つの指針としてお使いください。因みに全部リスト化すると230くらいありましたが、それはきっとセミナーとかでやるかなぁと。

http://e0166.blog89.fc2.com/blog-entry-824.html

あなたの生活を確実に拘束し時間を浪費させる動画50

今回は生産性を向上させる事ばかり考えて記事を書いてきたので、逆に年末にかけて忙しい皆さんの時間を出来るだけ拘束し、忙しさを倍増させるものが無いかを考えました。その結果、動画で行こうと言う事になったのが1ヶ月以上前。動画閲覧本数はおそらく600本以上。その中から、おもしろそうなものを50個ベストチョイスいたしました。

http://e0166.blog89.fc2.com/blog-entry-820.html

webデザインのセンスを磨く○○系のwebデザインまとめ

webデザインを学ぶならwebデザインから。と言うわけで、今回は海外のエントリを中心に、○○系のまとめをまとめます。

http://e0166.blog89.fc2.com/blog-entry-817.html

jQueryプラグインのベストトレンド総まとめ2010

もはやこの業界ではかなり浸透しつつあるjQuery。今回はそんなjQueryにスポットを当て、本年度紹介された中でも、ホットなトレンドプラグインをご紹介します。

http://e0166.blog89.fc2.com/blog-entry-816.html

ツイッターの日常における35の行動パターン

私が良く見かける35の行動パターンに名前をつけてみようと思う。年末の誰も見てない時に公開しようと思っていた、ただのネタだったのですが、結構時間がかかりこの時期に・・・。

http://e0166.blog89.fc2.com/blog-entry-823.html

ウェブデザイナーのためのウェブアプリ15

OSがWindowsであろうと、ubuntuであろうと、共通のサービスを受けることができるのがウェブアプリケーションです。ウェブデザイナーの中には、自宅ですでにubuntuを利用している人も多い。また、Mac、Windowsと、各自それぞれの使いやすい物を利用していると思います。

http://e0166.blog89.fc2.com/blog-entry-784.html

愛用するGoogleChromeエクステンション12個

この2年でノートPC2台購入。自他のPCはクラッシュしてリカバリー。会社のPCは新しいのがあたり、再セットアップ。そんなこんなで、会社はまぁともかくとして、とりあえず全PCが比較的3ヶ月に一度リカバリーしてもいいように、自分用にメモとして残しておきます。

http://e0166.blog89.fc2.com/blog-entry-784.html

文章や会話のプレゼンテーションを向上させる方法

文章力がないためにプレゼンに失敗した、会話がうまくできずにプレゼンに失敗した。こういう経験はなかなか無い。なぜなら多くの場合、失敗したことに気がつかないからです。

http://e0166.blog89.fc2.com/blog-entry-802.html

サイトの裏側の意識を変え売り上げをアップする方法

ネットショップ運営者が、あることをちょっとだけ始めてみただけでわずか5ヶ月で売り上げが3倍になりました。はたして、webサイト運営がどのように変わったのでしょうか。。

http://e0166.blog89.fc2.com/blog-entry-749.html

webサイトのリピーターを増やすさりげない5つのコツ

多くのビジネスサイトのアクセス数を支えている大手検索サイト、Yahoo、Googleのアルゴリズムが変わる事で、突然商売がひっくり返る事態を回避する方法。

http://e0166.blog89.fc2.com/blog-entry-746.html