フォームをより使いやすくしたい。 そんなときに使えそうなのが、『50 jQuery Plugins for Form Functionality, Validation, Security and Customisation』。フォーム周りに使えるjQueryプラグイン集です。 バリデータやアップローダ、パスワードの安全性チェックなど、いろいろありますね。 jQuery “Highlight” Plugin フォーカスが当たっているフォームに背景画像を敷いて、ハイライトしてくれるプラグイン Autotab: jQuery Auto-Tabbing and Filtering 電話番号などのinputで、自動で次のinputにカーソルを移動してくれる jQuery NobleCount Twitterのような、あと何文字入力できる、を表示してくれる「jQuery NobleCount」 AJ

95455835/ Hemera/ Thinkstock 手軽に本格的なネットショップを開きたいという人にお勧めのソリューションを５つご紹介いたします。 小さなショップから比較的規模の大きなショップまで利用できるものを基本として、それぞれの特長を独自の観点で簡単にまとめています。 既に構築したいシステムの要件が細かく決まっている場合は、それが実際に実装できるサービスかどうかを事前にご確認いただくことをお勧めいたします。 EC-CUBE 日本発のECオープンソースです。 とても高機能なのに無料で利用できてしまうところが素敵です。 オープンソースですから、自身で機能を追加することも可能です。 もちろんその場合は技術力を要しますが、EC-CUBEを利用したサイト構築の代理店も多く存在しますので、そういったところに依頼するのも手です。 サーバを既にお持ちだったり、多少の技術的知識がある場合におすす

サイトにかっこいいUIを実装したい。 そんなときにおすすめなのが、『25+ Best jQuery Plugins To Beautify Your Website』。サイトをかっこよくするためのjQueryプラグイン集です。 初めて見るものもあっていい感じです。 YoxView lightbox系の画像オーバーレイスクリプト。ナビゲーションとキャプションがフェードアウトしたりとディテールが気持ちいいです Fade In and Out Tooltips for Prototype and Scriptaculous フェードイン&アウトで表示されるツールチップ Sweet Titles Transparent and Fading Tooltips ページロード時に、画像をフェードインして表示させるスクリプト Captify Displays Pretty Image Captions

96332132, iStockphoto/ Thinkstock CSSでかっこいいUIを実装したい。 そんなときにおすすめなのが、『30 Pure CSS Alternatives to Javascript』。CSSだけでJavaScriptのような動きを実装するサンプル集です。 なかなかいい感じのものが揃っています。 Valid Non-Javascript Lightbox JavaScriptを使わずに、libhtbox系の動きを実装。反応が速くていい感じです Create a Content Slider Using Pure CSS さくさくと切り替わるコンテンツスライダー Pure CSS speech bubbles CSSで作る吹き出し型のデザイン Accordion Using Only CSS CSSを使ったアコーディングメニュー CSS-Only Tabbed

86501330, Jupiterimages/ Goodshoot/ Thinkstock かっこいい動きが実装できるjQueryプラグインを探している。 そんなときにおすすめなのが、『25 Amazing and Fresh jQuery Plugins』。新しいjQueryのプラグイン集です。 既出のものがありますが、動きの洗練されたものがまとまっています。 YoxView – jQuer Image Viewer Plugin lightbox系のかっこいいスライドショー Uniform – Sexy forms with jQuery ラジオボタンやファイル選択ボックス、チェックボックスをjQueryでデザイン。ホワイト、グレー+ブルー、ブラックの3タイプがダウンロードできる jQuery Form Wizard Plugin フェードイン&アウトで遷移するバリデーション付きのフ

かっこいいスライドショーを作りたい。 そんなときにおすすめなのが、『28 Useful JQuery Sliders You Need To Download』。jQueryのかっこいいスライドショースクリプト集です。 かなりいい感じのものが揃っています。 Automatic Image Slider w/ CSS & jQuery CSSとjQueryで作られた、自動でスライドするギャラリー Animate Panning Slideshow with jQuery 大きい画像の一部がパンしながら移動するスライドショー SlideDeck jQuery plugin とてもかっこいいスライドショー。無料版と$99の有料版がある。Basecampのサイト等、実装例多数 jQuery Infinite Carousel スムーズな動きのカルーセル（イメージスライダー） Easy Slider

