「Webアクセシビリティ」研究と Webページの試作 -視認性,操作性向上のための提案と試行錯誤的実践-

Slides:



Advertisements
Similar presentations
Web アクセシビリティ ~新しいアクセシビリティの基準~ 北海道情報大学 情報メディア学 部 情報メディア学科 新井山ゼミ 山口 岳.
Advertisements

「ジャグリング」を題材とする 動画コンテンツ制作 -初心者向けディジタル・ジャグリング・マニュ アル- 北海道情報大学 情報メディア学 部 情報メディア学科 新井山ゼミ 中西 真輝.
「 DTM と職業」に関する調査と DTM 楽曲の制作 北海道情報大学 情報メディア学 部 情報メディア学科 新井山ゼミ 宮本 拓美.
Integrated Personal Page C05823 森本万里子 C05829 西山礼恵 C05899 高木華子.
DTM を使った楽曲制作 DTM を扱う職業などの調査 北海道情報大学 情報メディア学 部 情報メディア学科 新井山ゼミ 宮本 拓美.
ランダム作曲とイメージ動画の 作成 北海道情報大学 情報メディア学 部 情報メディア学科 新井山ゼミ 太田 基晶.
プログラム作品制作 ~ ActionScript 3.0 ~ 北海道情報大学 情報メディア学 部 情報メディア学科 新井山ゼミ 倉島 健.
DTM を使った楽曲制作 DTM を扱う職業などの調査 北海道情報大学 情報メディア学 部 情報メディア学科 新井山ゼミ 宮本 拓美.
DTM を使った楽曲制作 DTM を扱う職業などの調査 北海道情報大学 情報メディア学 部 情報メディア学科 新井山ゼミ 宮本 拓美.
RSS,Atom の動向 理工学部 情報学科 3 年 片山友輝. 発表内容 ・ RSS,Atom おさらい ・なぜ Atom ができたか? ・ Atom の特徴 ・ Atom の動向 ・ Atom フィードの記述方法 ・ Atom 対応ツール ・参考文献・資料.
DTM を使った楽曲制作 DTM を扱う職業などの調査 北海道情報大学 情報メディア学 部 情報メディア学科 新井山ゼミ 宮本 拓美.
DTM を使った楽曲制作 DTM を扱う職業などの調査 北海道情報大学 情報メディア学 部 情報メディア学科 新井山ゼミ 宮本 拓美.
六角大王による 3DCG の作成 北海道情報大学 情報メディア学 部 情報メディア学科 新井山ゼミ 田中 聡.
北海道情報大学 情報メディア学部 情報メディア学科 新井山ゼミ 中村 有佑
北海道情報大学 情報メディア学部 情報メディア学科 新井山ゼミ 金子 拓磨
「図書管理」のための Webアプリケーション開発 -Apache/Tomcat/MySQL/Java on Windows XP-
Flash作品制作 ~ActionScript 3.0~
WWW のおはなし 神戸大学理学部地球惑星科学科 4 回生 佐伯 拓郎 (地球および惑星大気科学研究室) 藤田 哲也 (宇宙物理学研究室)
DTMを使った楽曲制作 DTMを扱う職業などの調査
WDC提出用Webページ ~フリー素材作成~
ハルビン絵葉書コレクションシステムの再構築と機能追加 -サーバ側:PHPとMySQLを用いて
北海道情報大学 情報メディア学部 情報メディア学科 新井山ゼミ 田中 聡
Flashプレイヤーを使った動画配信 情報工学科 宮本 崇也.
作成支援ツール“TTEdit”を用いた フォントの自作 -Webデザインコンテスト参加作品(2007)-
DTMを使った楽曲制作 DTMを扱う職業などの調査
「吉里吉里2KAG」による アプリケーションの開発 -アドベンチャー・ゲーム以外の各種用途への応用-
Word2007でWeb作成方法紹介ページ ~Word初心者でもわかりやすく~
「DTMと職業」に関する調査と DTM楽曲の制作
「サバイバル・ゲーム」のための Web ページの制作 -Webデザインコンテスト参加作品(2007/2008)-
Webアクセシビリティ ~新しいアクセシビリティの基準~
「絵葉書を通じてのハルビンの 街の印象調査」システムUIの iPadアプリ化 谷研究室  飯 祐貴.
CSSを利用したWebデザイン 理工学部 情報学科 3回生 喜多 亮輔.
CG作品展示サイト”Fragments” ~ 『閲覧しやすさ』と『デザイン性』を両立させた Webデザイン~
DTMを使った楽曲制作 DTMを扱う職業などの調査
Webアプリケーション開発 ~図書館管理システム~
知的障害者の生活を題材とするWebページの制作 -Webデザインコンテスト参加作品(2005/2006)-
企業としての経済活動や 社会貢献活動の情報を インターネットを通して 社外に広くアピール.
3DCGソフトウェア 「六角大王」による作品の制作 -Webデザインコンテスト参加作品(2008/2009)-
モーツァルトの手法に着想を得た ランダム作曲法
雛型ファイルについて 雛型ファイルを以下からダウンロード 昨年のプレゼン資料を参考にする場合
雛型ファイルについて 雛型ファイルを以下からダウンロード 昨年のプレゼン資料を参考にする場合
DTMを使った楽曲制作 DTMを扱う職業などの調査
15パズルの解法について 北海道情報大学 情報メディア学部 情報メディア学科 新井山ゼミ  大石 貴弘.
Piggy Bank: Experience the Semantic Web Inside Your Web Browser
認知科学と諸問題 第1班 巽ゆかり 古谷礼奈 諸戸孝之 黒滝麗子
“Word 2007”を活用した Webページの制作 ~Webデザインコンテスト参加作品(2009/2010)~
インターネット活用法 ~ブラウザ編~ 09016 上野喬.
「C++言語」習得のための実践的研究 -「テンプレート」,「例外処理」,「実行時型情報」-
動画編集ツールによる作品制作とWebページによる紹介
雛型ファイルについて 雛型ファイルを以下からダウンロード 昨年のプレゼン資料を参考にする場合
「六角大王」によるCG作成と Webページ制作
北海道情報大学 情報メディア学部 情報メディア学科 新井山ゼミ 大平 哲也
Flashを使用した ミュージックビデオの作成
Webマーケティング全体像 2015/5/4杉浦 ①モバイルファースト ②SEO(検索エンジン最適化) ④LPO(ランディングページ最適化)
基礎プログラミング演習 第1回.
2004年度 サマースクール in 稚内 JavaによるWebアプリケーション入門
2003年度 データベース論 安藤 友晴.
ケースで学ぶ! 個人情報保護の基礎 個人情報保護の最新対策 年版 eラーニングコースで対策を!
ご利用説明 2018年10月 (株)紀伊國屋書店.
利用説明 2018年9月 (株)紀伊國屋書店.
売れるためのWEBサイト構築.
情報検索(6) メディア検索の仕組み 教員 岩村 雅一
エピソード記憶に訴えるBookmarkless Bookmarkの実現
北海道情報大学 情報メディア学部 情報メディア学科 新井山ゼミ 金子拓磨
基礎技術ー3 : Webページの標準規格について
岩手県立大学ソフトウエア情報学部 3年 鈴木研究室所属 井ノ上 憲司
売れるためのWEBサイト戦略.
オリジナル歌唱楽曲制作と Webページによる紹介
初心者向けの株の解説 自身の運用体験のWebサイト制作
岩手県立大学ソフトウエア情報学部 3年 鈴木研究室所属 井ノ上 憲司
Presentation transcript:

