1. チャコウェブラジオ
  2. #65 続編・iPhoneグレースケー..
2026-02-05 14:32

#65 続編・iPhoneグレースケールにしてみて気付いたこと

前回に続いて、パーソナリティゆみこもiPhoneのグレースケール体験をしてみました。

普段何気なく使っていたコンテンツが突然「使いにくい」経験をしたことで、発見や気付きを語ります。

  • グレースケールでアプリが探しにくい

  • 色で無意識に情報を判別していた

  • シンプルなアイコンほど見つけやすい

  • 色だけの既読未読表示は誤解を招く

  • パステル色分けは濃淡が分かりにくい

  • 枠線・形・文字など色以外も必要

  • 重要な通知や緊急表示は優先的に配慮していきたい

「チャコウェブラジオ」は株式会社Cyber Catsが運営するチャコウェブのスタッフが、ウェブアクセシビリティを実践したい制作者やウェブ担当者に向けて、ゆっくりじっくり解説していくポッドキャストです。

ご感想やチャコウェブへのご相談はメールフォームよりお寄せください。

https://www.chaco-web.com/contactus.html

出演:

やまぐちみあ(ウェブアクセシビリティマネージャー)

https://x.com/chacoweb_ymgc

社内で定期的に開催している勉強会では、制作メンバーとウェブアクセシビリティ関連の知識を共有したり、意見交換を積極的に行っています。

お客様のホームページ制作にあたっては、ディレクター、デザイナーとの打ち合わせ時にウェブアクセシビリティの観点からデザインや仕様の決定に携わっています。

また、ウェブアクセシビリティに関するブログ記事の更新も担当しています。

よこやまゆみこ(ウェブマーケティングマネージャー)

https://x.com/chacoweb_yama

ブログを10年以上運用してきた経験から実践的なアドバイスを得意とし、コンテンツ発信を活用して企業の価値を高めるサポートをしています。

400件を超える中小企業のホームページ制作に関わり、SEO、コンテンツマーケティング、ライティングの知識を使ったコンテンツ制作で利益につなげる制作ディレクションと利益獲得のアドバイスをしてきました。

ウェブの情報発信力を存分に活用する考え方を基礎からお伝えし、運用能力を身につけていただくお手伝いをしています。

チャコウェブ公式サイト

https://www.chaco-web.com/

チャコウェブ公式X

https://x.com/_chacoweb

株式会社Cyber Cats公式サイト

https://cybercats.jp/

ポッドキャストの書き起こし「LISTEN」はこちら

https://listen.style/p/chacoweb?k2xLjX2w

サマリー

iPhoneをグレースケールに設定することで、彼は色が視覚的な手がかりとしてどれほど重要かを再確認しています。アプリや商品の選択が難しくなり、色への依存が明らかになったことで、アクセシビリティに関する新たな視点を得ています。また、色の識別や視覚特性について新たな気づきを得ており、特にパステルカラーがアクセシビリティに与える影響を考える良い機会となっています。

