hitode909の日記

以前はプログラミング日記でしたが、今は子育て日記です

direction: rtlしながら文字を逆順に書く

企業が謝罪文などを公開するときに、謝罪文を画像として公開して、テキストで済むのにわざわざ画像にしているのは、検索避けする意図があり、不誠実な態度なのでは、といって怒られるということがよくある。
CSSでdirectionをrtlにして、その中での文字は逆順に書くことで、テキストとして選択できるけど検索されないかたちで、検索避けできるのではないか。


この茶碗蒸しを作りすぎたことを詫びる文は文字を逆順に書いていきCSSで右から左に並べて構成している。

。すまげ上し申礼御く厚り賜を配高ごの別格は素平
、いましてぎすり作をし蒸碗茶、はびたのこ
。たしでんせまいざご訳し申に誠、しけかおを惑迷ご

<p style="text-align: left;direction: rtl; unicode-bidi: bidi-override;">
  。すまげ上し申礼御く厚り賜を配高ごの別格は素平<br>
  、いましてぎすり作をし蒸碗茶、はびたのこ<br>
  。たしでんせまいざご訳し申に誠、しけかおを惑迷ご
</p>


画面幅いっぱいで改行してしまうと、2行目が先に登場してしまって不思議な見た目になる。1行内だと右から左に並び替えられるけど、2行になるときは2行目は2行目のままなので上下には入れ替えられない。考えてみるとそうだけど最初何が起きてるかわからず不思議だった。

。たしでんせまいざご訳し申に誠、しけかおを惑迷ご、いましてぎすり作をし蒸碗茶、はびたのこ。すまげ上し申礼御く厚り賜を配高ごの別格は素平

<p style="text-align: left;direction: rtl; unicode-bidi: bidi-override;">
  。たしでんせまいざご訳し申に誠、しけかおを惑迷ご、いましてぎすり作をし蒸碗茶、はびたのこ。すまげ上し申礼御く厚り賜を配高ごの別格は素平
</p>

最初、dir=rtlでできるかと思っていたけど、1文字ずつの並ぶ向きは変わらなかった。
検索できなくなるし、コピーすると逆順になり、スクリーンリーダーを使ってる人は読み上げ不能になる。このブログには音読ボタンを置いてるので押して見ると確認できる。
人の暮らしを豊かにするはずの技術を、こういう形で、本来の用途とは異なる、オープンインターネットを阻害する悪い使い方はやめましょう。