デザインに使える or 参考になる素材を探している。 そんなあなたにおすすめなのが、『18 Search Engines For Designers – Creativity Boost』。デザイナーのための素材検索サイト集です。 いくつか便利なサイトがあるのでご紹介します。 IconLet ライセンス情報の記載がある、使いやすいアイコン検索サイト IconLook タグクラウドや人気のアイコンでフィルタリングできるアイコン検索サイト。ライセンス情報の記載がわかりやすい FyFont 画像をアップロードすると、何のフォントかを調べてくれるツール Vectorials ベクターデータのチュートリアルがたくさん見つかるサイト Tutorial Vault Photoshopやillustrator、Flashなどのチュートリアルが見つかるサイト。UIがすっきりしていて探しやすい 一度見てみてく

マウスオーバー時に気持ちのいい効果をつけたい。 そんなときにおすすめなのが、『BubbleUP』。アイコンがふわっと拡大するjQueryです。 アイコンにマウスオーバーすると、ふわっとサイズが大きくなりますね。動きが滑らかで気持ちいいです。 デモは以下から。 jQuery Menu Plugin: BubbleUP 実装方法も詳しく解説されているので、ぜひ見てみてください。 Learning jQuery: Your First jQuery Plugin, “BubbleUP” ブログ遅くなりました。。昨日は書けなかった。すんまへんm(_ _)m 急いで作業しているところでOSが起動しなくなり、ここ数年で一番大変な日を過ごしました。。。 セキュリティーについて深く考えさせられたので、心機一転してがんばります。

フォーム周りでjQueryを使いたい。 そんなときにおすすめなのが、『25 jQuery Tutorials for Creating and Working with Forms』。フォームで使えるjQuery集です。 かっこいいものが揃っていますね。いくつかご紹介します。 Creating a Slide-in jQuery Contact Form クリックするとスライドインして現れるコンタクトフォーム Build an Incredible Login Form with jQuery クリックすると、ぐいんと勢いよく現れるフォーム Using Form Labels as Text Field Values ラベルタグの内容をテキストフィールドの値にして透かしテキストにしたフォーム Create a Progress Bar with JavaScript フォームの進捗状況をプ

Google Chromeを使っている（アドオンがあるなら使いたい）。 そんなあなたにおすすめなのが、『30 Irreplaceable Chrome Extensions』。Google Chromeのエクステンション集です。 便利そうなのをざっとご紹介しますね。 Aviary Screen Capture キャプチャ（スクリーンショット）が撮れる Xmarks Bookmarks Sync Firefox、Safari、IEとブックマークを同期 Evernote Web Clipper Evernoteに簡単に投稿できる Chrome Gestures マウスの動きで「戻る」「進む」などを制御できる Google Similar Pages beta (by Google) よく似たページを探してくれる Feedly 雑誌のようなスタートページにできる。Google ReaderやTw

Appleのサイトのような、かっこいいインターフェースを実装したい。 そんなあなたにおすすめなのが、『15 Incredible Apple Webdesign Style Coding Tutorials』。Appleのようなデザインをするためのコーディングチュートリアル集です。 かなりかっこいいのが揃っていますよ。 A Beautiful Apple-style Slideshow Gallery With CSS & jQuery Appleの製品紹介で使われているような、スライドショー。jQueryで動作し、PHPやDBは必要ない Apple style Accordion Menu Appleのサイドバーで使われているような、アコーディオンメニュー How to: Recreate apple.com menubar Appleのグローバルメニューはデザインがよく、ソースも綺麗。

Smashing Magazineで、請求書のデザインがいろいろと紹介されています。 いくつかご紹介しますね。 Graeme Duckett Hicks Design Francisco Inchauste Devia シンプルですがロゴの使い方、色使い、レイアウト、フォントの選び方などが参考になるのではないでしょうか。 その他、CurdbeeやFreshbooksといった、オンラインで請求書が作れるサービスも紹介されています。デザインの参考になるのでは。 一度見てみてください。 Invoice Like A Pro: Examples and Best Practices 久々にマクド中。kitsonのバッグとか持ったギャルがいっぱいいるぞ。今年はスパンコールとかキラキララメラメがはやりのようですね。。 ギャルと言えば19歳で起業した藤田志穂さんの本がなかなかいい感じです。

2EXPRERTSDESIGNというサイトで、無料でダウンロードできるクオリティーの高いPSDファイルがたくさん紹介されています。 いくつかご紹介しますね。 ↑はGrass Number PSD ( by PsEvi )。 Web User Interface Treasure Chest ( by LazyCrazy ) Full Pin Stock ( by atilazz ) Scratches PSD 45 Useful Collection of Free Photoshop PSD Files 他にもロゴデザインのPSDファイルなど、しっかり作られたものがまとまっています。 一度見てみてください。 500+ Free Download High Quality Photoshop PSD Files For Designers 金曜日ですね〜。週末はまったりするぞ。

