Re: 早稲田大学のサイトリニューアルがなぜこんなにひどいのか。
2014年11月18日 hokorinさんのお書きになった早稲田大学のサイトリニューアルがなぜこんなにひどいのか。という記事が炎上してしまっているようです。何となく言わんとしていることが分かる部分はあれど、しかし全体的に言葉足らずな印象はあって、残念な感じがします。本件については当初、触れるつもりはなかったのですけど（論点が複数絡み合っている印象があり触れにくく感じました）、とはいえWebアクセシビリティについて書かれた記事でもありますので、その領域についてのみ、自分の考えを整理する目的で書いてみようと思いました。 今回のリニューアルではIE10以降を対象外としていて、普通に使っているIE7や8では見ることができません、 これはアクセシビリティ上かなり問題だと思います、多くの人が目にする大学というサイトでノンアクセシビリティを貫くというのは、いまの時代にそぐわないのではないでしょうか。 ま
スマートフォンサイト制作で「なんで拡大縮小できるようにしてるの？」と言われた時の対処法
※ この話はフィクションです。実在の人物や団体などとは関係ありません スマートフォンサイトを制作していて、「サイトを自由に拡大縮小できるようにしてるのは理由あんの？」と言われた時の場合の話です。 Viewportの設定どうしてたか <meta name="viewport" content="width=device-width"> これだけ。こうするとサイトの幅=デバイスの幅になり、拡大縮小は自由にできる。 対処法1：話し合うそもそもブラウザにデフォルトで備わっている拡大縮小機能を無効にするのがおかしいなぜ拡大縮小を無効にするのか ネイティブアプリ感を出したい拡大縮小した時に表示が崩れるのを防ぎたい拡大した時に画像がボヤけるのが嫌例えば構成/デザインの上で小さな文字を使わなくてはならない場合、ユーザーはどうやってその文字を拡大するのかユーザーが拡大したいと思っても拡大が禁止されていたら、
入力フォームのプレースホルダーを使ってはいけない
入力フォームのプレースホルダーテキストは、入力欄にどんな情報を入れたのかをユーザーが思い出すことや、エラーのチェック・修正を難しくしてしまう。また、視覚や認知機能に障害のあるユーザーにはさらなる負担となる。 Placeholders in Form Fields Are Harmful by Katie Sherwin on May 11, 2014 日本語版2014年6月17日公開 コンテクストに沿った説明やヒントは、入力フォームのそれぞれに何が入るかを明確にするのに役立つ。その結果、入力が促進され、コンバージョンレートは向上する。ヒントの提供方法はいろいろとある。実装として一般的なのは、入力フォーム内に説明を入れるやり方だ。しかし、残念ながら、入力フォーム内のプレースホルダーはユーザビリティに役立つよりも損なうことのほうが多いことがユーザビリティテストでは繰り返し示されている。 ラベル
「ページの先頭に戻る」リンク不要論
2013年9月4日 著 ページの先頭に戻るリンク -- Website Usability Infoという記事を読んで。かねてより、当サイトにおける情報設計については何回かに分けて覚え書きをするつもりでおり、その一環としていずれ書き起こす予定だったのですが、良い機会なので自分なりの「ページの先頭に戻る」リンク不要論を書いておきます。 なぜ「ページの先頭に戻る」必要が生ずるかといえば、ページ固有のメインコンテンツ（以下「本文」）を読んだ後でサイトID（＝サイトのトップページへのリンク）だったり、グローバルナビゲーションだったり、あるいはサイト内検索とかユーティリティ系リンクなど、ページの先頭部分（ヘッダー）にある機能、情報要素にアクセスするため、でしょう。 しかし、それらが仮にヘッダーではなく、本文より後ろに登場すれば、そもそも「ページの先頭に戻る」必要はなくなります。むしろそのような表示順
スキップリンクって必要？マジで！？
2013年1月14日 著 この文章は、28回目となる国際「テクノロジーと障害者」カンファレンス（通称CSUNカンファレンス2013）に提出したペーパー「Do we really need skip links, seriously?」の日本語訳です。残念ながら審査を通過することができず（セッションに空きが出れば採用するかもねという返事）、発表をすることは叶いませんでした。ウェブアクセシビリティ基盤委員会が先だって開始したJIS X 8341-3:2010 達成基準7.2.4.1を満たす条件に関する意見募集に対する自分の意見（の一部）として、以下に掲載しておきます： Webページの主要なコンテンツに対し、直接的なアクセスを提供するスキップリンクを設けることは、WCAG 2.0の達成基準 2.4.1 バイパスブロックを満たすための方法として、広く知られています。スキップリンクは、Webページを
PDFへのリンクは別窓にしていますか？リンク先を別窓・タブにするかどうかの自由を制限しないためユーザービリティ上、target=_blankは推奨されていないのは承知です。しかし、target=_blankをしていなければ、開いているサイト画面と同じ窓にPDFが開き、PDFを見終...
PDFへのリンクは別窓にしていますか？ リンク先を別窓・タブにするかどうかの自由を制限しないためユーザービリティ上、target=_blankは推奨されていないのは承知です。 しかし、target=_blankをしていなければ、開いているサイト画面と同じ窓にPDFが開き、PDFを見終わって右上の×で閉じると元のサイト画面も一緒に閉じられてしまうことになります。 上記のことから、現状はガイドラインには反していますがtarget=_blankするようにしています。皆さんはどのようにしているか知りたいです。 そのサイトの閲覧対象者がどのようなITリテラシーであるかによって使い分けています。 ブロガーやIT情報関連者を対象としているなら別窓は使用していません。その場合は、PDFでも同様です。ユーザビリティー上、混在するのが一番使いにくさを感じさせますので。 一方、その他は、外部サイトへのリンク、P
タッチパネルが使えない人がいる | 水無月ばけらのえび日記
公開: 2012年2月19日16時15分頃 「タッチパネル拒否症 (blog.yamk.net)」。静電容量式のタッチパネルがうまく使えない体質の人がいるというお話。 iPhone で一気に普及した静電容量式のタッチパネルは、指先からの僅かな静電気に反応するのだが、指先がパサパサになってしまう人は全く電気が流れないためタッチセンサーが応答しない。 対策としては、触る直前に指に息を吐きかける、保湿クリームを常に指先に塗る、等が挙げられている。 実は私も冬場は指先がバサバサになって皮がむけたりする体質で、指先で何かをこすると痛くて厳しかったりします。 ※皮膚科の医師によると、自律神経の関係で汗が出っぱなしになっていて、皮脂が失われるのが原因らしいです。いちおうワセリン (www.amazon.co.jp)を使って症状を緩和していますが、無限の持続時間があるわけでもないので……。 そういえば、P
Re: スキップリンクにまつわるいくつかの議論
2012年1月28日 ばけらさんがスキップリンクにまつわるいくつかの議論を紹介されていましたが、そのとあるところに自分も居合わせていたので（議論した場を隠す必要性を僕は感じないのですが......ちなみにWAIC WG2でのお話です）、ちょこっと言及しておこうかと。 ビジュアルブラウザを使っている一般のユーザーが、「次の見出しにジャンプする」という機能を必要とするケースがあるのか スキップリンクによるブロックスキップは、特定の障害を持つユーザーの役には立つかも知れないが、その他のほとんどのユーザーには無用な者なのではないか 既にうろ覚えですが、上記は自分の発言からの書き起こしのように記憶しています。要点は、スタイルシートでマルチカラムレイアウトが実装されたWebページにつき、コンテンツをリニアライズして利用するのでなければ、ブロックスキップは有用ではないのでは？という疑問です。リニアライズ
らき☆すた9 | 水無月ばけらのえび日記
公開: 2012年1月3日19時30分頃 9巻が出ていました。 らき☆すた9 (www.amazon.co.jp)自分が何巻まで持っていたのか自信がなく、とはいえ平積みになっているからには新刊だろうと判断して購入。新刊でした。 内容としては、まあ良くも悪くもマンネリなのですが、今回はずば抜けて印象に残ったものがありました。それはepisode258の冒頭の話。 さてっと保存もできたし戻る戻るっと――あれ? ああ 何だ別窓で開いてたのか―― さてとこの絵は堪能したし閉じる閉じるっと―― ――ってコレ別窓じゃなかったのか―― これは別窓体質っ!? 別窓とそうでないものが混在していると分かりにくいという話で、全くその通りだと思います。どちらかに統一されているべきで、全てのリンクが別窓というのはあり得ないでしょうから、どうすべきかは自ずと明らかだと思うのですが。
ウェブサイトに当たり前のように配置されるメニューとは、一体何だろう？
ウェブサイトやブログに当たり前のように配置されるメニューですが、これはいったいなんだろう？と改めて考えてみます。 時に装飾もされるこの要素は一体何か？ サイトのそれは「見る」要素か「使う」要素か？のどちらかというと、「使う」要素です。ということは少なくとも、ごちゃごちゃ動かすものではなさそうです。 配置場所は、上にあるときもあれば、横にあるときもあります。サイトによっては、これが多すぎて、「見る」要素がとてもとても少なくなってしまっているサイトもあります。 これらは、サイト内の「見る」要素を分類していることが多いです。つまり、分類するために「使う」要素といえそうです。 当たり前に存在するよくわからないものを、確かめるためには一度とってしまうのがてっとりばやいです。 とったときに感じる違和感から、それが一体何か？のヒントが生まれることがあります。 ということで、いさぎよくとってしまうと、「見
勝手にリデザイン：新宿高層ビルの館内施設案内板
9/8/2011勝手にリデザイン：新宿高層ビルの館内施設案内板Twitterで、あるサイン（案内板）のことが話題になっていました 。新宿のあるビルの案内図のようですが、わかりづらいことが問題になっているようです。 …確かにこれはわかりません。トイレを探している時に遭遇したら結構辛いと思いますね。でも、なぜわかりにくいのか、どういう改善案が考えられるのか、もう少し考えてみることにしました。 仕様 まず、この図から読み取れる情報だけでは何が「正解」かわからないので、実際の現場に足を運んでみました。 そして、館内をぐるっと見学してみて、大体の施設の配置を把握してきました。（ちなみに、ビルの中をウロウロしてると普通に不審者だと思うので、警備員の方に目的を伝え、撮影可否についても尋ねましたが、撮影はNGとのことでした） それで、記憶を頼りに書いてみた館内図がこちらになります。案内板Aが問題となる案内
新宿到着。トイレどこか分からんわ！ これ作ったやつマジくたばれ。... on Twitpic
新宿到着。トイレどこか分からんわ！ これ作ったやつマジくたばれ。
Latest topics > Firefoxアドオンの開発を通じて考えるようになったインタラクションデザイン - outsider reflex
Latest topics > Firefoxアドオンの開発を通じて考えるようになったインタラクションデザイン 宣伝。日経LinuxにてLinuxの基礎？を紹介する漫画「シス管系女子」を連載させていただいています。 以下の特設サイトにて、単行本まんがでわかるLinux シス管系女子の試し読みが可能！ « Fox Splitterを作りなおした Main ジム通いを始めた » Firefoxアドオンの開発を通じて考えるようになったインタラクションデザイン - Jun 30, 2011 あかつかだいすけさんのご紹介で、6月27日に慶応大学湘南藤沢キャンパスでインタラクションデザインについての講義を1時間ほどやらせていただきました。その際の発表資料はいつもの通り「高橋メソッド in XUL Returns」で作ったのですが、Remote XULがデフォルトで禁止されるようになったFirefox
今日のUIは高齢者には優しくない？ | スラド
プロダクトデザインおよびエンジニアリングを専門とするMike Bradley氏によると、今日のソフトウェアやハードウェアは高齢者にとっては不必要に複雑であるという問題があるそうだ（PC Pro、本家/.）。 昔のグラフィカルUIはよりシンプルであり、現在ほど複雑ではなく、どのように操作すればよいかはずっと分かりやすかったとBradley氏は指摘する。また今日のUI設計は特に若者をターゲットとしており、結果として高齢者を疎外する状況を生んでいるという。 スマートフォンユーザのUI知識を前提とする開発側にも問題があるという。iPadのような端末はPCより操作は分かりやすいとされているが、それでもある時点にくるとアイコン操作に関する一定の慣れと知識を要求されるとのこと。 例えばiPhoneのアラームについては時計の文字盤と「＋」記号のアイコンが表示されているが、高齢者はこのアイコンと「アラームを
JIS X 8341-3:2010の達成基準は難しい | 水無月ばけらのえび日記
公開: 2011年4月29日19時45分頃 こんな記事がありますね……「中央省庁Webサイトのアクセシビリティ対応はまだ不十分 日経BPコンサルティングが調査結果を発表 (pc.nikkeibp.co.jp)」。 この調査では、同社が独自に設けた20の項目について調べた（調査概要）。項目は大きく3つに分類される。知覚に関する項目（説明が必要な画像に代替テキストを付与しているか、など）、操作に関する項目（キーボードのみで適切にページ移動ができるか、など）、理解に関する項目（Webページで使われている言語が明示されているか、など）である。いずれの項目も、2010年8月に公示されたWebアクセシビリティに関する規格「JIS X 8341-3:2010」を参考にして設定されている。 JIS X 8341-3:2010という名前はちらっと出ているものの、これはあくまで独自調査です。JIS X 834
Firefox 4 で Ctrl+E で検索バーにフォーカスしたい - てっく煮ブログ
Firefox 4 が出たので試しに使ってみたらだいぶ高速になっていていい感じです。ただ、いままは Ctrl+E で検索バーにフォーカスできたのですが、Firefox 4 になってから Ctrl+E が使えなくなってしまいました。Ctrl+K を使えばフォーカスできるのですが、いままで Ctrl+E に慣れていたのでいきなり違うキーを使えといわれても困ってしまいます。解決するアドオンが既に存在している！そこで軽く調べてみると Ctrl+E で検索バーにフォーカスできるようにするアドオンがありました。Change Search Shortcut :: Add-ons for Firefox試しにインストールして再起動すると、Ctrl+E で検索バーにフォーカスできるようになりました。めでたしめでたし。なぜ Ctrl+E が使えなくなったのかFirefox 4 の目玉新機能「Panorama」
外部サイトへのリンクにtarget=_blank属性を追加（jQuery）
外部サイトへのリンク jQueryを使って、外部サイトへのリンクにtarget=_blankを追加する仕様にしました。 外部へのリンクにtarget=_blank属性を付けることはアクセシビリティの観点から望ましくない。つまり、別ウインドウで開くかどうかはユーザーが判断すべきとされてきましたが、これだけタブブラウザが普及するとかえってアクセシビリティ上よろしくないという気がします。 といって膨大な記事の中から外部へのリンクを探し出して、手書きでtarget=_blank属性を追加するのも大変な作業量です。 そこで、jQueryを使って処理することにしました。 関連リンク Wordpress: 外部リンクをtarget=_blankに - blog.eラーニング.co.jp jQuery (document).ready( function () { jQuery ('a[href^=htt
JIS X 8341-3 って対応する意味あるの？という問いに対して – blog.shiten.info
JIS X 8341-3（高齢者・障害者等配慮設計指針－情報通信における機器、ソフトウェア及びサービス－第三部：ウェブコンテンツ）（規格詳細情報） は、Web コンテンツのアクセシビリティに関する設計指針で、昨年 2010年8月20日に JIS X 8341-3:2010 として改正版が公示された日本工業規格です。初版は、2004年に公示されています。アクセシビリティのセミナーや、ウェブ制作会社が説明に使う場合は「ウェブコンテンツ JIS」と呼ばれていたりします。 現状、この規格には認証機関は存在しません。また、法令のような、強制力や拘束力もありません。第一者監査（内部監査）、第二者監査（利害関係を伴う外部組織≒顧客による監査）による適合性評価に基づいて、自己適合宣言を行うしかありません。この点について、疑問を持つ方がいらっしゃって、「だったら適合しても意味がないじゃないか」という人もいら
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JintrickのマイクロWeb日記, 2011 春
https://jp.techcrunch.com/2011/02/18/20110217twitter-wants-to-know-why-you-arent-using-newtwitter/
