新着記事『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。
「ファイルを保存せずにうっかり閉じてしまった！」を防止する
「変更を保存しますか？」と聞かれる。うっかり「いいえ（N）」ボタンを押そうものなら、前回保存してから今回までの作業内容はすべてパーだ ファイルの編集後にウィンドウを閉じようとして「'ファイル名'への変更を保存しますか？」とダイアログが表示された際、ついうっかり「いいえ（N）」を押してしまい、それまで作業していたファイルを失った経験は誰にでもあることだろう。それまでの何十分、場合によっては何時間もの作業がほんのちょっとしたオペレーションミスで失われてしまうわけで、その瞬間の絶望感はハンパではない。 このような、ファイルの変更を保存せずに閉じてしまう悲しい事故を未然に防いでくれるありがたいソフトが、今回紹介する「ファインセーブ」だ。このソフトを常駐させておくと、前述のダイアログにおいて「いいえ（N）」ボタンが無効化される。つまり、保存せずに閉じるという選択肢そのものをダイアログからなくしてしま
窓の杜 - 【REVIEW】Firefoxのステータスバーに好きなツールボタンを配置できる「Status Buttons」
「Status Buttons」は、ステータスバーに任意のツールボタンを配置できる「Firefox」用の拡張機能。「Firefox」v3.0以降に対応するフリーソフトで、編集部にてWindows Vista上の「Firefox」v3.0.6で動作を確認した。ライブラリサイト“Firefox Add-ons”からダウンロードできる。 「Firefox」はツールバーに配置するボタンを自由にカスタマイズすることが可能だ。頻繁に利用するボタンのみを配置したり、利用頻度に応じて右と左へ配置を分けるなどしているユーザーも多いだろう。Webブラウズ中のさまざまな操作を迅速かつ快適に実行するためには、こうしたカスタマイズでマウスの移動距離を少しでも短縮したい。 そんなカスタマイズ好きなユーザーにお勧めするのが「Status Buttons」だ。ステータスバーの左右両端に任意のツールボタンを配置できるため、
秀逸なユーザビリティのボタンをデザインするための5つの秘伝 - GIGAZINE
ユーザビリティを考える上でかなり重要なのがボタンのデザイン。聞いた話だと、某どこかのローンお申し込みページではボタンのサイズを極端に大きくして目立つようにして、ボタンに「OK」とか「投稿」ではなくデカデカと「今すぐ申し込む」というようにラベリングしたところ、数百パーセント増しで申込みがあったとのこと。ほんの少しのデザインの差でもバカにはできません。 というわけで、いろいろな有名サイトのアイディアが詰まって練り込まれたボタンのデザインを見てみると、どれもこれも一見すると普通に見えるようでも、実はそうではないことがわかります。それらには共通して5つのルールが適用されています。 秘伝の法則は以下から。 ■秘伝その1：色 ボタンの色はページの他のものよりも目立たせ、より明るく、そしてコントラストを効かせてページのカラーとは対照の色を使いましょう。 ■秘伝その2：場所 ユーザーがすぐに見つけることが
CSSで色指定が可能な立体的でクールなボタン実装サンプル:phpspot開発日誌
Liquid & Color Adjustable CSS Buttons - CSS/XHTML/Photoshop Tutorial When working on a large site with multiple buttons, it can be quite tedious to make all the buttons in Photoshop.CSSで色指定が可能な立体的でクールなボタン実装サンプル。 次のようなクールなボタンが作れます。background-color の指定でボタンの色が変えられるのでなかなか良いです。 だめかと思われたIE6でも動作してます。 追記） CSSのみでIE6.0対応しているわけでなく、一部ＪａｖａＳｃｒｉｐｔを使用しているみたい。 ご連絡いただきましてありがとうございました。 関連エントリ CSSでクールなボタンを作るまとめ
[JS]ナビゲーションの背景画像をアニメーションさせるスクリプト
Snook.caのエントリーから、「ナビゲーション画像にアニメーションのエフェクトをつける -CSS Sprite2」のように、ナビゲーションの背景画像にさまざまなアニメーション効果つけるスクリプトを紹介します。 Using jQuery for Background Image Animations デモ デモでは、上下のアニメーション、左右のアニメーション、フェードのアニメーションがあります。 スクリプトにはjQueryがメインに使用されており、それぞれのアニメーションは下記のように記述されています。 「#a」は上下、「#b」は左右、「#c, #d」はフェード。 <textarea name="code" class="js" cols="60" rows="5"> $(function(){ $('#a a') .css( {backgroundPosition: "-20px 35
デザインも秀逸なナビゲーションを実装するスタイルシートとスクリプトのチュートリアル集
デザインも秀逸なナビゲーションを実装するスタイルシートとスクリプトのチュートリアルの紹介です。 各サイトではチュートリアルの他、ファイル一式や画像データをダウンロードできるものもあります。
Web2.0デザインジェネレーターいろいろ-２００８年８月:phpspot開発日誌
Web 2.0 Design Generators For Developers | 84 Bytes here is a handy list of online tools to help you save time and effort creating nice graphics for your sites or apps. Web2.0デザインジェネレーターいろいろまとまっていました。 過去にいろいろとこうしたツール系は書いてきましたが、まだ知らないものもありました。 ボタン As Button Generator Buttonator.com My Cool Button ローディング画像 AJAXload.info AJAX loading Gif generator バッジ Web 2.0 Badges Fresh Badge リボン QuickRibbon Websit
いろいろなサイトのナビゲーションを集めた -Navigation Design Showcase
Navigation Design Showcase Navigation Design Showcaseは現在49個登録されており、Elements of Designには他にもウェブサイトでよく使うエレメントのデザインが収集されています。 コメントの入力欄のデザイン集 コメントのデザイン集 カレンダーのデザイン集 打ち出しエリアのデザイン集 コード表示のデザイン集 動画プレイヤーのデザイン集 フッタのデザイン集 アイコンのデザイン集 画像のキャプションのデザイン集 ログインフォームのデザイン集 ナビゲーションのデザイン集 価格表のデザイン集 登録フォームのデザイン集 引用箇所のデザイン集 検索フォームのデザイン集 見出しのデザイン集
デザイン性に優れたCSSメニュー集:phpspot開発日誌
Hidden Pixels - Ultimate CSS Menus デザイン性に優れたCSSメニュー集。 これは、と思うようなかっこいいＣＳＳメニューが特集されていました。 Professional drop-down Professional dropline Space Drop Down Menu Flyout hybrid menu Professional drop-down - shadow menu Brooke Case Drop Down Tech Radar mouseover tabs つい押したくなるようなメニューですね。 参考にクールなメニューを作ってみましょう。 関連エントリ クールなナビゲーションメニューを作成するCSS＆HTMLサンプル アニメーションするドロップダウンメニュー作成ＪＳ「Sliding JavaScript Dropdown Menu」 J
クールにアニメーションしてハイライトしてくれるJavascript『Create a Simple, Powerful Product Highlighter with MooTools』 – creamu
DiaryTechnology クールにアニメーションしてハイライトしてくれるJavascript『Create a Simple, Powerful Product Highlighter with MooTools』 クールなインターフェースを実装したい。 そんなあなたにおすすめなのが、『Create a Simple, Powerful Product Highlighter with MooTools』。クールにアニメーションしてハイライトしてくれるJavascriptだ。 このエントリーでは、かっこよくアニメーションしてくれるインターフェースが紹介されている。HTML、CSSだけでなく、Javascriptも公開されているため、実装するのも容易だろう。ライブラリはMootoolsを使用している。 以下にデモがあるので見ていただきたい。 » Demo クールにアニメーションしてハイ
ナビゲーションやボタンなどのパーツを作成するPhotoshopのチュートリアル集 | コリス
ヘッダー、ナビゲーション、ボタン、アイコンなどウェブページで使用するパーツを作成するためのPhotoshopのチュートリアルの紹介です。
チェックボックス、ラジオボックスをオシャレに表示するJS:phpspot開発日誌
Custom Checkboxes, Custom Radio Buttons, Custom Select Lists チェックボックス、ラジオボックスをオシャレに表示するJS。 次のようなチェックボックス、ラジオボックスにスタイルできるJSです。 <input type="checkbox" class="styled" /> のように、class="styled" で自動スタイルされます。 CSSを変更でデザイン変更可能です。 関連エントリ CSSデザインされたTextAreaサンプル inputのtype=fileをCSSでクールにスタイルするサンプル サイトのチェックボックス、ラジオボタンを可愛い感じにするためのJavaScriptライブラリ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
web制作関連ジェネレーター - ブックマーク - Tips - AZ store
かなり自由にスタイリッシュなボタンを作れるジェネレータ『Da Button Factory』 - 100SHIKI 〜 世界のアイデアを日替わりで 〜
ユーザーフレンドリーな優れたナビゲーション集
[CSS]フォーム要素に半透明のナビゲーションを重ねるスタイルシート
綺麗で立体感のあるサイトメニュー素材:phpspot開発日誌
[CSS]ナビゲーションやフォームなどを実装するサンプル集 -CSS Portal
CSSでクールなボタンを作るまとめ:phpspot開発日誌