Ajaxload - Ajax loading gif generator
Indicator type : Background color : # Transparent background Foreground color : # Create easily your own ajax loader icon : Select the type of indicator you want Enter the background code color you want (tick "Transparent background" if you don't want one Enter the foreground code color you want Press "Generate it"
キャズムを超えろ！ - 団塊～シニア層向けのWeb設計 やっちゃいけない10のＵＩ
一時期パソコン教室の講師をやっていたことによる経験と、昨今Webサービス運用にあたって中高年層からのクレームなどを自分なりにまとめた結果として、50代以上のユーザに対するWebサービス＆PCアプリケーションのUI設計における以下10のTIPSを公開してみたいと思う。...といってもたかだか10個で収まる簡単な話ではないので、思いついたら都度追加して行きたい。 ID，ニックネームを考えさせてはいけない。半角英字開始限定は論外 IDやニックネームが思いつかない方が多い。これはシニアに限らず、ITリテラシーがそれほど高くない若年層についても言えること。作る側の人間も「過去にWebで使ったID,Nicknameは全て使っちゃダメ。何か新しいのを考えて入れてみて。」と言われると結構悩んじゃうもの。それと同じ状態に陥ると思っていただけるとわかりやすい。「IDのかわりに電話番号でもいいですよ」というと結
ユーザーの動き。｜CSS HappyLife
ボクたちみたいな、ウェブサイトを閲覧するのが当たり前の人間からすると、全く気づかない事に気づかされたりしたので、自分用メモ。 2008年2月14日の22：47頃に追記 ボクのただのメモ書きをもうちょっとちゃんと以下のエントリーで書いてもらってるので、あわせてご覧になって頂くと、良いかと思います。 Webアクセシビリティについての覚書 - ねんがんのWebユーザビリティテストに参加した ロゴクリック＝トップページに戻るという認識は殆ど無い。 トップページに戻る場合は、ブラウザの「戻る」ボタン。 サイドバーのバナーは、認知すらされない傾向が強い。 そもそもバナーとして押せるものではなく、デザイン上の飾りとして見られる場合も。 リストのマークとかのマーク部分をクリックしよーとする人が居る。 それにより、クリックできないと諦めるケースも。 プルダウン（ドロップダウン）型メニューは、近くのボタンを押
Alertbox: 2005年 ウェブ・デザインの間違いトップ10（2005年10月3日）
2005年、ユーザをうんざりさせてきたWebデザインの間違いをリストアップしてみると、古くから言われているものがランクイン。悪さをし続けていることがわかった。 Top Ten Web Design Mistakes of 2005 by Jakob Nielsen on October 3, 2005 Webデザインの間違いをリストアップするにあたり、今年は趣向を凝らしてみることにした。私が発行しているニュースレターの読者にお願いして、今年、もっとも腹立たしいと思ったユーザビリティ上の問題点を投票してもらったのだ。 読者の参加によって、ユーザテストでは気付かなかった多くの課題が浮き彫りになるだろうと思っていたが、そうはならなかった。30位までにランクインした問題点は、ユーザビリティガイドラインの中で指摘済みのものばかりだったのだ。今年のトップ10を読んで、“聞き覚えがあるぞ！”と思われる方
Webデザイン エンジニアリング 第16回 ボタンを押させるテクニック：ITpro
対象とするユーザーの“慣れや知識”によって，画面の構成を変えたほうが伝わりやすいとするならば，画面上の「ユーザー・インタフェース（UI）部品」の色や形状も，ユーザーに応じて変えるべきでしょう。今回は，代表的なUI部品でありながら，なかなか作り手の思うように押してくれない「ボタン」について考えます。 わかりやすいボタンの形状はユーザーによって違う まず，前回とほぼ同じ絵を用います。Webシステムの操作方法への「熟知度（PCリテラシ）」を縦軸，「提供したいサービスに対する知識」を横軸とします。そして，それぞれの「軸」に対して，受け入れやすいと思われる「ボタン」の形状を例記しました。 上図の【A】や【B】のタイプに当てはまるPCリテラシの高いユーザーは，ボタンの“ラベル”に「submit」と書かれていようが「GO」と書かれていようが，ボタンを認識することはさほど苦ではありません。 しかし，PCに
シニアはログインでつまづく？！ - Trans
最近、シニア向けのあるWebサービスを構築している。その中で、シニア（特に、団塊世代、もしくはそれ以上）の方が、どういったところでWebサービスにてつまづくのかが少し分かってきたので、自分の備忘録も兼ねてメモしておく。 先に言っておくと、シニアはまずログイン、もしくは新規登録でつまづく。「中に入れない」「何かパスワード間違えているみたいなんだけど」そういった質問が、どんどん寄せられる。このWebサービスを構築する前に、できる限りネット上でシニアのネット行動特性みたいなものは調べてみたが、その多くは「ログイン後」、もしくは「ログインする必要がないサイト」のことだったと、今更ながら気が付いた。例えば、 ユーザビリティ研究所: シニア向けウェブサイト構築のための10のポイント 使いやすさを考えてみる。(アクティブシニア・シルバー層の現場から) そう、シニアのネット上の行動特性はある程度研究が進ん
顧客の機能要求に折れないこと!
Kathy Sierra /青木靖 訳 2006年5月10日 製品やサービスが成功するほど、ユーザの要望を受け入れるようにというプレッシャーは強くなる。ユーザが多くなるほど、要望の範囲は広がっていく。あるユーザにとっての ｢それがないんだったら買わない｣機能が、別のユーザには取引をぶちこわすものになる。そしてあなたの製品やサービスが人気になるほど、そういった要望は、要求と最後通牒へと変わっていき、ついには痛烈な批判になる。 私たちになしえる最悪のことは、それに折れるということだ。しかし要望/要求や批判が強く、怒りを帯びたものになるほど、誘惑に抵抗するのは難しくなる——｢この1個だけ付け加えれば･･･きっとあの連中もおとなしくなってくれる｣ しかしあらゆる色を1つに混ぜ合わせて泥色のしみを作るなら、誰も私たちのすることを嫌わなくなるが、同時に誰も喜びも、興奮も、魅了もされなくなる。そうして私
FPN-団塊〜シニア層向けのWeb設計 やっちゃいけない10のＵＩ
5．ビジネスリサーチのビジネスモデル ビジネスリサーチがアウトソースされる理由 ビジネスリサーチを社外に依頼する理由①〜信頼できる人「すべては依頼から始まる」からでも書きましたが、依頼主が社外にリサーチを委託する最大の理由は、事業環境を定点で把握… 2021.01.18 2021.05.13 147 view コラム〜リサーチャーの日常 トリプル ディスプレイ モニター 在宅勤務が常態化している人は、まず トリプル ディスプレイ 環境に投資することを考えてみてください。作業効率の圧倒的向上が可能です。… 2021.05.06 2021.05.11 205 view 3．ビジネスリサーチの報告書作成 聞き手の頭に入りやすい資料作成〜聞いて理解する人と読んで理解… 【 相手に合わせた 資料作成 】最初に結論を述べてから、それを裏付けるデータを提示するという構成は、欧米流のロジカルシンキングの基
ウェブに激しく使えるインタラクティブなインターフェース集『Welie』 - 100SHIKI ～ 世界のアイデアを日替わりで ～
インタラクティブなデザインがどうあるべきか、そのデザインパターンを集めまくっているのがデザイナーのWelieさんだ。 彼のサイトではカテゴリーごとにどういったインターフェースデザインが有効かをまとめてくれている。 検索サイト、ショッピングサイト、サイトナビゲーションなどなど、ウェブを作る仕事をしている人にとっては必見だろう。 またそれぞれのパターンにはスクリーンショットの例や、いつ使うべきか、使うときにはどういった点に気をつければ良いかも教えてくれる。 こうした資料は知っておいて損はないですね。
disneycom.jp（D混む.jp）
D混むは東京ディズニーリゾート、ディズニーランド・ディズニーシー、の混雑状況を科学的に分析し予測しているサイトですdisneycom.jp（D混む.jp）は、東京ディズニーリゾート（ディズニーランド・ディズニーシー）の混雑状況を科学的に分析し予測しているサイトです。 せっかく仕事を休んで東京ディズニーリゾートへ遊びに行ってもアトラクションは混雑していて楽しめなかったり、入場制限で引き返してしまった経験をお持ちの方は非常に多いと思います。そういう方々のスケジュールの一つの参考になれば幸いです。 ※2008年5月21日より東京ディズニーリゾートの混雑状況をサイト掲載からメールでの配信へ変更いたしました。
離脱率90%は当たり前！？最後の難関『入力フォーム』の離脱を改善する
『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day
「マウスオーバーでリンク先のサムネイルを表示」は導入してほしくない - ARTIFACT@はてブロ
Twitterでちょっと盛り上がったのではてなにもメモ。あまり見かけない意見なので書いておく。 ※追記したけど、サービスのなかでも設定を無効にすることができるものも多い マウスオーバーすると、リンク先のサムネイルを表示するJavascriptがあるんだけど、あれが役立ったことないんだよなー。その割には鬱陶しいので、だから、自分で導入する気はないし、できたら他のブログで導入して欲しくない。 サムネイル画像を表示すれば、閲覧者が興味を持ちやすくなるだろうという発想から生まれているんだろうけど、特殊なWebサービスで画面が特徴的だとかならまだしも、他ブログにリンクしている場合、ブログのサムネイル画像はそれほど特徴的でないので、そんなに役立つことはない。ブログの場合、閲覧者に関心を持ってもらうのなら、サムネイル画像よりも記事の中身を引用するほうがいいだろう。 ブログの記事が文字だけで素っ気ないから
Webアクセシビリティのポータルサイト『Infoaxia(インフォアクシア)』
アクセシビリティPodcast 2人の軽妙なトーク(?)で最新情報を提供 Web Developer 日本語版 2008年3月より、開発およびユーザーサポートを他サイトへ全て移管しました。 移管のお知らせ "Webアクセシビリティとは？"から始まる『Webアクセシビリティ入門』、2004年6月に制定されたWebコンテンツのJIS（日本工業規格）『JIS X8341-3の解説』など、これだけは知っておきたいWebアクセシビリティの基礎知識を習得。 Webアクセシビリティ入門 Web アクセシビリティを正しく理解する上での基礎知識を分かりやすく解説。 JIS X8341-3の解説 2004年6月に制定された、Webコンテンツの JIS X 8341-3 について詳しく解説。 Webアクセシビリティ用語辞典 Web アクセシビリティに関連する専門用語の辞典。 『基礎知識』トップ
カテゴリとタグを上手に使い分ける : could
CMS にタグというコンセプトが組み込まれる以前は「カテゴリー」はどういった情報がコンテンツに含まれているのかを示すものでした。例えば、Mac、映画、ライフハック、仕事といった具合だと思います。しかし、タグ機能が CMS に導入されるようになると、以前カテゴリ名として扱っていた名称 (キーワード) がタグへ移行していきました。 ここで課題になってくるのが、タグがコンテンツに含まれている情報を示すようになったので、カテゴリに明確に違う役割を示さなくてはならないところです。もし従来のように「Mac」というカテゴリを作ってしまうと、Macに関する情報が書かれたエントリーに Mac というタグを書き込むことは重複になりますし、管理する側もこれはカテゴリなのかタグなのかというのが分かり難くなり、記事によって異なる示し方になりかねません。 ブログエントリーとひとことで言ってもエントリーによって様々なタ
訪問済みリンクを一工夫する - lucky bag
リンクの色によって、訪問済みなのか否かの判別を出来るようにするってのは、ユーザビリティ的には必要なことだとは思う。そう言った意味では、拙サイトなんかは全くもって許し難い設計な訳だけど、まぁそれは置いておく。んでもって、ただ色を変えるだけではなく、画像を使ってもうちっと視覚的に分かりやすくするのもありなんじゃないのかなぁって思ってみた。そして、サンプルを作ってみた。 visited_link_sample.html サンプル内のリンクが既に訪問済みであれば画像がチェックマークに変わるはず。CSS は下記のような感じで、a 要素に対してそれぞれ a:link、a:hover、a:visited で一つの背景画像の位置を変えることで見せ方を変えている。 li a { padding-left: 25px; line-height:180%; background:URL(mark.png) no
1分間で学ぶ、ウェブサイトのユーザビリティ | コリス
Interactive Marketing Blogから、1分間で学ぶウェブサイトのユーザビリティを紹介します。 One Minute Guide to Usability 下記は、1分間で学ぶウェブサイトのユーザビリティの意訳です。 Who are you? 何者ですか？ 例：ロゴ、ブランディング Are you trustworthy? 信頼できますか？ 例：ベリサイン・Trust-e、信頼できるデザイン、サポート What do you do? 何をしているのですか？ 例：取り扱っている商品・サービス、会社紹介 Where to next? 次に、何をするべきですか？ 例：見積請求、営業担当へ電話 Exit Panic: Where do I go now? パニック：私はどのページをみればいいですか？ 例：ヘルプ、ログイン、コンタクト・インフォーメーション
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://www.openvista.jp/archives/note/257/?257/
なつみかん＠はてな - ユーザビリティ関連記事 まとめ
UIパターンいろいろ - DesignWalker
クリエイティブなE-コマースサイトいろいろ - DesignWalker