クリック率・コンバージョン率を高めるボタン。3つの大きなポイント
WEBサイトを運営していれば、サイトに訪れてくれたユーザーに【申し込み】【購入】【資料請求】【問い合わせ】などのアクションを、たくさん起こして欲しいと考えると思います。 そのためWebクリエイターは、どうしたらコンバージョン率や数が高まるのかを日々考え・テストを繰り返しています。 私もそのことを考えている1人として、今回はサイトの目的を達成させるために欠かすことのできない大変重要な要素の1つである【行動を呼びかけるためのボタン（Call to Action Button）】についての考えをまとめたいと思います。 目的を達成へと導くボタン ボタンはホームページの最終的な目的である【申し込み】【購入】【資料請求】【問い合わせ】などのアクションを、ユーザーに起こしてもらうためには欠かせない要素の1つです。ボタンのデザインやボタン内の文章を変えただけで、資料請求が増えたなんていう事例はたくさん存在
【実践編】少しの手間で大きく変わる、細部にこだわったWebデザインを
2013年3月23日 Photoshop 「少しの手間で大きく変わる、細部にこだわったWebデザインを」で紹介した「わずかな」加工を使ってボタンのデザインをかっこよくしよう！というチュートリアル記事です。前回の記事内にPhotoshopでの作成チュートリアルも載せたかったのですが、あまりにも長くなりそうだったので別記事にする事に。合わせて見てみてください！ ↑私が10年以上利用している会計ソフト！
Webデザインの“ブブン”を集めたブブンデザインアーカイブ 公式サイト
タグ一覧 タイトルロゴ(159) プライマリナビゲーション(72) グローバルナビゲーション(246) メインビジュアル(95) 見出し(326) 文字装飾(10) アクセント(29) サイドメニュー(142) ログインフォーム(68) タブ(55) テーブル・表(23) 地図(12) 特集バナー・内部リンク(525) Twitterアイコン・バナー(64) RSSアイコン・バナー(41) フォーム(9) アイコン(195) ＜前へ 次へ＞(12) 検索窓(149) パンくずリスト(12) このページのトップへ戻る(52) フォントサイズ変更ボタン(34) 問合せ・送信・購入ボタン(72) 電話番号(41) フッター・コピーライト(99) ニュース・ポータル・検索(207) ファッション(200) 音楽・ゲーム・コンテンツ配信(58) ネット関連サービス(86) オンラインショップ(308
質感溢れるクオリティの高いボタンのPSD
素敵な質感のあるボタンギャラリー。 あぁ・・・世の中素敵なデザイナーさんっていっぱいいるもんだなぁ等と思いながら、いつか使いそうなのでご紹介。 思わず押したくなるボタン 光沢があって、なにやらツルツルしてると思わず押したくなりそうになります。 全体的なデザインを考えて、「ボタンだけ浮かないように」注意して使う必要があるかもしれませんね。 中でもネタ帳お勧めのアイコンをピックアップ。 ちょっとでも気になった方は以下でいろいろ堪能するといいかも！ Ultimate Collection of Free Buttons in PSD Format １）多数のボタンデザイン 各種多数のボタンデザインが入っているお勧めの一品。 もう色々揃ってるので、これだけあればまぁあとはいんじゃないか的な流れになりそうだけどその辺は個人のお好みで。Adobe風のタグが一押し。 ２）Windows7ボタン Wind
ユーザーにクリックされやすいボタンデザインの5つのポイント
ユーザーの行動への呼びかけを促す「ダウンロード」や「サインアップ」などのボタンをデザインする際に気をつけたい5つのポイントをLee Munroeから紹介します。 Web Design Trends: Call To Action Buttons 先日とりあげた「ハイパーテキストリンクのスタイル大全」の5. ボタンスタイルで紹介されているものです。 以下は、各ポイントを意訳したものです。 はじめに サインアップやダウンロードなど、ユーザーの行動への呼びかけを促すボタンのデザインはウェブデザインにおいて重要なものです。 ボタンはそのページのゴールの一つであり、その目的のためにそれぞれのページをデザインするといっても過言ではありません。 行動を呼びかけるボタン（Call to Action Button）はユーザーの注意を引く必要があります。以下に、そのボタンのデザインの5つの特長をあげます。
いろいろなサイトのボタンを集めた -Button Design Showcase
アローやアイコンを添えたり、グラデーションを適用したものなど、さまざまなデザインのボタンを集めた「Button Design Showcase」を紹介します。 Button Design Showcase Buttonには現在24個登録されています。 Elements of Designは、以前紹介した「検索フォームや見出しなどエレメントのデザインを集めたサイト -Elements of Design」のサイトで、久しぶりに訪れてみたら、カテゴリが増えていたので、他のも紹介します。 ブログのコメント用フォームのデザイン集 ブログのコメントのデザイン集 ボタンのデザイン集 カレンダーのデザイン集 カルーセルのデザイン集 コード表示のデザイン集 言語選択のデザイン集 Emailのサインアップフォームのデザイン集 エラーメッセージのデザイン集 動画プレイヤーのデザイン集 フッタのデザイン集 フォ
CSS3を使ったボタンデザイン | チバのブログ
CSS3の「これは！」という機能を紹介するエントリーの第2回。CSS3で作るボタンデザインを紹介します。 前回は画像を使わずに角丸を作るborder-radiusというプロパティの紹介だったのですが、ただの仕様書の写しのようになってしまいました...。 前回の反省も踏まえて、今回はサンプル付きで紹介したいと思います。 ボタンのデザインの参考にしたのはButton Design Showcaseというエントリー。 Button Design Showcaseの中から、CSS3で作れそうなものをいくつかピックアップしました。 ※サンプルはFirefox3.5～、Webkitでしか確認していません。 かっこいいボタンがいくつもあったのですが、CSS3の新機能を紹介できそうなボタンのデザインとして以下の3つを選びました。 アップル風のボタン 透過pngのグラデーションを使ったボタン RGBa
シルバーメタルやブラックメタルのフリーのボタン素材
メタルやグロッシーをテーマにしたボタン素材をpsdGraphicsから紹介します。 PSD silver metal buttons set ダウンロードできる素材のフォーマットはPSDで、背景やテキ
つい押したくなるようなボタン作成Photoshopチュートリアル集:phpspot開発日誌
つい押したくなるようなボタン作成Photoshopチュートリアル集が40種類ほど公開されていました。 ボタンといっても色々な種類があって、ちょっとした変り種のボタンを作る際にも参考にできそうな豊富なチュートリアル集になってるようです。 各リンク先は以下のエントリを参考にしてください。 40 Best Photoshop Tutorials for Creating Buttons and Badges | Naldz Graphics
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ウェブデザインのセンスを学ぼう、2012年上半期洗練されたディテールのUIデザインのまとめ
新着記事
IDEA * IDEA
http://www.designwalker.com/2009/11/button-resources.html
CSSによるボタンスタイリング例いろいろ:phpspot開発日誌