サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
衆院選
www.infoaxia.com
改正版 JIS X 8341-3 に適合した実装方法 「箇条7 ウェブコンテンツに関する要件」の概要 UAIセミナー「Webアクセシビリティ@秋葉原」-JIS改正原案の紹介-(2009年5月22日、ITRC研究会) この資料のスライド: PDF版 1.「箇条 7. ウェブコンテンツに関する要件」の読みかた まずは、アウトラインの把握から。 ウェブコンテンツに関する要件 2004年版: 5. 開発及び制作に関する個別要件 5.1 規格及び仕様 5.2 構造及び表示スタイル 5.3 操作及び入力 5.4 非テキスト情報 5.5 色及び形 5.6 文字 5.7 音 5.8 速度 5.9 言語 2009年版: 7.ウェブコンテンツに関する要件 7.1 知覚可能に関する原則 7.2 操作可能に関する原則 7.3 理解可能に関する原則 7.4 堅牢性に関する原則 「ウェブコンテンツに関する要件」
リンク&資料集:ツール Webアクセシビリティに関連するツールのサイトへのリンクです。 無償ツール Webページのアクセシビリティをチェックできる無償のソフトウェアです。50音順。 Web Accessibility Toolbar(ウェブ・アクセシビリティ・ツールバー) 開発:WAT-C(Web Accessibility Tools Consortium)、対応OS:Windows 98 / Me / 2000 / XP、価格:無料 WindowsのInternet Explorerに組み込まれるツールバーで、ブラウザと一体化して手軽に使用できるのが特長。文書構造、画像のalt属性、テーブルの構造、日本語特有の問題、リンクのラベル等のチェック、さまざまな視覚障害での見え方表示、画面拡大などのシミュレーション、Webアクセシビリティ関連サイトへのリンクなど、豊富な機能が用意されている。
次に、JIS X8341-3の基本的な考え方を示している"基本方針"と"基本的要件"について解説します。 基本方針 JIS X8341-3:2004の"4.1 基本方針"では、以下の3つのポイントを挙げています。 a) ウェブコンテンツを企画・制作するときに,可能な限り高齢者・障害者が操作又は利用できるように配慮する。 b) ウェブコンテンツは,できるだけ多くの情報通信機器,表示装置の画面解像度及びサイズ,ウェブブラウザ及びバージョンで,操作又は利用できるように配慮する。 c) ウェブコンテンツの企画から運用に至るプロセスで情報アクセシビリティを常に確保し,更に向上するように配慮する。 高齢者および障害者への配慮はもちろんですが、b)では多様化するデバイスやブラウザへの配慮が挙げられています。近年ではパソコン以外にも、PDAや携帯電話といったモバイル系の端末が普及してきていますし、情報家電
要求分析、現状把握、そして要件定義 -木達 一仁の『Web標準に準拠したサイト構築』 第2回 Web標準に準拠し、(X)HTMLとCSSでサイトを構築する際のワークフローやポイントをご紹介するシリーズの第2回では、前回ご紹介した7つのプロセスのうち最初の3つ、要求分析に始まり現状把握から要件定義にいたるまでの各プロセスに焦点を当てます。これらはいずれも、Web標準準拠という前提の有無にかかわらず極めて重要なプロセスだと思いますが、Web標準という視点から要点をまとめてみます。なお本コラムでは、既存のサイトの再構築を前提とします。 1.要求分析 主にヒアリングを通じ、サイトあるいはコンテンツへの要求を分析します。この要求には、情報を発信する側と受信する側双方のニーズやゴールが含まれます。ことWeb標準に関していえば、それに準拠することでさまざまなメリットを享受することが期待できるわけですが
現在位置:ホーム リンク&資料集 『Research-Based Web Design & Usability Guidelines』 『Research-Based Web Design & Usability Guidelines(調査研究に基づいた Web デザイン & ユーザビリティ・ガイドライン)』の日本語訳は、アメリカ保健福祉省(HHS)の許可を受けた株式会社インフォアクシアが提供しています。 目次 『第9章:見出し、タイトルとラベル』は、3月8日火曜日に公開する予定です(毎週火曜日更新)。 イントロダクション 背景および方法論 ガイドラインの使い方 第1章:デザインプロセスと検証 第2章:ユーザー・エクスペリエンスの最適化 第3章:アクセシビリティ 第4章:ハードウェアとソフトウェア 第5章:HOMEページ 第6章:ページレイアウト 第7章:ナビゲーション 第8章:スク
「カラー・コントラスト・アナライザー」は、色のチェックツールです。前景色と背景色のコントラストをチェックしたり、色覚の違いによる見え方をシミュレーションしたりすることができます。 このソフトウェアは、The Paciello Groupが提供しており、Windows版とmacOS / OS X版があります。 色のコントラストのチェック ウェブコンテンツの前景色と背景色のコントラストが十分かどうかを判定する基準には、W3Cの『WCAG 2.0』で定義されている「コントラスト比」の計算式を用いています。このコントラスト比を用いた達成基準は、そのまま日本工業規格の『JIS X 8341-3:2016』でも採用されています。 1.4.3 コントラスト(最低限レベル)に関する達成基準 テキスト及び文字画像の視覚的提示には,少なくとも4.5:1 のコントラスト比がある。ただし,次の場合は除く(レベル
新時代の見出しとキャッチコピーの書き方 -益子 貴寛の『Webライティングの理論と実践』 第2回 Web上で魅力的な文章やキャッチコピーを書くためのライティングメソッド「Webライティング」。ユーザーをコンテンツに引きつけるには、魅力的でわかりやすい「見出し」や「キャッチコピー」が大切。今回は見出しとキャッチコピーの基本、さらに検索・RSS時代に求められる表現方法について考えてみよう。 Webは見出しで決まる ロボット型検索エンジンの発達・普及により、ユーザーは必ずしもトップページからブラウジングするわけではない。Webサイトは検索エンジンによって、いわば分断されているのである。したがって、ページ単位で内容がわかるようなタイトルをつけるのが大原則だ。 また、ページタイトルと同じキーワードが見出し要素(h1~h6要素)など本文中で使われていれば、検索アルゴリズム上でキーワードとの適合度が高
Webというのは、従来の新聞・雑誌などの紙の印刷物、テレビ、ラジオといったメディアと比較しても、無限の可能性を秘めていることは皆さんも日頃から感じていることでしょう。そして、それは高齢者や障害者などのユーザーの立場からも同じことが言えるのです。 Webコンテンツならではのユーザーのメリット 例えば、新聞や雑誌などの紙の印刷物の文字サイズを考えてみましょう。印刷された文字の大きさは、それを読むユーザーが変えることはできません。しかし、Webコンテンツの場合はもしユーザーが文字サイズが小さくて読みづらいと感じれば、ブラウザの設定を変更して文字サイズを大きくすることができます。そして、パソコンの画面解像度やブラウザのウィンドウサイズも変更することができるなど、ユーザーの好みに応じてその閲覧環境を自分好みにカスタマイズできるのです。紙の印刷物と同じように文字の大きさやレイアウト幅を固定してしまうW
見やすく読みやすい文章レイアウトと校正のコツ -益子 貴寛の『Webライティングの理論と実践』 第3回 Web上で魅力的な文章やキャッチコピーを書くためのライティングメソッド「Webライティング」。今回は、文章の見やすさ、読みやすさを向上させるためのレイアウトや編集のポイントと、校正テクニックについて見ていこう。 長い文章は段落分けし、行間を広めにとる Webページでは長い文章は読みやすさを考えて適度に段落分けし、行間を広めにとる必要がある。次の2つの例を比較してみよう。 以下にある、"[調整前]"の文章は段落分けが明確でなく、行間が狭いため、全体が雑然とした雰囲気になっている。このようなレイアウトでは、文章の内容に関わらずユーザーに一瞥されてしまい、読んでもらえない可能性が高い。 一方、"[調整後]"の文章は適度に段落分けされ、行間もやや広めにとってあるので、読みやすく理解しやすい。上
CSSの導入を阻む4つの難関 -大藤 幹の『Web標準の基礎知識』 第3回 以前より泥臭い作業は減ったものの つい数年前までは、CSSレイアウトは非常に泥臭い作業が必要なものでした。特定のブラウザでの原因不明のバグに悩まされながら、洗練されていない裏ワザ的テクニックを使うなど、様々な試行錯誤を繰り返すことでやっと完成できるようなものだったのです。しかし、現在は違います。各種ブラウザで発生する問題の多くはすでに把握されていて、その対処法も広く知られるようになり、裏ワザ的テクニックもそれほど使わなくて済むような状況となっています。 とはいえ、CSSはXHTMLと比較するとやはり難しいと言わざるを得ません。実際問題として、CSSをうまく導入できない、なかなか上手に使いこなせないという人は意外に多いのではないでしょうか。その理由を考えてみると、CSSを難しくしている原因の主なものは、CSS自身で
リンク&資料集:JIS X 8341-3 2004年6月20日に制定されたWebコンテンツのJIS X 8341-3の関連サイトへのリンクです。 報道資料 経済産業省:情報バリアフリー分野の日本工業規格の制定 経済産業省のJIS X 8341-3制定に関する報道資料です。 購入 『 JSA Web Store』 JIS X 8341-3の規格票が、冊子またはPDFファイルのダウンロードで購入できます。規格番号の"X8341-3"で検索してみてください。 閲覧 JISC(日本工業標準調査会) JIS X 8341-3の規格票をPDFファイルで閲覧することができます。 関連情報 『 日本工業規格(JIS)X8341関連情報』 情報通信研究機構が提供する関連情報サイトです。 『 日本工業規格 JIS X8341「高齢者・障害者等配慮設計指針」関連情報』 PCオープン・アーキテクチャ協議会が提供す
Webアクセシビリティとは? 2004年6月20日にWebコンテンツのアクセシビリティが、JIS(日本工業規格)化されました。"アクセシビリティ"というと、障害者への配慮だと考えている人が多いようです。もちろん間違いではありませんが、日本でアクセシビリティを考える場合には、それ以外にも高齢者層のユーザーへの配慮も考えなくてはなりません。2004年6月20日に公示されたJISの正式名称は、JIS X8341-3『高齢者・障害者等配慮設計指針-情報機器における機器,ソフトウェア及びサービス-第三部:ウェブコンテンツ』となっています。 アクセシビリティの定義 "Webアクセシビリティ"とは、"Webを利用するすべての人が、年齢や身体的制約、利用環境等に関係なく、Webで提供されている情報に問題なくアクセスし、コンテンツや機能を利用できること"ということができます。そして、そのようなWebコンテン
Web アクセシビリティを実践する上での考え方やノウハウを、エキスパートの記事や実践事例のインタビューなどで紹介します。
Webの媒体特性とユーザーリテラシー -益子 貴寛の『Webライティングの理論と実践』 第1回 Web上で魅力的な文章やキャッチコピーを書くためのライティングメソッド「Webライティング」。今回は「Webの媒体特性」と「ユーザーリテラシー」の観点から、Webライティングについて考えてみよう。 Webの媒体特性とWebライティング Webベースの文章と紙ベースの文章のどちらを長く読んでいられるかといえば、紙ベースと答える人が圧倒的に多いだろう。Webライティングの観点からWebサイトと紙媒体の違いを考えてみると、次の5つがWebの媒体特性として浮かび上がってくる。 1. 双方向性・対話性が高い 低コスト、情報受発信の障壁の低さなどの理由から、Webはユーザーがリアクションを寄せやすいメディアである。このような双方向性・対話性は、Webの媒体特性を決定づける大きなポイントである。 2. 見に
"守り" ではなく、"攻め" のアクセシビリティのススメ - 植木 真の『アクセシビリティとWeb標準、SEO』 第1回 JIS X 8341-3制定により進んだアクセシビリティ対応 2004年6月に JIS X 8341-3(『高齢者・障害者等配慮設計指針-情報機器における機器,ソフトウェア及びサービス-第三部:ウェブコンテンツ』)が制定されたことをきっかけにして、官公庁や自治体はもとより、企業サイトにおいてもアクセシビリティに積極的に取り組む企業が増えています。JIS 制定前後は、業種もIT関連がほとんどでしたが、最近では百貨店、新聞社、銀行、証券、食品、製薬など、業種に関係なく広がっていることは皆さんもご存知のことでしょう。ガイドライン整備や法制化では先行していた欧米などの海外諸国でも、最近は企業サイトでの取り組みが徐々に始まっているようですが、こと企業サイトのアクセシビリティ対応
ワークフローの概要とその考え方 -木達 一仁の『Web標準に準拠したサイト構築』 第1回 Web標準に準拠して、文書構造を適切なマークアップにより明示し、文書の見た目はスタイルシートで定義するようサイトを構築する際の、具体的なワークフローやポイントについて、これから4回にわたりお話させていただきます。第1回の今回は、全体的なフローの紹介とその考え方についてご紹介します。 ワークフロー概要 レイアウト目的で(X)HTMLのテーブル要素を使用し、スタイルシートはまったく(あるいはほとんど)使用していない実装手法に基づくサイトをWeb標準に準拠させる場合、そのフローは以下の7つのプロセスから成ります。 個々のプロセスの呼称や、全体をいくつのプロセスに分けて定義するかは、プロジェクトの規模等によって異なるでしょうが、概ねこのようなプロセスが必要になるのではないかと思います。 サイト制作は段取り八
エキスパート連載コラム アクセシビリティ、Web標準(Webスタンダード)、SEO(検索エンジン最適化)、ライティング、それぞれの第一人者の皆さんによる連載コラムです。"木を見て森を見ず" にならないように、アクセシビリティを関連するキーワードとあわせて考えてみましょう。 植木 真の『アクセシビリティとWeb標準、SEO』 第1回:「"守り" ではなく、"攻め" のアクセシビリティのススメ」 第2回:「アクセシビリティとWeb標準」 第3回:「アクセシビリティとSEO」 第4回:「アクセシビリティとライティング」 第5回:「アクセシブルなサイト構築フロー」 プロフィール 植木 真(うえき まこと) 主に大手企業サイトのアクセシビリティ対応をサポートするコンサルタント。2004年10月に株式会社インフォアクシアを設立。2004年6月に制定された JIS X 8341-3 の策定作業に従事し
アクセシビリティ、Web標準(Webスタンダード)、SEO(検索エンジン最適化)、ライティング、それぞれの第一人者の皆さんによる連載コラムです。"木を見て森を見ず" にならないように、アクセシビリティを関連するキーワードとあわせて考えてみましょう。 植木 真の『アクセシビリティとWeb標準、SEO』 第1回:「"守り" ではなく、"攻め" のアクセシビリティのススメ」 第2回:「アクセシビリティとWeb標準」 第3回:「アクセシビリティとSEO」 第4回:「アクセシビリティとライティング」 第5回:「アクセシブルなサイト構築フロー」 プロフィール 植木 真(うえき まこと) 主に大手企業サイトのアクセシビリティ対応をサポートするコンサルタント。2004年10月に株式会社インフォアクシアを設立。2004年6月に制定された JIS X 8341-3 の策定作業に従事した後、現在は W3C/W
情報を公開し、共有しよう - 住 太陽の『トリックに頼らない本当のSEO』 第1回 公開されていない情報にはアクセスできない 私たちは現在、ほとんど毎日のようにWeb上の情報を利用しています。例えば、ちょっと出かけよう、といった場合でも、天気予報サイトで目的地の天気や気温を調べて服装を選択したり、乗り換え案内のサイトで路線情報を調べて出発時間を決めたり、ホテル予約サイトで宿泊施設を決めたり、ブログ検索サイトで目的地周辺の観光やグルメの情報を調べて立ち寄り先を決めたり、といった具合で、Web上の情報を利用しない日常など今や考えられません。多種多様な人々が、多種多様な情報を公開し、共有しているWebの世界は、まさに情報の宝庫のようになっており、GoogleやYahoo!などの検索エンジンを使えば、仕事のこと、生活のこと、趣味のことなど、見つからない情報などないかのようです。 しかし、残念なが
アクセシビリティとSEO - 植木 真の『アクセシビリティとWeb標準、SEO』 第3回 アクセシビリティを確保すると、SEO効果がある ウェブクローラーは、基本的に全盲ユーザーと同じだ。 君のサイトがアクセシブルでないほど、Googleやその他の検索エンジンから訪れる人が少なくなる。 これは、書籍『DESIGNING WITH WEB STANDARDS』で、その著者のJeffrey Zeldman氏が述べている言葉です。"ウェブクローラー" というのは、いわゆる検索エンジンのロボットのことを指します。 また、アクセシビリティを確保したらなぜか検索結果ページのランキングが上がった、という話もよく聞かれるようになってきました。これについては、筆者も数年前からセミナーや雑誌記事などで取り上げてきたことですが、最近こういった話を耳にする機会が多くなってきたように思います。JIS X 8341
Web標準って何? -大藤 幹の『Web標準の基礎知識』 第1回 Web標準の2つの意味 最近になって、「Web標準」という言葉をよく耳にするようになりました。では、「Web標準」とは具体的に何を指す言葉なのかというと、ひとことではなかなか表現することができません。その理由を考えてみると、「Web標準」には大きく2つの意味が込められて使われているからではないかと思います。 Web標準は「Webの標準規格の総称」 1つめの意味としては、英語では「Web Standards」と呼ばれていることからもわかるように、「Webに関する標準規格の総称」であると言うことができます。つまり、W3C(World Wide Web Consortium:中立的な立場からWeb関連の技術仕様やガイドラインなどの策定を行っている国際産業コンソーシアム)が策定・公開しているXHTMLやCSS、ECMA(Europ
Web サイトは、使いやすく効率的な人間とコンピュータのインタラクションを容易にして促進するようにデザインされるべきです。デザイナーは、コンピュータの性能を利用してユーザーの作業負荷を軽減するように、あらゆる手段を試みなくてはなりません。ユーザーは、情報が直接的に分かりやすい体裁で表示されて、コンテンツの構成がとても直観的であるときに、Web サイトを最大限に利用することができます。また、通常の作業と一貫性がある、数秒間以上情報を覚えておく必要がない、すぐに理解できる用語がある、そして情報で負担をかけすぎない、といった一連のタスクもユーザーにとっては有益です。 Web ページが読み込まれるのにユーザーを数秒間以上待たせるべきではありません。そして、待たせている間は進捗状況を適切に提供するべきです。ユーザーは情報を容易に印刷できなければなりません。デザイナーは、ユーザーに勝手にウィンドウある
Webアクセシビリティを実践するには、ツールの活用が不可欠です。目的や運営・制作現場のニーズに適うツールを選択して作業を効率化して、アクセシブルなWebコンテンツ制作を実践しましょう。 Web Accessibility Toolbar Windows版 Internet Explorer のツールバーで、ブラウザ画面に表示されているWebページのアクセシビリティを様々な観点からチェックおよびシミュレーションすることが可能(ダウンロード:無償)。 Web Acessibility Toolbar の概要/ダウンロード カラー・コントラスト・アナライザー 画面上の背景色と前景色のコントラストを W3C が提案している計算式で判定でき、3つのタイプによる色覚特性での判定も可能なチェックツール(ダウンロード:無償)。『Web Accessibility Toolbar』からの起動も可能。 カラー
特集記事:Ajaxのアクセシビリティ イントロダクション:Ajaxとは? Ajaxのアクセシビリティを語る前に、まずAjaxとは何か、そしてAjaxがWebアプリケーションにどのような進化をもたらしているかを説明しておこう。 Ajaxという用語は、Asynchronous JavaScript and XML の略で、JavaScriptとXMLを組み合わせて用いる技術のことを指す。このAjaxを使うと、従来ならばWebページ全体をリフレッシュしなければならなかったインタラクションが、変化させたい部分だけを読み込むことが可能になり、操作性が軽快になるということで注目を集めている。たとえば、キーワードを入力して検索するとき、これまではキーワードを入力して検索ボタンを押すと、ページ全体がリフレッシュされて、検索結果ページが表示される、というのが当たり前だった。これがAjaxを使うと、検索ボタン
2001年6月20日に施行された米国のリハビリテーション法508条で定められているガイドライン(1194.22 Web-based intranet and internet information and applications.)をインフォアクシアが日本語訳しました。原文はあくまで英語ですので、参考資料としてご活用下さい。 リハビリテーション法508条の原文(英語) 第1194部22条 Webベースのイントラネットとインターネットの情報およびアプリケーション (a) すべての非テキスト要素には、それと同等な役割を果たす代替テキストを提供しなければならない。(例:alt属性、longdesc属性、またはHTMLの要素のコンテンツ内などで記述する。) (b) マルチメディアのプレゼンテーションと同等の役割を果たす代替コンテンツを、そのプレゼンテーションと同期させなければならない。 (c)
『Research-Based Web Design & Usability Guidelines』(以下、ガイドライン)を上手に活用することの秘訣は、いかに組織内で広く普及させて利用するか、にあります。単にガイドラインをデザイナーやサイト運営者に与えるだけでは、ガイドラインを採用して利用することにはなりません。 誰にどんなメリットがあるのか ガイドラインは、4つの主要な読者にメリットを提供します。 デザイナー ガイドラインは、デザイナー(特に、新人)が Web サイトを企画したりデザインしたりするときに考える必要のある事柄を明確にします。ガイドラインを適用することで、"個人的な主観" によるデザインのマイナスを削減するでしょう。そして、調査研究に基づいた解説を参照することで、デザインチームのメンバー間の意見の相違からくる衝突を減少させることができます。 ユーザビリティ専門家 ガイドライン
次のページ
このページを最初にブックマークしてみませんか?
『Webアクセシビリティを理解し実践するためのポータルサイト『infoaxia(インフォア...』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く