Webディレクションやってます blog

5月28日、東京の新宿NSビルにて開催されたWebカラーセミナー「実例から学ぶWebサイトの色彩設計」に参加してきました。

講師は、フォルトゥナの坂本 邦夫さん（@Kunio_Sakamoto）です。

Facebookで告知があって速攻申し込んだのですが、当日は都内で大型のセミナーが知ってる限り他に2件あったのですが、こちらも大盛況でした。

セミナーアジェンダ

• 配色ではなく色彩設計をしよう
• サイト運用のための色彩設計
• 実例10サイトから学ぶ色彩設計

セミナーを通して印象に残っているのは、冒頭にあった色彩設計の「3つの要素」について。

色彩設計の3つの要素

機能的な色彩
視覚的な訴求力
色彩戦略

今までこういったことをロジカルに考えきれずにいたので、こういった考え方があったことが分かり、目から鱗。

• 文字・図版の読みやすさ
• リンクの分かりやすさ
• 視線の誘導
• 区別のしやすさ
• 配色の調和、美しさ
• 印象の残りやすさ
• 心理的な効果
• 業種・商品・人物に合った色
• ユーザーの好む色
• 競合サイトとの色の関係

と言ったことは、それぞれを何となくは考えているのですが、全部を抜けもれなく考えられていて、それをサイトのデザインをアウトプットするまで踏襲出来ているか？と言われるとやっぱり出来ていないことが多い。

そういう意味では、サイト構築の要件定義から設計までの間で「やるべきリスト」のアップデートが出来たよう思います。

アクセシビリティへの対応

またビジュアルデザインにおいては、折りに付け「足かせ」のような扱いを受けることもあるアクセシビリティへの対応。

しかし坂本さんのお話の中には、Web-Jisへの対応の話もしっかりあり、色彩設計の観点からも決してWeb-Jis対応が難しいといった訳ではない。
むしろWeb-Jisなどで定義されているコントラスト比などの数字データも利用して、本来の「ファインダビリティ」を満たしましょう、といった話は「感覚」や「感性」だけではない説得力がありました。

モノクロで確認？

また、「モノクロでデザイン確認していますか？」という話もありました。
これは全く考えたことがありませんでした。

でも、坂本さんが仰ったとおり、自分自身も、

• イベントなどの開催状況の情報の印刷
• 打ち合わせ資料で自分自身の分の印刷
• 地図の印刷

などは確かにカラーで出さず白黒で出すことがほとんどです。

そういった時に今まで「白黒にしたら見えなくなった！」って経験は流石にないのですが、それでも「より見やすい」ってのは制作側としては考えておくべきなのかもしれません。

これは今後は気をつけて実施していきたいと強く思いました。

坂本さん、今回は本当にありがとうございました！

---

関連タグ：アクセシビリティ WCAG design web-jis 

今年の6月に会員になっている日本Web協会のメルマガにコラムを寄稿させていただいたのですが、話をしたら、読んでみたいといって頂けたので、転載しています。

丁度タイミングとしては、先日発表が終わった後なので、前後している内容でもありますが、大枠時期には関係ない内容と思ってますので、まぁ、いいかな？と。

ということで、下からがそうです。

---

『アックゼロヨンの意義』

---

2004年9月、まだ暑さの残る時期に五反田の東京簡易保険会館ゆうぽうとには多くの人が詰めかけていました。
開催されたのは「Ac+C'04キックオフ・イベント」。日本で初めてＷｅｂサイトにおけるJISの規格が出来た事を受け、当時“Webアクセシビリティをみんなで創造しよう！”というスローガンを元に、これからWebサイトをどうしていこう、どうなっていくのか、という期待と不安の入り交じったイベントでした。

イベントでは「日本のアクセシビリティの夜明け」のようにその意義が多くの方から話されました。
また単純にお祭り雰囲気のようになるだけでなく、パネルディスカッションの場では「JIS X 8341-3（以下ウェブJIS）は出来たが、ただ盲目的にそこに記載されていることを実装すれば、アクセシブルなサイトが出来ると思うのは間違いであり、真のエンドユーザーのニーズをくみ取り実装していくことこそがアクセシビリティへの本当の方法だ」という警鐘とも取れる発言がパネラーから出た事は、今にも通じる重要な視点だったと思います。