Smashing Magazineで、WordPressのコーディングテクニックが紹介されています。 これは自分的にもタイムリー。ざっとご紹介しますね。 エントリーごとのスタイルを変える post_class()を使って、「.henry」「.sticky」「.category-tutorials」「.tag-wordpress」といったクラスにCSSを指定できるようにする。post IDでは例えば「#post-876{} 」にCSSを適用できる 関連するエントリーをサムネイル付きで表示する PHPの画像リサイズスクリプトであるTimbThumbを使って、画像を40 x 40pxにリサイズ トップページの見せ方を変える 新着3件のエントリーを、他と違ったデザインで見せるテクニック 複数のループを使う WPの標準機能である「rewind_posts()」を使って、1番目のループをリセットし、2

DESIGNM.AGで、ロゴデザインをする時に参考になるサイトが紹介されています。 4つのカテゴリーに分かれてたくさんありますね。いくつかご紹介します。 ロゴデザインのインスピレーションが得られるサイト » Logo Faves » LogoGala » Logo of the Day ロゴをテーマにしたブログ » Logo Design Love » David Airey » Logo Designer Blog ロゴデザインチュートリアル » Zeeのロゴをillustratorで作る方法 » オバマ大統領のOのロゴの作り方 » レインボーカラーのロゴを作るチュートリアル ロゴに関する記事やケーススタディー » Henri Ehrhartのブランドデザイン » Miskeetoのブランドデザイン » Butterfield Photographyのロゴデザインプロセス よくまとまって

Abduzeedoで、かっこいいフリーのPhotoshopブラシがまとまっています。 いくつかご紹介しますね。 ↑はPaintdrop。 TAIL Ink Splatters Real Brush Strokes Coffee Happens Reloaded deviantARTにリンクするので、ライセンスはそちらを確認してください。 その他のリストは以下からどうぞ。 » Awesome Free Photoshop Brushes 昨日は髪を切りに。19歳の子に対応してもらって若返った気分になりました☆

AjaxLineで、素晴らしいjQueryチュートリアルがまとまっています。 ざっといくつかご紹介。 » Animated Menu Using jQuery jQueryを使ったアニメーションするメニュー » How to create tab with JavaScript シンプルなタブ切り替えコンテンツの作り方 » Animated Navigation with CSS & jQuery マウスオーバー時にくるっくるっと切り替わるかっこいいメニュー » 5 Sliding Content Techniques, Examples & jQuery How to’s 画像をスライドで切り替える超クールなテクニック » jQuery FAQs: Scroll To and Highlight Tutorial ページ内リンクのスクロール後、対象のコンテンツをハイライトしてくれる »

Web Developer plusで、知っておきたい使えるCSSテクニックが紹介されています。 いくつかご紹介しますね。 ・テキストハイライト時の色を変更する SafariやFirefoxでテキストを選択した時の色を変更できる。コードサンプルは以下 ::selection{ /* Safari and Opera */ background:#c3effd; color:#000; } ::-moz-selection{ /* Firefox */ background:#c3effd; color:#000; } ・プリント時にページを指定箇所で分割する 以下のクラスを指定することで印刷時のページを分割できる .page-break{ page-break-before:always; } ・テキストの代わりに画像を表示する よく見られるSEOテクニック。ユーザーには画像を見せ、検索エ

Tutorial9で、Webデザイナーのための美しいjQueryプラグインが紹介されています。 ざっといくつかご紹介。 » jQuery.popeye – an inline lightbox alternative lightboxをギャラリーのようなインターフェースに代替したjQuery.popeye » jPlayer – jQuery mp3 player plugin jQueryで作るmp3ミュージックプレーヤー » jQuery form plugin jQueryで非同期通信のフォームを実装 » easyDrag jQuery plugin 簡単にコンテンツをドラッグ&ドロップできるようにするプラグイン » jQuery accordion plugin – vertical 垂直方向のアコーディオンメニュー » Switch stylesheets with jQuery

Best Design Optionsというサイトで、Photoshopのグラデーションファイルがたくさん紹介されています。 ざっといくつかご紹介。 その他のリスト&ダウンロードは以下からどうぞ。 » How to Use Photoshop Gradients Plus 600+ Gradients to Download いい天気ですねー。ドライブ日和だな。