Webデザイナーに役立つWebデザインのネタ、Webデザインに関連するテクニックやツールを紹介しています。随時人気の話題だけをピックアップしているので、Webデザイン業界の動向をまとめ読みするのにも最適です。Webデザイナーの日々のWebデザイン業務にどうぞお役立てください～。
Webデザインには一般のデザインスキルのほかに、HTML・Javascript・CSSなど多様なスキルが求められます。Webデザイナーが、さらに複雑化するWebデザインを把握する一助にでもなれば幸いです。
Function Web Design & Development [ Blog ] Free Icons: Function Icon Set, 128 Completely Free Icons 綺麗で汎用に使えそうなアイコンセット集「Function Icons」。 次のようなアイコンが公開...
jQuery Style - A gallery showcasing awesome sites built with jQuery jQueryを上手に使ったサイトのお手本を色々探して参考にできる「jQuery Style」。 jQueryでいろいろ出来るのはわかった、でもサイトに実際に上手く...
idTabs わずか2KBで直感的に使えるタブインタフェース実装用jQueryプラグイン「idTabs」 以下のようなHTMLを簡単にタブ化できるみたいです<ul class="idTabs"> <li><a href="#aaa">Tab 1</a></li> <li><a href="...
Chimply generates your images ユニークなAjax読み込みアイコンが作れる「Chimply」。 チンパンジー風のキャラアイコンが可愛いアイコン作成サイト。 作れるアイコンは、ユニークで、ほかでは作れないようなものがズラリ。 色なんかのパラメータも当然調節できるようです。...
ie6fixer - onderhond.com サイトのIE6対応を補助してくれる「ie6fixer」。 サイトのCSSをペーストして、各種オプション指定でサブミットすると追加CSSが吐き出されます。 floatな要素にdisplay:inline を追加したり、min-heightをheigh...
Fun With CSS Shapes - Nettuts これは驚き！CSSだけで作れる吹き出しボックス。 次のような吹き出しが、画像を一切使わずにCSSだけで実現できてしまうようです。 HTMLコードをちょっと分かりやすいようにダイエットしてみたものが以下。<!DOCTYPE html PUB...
Boks - A Visual Grid Editor サイトのレイアウトがサクサク作れるAIRアプリ「Boks」。 Boksを使えば、グリッド内をドラッグ＆ドロップして直感的にレイアウトを作っていけます 作ったレイアウトは「Export」で簡単にHTML+CSSに出来ます。 HTMLとCSS複数...
200 Free Exclusive Icons: Siena | Webdesigner Depot 綺麗で汎用に使えそうで商用利用も可能なフリーアイコンセット「Siena」。 次のような綺麗なアイコンセットが公開されています。 ダウンロード方法は、Webdesigner Depot のRSSフ...
40 Logo Design Tutorials - Psdtuts あの有名プロダクトのロゴを作るPhotoshopチュートリアルいろいろ。 ロゴデザインのチュートリアルの紹介の中で、有名プロダクトの部分についてピックアップしてみました。 How to Make the Windows Vist...
10+ Sites To Add Amazing Effects To Your Photos | MakeUseOf.com オンラインで写真を簡単に、高度に加工できるサイトが色々と紹介されていたので遊んでみました。 PhotoFunia 結構有名なサイトらしいのですが、知りませんでした。 多数...
さわらびフォント: 概要 - SourceForge.JP (via Moongift) 綺麗な日本語が書けるフォント「さわらびフォント」。 SourceForgeでオープンソースで開発されているようです。 次のようになかなか綺麗なフォントがフリーで使えるのは嬉しいですね。 英文の自体もよい感じで...
35 Free Fonts to Enhance Your Designs | Fonts | instantShift すごく良い感じの英文フォントいろいろが紹介されていたので一部ご紹介。 フォントに関しては、いくら紹介してもしきれないほどのフォントが存在し、日々生まれていますね。 Sketch...
Justify elements using jQuery and CSS jQueryとCSSを使ってフォームのinput要素を楽に整列させる方法が紹介されております。 何ができるか？というのは次の図を見て頂くのがはやいでしょう。 ビフォア ↓↓↓↓ アフター これを実現するために、CSSとマー...
ecoder | home ブラウザ上でソースコード編集が可能な開発環境を提供「ecoder」。 通常、開発というとローカルで保存してアップロードという形が当たり前ですが、ここ数年のトレンドの全部ブラウザで動かそうという流れを受けた開発環境です。 PHPや、HTML等、ファイルの種類に応じて綺麗に...
30 Photoshop Actions for Touch Ups and Enhancements - Part 2 １クリックで写真の印象を簡単に変えてしまうPhotoshopアクション集が公開されています。 色合いの微調整で調整していくのもいいですが、数あるアクションをそれぞれ試してみてど...
40 Useful Adobe Illustrator 3D Tutorials and Techniques 凄くクオリティの高いプロレベルのIllustratorの3Dチュートリアル集40。 まさにプロレベルな次のような画像を作れるチュートリアルが公開されています。 Create an Ope...
Easy Display Switch with CSS and jQuery クールに表示を切り替えられるCSSとjQueryサンプルが公開。 デモページ でそのかっこよさが確認できます。 かっこよくてつい切り替えてしまう、そんなスイッチになってますね。 関連エントリナビゲーションのUIはこれで...
TinyTable JavaScript Table Sorter - 2.5KB - Web Development Blog わずか2.5KBでテーブルにソート機能を提供する「TinyTable」。 シンプルだけど次のようなかっこいいソート可能テーブルを実現できる軽量ライブラリが公開。 デモペ...
Splashy Icons 小さくてかわいいWEBサイト用462アイコンのセット「Splashy Icons」 famfamfam みたいな可愛くて使い勝手がよさそうなアイコンパックが公開されています。 色々あります。 ライセンスは Creative Commons 3.0 とのことです。 関連エ...
ColorBox - customizable lightbox plugin for jQuery クールにデザインされた多機能LightBox「ColorBox」 もう成熟してきたこの分野ですが、ColorBoxはなかなか多機能かつクールなようなのでご紹介。 単一の写真表示 写真をグループ化し...
