ハクソク

世界を動かす技術を、日本語で。

テキストを選択させてください

243日前原文(aartaka.me)

概要

  • テキストが選択・コピーできないUI の問題提起
  • 翻訳や理解の障壁 となる仕様への批判
  • テキストの利便性・重要性 の強調
  • 画像や音声と比較したテキストの優位性 の説明
  • ユーザー体験・アクセシビリティ向上 のための提言

出会い系アプリの非選択可能テキスト問題

  • 孤独感 からBumbleを利用する日常
  • Tinderの危険性 を避けてBumbleを選択
  • 仕事中の暇つぶし としてスワイプ作業
  • 夏のArmeniaに集まる多国籍観光客
  • 多様な言語のプロフィール が並ぶ状況
  • 語学力の停滞 による内容把握の困難
  • ドイツ語の美しいプロフィール に惹かれる体験
  • 母語で書く選択 の尊重
  • ストーリー理解のための翻訳試み
  • Bumbleアプリでテキスト選択不可 の壁
  • OCRやiOSの写真認識 など手間の多い代替手段
  • 結果的に諦めてスワイプ左 という残念な結末

UIにおけるテキスト非選択化の弊害

  • テキストが選択不可＝実質的な画像化
  • 画像・音声・動画・JS重ページ の多次元性
    • 参照や操作の難しさ
    • Media Fragmentsの不採用
  • テキストによる機能・利便性の喪失
  • ポッドキャストの巻き戻し困難
  • 動画の文字起こしの限界
  • Webグラフィックスの不可視性
  • テキストの特性
    • コピー・翻訳・アクセシビリティ
    • 軽量性・情報処理の基盤
  • UIにテキストを使う理由
    • 意味伝達・明確な指示・理解のため
  • テキスト処理の難化は本末転倒

テキスト選択不可UIへの警鐘

  • テキスト選択・コピー禁止はユーザーへの犯罪
    • 理解・アクセシビリティ・意味への妨害
  • ユーザーの行動を不自由にする設計の否定
  • テキストを自由に使わせるべきという主張
  • フィードバックを推奨
    • メールでの意見送信
  • ページの永続性と多様な形式での閲覧案内
  • 著作権と意見の個人性明記

まとめ

  • テキストの選択・コピーはユーザーの基本的権利
  • 意味伝達・アクセシビリティの観点からも不可欠
  • 開発者はユーザー体験を損なう設計を避けるべき
  • テキストの自由な利用を守る重要性

Hackerたちの意見

このページのテキストが選択できないのは、トロールなのかな？ 編集: 確実に意図的だね、他のエントリーは選択できるテキストだし。

Androidでは、ホームボタンを長押しするとGoogleアシスタントが起動して、現在の画面をOCRしてすぐに翻訳してくれるよ。皮肉なことに、これが今までAndroidを使い続けている唯一の二つの機能のうちの一つなんだ。

└

iOS 26でも基本的に同じことができるよ。スクリーンショットを撮って（電源ボタン + 音量アップ）、表示されたスクリーンショットのサムネイルをクリックする。そうすると、スクリーンショットがフルスクリーンで表示されて、「翻訳」ボタンがあるよ（他のAI関連の機能も一緒にね）。

└

この簡単な解決策が好きだな：ウェブサイトを印刷して、そのページの写真を撮って、OCRソフトにかける。これだけで簡単だよ。

└

アプリスイッチャーでは全てのテキストが選択可能だけど、OCRを使ってるから、状況によっては違うかもね。

└

Googleのことだから、最後にチェックしたときにはこの機能はGeminiでは使えなかった（または一部のデバイスでしか使えなかった）。Geminiが将来的にGoogleアシスタントに取って代わることになったら、これはAndroidからGoogleが取り去るまた一つの便利な機能だね。

└

面白いね。私はスクリーンショットを撮って、Google Lensに送るんだけど、これはあなたが言ってることよりも明らかに手間がかかるよ。でも、ジェスチャーを有効にしてるから、ホームボタンがないんだ。ホームを長押しするのと同じジェスチャーって何だろう？

└

うん、確かにAndroidで一日に何回も使うお気に入りの機能だよ。iOSでスクリーンショットを取るのがほぼ同じだって言ってる人たちとは違って、全然違うから。これは画面全体を一時的なスクリーンショットに移動させて、テキストをコピーしたり、翻訳したり、色々できるんだ。スクリーンショットを取る遅延もないし、そのファイルが永久に残る心配もない。今の時代、画像がテキストデータを共有する最もアクセスしやすい方法になってるのが超皮肉だよね。でも、これが「エンシティフィケーション」がもたらしたものなんだ。