「Webアクセシビリティ」研究と Webページの試作 -視認性,操作性向上のための提案と試行錯誤的実践- 北海道情報大学 情報メディア学部 情報メディア学科 新井山ゼミ 0521113 山口 岳

目次 研究概要 研究目的 研究手順 研究成果 評価考察 今後の課題 参考文献

研究概要 Webアクセシビリティ研究 Web利用者調査 アクセシビリティとバリアフリー Web制作講座 以上の内容を本研究にあたって調査・制作

研究目的 Webアクセシビリティとは何か アクセス+ビリティ(可能な)の造語 一般にWebサイトにおける使いやすさの目安 見る人を意識して制作されるべき 今日の過剰なまでのバリアフリー指向

研究手順 アクセシビリティを考えるにあたって 調査日:2007年5月~6月 Webの利用層を調査 調査方法 この結果から分かること 一定の期間設置→結果を総合・分析 この結果から分かること Web利用者の閲覧環境(個人情報は含まない) 調査日:2007年5月~6月

調査結果(1) 使用OSの割合 Windows利用者が多数 Windows XP:84.2% Windows 2000:7.9% Windows Vista:3.6% Macintosh:1.8% Windows利用者が多数

調査結果(2) 使用ブラウザの割合 IE利用者多数 IE:58.8% Sleipnir:17.3% Firefox:15.0% Opera:2.7% IE利用者多数

