知っておいて損はないAJAXやCSSを駆使したタブインターフェース18種類 - GIGAZINE
技術的知識が無くてもタブを作れるフリーソフトからかなり派手な効果を伴うタブ作成ライブラリ、Yahoo！やGoogle、Adobeの作ったタブまで、いろいろと応用が利いて独自の特徴があるものをざっくりと18種類ほどピックアップしてみました。 いろいろなページやブログで頻繁に見かけるタブ方式のメニューですが、こうやって並べてみると実は見せ方も使い方も種々様々であることがよくわかります。 まずは知識不要でタブが簡単に作成できる「CSS Tab Designer」。Windows用のフリーソフトで、約60種類ものデザインが用意されています。その中にタブ方式のメニューもたくさん用意されており、ほかにも縦型のメニューやZDNet風メニューなども用意されています。 OverZone Software - CSS Tab Designer 細かいカスタマイズが可能なタブメニュー。画像を使ったサンプルも用意
かわいい吹き出しのコメント欄
なんとなくはてブを見ていたら、コメント欄に使えそうなかわいい吹き出しのライブラリーを発見。 ･･････というわけで、さっそくカスタマイズ。 willmayo.com » CSS Speech Bubbles こちらの角丸は、CSSだけでなく JavaScript も使われています。 上記のサイトを参考に 無義さん に協力していただき CSS だけで吹き出しのコメント欄にしてみました。 こんな風に3枚の画像を使用しています。 1 → 2 → 3 → 他にも吹き出しのデザインが紹介されているサイトを参考にどうぞ。 CSSでバブルタイプのblockquote『Bubble Quote』を作りました。 | CREAMU 4色のかわいい吹き出しを配布されているブログ こちらの角丸は、コーナー画像4枚と吹き出しの計5枚のパーツを使用するパターンです。 Dynamic Drive CSS Librar
akihiro kamijo: Halo から Aeon へ
今回はビジュアルデザインの話です。といっても UI コンポーネント限定ですが。 Flash に興味のある方は Halo （ヘイロー） という言葉を聴いたことがある方も多いと思います。最近の Flash にはもれなく付いてる UI コンポーネントのビジュアルデザインのテーマ名ですね。 Halo はどんなデザインなのかよく分からないという方は、例えばボタンだと下の図のような感じです。言葉だけではぴんと来なかった人も見れば思い出したりしませんか？ いまさらながら Flash 標準 UI コンポーネントが登場した背景 ちょっと前になりますが Flash が Web サイトで広く使われるようになって、スプラッシュページ以外の用途もだんだんと認知されるようになってきた頃がありました（Flash 5 あたり）。一方で、その頃は Flash の使用自体に対するネガティブな意見もまだまだ強い頃でした。jac
チープカ - はてなダイアリーのデザインを作るうえでのtips
CSS | 01:06 | はてなダイアリーのデザインをいじる上ではてなダイアリー独自に気をつけなくてはいけないものについて例をあげてみます。DOCTYPE宣言が互換モードまず一番問題になるのがここでしょうか。気をつけなくてはいけないのはなんといっても「IEで見るとwidthにpaddingがふくまれる」という点です。これはIE7になっても変わりません。そのためwidthとpaddingを同居させた要素を記述した場合にIEと他のモダンブラウザでは表示が変わってしまいます。回避策で一番簡単なのは同じ要素にwidthとpaddingを同居させないということです。ただしはてなダイアリーの構造上h1とかでwidthとpaddingを一緒に使わざるを得なくなったりするのでそん時はハックするしかないです。はてなのヘッダを透明にするはてなのヘッダは配色がしやすいように、画像部が透過されるようになりました
たった１分でかっこいい写真に変身できる！Webツール :: Love & Design ::
ブログや mixi に写真をかっこよく載せたい人は必見！ 画像処理ソフトを持っていない人や、めんどくさがり屋さんにもピッタリのオンラインフォトエディタを2つご紹介します。ユーザー登録・インストールも不要で誰でも簡単にフォトショップ顔負けのかっこいい写真が簡単に作れちゃいます。 【PR】ネットで画像を無料加工 PXN8.COM - Online Photo Editor （やのさん thx!） 説明が不要なくらい作り方も簡単です。 すべてのブラウザ(IE、Firefox、Safari、Opera)に対応しています。 アンドゥ・リドゥ機能（やり直し） ズーム機能（拡大縮小） 明るさ調整 トリミング リサイズ 画像の回転 赤目の補正 歯を白くする処理 セピア加工 LOMO*（ロシア製のトイカメラ風） フィルター ラウンド（角丸） ボーダー ぼかし 雪 *参考：:: Welcome to Lomo
プログラマでも出来るWebデザイン - Blog.37to.net
home blog labs about contact プログラミング・開発 > プログラマでも出来るWebデザイン (X)HTML CSS テンプレート デザイン 画像 作成： 2007-01-08T01:58:41+09:00 更新： 2009-04-29T09:48:31+09:00 年始早々に大幅リニューアルした当ブログですが、リニューアルのお知らせでも書いた通り、 今回のデザインリニューアルに当たっての作成過程や、使ったツールを書いていきます。 デザインセンスの無い私にとって、今回のリニューアルは良く出来たと自負しているので、 お題はプログラマでも出来るWebデザイン。 前提として、CSSでコーディングが出来て、ある程度HTMLは設計出来る、でもデザインは・・・orz な人を対象にしています。 使用したツール・サイト一覧 作成過程は後半に書くとして、今回使用したサイト・ツールで
メールアドレス画像化ジェネレーター集 | *LOVE IS DESIGN*
スパム対策にメールアドレスを画像にしてくれる、便利なジェネレーターをまとめてみました。おしゃれなデザインなのでブログのワンポイントにもなりますよ。 きゃっとまーくめーる 可愛いネコのイラスト付き フォントもいろいろ選べます。 わたしが使用しているのは「みかちゃんFONT」です。 でざいんめーる フォントや背景色の変更・グラデーションなど 参考：でざいんめーるのサンプル一覧 E-Mail Icon Generator E-mail Sigs GMail・Hotmail・MSN・Yahoo!などに対応 Gmail Signature Generator Gmail用 Handmail 参考 HTMLエンティティ化 メールアドレス画像化以外のスパムメール対策は、エンティティコード（数値文字実体参照）に変換する方法もあります。 追加（2007/3/14） Faviconメール ファビコン＋メルアド
勝手ながら『Web 2.1のデザインパターン』を考えてみた | S i M P L E * S i M P L E
さてデザイナーでもなんでもないのでかなり個人的な主張ですが、「Web 2.0っぽいデザイン」の次を考えてみました。 名づけて『Web 2.1のデザインパターン』ｗ。 個人的には「角丸の次って何よ？」と常々思っていたので、最近新しく出てきたサイトに共通するいくつかの特徴をまとめてみました。 かな～り主観なので「そうかぁ？」と思われる方もいらっしゃるとは思いますが・・・間違いを恐れずにメモ書き程度にエントリーです。 では早速。僕が感じている「次っぽいデザイン」の特徴は4つ。 【1】 極太ストライプ（Bold Stripe） ストライプはWeb 2.0っぽいデザインでも流行っていますが、それをもちょっと太くしたやつを最近よく見ます。 ↑ タイトルと背景が太いストライプに。 ↑ 細いストライプはWeb 2.0っぽかったですが、最近はちょっと太めが流行りかな。 【2】 極太枠線（Bold Borde
ウノウラボ Unoh Labs: ユーザビリティって何だろう？（基本のまとめ）
こんばんわ、Sashaです。フォト蔵のUI改善への要望が高まっているのをうけて、最近、ユーザビリティについてみんなで考えています。 基本の基本が気になる私は、「ユーザビリティって何だろう」というところから考えるべく、『ユーザビリティのguru』と呼ばれるJakob Nielsenの「ユーザビリティ」の定義を復習しました。以下はそのまとめです。 ユーザビリティって何だろう？ ユーザビリティは、UIがどのくらい使いやすいものであるのかを示す質的属性です。「ユーザビリティ」という言葉は、モノをデザインする過程で「使いやすさ」を改善するための方法でもあります。 ユーザビリティは、次の5つの品質によって表すことができます。 「学習しやすさ」 初めてそのデザインに触れるユーザーが、どれだけ容易に基本的なタスクを発見し、遂行できるだろう？ 「効率のよさ」 ひとたびそのデザインを学習したユーザーが
Japanese Traditional Colors
桜色 (さくらいろ) # 薄桜 (うすざくら) # 桜鼠 (さくらねず) # 鴇鼠 (ときねず) # 虹色 (にじいろ) # 珊瑚色 (さんごいろ) # 一斤染 (いっこんぞめ) # 宍色 (ししいろ) # 紅梅色 (こうばいいろ) # 薄紅 (うすべに) # 甚三紅 (じんざもみ) # 桃色 (ももいろ) # 鴇色 (ときいろ) # 撫子色 (なでしこいろ) # 灰梅 (はいうめ) # 灰桜 (はいざくら) # 淡紅藤 (あわべにふじ) # 石竹色 (せきちくいろ) # 薄紅梅 (うすこうばい) # 桃花色 (ももはないろ) # 水柿 (みずがき) # ときがら茶 (ときがらちゃ) # 退紅 (あらぞめ) # 薄柿 (うすがき) # 長春色 (ちょうしゅんいろ) # 梅鼠 (うめねず) # 鴇浅葱 (ときあさぎ) # 梅染 (うめぞめ) # 蘇芳香 (すおうこう) # 浅蘇芳 (あさすお
ウノウラボ Unoh Labs: デザインセンスの無い人がwebサイトを作成する際に参考にしているサイト
こんにちは satoです。 いくら面白くて、高機能なwebサイトを作成しても、デザインがダサいとサイトの魅力や開発意欲は半減です。 僕もまったくデザインセンスが全く無いのですが、新しい物を作成する際には以下のサイトを参考にしています。 (1)Color Scheme Generator 2 デザインの大まかな配色等を決めるのに使用することがあります。 真似するだけで、Coolなサイトに見えるような気がします。 (2)Color Palette Generator ロゴ等の画像を指定すると、その画像に合ったカラースキームを 教えてくれます。 (3)Web 2.0 Colour Palette 有名なサイトのカラースキームの一覧があります。 (4)pmob.co.uk CSSや画面分割などのさまざまなサンプルや解説があります。 (5)logopond さまざまなロゴのサンプルがありま
Web 2.0 V2 BETA
In the realm of idle RPGs, where players seek the thrill of adventure without the constant demand for active engagement, AFK Journey emerges as a formidable contender. As enthusiasts of this gaming genre embark on their digital quests, comparisons are inevitable. How does AFK Journey stand against its counterparts? Let’s delve into the realms of passive gameplay and discover the distinctive featur
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
今押さえておくべきWeb制作に役立つ37個のブックマークまとめ*ホームページを作る人のネタ帳
Open Source Web Design - Download and upload free web designs.
WEB制作時に便利な9つのFirefox拡張機能(Add-ons) - デザインウォーカー | DesignWalker - ロサンゼルスで働くウェブデザイナーの日記
could
新規でサイトを作る際に僕がいつも使ってるCSSのセットを公開するよ::::::STOPN' LISTEN::::::to the silence:::::::
tingelets – Bookmarklets for Web Developers
Polaroize
もう一つのWeb2.0なロゴメーカー「Web 2.0 Stylr」:phpspot開発日誌