メッセージが表示されたんだ：「ああ、JavaScriptを無効にしたんだね。頑張ってるね、クリーンウェブ仲間！」って。いつもは「このアプリはJavaScriptがないと動かない」って言われるのに、面白いね。でも、そのメッセージのテキストを選択してここに貼り付けることができなかった…その上にある「テキストを選択させて」っていうヘッダーを見ながら、「そうだよね！」って思った。

└

CSSを無効にすればテキストを選択できるよ。

このページには、ブログの他の場所では適用されていない以下のスタイルがあるから: body { -webkit-user-select: none; -webkit-touch-callout: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } テキストが選択できないのは意図的だと思う。ここにあるいくつかのコメントが仮定しているように、偶然ではないし、「皮肉」でもなく、この行動がどれだけイライラするかを示すための意図的な努力だと思う。

└

uBlockでは: *##html, body, body *:style(user-select: auto !important)

└

なんでこんなに多くのコメントが「意図的なトロールか偽善か」について話してるのか分からない。別のブログ記事をチェックするのに10秒もかからないのに :(

└

こういうウェブサイト用にブックマークレット作ってるよ、笑

└

最近の人たちはそんなに鈍感（つまり、バカ）なの？著者がジョークだって気づけないなんて。

ウェブ開発者として、これには完全に同意するけど、大きな例外があるんだ。それは、クリック可能なテキスト。コンテンツとして読まれるべきものは、絶対に、選択可能でコピーできるべきだよ（適切な権限があればね）。でも、タブのヘッダーやボタン、さらにはテキストが少ないタイルみたいな、ユーザーがクリックするためのものは、テキスト選択を防ぐべきだし、通常はそうすべきだと思う。タブを行ったり来たりしているときに、誤ってテキストがハイライトされてそのまま残るのはすごくイライラするよね。すべてのルールには例外があるし、その例外にも例外があるけど、基本的にはクリック可能なエリアでのテキストハイライトを許可するのは、UX的には厳しいと思う。* アンカーリンクは含めてないけど、あれはテキストコンテンツ内でインラインにあるべきもので、だから選択可能であるべきなんだ。

└

100%同意できない。誰もがすべての言語に堪能なわけじゃないし、ブラウザの翻訳機能が完璧に動くサイトなんてないよ。ボタンやタブにある一言を翻訳したいときもあるのに、誰かが「これでいいだろ」って思って選択できないようにしてるのはおかしい。

└

クリックできないと思ってるランダムなもののテキストをコピーするために、開発者コンソールに入らなきゃいけないのは嫌だ。そんなことがありすぎる。

└

日本のウェブストアでCDやグッズを買うことがあるんだけど、これらのサイトは実際に日本人が使ってるところだから、翻訳がほとんどないんだよね。ナビバーの日本語をコピーして翻訳にかけるのがルーチンになってて、「カート」「注文」「アカウント」「ヘルプ」みたいなリストが出てくるよ。ボタンの例もそうなんだけど、もし中国語がわからなかったら、「下单」と「返回」が何を意味するのか、翻訳にコピー＆ペーストしないとわからないよね。

└

ほぼ毎日使ってる実例があるんだけど、チケットシステムでチケット番号のナビヘッダーを選ぶときに、その番号をどこかにコピー＆ペーストするんだ。もちろん、こうする必要があるのは他にもいろんなデザインの悪い決定があるからなんだけど、全てのテキストが選択できるべき理由の一例だよね。

└

でも、タブのヘッダーやボタン、テキストが少ないタイルみたいな、ユーザーがクリックするためのものは、テキスト選択を防ぐべきだし、通常そうするべきだよね。タブを行ったり来たりしてるときに、誤ってテキストがハイライトされてそのままになるのは超ウザい。例えばOutlookメールはその原則が満載で、メールアドレスをコピーするのが「選択できないメールアドレスにカーソルを合わせて連絡先カードを表示させ、連絡先カードをスクロールして再度表示されるメールアドレスを見つけるけど、また選択できない、で「クリップボードにコピー」アイコンをクリック」って感じになる。テキストは選択できるようにしてほしい。

└

ボタンのようなグラフィック要素については議論の余地があるけど、テキストに関しては、クリック可能でもテキストとして扱うべきだよ。Outlookのウェブ版では、アポイントメントの場所が住所になってることがよくあるけど、そのテキストは通常クリック可能なんだ。でも、そのクリックアクションは、どのマッピングサービスを使いたいかとか、他のアクション（例えば、別のメールやSMSに住所をコピーするなど）には対応してないんだ。Outlookは君の哲学に従ってるけど、そのテキストを選択してコピーすることはできないし、いくつかの補助的なクリックを経ないといけない。これは本当にイライラする行動だよ。君が会議室で同僚と話し合ってるか、あるいは自分の中で会議をしてるかは関係なく、何か他のことが関わってるときに正当な用途を考えるのは間違ってる。ちなみに、その住所がリンクになってるのは60%から70%の確率でいいけど、そうじゃないときは明らかにデザインミスだよ。

└

ウェブページのリンクがシングルクリックで開くのがずっと気になってる。ダブルクリックで開くべきだし（コンピュータの他のほとんどのものと同じように）、シングルクリックはテキスト選択を始めるために使うべきだよね。

└

同意だね。伝統的なデスクトップのUIに近づくほど、クリックできるテキストの選択がめちゃくちゃになるよね。シンプルなウェブフォームなら、ラベルを選択可能にしても大した問題じゃないし、むしろ良いことだと思う。でも、タブ付きダイアログボックスみたいに振る舞おうとするものだと、ナビゲーションが左右で壊れちゃうんだよね。

└

タブを行ったり来たりしてるのに、テキストが誤ってハイライトされてそのままになっちゃうのが超イライラする。どうやってこれをやるの？ > テキスト選択を防ぐことができるし、通常はそうすべきだよ。やめてくれ、考えすぎだよ。デザインを少なくして、もっと良いデザイナーになって。

└

反対だね。多くの場合、テキストはクリック可能だけど、Wikipediaや検索エンジンにコピー＆ペーストしたい内容も含まれてるんだ。例えば、注釈（このテキストをクリックすると詳細情報が見れる）や、公共の何かを指す固有名詞の見出しやタイトルとか。これは「例外」じゃないと思う。むしろ「そのテキストを選択不可にしないで」って言いたくなるくらい一般的だよ。

読んでるときにテキストを選ぶのが好きなんだけど、うまくいかないと超イライラする。こういうサイトには呪いをかけたい。

└

私も全く同じことをしてる。自分だけかと思ってたよ。

チームはリアルタイムキャプションからテキストをコピーさせてくれなかった。許可されてないってポップアップまで出てきた。でも、会議後に公開されたトランスクリプトでは同じテキストをコピーできたから、なんで即座にコピーできないようにすることがそんなに重要だったのか分からない。すごくイライラした。あの時すぐにそのテキストが欲しかったのに。

BumbleやHingeなどが、プロフィールを検索不可に設定しているのは、ドックスの最低限のバリアとしての意味があるのかな。現代のデーティングアプリには多くの異議があるけど、彼らが対処しようとしている実際のトレードオフや問題があると思う。翻訳を知るためにChatGPTやClaudeにスクリーンショットをアップロードするのは、 unreasonableな要求じゃないと思うよ。[0] https://setharielgreen.com/blog/date-me-docs-obviously/

└

そうかもしれないけど、いろんな文脈で起こることだよ。特にアプリでは、今のところHipcampでは旅行の詳細な指示をコピーできないんだ。Airbnbでは「ハウスルール」のドキュメント全体はコピーできるけど、特定の段落や文だけはコピーできないんだよね。

└

これが彼らが使う「理由」かもしれないけど、実際にテストしてそれがどれだけの保護を提供するか示したとは思えないし、ただアプリを使いにくくしてるだけだよ。良い理由に聞こえるからって、それが良い理由になるわけじゃない。

モバイルアプリでは特にイライラするよね。iOSのアプリだと、例えば： - アプリのレビューのテキストが選べない（翻訳用とか） - WhatsAppのテキストバブルは中のテキストを全く選べない - WeChatも同じ。全体的に、アプリがフィールドに対して標準のOSオプションを全然提供しないのもすごく面倒だよね。WhatsAppやWeChatは、アプリ自体がサポートしているかどうかに関係なく、メッセージの「翻訳」機能にアクセスできないし。

だから、ネイティブアプリよりもウェブアプリの方が好きなんだよね。ウェブは選択可能なテキストと拡張機能で読めるテキストがデフォルトだから、分からない単語があったら、ほとんどの単語を長押しして「定義」を選べるし（デスクトップなら右クリックでも）。でもネイティブは選択できないテキストと拡張機能なしがデフォルトなんだよね。それに、ウェブでのFlutterが嫌いな理由でもある。テキストをキャンバスにレンダリングしちゃうから、急に何も選べなくなって、アクセシビリティや定義・翻訳のオプションが使えなくなる。例えば、https://earth.gooogle.com に行って、都市をクリックしてみて。情報ボックスがポップアップするけど、何も選べない。もちろん、デザインが悪いHTMLの情報ボックスもそうなるけど、デザイナーがわざわざ悪くしないといけないのに、Flutter（や一般的なネイティブ）はデフォルトが悪いんだよね。