当時からアメリカではリハビリテーション法 第508条という法令によって政府が調達する製品や市民に提供する情報、サービスには障害者・健常者が同様のレベルでアクセス出来ることが義務づけられていると言うことが有名な事例として各国でも様々取り組みが行われていました。

今にして思うと、このアックゼロヨンは、日本において一番最初に声高に「アクセシビリティにどのように向き合うか？そしてそもそも向き合うべきなのか？」という漠然と広がっていた疑問へのある種の答えの投げかけだったのではないかと思います。

ウェブJISが出来た事、アックゼロヨンという形でそれを日本のサイトに還元するイベントの発足により、間違いなく「アクセシビリティ」という言葉は日本のWebサイトを作る人の中に広く浸透していったはずだからです。

そしてその後アックゼロヨンは３回のアワードの発表を行い、日本でも十分にアクセシブルなサイトを、その上で更にクリエイティブなサイトを作る基盤があることを証明してきました。

一方で「アクセシビリティ対応はそれ自体が崇高な事は十分に理解が出来るが、実際のコストを出すクライアントにとってそれが必ずしも有益と判断をされる訳ではないため、実装する事ができない」「商業活動において障害者の方を対象にするべきことは分かるし、公共機関での対応などにもそれは見られるのだが、Webサイトでどこまですべきなのか？本当に必要なものなのか？」という不安・不満が現在のWebサイトの制作に関わる方々の中にあり、そのジレンマを引き起こしているのもまた紛れもない事実だと思います。

今年通算４回目のアックゼロヨンのアワードが開催されることは、キックオフイベントより追いかけてきた身としてはとても嬉しく思います。
一方で、これからのアックゼロヨンが、そしてそのアワードが示していくべき道は日本のＷＥＢサイトに関わる全ての人、それは発注者としての方や、制作サイドに関わる人たちを含めた全ての人が、「Webサイトにはアクセシビリティが必要なのである」ということを考えるべくもなく、ごく自然に思われるようにしていくことなのではないかと思っています。

そこに至る道を見定めないままでは、一部の先進的なＷＥＢサイトのみが実装を行っているだけのものに成り下がってしまうはず。

今年のアワードに上がるサイト、それぞれに注目していきたいと思います。

---

〜プロフィール〜
株式会社ソナー　ディレクター　名村　晋治
1993年よりインターネットに触れ、1996年ごろより、Webサイトの制作に関わりWebサイトにおけるブランド訴求を軸に各種サイト制作に関わる。2005年ソナーに入社し、2006年より同社取締役。不動産Webサイトの構築のためのディレクション業務に従事。
自社でのディレクション業務だけでなく、各地でディレクションやブランディングに関するセミナーも開催。

---

関連タグ：WCAG アクセシビリティ アックゼロヨン 

毎年恒例で盛大なネタになっていますが、名村は今年もアクセシブルでクリエイティブに注力したWebサイトを表彰する「アックゼロヨン・アワード」のスポンサーをさせてもらっています。

個人でやってるので大したレベルではないのですが、2004年から追いかけているイベントではるので、少しでも協力できるのであれば、ってことで、出資をさせていただいています。

---

---

個人的に、今年は審査員の方も凄い方々ばかりなので、その目を通ってアワードに輝く作品はどういった作品なのか、今から興味深いので、今年も、出来れば表彰式にお伺いしたいなぁと思っています。
（去年の表彰式の二次会は存じている人が殆どいなくて壁際でコソコソしていたのはナイショ）

そこで受けた印象などは是非とも自分が作っていくサイトにも還元していって、裾野から、アックゼロヨンの思想を広げていくお手伝いが出来ればいいなと思っています。

---

---

サイトでは、トップと協賛紹介でバナーとコメントを入れさせて頂いております。

もしご連絡の際には名村まで連絡をいただければ、どこでもお伺いいたします！
もちろん、不動産ビジネス以外でもお手伝いさせていただけますので、ご相談はお気軽にいただければと思います。

---

関連タグ：WCAG アクセシビリティ アックゼロヨン 

今年もアックゼロヨン・アワードの季節がやってきました。
ご存じのない方へ説明をさせて頂くといたしますと、アックゼロヨンのサイトの方に詳しく掲載はされているのであれですが、

---

開催目的

---

「アックゼロヨン・アワード」は、年齢や性別、障害の有無、ITリテラシの高低に関わらず、誰にとっても使いやすいウェブサイトを表彰します。