00:04
こんにちは。チャコウェブラジオは、株式会社Cyber Catsが運営するチャコウェブのスタッフが、
ウェブアクセシビリティを実践したい制作者やウェブ担当者に向けて、ゆっくりじっくり解説していくポッドキャストです。
進行を担当するゆみこです。よろしくお願いします。
みやです。よろしくお願いします。
今回は、アクセシビリティに関する雑談会です。
テーマを一つ取り上げて、アクセシビリティについて考えたことや感じたことなどを、自由にお話ししていきます。
よろしくお願いします。
グレースケールの影響
はい。今回のテーマは、iPhoneをグレースケールにして気づいたこと、続編です。
はい。これはあれですね。私がスマホを使う時間を短くしたいみたいなので、
グレースケールにすると時間が短くなるらしいみたいなのを試してみたら、
スマホを使う時間も短くなったんだけど、色分けとかが全然わからなくて、アクセシビリティを肌で感じたっていう前回のお話ですね。
そうでしたね。そこで触発されて、実際に私、ゆみこもやってみたという感想を、
今回、みやさんに聞いていただこうという回ですね。
はい。ぜひお願いします。
はい。これさっそくやってみて、私、実はスマホを使う時間とかは、結構仕事の時とか何かで決めちゃってるので、使う時間はあんまり変わらなかったんですよ。
ただ、使う時に結構困ったというか、あわわわってなったことが結構あって、
まず一つは、アプリ探せないっていうのがありました。
めちゃくちゃわかります。
はい。ホーム画面から、いつもの青いアイコンのこれみたいなとか、緑のアイコンのこれとかで、
頭の中で無意識に色で探してる習性があったらしくて、そこが全部グレースケールになると、あれ?どれ?みたいな感じで、全然わからなかったんですよね。
私もそういう感じで、そこまで色で判断してると思ってなくって、アイコンとかの模様とかマークとかロゴとかで判断してると思ってたんですけど、やっぱりグレースケールにしたら、あれ?ってなっちゃって。
そうなんですよ。
めちゃくちゃ、色に頼ってたんだな、自分っていうのを認識しました。初めて。
そうですよね。意外と色頼りで、このカテゴリー分けをしながら、そこからこの形のアイコンというような、急に自分で探してるんだなということに初めて気がつきました。
なんか当たり前にやりすぎてて、全然気づいてなかったんですよね。
そうですね。あとは、グレースケールにしたら、わかりやすいアイコンとわかりにくいアイコンっていうのもあって、やっぱりちょっと細かく色々模様があったりすると、複雑だと探しにくいなというのがありました。
確かに。なんかこう、結構グラデーションされてて、細かいイラストが入ってて、みたいなのだと、もうグラデーションとかもよくわからないなっていう感じですね。
そうです。そういう感じでしたね。なので、もうはっきりシンプルなアイコンだとすごいわかりやすくて、見つけやすいですね。
なんか結構個人的には、文字がいっぱい入ってるのとかよりは、本当にそれこそXとかみたいな、バンって一個文字が入ってるとか、なんかこうロゴが入ってるとか、そういうほうがわかりやすいなと思いました。
そうでしたね。私もグレースケールの場合は、本当にシンプルな大きめに表示してくれてるアイコンはすぐ見つけられて助かりました。
そうですね。
あとこの見つけやすい、見つけにくいということに関すると、買い物をするときに商品が選べないという。
はい、商品が選べないというと。
やっぱり、色でこの商品いいなみたいなので、かなり探しているので、写真付きのものって大事なんですが、結構わからないなという感じですよね。
Amazonでいろいろ見たりとかしても、なんか魅力的に思えなくて、自分の中で。
だから、買い物をする気持ちは下がるので、無駄遣いは減るかもしれないなと思いました。
色の重要性
なるほど。でも確かにそうですね。なんか、やっぱり色って魅力的なんでしょうね。
なんかその前回、私がスマホ使う時間を短くしたいみたいなので、いろいろ調べてたときも、色は魅力的で、なんかこうノエの刺激も結構強いって言われてるから、
そのグレースケールにすると、例えばですけど、SNSとか動画とか見ても、あんまり楽しいっていう気持ちがカラーの時に比べると、
なんかちょっと少なめというか、そんなにずっと見ちゃうみたいなのはなくなるんで、スマホの時間が減るよみたいなことが書いてあって。
そうですね。
そうなのかって最初は思ったんですけど、やってみたら、やっぱり色があるだけで魅力的に見えるんだなっていうのは思ったので。
確かに。
だからそれで言うと商品とかも、なんか白黒だったりグレースケールだったりすると、選ぶときにちょっと私だったら自信持てないかもしれないです。
なんか、これで大丈夫かなみたいな。
はい、確かに。ほんとそうですね。
物にもよるとは思うんですけど、そうですね。
何かを選ぶという時に、結構色頼りになっている暮らしになっていたんだなっていうところですね。
あとですね、これは色だけで差別化しているコンテンツっていうのが、実は結構あるなと思っていて、
色だけで差別化しているコンテンツだと判別できないということに出会ったんですね。
何かのお知らせを読んだりで、読んだら既読というふうに色が変わったりして、
まだ読んでない項目は未読というので、ラベルがちゃんと色分けでされてるんですが、
もう白黒の世界だと、どっちもグレーで同じ色に見えたんですよ。
ありますね。
未読も既読も分からないっていう。
どっちっていう。
そう。
ありますあります。ありました私も。
はい。
これはね、分かりにくくて。
一方でですね、銀行さんとか、アクセシビリティにある程度対応しているところですと、
色だけではなくて、線ですね、枠の線を背景を変えたりとかしているので、
これが白に変わったりとか、枠線がなくなったりとか、そういう差別化があったので、そちらは分かりやすかったんですよ。
そうですね。
やっぱり色だけで判別させないっていうのは重要だなって思いますね。
そうですね。
WCAGとかにもありますけど、やっぱり色だけじゃなくて、形を変えるとか、枠線をつけるとか、架線を引くとか、
あと何て言うんですか、例えば、未読は未読って書いておく、既読は既読って書いておくとか、
そういう色以外のところで判別できるってものすごく大事だなってのは、私もグレースケールにしたとき思ったので。
そうですね。
これめちゃくちゃ重要だなっていうのを、何て言うんですか、自分で経験しました。
そうですよね。
iPhoneグレースケールの体験
ガイドラインでは読んで理解していたつもりだったんですけどっていうところですね。
はい、そうなんです。そして意外とまだまだ世の中には、それができていないコンテンツがあって、ここでちょっと誤解が生まれてしまう状況があるんだなというところを思いました。
本当にあれですよね、それで取り違えたまま何かを、誤解したままとか取り違えたまま手続きとか進めちゃったら、ちょっと怖いなっていうのは思いました。
そうですよね。確かに途中でなかなか気づけないと思うので、ここは気をつけたいなと思ったんですよね。
あとその同じような話なんですが、パステルカラーですね。
パステルカラー。
はい。パステルカラーで色分けしているサイトとかコンテンツって、ほとんど色の違いがわからないという。
ああ、そうかもしれないです。
あの、トーンが一緒すぎると同じすぎると、トーンがわからないですよね。
そうですね。濃淡がないんですよ。濃いとか薄いとかが。
だからそれがすごく、こう、しっかりしてるとグレースケールでもパッと見で判別できるんですけど、濃淡がないと、それこそパステルカラーのグラデーションとかって多分一色とかで見えちゃうんですかね。
はい。一色でしたね。
ですよね。
あの、パステルカラー好きで綺麗だなと思うんですけど、こんなに全部同じグレーだったんですよね。
はい。
なので、最初にそのパステルカラーの状態を見て、後でカラーにした時に、あれ、カラフルだったっていうことに気がついたっていうぐらい。
はい。
全然わからなかったですね。
それが、今回はその、私たちがiPhoneグレースケールにしてみて、ウェブの中でそうだなって体験したわけですけど、
はい。
これ、例えばその識覚特性持ってらっしゃる方だったりすると、その現実世界でも同じことがずっと永遠に起きてるわけじゃないですか。
そうですね。
だからそれこそ、例えば何か危険を知らせるようなサイレンとかアラームとかいろいろありますけど、
はい。
そういうものの点滅だったりとかが、こう、なんていうんですか、見えにくかったりとか、
うん。
あと表示がいつもと変わらない、なんていうんですか、色があれば明らかに何かこういつもと違うのがわかっても、平常時と色が大差なく見えちゃうとか、あるのかなって思うと、
ありますね。
ここはやっぱり、なんか、なんていうんですか、なかなかそこの対策が必要だっていうのが、気づきにくいかもしれないですけど、
はい。
めちゃくちゃ重要だなって思って、本当に命にかかってくるとことかもありますよね、その信号とかもそうですけど。
本当そうですね。
うんうん。
なので、そうなると、なんか遊びとかであれば、まあいいかなと思うんですが、ちょっと重要度の高いところ、
はい。
さっきのお知らせとかですね、そういったところとか、緊急時のアラート表示、
はい。
みたいなところは、思いっきりアクセシビリティに気をつけて作るの優先度を高めたほうがいいんだろうなというふうに思いました。
重要な表示の工夫
これは、なんか、自分で体験して理解だけじゃなくって、あ、こういうことだったんだっていうのがわかりましたね。
そうですね、本当に。なので、今後の設計とかで、どこに優先度を置いたらいいのかっていうところにも、ちょっと参考になるような体験だったので、
はい。
すごい面白かったですね、もう。
うんうん。
その他にも、アクセシビリティの機能って、スマートフォンにいっぱいあるので、ちょこちょこ試してみたんですが、
はい。
なんか、面白いですよね。いろんな表示があって、なので、そういったのも、皆さんもぜひ試していただくと、楽しい発見があるんじゃないかなと思いました、私は。
そうですね。
はい。
ですね。
はい。
ということで、じゃあ今日はこんなところで終わりましょうか。
はい、ありがとうございます。
はい、お聞きいただきありがとうございました。感想をいただけるととっても嬉しいです。
ハッシュタグチャコウェブラジオをつけて、ぜひXで投稿してください。また、概要欄にメールフォームリンクをご用意しています。
ウェブアクセシビリティに対応したい方、チャコウェブにお仕事を依頼したい方や、ご相談がある方は、お気軽にメッセージをお寄せください。
次回もお楽しみに。
14:32

コメント

スクロール