調査結果(3) 画面解像度の割合 解像度の大型化進む 640×480はほぼなし PDAなどの小解像度も 1024×768:37.5% 1280×1024:32% 1280×800:5.6% 1600×1200:4.4% 解像度の大型化進む 640×480はほぼなし PDAなどの小解像度も

調査まとめ 1024×768以上の解像度が99%超え ほとんどの閲覧者がWindows OS IEブラウザ or IEエンジンの利用者多数 現行で1024×768以上での製作が可能 ほとんどの閲覧者がWindows OS ただし近年のApple人気でMac OSも増加 制作者はMac OSでのWeb表示特性も学ぶべき IEブラウザ or IEエンジンの利用者多数 IEのタブブラウザ可によって利用者がまた増加

研究手順 アクセシビリティとバリアフリー カラーユニバーサルデザインとWeb 障壁を“取り除く”ことと“作らない”ことは違う 今日は過剰なまでのバリアフリー指向にある 目的の閲覧者層に合わせたデザイン カラーユニバーサルデザインとWeb 日本人男性の20人に1人が色弱 Webページにおいても考慮すべき カラーユニバーサルデザイン(CUD)

研究成果 色弱とは色の認識が異なる状態を言う 視覚器官の赤,青,緑を認識する部位の異常 日本人男性の20人に1人(女性は500人に一人) 色による情報の区分け→理解できない可能性

研究成果 バリアフリーとアクセシビリティ 今一度アクセシビリティの基準を見直す必要 アクセシビリティ≠バリアフリー 若者へ向けたサイトにお年より向けの配慮は 必ずしも必要ではない。 サイト利用者に見合ったアクセスのしやすさ 今一度アクセシビリティの基準を見直す必要

研究成果 Webの方向性を分類 技術的な部分 多くの人が見る可能性のある分野では CUDやアクセシビリティは重要 対して個人ページでは重視されない ジャンルによっても異なる 技術的な部分 Windowsユーザ向けのサービスが Macユーザに配慮する必要性はない ブラウザに関しても同様

まとめ 今のアクセシビリティは現状にそぐわない 常に市場の動向を調査する 安易に言葉に踊らされない 制作者が狙った層に合わせて制作 日々進歩する技術との照らし合わせ 常に市場の動向を調査する 今主流のブラウザや解像度はどの程度かなど 安易に言葉に踊らされない アクセシビリティを誤解しない 過剰な配慮はかえって逆効果

開発成果 Web制作講座 対象:Web制作をこれから学ぶ人 目的:一緒にアクセシビリティも理解してもらうこと http://genbu.rmme.do-johodai.ac.jp/~s0521113/ web/index.htm http://gosya.sakura.ne.jp/hiu/semi/web/index.htm (学外の予備サイト)

評価 CUDに関しては再考の余地 研究の発展 Web利用者調査から長期日数が経過 2年間で着手した分野があまりに広範

考察 CUDの分野は常に発展 Web利用者調査から経過した間 これらを盛り込めなかったのが残念 常に情報を収集する必要 Vistaの利用者は増加 Googleブラウザの登場によるブラウザ競争 これらを盛り込めなかったのが残念

今後の課題 常に最新の技術や情報をチェックする HTMLやCGIは既に過去の技術 XHTMLやPHP,サーバの技術 クライアント側の技術やアプローチだけではなく サーバ側の技術なども知る必要 Web利用者の環境は常に変化する ブラウザのバージョンアップや変化には敏感に

参考文献 HTMLポケットリファレンス 詳解HTML&CSS&JavaScript辞典 出版:技術評論社 著者:片岡巌 出版:秀和システム 著者:大藤幹・半場方人 19

参考文献 Web開発支援ツール Google Chrome サイト内検索エンジン導入レポート 色弱シミュレータ“Vischeck” http://www.fenrir.co.jp/sleipnir/plugins/hawkeye.html Google Chrome http://www.google.com/chrome/ サイト内検索エンジン導入レポート http://homepage2.nifty.com/treknz/search.html 色弱シミュレータ“Vischeck” (Photoshopプラグイン) http://www.vischeck.com/ 20