アクセシビリティとクリエイティブは両立できるのか？

1：魅力的なクリエイティブとアクセシビリティの両立について

電通デジタル・千葉順子（以下、千葉）：ウェブサイト制作において、「アクセシビリティ」という言葉が出た途端に「かっこいいデザインや、魅力的なデザインができなくなるのではないか」と関係者に思われてしまい、構えられてしまうことが多くあります。われわれは、「クリエイティブを諦めないウェブアクセシビリティの実現」を掲げていることもあり、クリエイターの方と一緒にアクセシビリティとクリエイティブを両立するデザインについて切磋琢磨しながらサイトを作り上げていきたいと思っています。間嶋さんは、その点についてどう捉えられていますか？

majima DESIGN・間嶋沙知氏（以下、間嶋）：「アクセシビリティを確保すると、デザインがダサくなる」という誤解が多いのは、今までアクセシビリティを確保しつつ、魅力的なデザインを作ろうとしていた人の数が少なかったからではないかと思っています。

一見アクセシビリティが低いように思えるビジュアル表現を使う場合でも、人が集まってアイデアを出し合うと、スマートな解決策が見つかることもあります。かっこよく、かつアクセシブルであることを諦めず、追求する人が増えれば、その領域のデザインの水準は上がってきます。ウェブアクセシビリティの分野でも、かっこよさを追求するウェブデザイナーやアートディレクターが増えてくれば、魅力的なデザインがどんどん増えて、「アクセシビリティを重視すると、かっこいいデザインや、魅力的なデザインができなくなるんじゃないか」という印象は変わっていくのではないかと思います。

2：アクセシビリティとデザイントレンドについて

電通デジタルデザイナー・西垣戸初美（以下、西垣戸）：最近流行しているデザイン手法に、ニューモーフィズム、グラスモーフィズム^[1]があります。透明感やシャドウによって表現するこういった手法と、「誰にでも見えるコントラスト比を確保する」というアクセシビリティ達成基準^[2]との折り合いをつけるのは難しいように思います。間嶋さんは、こういったデザイン手法を使いつつ、アクセシビリティを確保するためにはどうすればよいと思いますか？

間嶋氏：常に新しい、かっこいい、イケてるデザインを作りたいという気持ちは、私もデザイナーとしてずっと持ち続けています。

こういった手法は、アクセシビリティの考え方とポイントを押さえておけば、どこで使えそうかという判断がしやすくなります。

まずニューモーフィズムを例に説明します。これをボタンやUIのコンポーネントに使うと、コントラストが確保できず、ただテキストを書いているだけに見えてしまう可能性がありますが、たとえば直接操作するUI要素ではなく、囲み背景の装飾として取り入れることはできるのではないかと考えました。

グラスモーフィズムは、単に背景にレイヤーを重ねて半透明にするだけでは文字が読みにくくなりますが、グラスの透過度を調整したり、背景との間に上のレイヤーの明るさを確保できる色を選定したりすれば、上のレイヤーに集中してもらいやすくなるといった使い方もできそうです。

具体的に言うと、背景に写真を配置する場合、写真の一番明るい部分に文字が重なったときでもコントラストが確保できるように、間に挟むグラスはある程度の暗さを確保した色にする、という感じです。

3：ロゴやブランドの色がアクセシビリティガイドラインの基準を満たさない場合について

インフォアクシア・植木真氏（以下、植木）：企業のウェブサイトがアクセシビリティを高めようとするときに、「ロゴで使用している色やブランドカラーがアクセシビリティガイドラインの基準を満たさない」というケースがあります。こういった場合、どのように対処すればいいですか？

間嶋：私は、目的に合わせてそれぞれ最適な色を設定すれば、場合によってはロゴの色をそのまま使わなくてもいいのではないかと考えています。与える印象を統一しながら、そういった仕組みを作っていくことも、デザイナーに求められる力ではないかとも思っています。

私が関わった企業の例を紹介します。

その企業のガイドラインでは、ロゴで使っているブランドカラーの他に、ブランドカラーを基準にしたコミュニケーションカラーを設定していました。コミュニケーションカラーには、ロゴの色と親和性が高く、コントラスト基準を満たせる色を用途ごとに用意してありました。これを使えば、ブランドのイメージを保ちつつ、アクセシビリティを確保できます。これはとてもいい方法だと思いました。

4：現代で求められる文章の書き方とアクセシビリティについて