---

となっています。

アックゼロヨンは、その名の通り2004年にWEB-JIS（JIS X 8341-3 高齢者・障害者等配慮設計指針 - 情報通信における機器、ソフトウェア及びサービス - 第3部:ウェブコンテンツ）が出来た事を受けて開催を行うようになり、第一回が2005年。

会の名前が「ゼロヨン」なのに初回が05年とはこれ如何に？という感じはしなくもないのですが（謎）、2004年にに五反田ゆうぽうとでキックオフイベントがあったので、それはそれで有りかと。

さて、今年もアクセシブルでクリエイティブなサイトを表彰するアワードな訳ですが、該当する、しそうなサイトを構築・運用している方は是非とも応募してみてはいかがでしょうか？
過去の表彰式に参加させて頂いていたりするのですが、確かに凄い大手なサイトが表彰対象になってはいますが、個人で作っているサイトであっても、アワードの意義を踏まえたサイトは表彰をされています。

その意味ではとても張り合いのあるアワードであると思います。

個人的なアックゼロヨンへの思い入れとかは、ここに書いたりしているのですが、僕が別に立ち上げたとかって訳でもないですし、個人的には日本ウェブ協会の会員だったりってはあるにはあるのですが、単純に面白そうなので、って理由で参加させて頂いている訳ですが、ここまで続いてきますと、周りにも宣伝してみたいな、という思いも生まれる訳で、是非ともご覧の皆様、ふるってご応募ください！

---

関連タグ：アクセシビリティ アックゼロヨン 

今日は植木さんがロクナナワークショップで実施されていらっしゃる「植木真の新ガイドライン対応アクセシビリティ講座 」に参加してきました。

アクセシビリティに関しては、一般知識としてWCAG1.0とJIS X-8341-3は読んではいますが、ずっと追いかけられているわけではないので、やはりそこは日本においてはアクセシビリティの神である「植木真」さんに聞くべきだと思っています。

それと同時にWCAG2･0がやっと出た（確か2006年ぐらいからワーキングドラフトでずっと勧告版にならなくて、痺れを切らしていましたｗ）ってこともあり、それを受けてJIS X-8341-3も10月には改訂版が出るということで、それらの変更内容を押さえておきたくて、勉強させてもらいにきました。

途中Lintでこのブログを採点されたのですが、カスタマイズをしていることもあって結構散々な結果でしたｗ
これはa-blogさんのディフォルトではなくて、名村がこのテンプレートに実装をしているHTMLがしょぼいだけですが、こういったところを目の当たりにすると、「ちゃんとやらねば・・・・」と思いますね。
がんばります。

個人的にはWCAG2･0とJIS X-8341-3の改善点について、それを考慮した具体的なHTMLの実装の解釈などの話はかなりためになりました。

なかなか実際の業務でガリガリに、音声ブラウザにガチ対応を考えたアクセシブルなサイト構築はないのですが、以前大藤さんが発表されていた「当然のこととして」と考えていく必要があるかな？と思いました。

例えば、ものすごい分かりやすい例で言えば、弊社（どこ）ではフォームのラジオボタンやチェックボックスには基本的には

---

label要素で関連付けをしてマークアップをする
label要素で関連しているinput要素には、マウスのhoverで色を付ける
label要素に対して、「cursor: pointer;」を付ける

---

などは実装するのが前提になっていたりします。（多少案件によるところもありますし、アクセシビリティとユーザービリティが一緒になっていますが）

これらは「時間がないからやるやらな」って判断をするようなものではなくて、実装するってものになっています。

そういったことでいえば以前大藤さんが書いていらっしゃった「最初から考えておくべきもの」としてとらえ、もちろん全てのアクセシブルなサイトにする要素を全部満たすのは無理にしても、自分の中でそれが「普通」というものを少しずつ増やしていけば、きっと全体的なクオリティの向上にもなってくるのではないかな？と思うわけです。

そういう意味では、WCAG2.0（日本語訳がされたWCAG2.0はこちら）とか、公開レビュー版のJIS X-8341-3（JIS X 8341-3 改正原案「高齢者・障害者等配慮設計指針− 情報通信における機器・ソフトウェア・サービス −第３部：ウェブコンテンツ」の公開レビュー）をもう一度目を通しておきたいと思いました！

---

関連タグ：アクセシビリティ セミナー ロクナナ