テーブルなどをHTMLで組んだ後に、CSSコーディングを簡略化したい。 そんなときにおすすめなのが、『Primer』。HTMLからCSSのベースを作ってくれるサービスです。 HTMLをペーストして、「PRIME IT」ボタンを押すと、idやclass名からCSSのベースを作ってくれます。 プログラマが作った素のHTMLにスタイルを当てていくときなどに使えるかもですね。 インターフェースがシンプルで、アイコンがかわいかったりするので一度見てみてください。 Primer あけましておめでとうございます。今年もよろしくお願いいたします。 今年は初の東京での年明け。浅草に初詣に行ったりおせちを食べたりで楽しい感じです。 勢いでwiiとニュー・スーパーマリオブラザーズを買いました。めちゃおもろいです。

クールなフォームのPhotoshopテンプレート集「Web Form Elements」がdeviantARTで公開されています。 次のようにフォームのレイアウトがパーツごとにレイヤーで分かれた状態で公開されています。 クールなフォーム実装をする際の参考にできそうです。 以下のエントリを参照してください。 Web Form Elements by ~sniperyu on deviantART Web Form Elements Vol.2 by ~sniperyu on deviantART 関連エントリ CSSでデザインされたテーブルレスでクールなフォームサンプル 超クールなログインフォームを作成するチュートリアル 画面遷移なしのクールなフォーム作成サンプル CSSでクールなINPUTフォームを作成するサンプル

Designs of the Year: 2009 どれもぱっと見でデザインが素晴らしいものばかりですが、細部も丁寧に作り込まれ、インタラクションも面白いものとなっています。 ギャラリーには他にも多数の素敵なサイトが登録されています。 The Drawar Website Gallery

2009年の凄いPhotoshopチュートリアルが100種類まとまったエントリのご紹介です。 次のようなすごいチュートリアルが満載です。年末年始に暇な方はこなしてみるのもよいかもしれませんね。かなり力がつきそうです。 以下のエントリを参照してください。 The 100 Most Popular Photoshop Tutorials 2009 関連エントリ プロレベルのPhotoshopチュートリアル集 ボタン作成のPhotoshopチュートリアル集 輝く綺麗なクリスマスツリーを描画するPhotoshopチュートリアル

あなたはヒトがモノを買う購買心理について、ご存じだろうか。この部分はビジネスを行ううえで非常に重要な要素となってくるので、とくによく理解してもらいたい。 「ヒトがモノを買う3つの理由」 について知っておく そこでまずは大きなポイントとなってくる、「ヒトがモノを買う3つの理由」について、しっかり頭に叩き込んでおこう。この3要素は、Webサイトにおけるセールスコピーライティングを行ううえで、絶対に忘れてはいけないポイントとなる。 1）ヒトは、「痛みから逃れたいがため」にモノを買う たとえば、就寝中の深夜に電話がかかってきて「今から来てくれれば車を抽選で1台プレゼントします」と言われても、疲れているから行かないと断る人が多いはずだ。あくまで抽選なのだし、そんなものに当選するはずもないと。 しかし、「あなたの車が盗まれそうだ」となれば、ほとんどの人が駆けつける。 人は「失うこと」つまり痛みのほうに

Web Design Trends For 2009 邦訳：2009年、押さえておきたいウェブデザインの10のトレンド 2009年に流行るであろうとされた10のトレンドです。確かに、これらのものが使用されたサイトは多く見かけました。

WEBデザイナーのためのランディングページのリンク集。サイトからの離脱率を抑え、コンバージョン率を高めろ！

細部のズームアップ表現に使えるPhotoshopチュートリアルが公開されています。 次のような、細かい部分をズームアップしたように一目でわかるようなイメージ作成のチュートリアルです。 製品の紹介などをWEBで行う際の参考にできそうです。 以下のエントリを参照してください。 Create a Zoomed In Effect in Photoshop 関連エントリ プロレベルのPhotoshopチュートリアル集 ボタン作成のPhotoshopチュートリアル集 カラフルで美しい光の描画Photoshopチュートリアル

画像を配列で指定すると紙芝居のように表示してくれるjQueryプラグイン「jQuery UI FlipBook」 2009年12月18日- 画像を配列で指定すると紙芝居のように表示してくれるjQueryプラグイン「jQuery UI FlipBook」。 次のように配列でデータを渡してあげると、指定したブロック内を画像の配列でアニメーションさせられます。 サイト上では、世界の天気の移り変わりを画像で動画っぽく表示しているデモが公開されています。 複数ある画像でアニメーションさせたい場合に使えそうですね。 使い方も簡単なので簡単に実装できます。 以下のエントリを参照してください。 jQuery UI FlipBook

jQueryをよく使う人に使えそうな７つのチートシートがまとまっています。 内容が被ってしまう部分もあると思いますが、７種類の中から自分が使いやすいものを組み合わせて置いておくと便利ですね。 ajaxブームの2005年から4年。すっかりjQueryが地位を確立してしまった感がありますね。 以下のエントリを参照してください。 7 jQuery Cheatsheets For Every Designer & Developer to Have | TutZone 関連エントリ ボックス要素をレンガ状に綺麗に整列させる「jQuery Masonry」が凄い GoogleMapみたいに画像をズーム＆グリグリ移動できるjQueryプラグイン「Mapbox」 少ないスペース内でコンテンツをグリグリスクロールさせられるjQueryプラグイン「Flips」 jQuery用のGUIコンポーネントプロジェク

2010年に向けて押さえておきたいウェブデザインのトレンドの14のポイントをWeb Design Ledgerから紹介します。 Web Design Trends for 2010 下記は、その意訳です。 また、同著者の別エントリーに対応したものもあります。 これはもう使用しない方がいいウェブデザインのトレンド はじめに 1. 特大のヘッダとロゴ 2. 手描き風のデザイン 3. 大胆で大きなフォント 4. タイポロジー 5. 1ページ レイアウト 6. インパクトがある画像 7. パースの活用 8. インタラクティブで直感的なデザイン 9. モーダルボックス 10. ミニマリズム 11. オーバーサイズのフッタ 12. レトロ 13. イントロボックス 14. 雑誌風のレイアウト はじめに このリストは、2009年に人気が高かったものからさらに発展するであろうトレンドを紹介しています。 ト