植木：時代の変化によって、タイパ重視や動画の早送り、SNSでの短文でのコミュニケーションが多くなっていると思います。コピーライターの大川さんは、ライティングで求められていることが変わってきている、など感じることはありますか？

電通デジタルコピーライター・大川歩（以下、大川）：SNSでのコミュニケーションが一般化し、画像や動画など、テキスト以外の表現方法も普及したことで、世間的に長い文章を読まない・書かない、そして長文が受け入れられにくい状況が生まれていると感じています。

アクセシビリティを高めるためにも有効な「見出しをつける」「箇条書きを使う」ライティングテクニック以外にも、記事の冒頭に「まとめ・概要をつける」「目次を表示する」といった手法は、今の時代を象徴する書き方だと思います。

植木：アクセシビリティの観点で言うと、最初に要約があると、文章を読むことに困難を抱えている人にとって、全文を読むかどうかの判断がつきやすくなります。また、見出しや箇条書きが適切に使われていると、情報が整理されて読みやすくなります。これは急いでいる人や時間がない人、情報をたくさんチェックしたい人などにとってもメリットがあります。

そう考えると、アクセシビリティ向上は特定の人だけのためではなく、さまざまな人にとって、より良いデザインになるという実例になるのではないかと思います。

間嶋：私もニュースサイトの「ざっくり言うと」という要約機能はありがたいと思っています。

一つのエピソードをお話しします。

ある会社が、ECサイトの売り上げを上げたいと考えていました。その会社のECサイトのユーザーは高齢者の方が多く、小さい文字やたくさんのテキストを読むことが苦手な人が多かったそうです。そうした方々にとって、テキストを読みやすく、記憶に残りやすくするための試行錯誤をした結果、「大事なことをしっかりと目立たせる」「見出しをこまめにつける」などを行ったそうで、それらはすべてアクセシビリティ確保のテクニックと同じでした。

「ウェブアクセシビリティの向上に取り組んでいます」ということを明確に掲げていなくても、売上を上げるために「使いやすい」「読みやすい」「わかりやすい」という工夫を重ねた結果、アクセシビリティを高めることにつながっているということは、よくあるのだと思います。

5：アクセシビリティ浸透のための方法について

千葉：ウェブアクセシビリティを浸透させようと活動しているものの、なかなか興味を持ってもらえなかったり、自分には関係ないと思われてしまったり、ということがあります。間嶋さんは、アクセシビリティに関心を持ってもらうために心掛けていることなどはありますか？

間嶋：私はしばしば「アクセシビリティ」という言葉を使わずに説明するという工夫をしています。「アクセシビリティ」という言葉を使うと、身構えたり聞き流したりしてしまうことがあります。そうならないように、最初に「発信している情報が伝わりにくい」「読む人がこのように困っている」という状況を具体的に共有すると、興味や関心を持ってくれたり、解決策に納得してくれたりすることが多くなります。

「アクセシビリティガイドラインでNGだから」と頭ごなしに良し悪しを説明するのではなく、「こうすると使いやすくなる」「こういう障害を抱えている人が読みやすくなる」といったように、「アクセシビリティ」という言葉を一旦封じて、具体的なメリット・デメリットを語ってみるのは一つの手だと思っています。

さいごに

千葉：私たちが日々迷ったり、悩みながら向き合っているアクセシビリティとクリエイティブとの両立について、デザイナーである間嶋さんからお話を伺うことにより、新たなアプローチの仕方やデザイナーならではの考え方を知ることができました。

ガイドラインの達成項目をクリアすることが目的にならないよう、誰もが使えるサイトを増やしていくために、電通デジタルならではのクリエイティブにもこだわったアクセシビリティの確保を目指し、これからもウェブアクセシビリティの向上をサポートしていきたいと思います。

電通デジタルには、私たちウェブアクセシビリティプロジェクトのメンバーをはじめ、さまざまな職能を持った人材が在籍しています。「自社サイトのアクセシビリティ確保をしたいけれど、どこから始めたらよいかわからない」といった場合も、ご相談いただければお力になれると思います。迷ったり、困ったりしたらぜひお声がけいただけると嬉しいです。

疑問や相談がある場合は、ぜひご連絡ください。

ご相談・お問い合わせ

• メールアドレス：web_accessibility-contact@group.dentsu.co.jp
• 電通デジタルのウェブアクセシビリティサービスメニュー