mdlab.jpThis domain may be for sale!
スマホのUI考２ 〜 フィードバックについて | fladdict
UIについて徒然と考える自分用メモ、２回目はフィードバック。ユーザーに「何かがおきたよ！」と如何に明解に知らせるか？１回目はこちら 随時増えたり減ったりするよ。自分の主観だから間違ってることもチラホラあるかもよ。 振り返ってみてTiltShiftGenでは、遷移系のフィードバックは少なめにして、情報系のフィードバックを多めに調整してたんだなぁとシミジミ。多分、ブラーの処理が重かったからだと思う。隙をみてバージョンアップしたい。 一般論 ・フィードバックとは？ ユーザーの操作に対して、結果を返すこと。操作の実感。 ・フィードバックのないアプリは痛覚の無い人間。 ・物理的なフィードバックもソフトウェア的フィードバックもなければ、ユーザーは何がおきているか知覚できない。 ・何かが起きたら必ずユーザーに通知する。 ・適切なフィードバックが行われるとユーザーは快感を感じる。 ・新雪に足跡をつけたり、
fladdict » スマホのUI考 〜 ボタンについて
SuperPopCamとか作ったときに、体系的な資料欲しいなぁーとか思ってたことのまとめ。 色々と自分の中の考えをまとめるためのメモ。世の中のアプリは機能を半分にして、減った予算分をUIの練り込みにつぎ込んだ方が絶対よいアプリになると思う。 書いてる作業が一番考えまとまるので、ちょぼちょぼあげていこうかと、まずはボタンから。 指の大きさの制約を受ける ・Webとスマホを比較した場合、最大の違い。 ・ピクセル単位でクリック位置を制御できるマウスポインタと違い、指は大雑把にしかタップ位置を指定できない。 ・このためAppleはボタンの最小サイズとして44pxというガイドラインを作っている。 ・視覚的に44px以下のボタンも実際のヒットエリアは大きめにする。 ・またこれに留まらず、ボタンとボタンの間のマージンは空けられるだけ空けた方が安全。 ・つまるところ「カッチリ」つめたボタンレイアウトのグラ
ユーザーエクスペリエンスデザインの成果物リスト | Web担当者Forum
ユーザーエクスペリエンス（UX）デザインの世界に身を置くわれわれにとっては、いまや心浮き立つような時代となった。UXの価値はますます広く認められるようになり、次々に生まれる新たなテクノロジーやメディアを超えたトレンドは、UXデザインの実践面で飛躍的な進化を生み出す土壌を整えつつある。 私自身、新たなチャレンジの数々に見舞われてあやうく安全圏から押し流されそうになりながらも、インフォメーションアーキテクトとしてはそれらを大いに楽しんでいる。これまでに、ソーシャルソフトウェアやリッチユーザーインターフェースをデザインしたり、モバイル検索の未来についてのシナリオを描いてみたり、いろいろなチャネルやアプリケーションにまたがるようなUXを設計してきた。するとそのうち、VIPルームの“エラい人たち”に自分のアイデアをご理解いただこうと苦心する場面が次第に増えつつあることに気づいた。 そんなわけで、私は
普通の企業がWebアクセシビリティをコストからチャンスにするには | 初代編集長ブログ―安田英久
今日は、アクセシビリティについて。アクセシビリティというと、多くのWeb担当者が「うちの会社は大企業でもないし公共機関でもないので、関係ない」と思うかもしれません。アクセシビリティは「コスト」であるととらえられていることが多いでしょう。しかし、視点を変えれば、そこに「チャンス」もあるのです。 念のために確認しておくと、「Webアクセシビリティ」とは、身体障がい者や高齢者などにとっても使いやすいWebサイトにするための考え方や方法論のことです。一般の言葉でいうと「バリアフリー」や「ユニバーサルデザイン」というとわかりやすいでしょう。 具体的には、視覚に障がいのある人はWebページを読むのに「音声読み上げツール」の類を利用しますが、見出しや図を画像として作っていると、プログラムは画像内のテキストを理解できないので内容を把握できないことになります。そういった場合に画像のalt属性などを利用して読
www.flatandtree.com is Expired or Suspended.
「 www.flatandtree.com 」のページは、ドメインが無効な状態です。 ウェブサイト管理者の方はこちらから変更・更新を行ってください。 「 www.flatandtree.com 」is Expired or Suspended. The WHOIS is here.
JavaScript: window.open() 小窓の基礎
window.open()で小窓 いわゆる小窓です。これはJavaScriptの window.open() というメソッドで 小窓となるウィンドウを生成します。 各引数の文字列は一重引用符または二重引用符で括って指定します。 第１引数「URL」は生成されるウィンドウに表示するページのURLです。 ※ ウィンドウに表示するページ（別のファイル）は別途作成して用意しておきます。 第２引数「ウィンドウ名」は特に指定する必要がなければ null で良いでしょう。 ウィンドウ名を指定するときは引用符で括ります。 ※ null を指定するとウィンドウ名の設定されていない新規ウィンドウとなります。 (HTMLの属性 target="_blank" と同等です) 例: window.open('example.html', null); 第３引数「オプション」はウィンドウの特徴を設定する文字列です。 こ
W3CがアクセシビリティガイドラインWCAG 2.0を勧告として発表 | 初代編集長ブログ―安田英久
ウェブの標準仕様を定める団体W3C（ワールドワイドウェブコンソーシアム）が、Webコンテンツのアクセシビリティに関するガイドライン「WCAG（Web Content Accesibility Guideline）」のバージョン2.0を12月11日にW3C勧告として発表しました。 高齢者や障がい者など、何らかの理由で通常のWebサイトではうまく利用しづらい人にも、こうすれば利用してもらいやすくなるというアクセシビリティの具体的なサイトへの適用の仕方や、正しくできているかの検証の仕方などが説明されているドキュメントです。 ちなみに、「W3C勧告」とは、その文書がW3Cによって承認され、内容が（いったん）確定したことを意味します。一般的な表現を使うと「正式版のリリース」ですね（ちなみに、その前の段階のものは、順に「ワーキングドラフト（草案）」→「最終草案」→「勧告候補」→「勧告案」と呼ばれます）
アクセシビリティ・カラー・ホイール
使用法: 画面左の円の中の色か、縦長の短冊状のバーから、マウスで前景色を選択してクリックするか、タッチ・スクリーンの場合は指定したい色の部分をタッチします。 次に「背景色」ボタンをクリックし、同じように背景色を選択します。 チェックマークが出たら、アクセシビリティ上、色の組み合わせは良好な状態です。 そうでなかった場合、前景色や背景色のボタンを選択し、一方か、両方の色を変更します。
テーブルとアクセシビリティ -- ごく簡単なHTMLの説明
大きなテーブルは、音声読み上げで内容を聞いているとき、データが何を示す値であるかが混乱してきます。音声ブラウザは、th要素の内容やtd要素のheaders属性を利用して、補助的な情報を読者（聴取者）に伝える機能を持っています（WebSite DesignのVol.3で「音声ブラウザでもまだサポートされていない」と書いてしまいましたが、新しいバージョンはかなり対応が進んできました）。 音声ブラウザとth要素 長い見出し項目の省略形 セルの関係を示す属性 scope属性 headers属性 データの次元と軸 補足：テーブルsummary属性の読み上げ 音声ブラウザとth要素 表（テーブル）は、大量のデータを縦横の二次元に整理することで、視覚的に把握しやすくします。しかし、音声合成でテーブルを読み上げる場合、データは順番に一次元的に読み上げられるため、全体像を把握することが難しくなります。たとえ
動画で学ぶ支援技術 スクリーン・リーダー篇 第1回 | アクセシビリティBlog | ミツエーリンクス
筆者は日常的に、コンピュータの画面情報を音声や点字にして読むことのできるスクリーン・リーダーというソフトウェアを使用しています。コンピュータを使用する場合、画面に書かれている内容をそのままでは読むことのできない、もしくは困難である視覚障害者にとって、このスクリーン・リーダーをはじめとした支援技術はなくてはならない存在です。 今回は特に、視覚障害者である筆者が使用しているスクリーン・リーダーを取り上げていますが、今後もさまざまな支援技術についてご紹介していきたいと考えております。 それでは、当Blogでもしばしば取り上げることのあるこのスクリーン・リーダーとは、どのようなものなのでしょうか？ 今回は、当社のWebサイトで公開を始めた「動画で学ぶ支援技術 スクリーン・リーダー篇」で、実際にその音声や画面をご覧いただきたいと思います。 動画の公開にあたって 当社が過去に行ってきたセミナー終了後に
リンクテキストとアクセシビリティとスクリーンリーダーの動作 - TRANS [hatena]
リンクテキストをスクリーンから隠したいときに、どんな方法が最もアクセシブルなのでしょうか。 Yahoo! User Interface Blogより もう3ヶ月ほど前のことですが、Yahoo! User Interface Blogで面白い取り組みをしていました。Empty Links and Screen Readersという記事です。その取り組みとは、リンクテキストをスクリーンから隠すための方法を1つ1つ検証し、どの方法がアクセシブルなのかを調査するというものです。 Yahooが調べたのは以下のリンクです。 通常のテキストとそれに対するリンク テキストもtitle属性もないリンク title属性はあるが、テキストがないリンク テキストの代わりに空白を入れたリンク これらのリンクに次のCSSを当てます。 特に指定しない offscreen visibility: hidden displ
![リンクテキストとアクセシビリティとスクリーンリーダーの動作 - TRANS [hatena]](https://cdn-ak-scissors.b.st-hatena.com/image/square/ca97218ef8242074e15cf05e7764859f63dc3901/height=288;version=1;width=512/https%3A%2F%2Fogimage.blog.st-hatena.com%2F6435988827676522384%2F6435988827676523057%2F1460995386)
デジパ、「業界別企業サイト分析 - 繊維業界編」を発表。繊維業界の主要企業48社の企業サイトを分析｜ニュースリリース｜デジパ株式会社
（ウェブサイトは2008年3月の時点のものを対象） 「業界別企業サイト分析 - 繊維業界編」の完全版（PDFファイル / 170KB）はこちらからご覧いただけます。 解説 業界の特徴としては、Flashを多用したウェブサイトが比較的多く見られた反面、ユーザビリティやアクセシビリティの面で平均ポイントが低い傾向が見られました。 1位 旭化成株式会社 旭化成株式会社の場合、レイアウト目的でのtable要素の使用や、Flashのアニメーションの動きの強さといった項目でポイントが低く、アクセシビリティの分野で若干ポイントを下げましたが、全体的には標準的な項目を押さえており、総合得点で高いポイントを獲得しました。 2位 ユニチカ株式会社 ユニチカ株式会社の場合、お問い合わせフォームの使い勝手やその他の項目の小さな減点のため、ユーザビリティの分野で若干ポイントが低めになりました。 またアクセシビリティ
ユーザビリティと驚き最小の法則について - めもり〜り〜く
驚き最小の法則という言葉を、ぼくはRubyコミュニティ界隈から学んだような気がするんだけど、これはユーザビリティにとっては非常に重要な考え方だよね。いままでつらつらと書いてきたLeopardレビューも、この法則を軸にして考えている気がする。 http://www.seshop.com/lib/redir_url.asp?url=%2Fbook%2Fpreview%2F200212%2F4-7981-0228-8-ruby.pdf だから、以下に書いたことはほとんど上に書かれていることの言い換えになるのだと思う。 この法則は、一昔前に流行っていまはあまり聞かなくなった「アフォーダンス」とも関係すると思うんだけど、つまり人間は身の回りのあらゆることに対して「予測」を行ってるということを前提にしようということだと思う。たとえば、ドアノブがついているドアがあったとしたら、それが引き戸だとは思わない
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
アクセシビリティを加速するWAI-ARIA
IDEA * IDEA
https://www.openvista.jp/archives/note/2009/flexible-web/?2009/flexible-web/
慶應義塾大学 湘南藤沢キャンパス（SFC）
目次 | Just Ask: デザインプロセスを通じて取り組むアクセシビリティ
みんなの公共サイト運用モデル 誰でも使える地方公共団体ホームページの実現に向けて