IDEA * IDEAドットインストール代表のライフハックブログ
カラーインスピレーションを刺激するサイト集
ブルー、グリーン、レッド、イエロー、ブラックなど各色のフォトやウェブサイトなどをコレクションしたカラーインスピレーションを刺激するサイトを紹介します。
[CSS]複数行のテキストを天地左右中央に配置するスタイルシート
Vertically Center Multi-Lined Text demo デモでは、一行、複数行ともに中央に配置されています。 仕組みは、吹き出しに「display: table;」、その中のパラグラフに「display: table-cell;」を指定し、天地左右中央に配置します。 HTML <div class="area"> <div class="bubble"> <p>To look best, text should really be centered inside this bubble both vertically and horizontally.</p> </div> </div> CSS .area { width: 300px; height: 300px; background: url(../images/abe-bg.png) no-repeat;
デザインのインスピレーションを受けるために便利なサイト集:phpspot開発日誌
50 Best Sites To Get Design Inspiration|Dzine Blog デザインのインスピレーションを受けるために便利なサイト集が紹介されていましたので一部ご紹介。 暇なときにでも見ていれば、感性を上げられそうなサイトばかりです。 Design Flavr 多数あるデザインサイトを、フリーワード、カテゴリ、色、タグなどから自在に検索することが出来ます Flashなサイト、CSSなサイトといった感じでカテゴリわけ 色による検索機能。作っているサイトに似た色を選択し、ちょっと物足りないかもという構築中のサイトに付け加える何かのインスピレーションを見つけられるのかも Muse サムネイルでデザインサイトを順に紹介 Cool Showcase 絵の検索サイト。カテゴリ、タグ、フリーワード検索が可能 Digital Abstracts 比較的大きなサムネイルとともにクー
サイトを公開するまえにチェックすべき15の項目 | エンタープライズ | マイコミジャーナル
Smashing Magazine - WE SMASH YOU WITH THE INFORMATION THAT WILL MAKE YOUR LIFE EASIER, REALLY. Smashing MagazineにおいてLee Munroe氏が15 Essential Checks Before Launching Your Websiteのタイトルのもと、Webサイトを正式にローンチする前にチェックすべき15の項目を紹介している。すべての準備が整うとすぐにでも公表したい気持ちにかられるが、忘れがちな最後のチェックを確実にやっておきたい。紹介されているチェック項目を要約すると次のとおり。 すべてのページにFavicon用のlink要素が用意してあるかチェックする。iPhone向けのFaviconを用意してあるならそれがすべてページに追加されているかどうかをチェックする。Favi
【連載】セカイ系ウェブツール考 (63) 見た目が大事! Webサービスの「インタフェース」設計に使えるもの | ネット | マイコミジャーナル
今回のテーマは「インタフェース」 WebサービスやWebアプリケーションを提供する際、そのサービスが成功するか否かは"ユーザインタフェース"が握っている。もちろんシステム面も重要ではあるが、それを利用するユーザにとっては内部的なものよりも、まずは見た目の印象に強く左右される。 最近ではCSSのテンプレート、各種CMS向けのテーマ集やアイコン集など、Webサイトを彩る要素を提供するサービスが数多くある。それらを組み合わせたり、自分のWebサービス向けにカスタマイズしたりすることで見栄えは相当良くなるだろう。 そして今回はそのようなインタフェースに関わる部分をオンラインで設計できるWebアプリケーションやオープンソース・ソフトウェア(OSS)をご紹介したい。HTMLをコーディングするだけでは難しい魅力的なインタフェースを作り上げるのに便利な情報がそろっているはずだ。 今回紹介するOSS・Web
綺麗なアイコン作成のチュートリアル集:phpspot開発日誌
45 Best Icon Design Tutorials?|?Dzine Blog 綺麗なアイコン作成のチュートリアル集が公開されておりました。 どれも技巧的な技術が使われており、アイコン以外の画像編集にも役立つかもしれません。 Transparent battery Icon iPhoneのバッテリーアイコン。輝いている部分の表現が秀逸です。 綺麗に輝かせるのは簡単なようで難しい Adobe CS3 Icon AdobeのCS製品風のアイコン作成チュートリアル。 パロディで、自分のサイトのロゴにしてしまっても面白いかも。 Aperture Style Camera リアルだけどイラスト調のカメラレンズの作成。細部まで表現されていますね 難しいグラデーション表現も解説 3D Vector Calender Icon 綺麗なカレンダーのアイコン作成チュートリアル。めくった感じがうまい。 立
チェックボックスを綺麗に並べるCSSサンプル:phpspot開発日誌
Checkbox alignment in IE and Firefox | Xinotes チェックボックスを綺麗に並べるCSSサンプル。 次のように、チェックボックスの横に、改行入りのテキストを入れても綺麗に配置するサンプルです。 簡単そうでなかなか難しいテクニックかもしれないので覚えておくとよいかも。 サンプル IEでもFirefoxでも動作。Chromeでも試してみたところ動作しました。 関連エントリ クリーンなデザインでピュアＣＳＳなフォームを作るサンプル CSSでクールなINPUTフォームを作成するサンプル CSSベースのクールなフォーム、サンプル集 CSSでフォームデザインをする際のチュートリアル
ウェブサイトでやってしまいがちなユーザビリティのミス
ウェブサイトでやってしまいがちなユーザビリティの9つのミスをSmashing Magazineから紹介します。 9 Common Usability Mistakes In Web Design 下記は、その意訳です。 1. クリックできるエリアが小さい リンクのクリックできるエリアが小さいと、ユーザーはクリックするのが非常に困難です。 解決方法 リンク箇所にpaddingなどを設けて、クリックできるエリアを大きくします。 2. 間違った目的のためのページネーション ページネーションは、内容を複数のページに分ける時に使用します。 しかし、最近ページビューを増やす目的でページネーションを設置しているサイトがあります。これには問題点が2つあります。 一つ目は、1つのコンテンツを読むのにページをロードしなくてはならないこと。二つ目は、SEOと関係があります。ページのインデックス付けを行う際、ペー
ECサイトに使えそうなアイコン素材集「Shopping Cart Icons」
ECサイトのデザインに欠かせないのがカートなどのショッピングに関連したアイコン。今日紹介する「Shopping Cart Icons」はそんなECサイト構築の際に役立つアイコン集をさらにまとめたエントリーです。 Shopping Cart Icon かなりデザインされた立体的なカートやショッピングバッグからシンプルで汎用性の高そうなアイコン集など幅広く紹介されています。今回は公開されているアイコンの中から気になったものをいくつか紹介したいと思います。 詳しくは以下 Free eCommerce icons Shopping Cart Icons E-shop Icons アイコンのような細かいクオリティもECサイトの信頼感やブランディングといった所に少なからず影響を与えるかと思いますので、自分で画像を作るのが苦手と言う方には種類も豊富にありますので、良い素材集だと思います。 WEBでお店を
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://gerenuk.crazyphoto.org/2009/06/15/714/
IDEA * IDEA
[CSS]floatを使用しないで、リストを水平に並べるスタイルシート
[CSS]半透明のパネルを使ったドロップダウン型ナビゲーションのスタイルシート
アクセシブルで、美しいフォームを実装するためのチュートリアル集 | コリス
[CSS]スタイルシートで実装するLightbox風エフェクト -CSS Light Box
チャリティや慈善事業サイトから学ぶサイトの重要な8つのポイント
かなり自由にスタイリッシュなボタンを作れるジェネレータ『Da Button Factory』 - 100SHIKI 〜 世界のアイデアを日替わりで 〜
http://www.designwalker.com/2009/02/ps-action.html
HTML、CSS、JavaScriptの練習に最適な便利ツール『rendur』 - 100SHIKI ～ 世界のアイデアを日替わりで ～
