トミー @SaekiTominaga@fedibird.com

樋口一葉の五千円札を受け取って、新札かと思ったら旧札で、記憶にある新渡戸稲造は20年前の2代前だったらしい。

ブログ書いた。

Edge の新しいページカラー設定と `background-color` や `border` 使用時のアクセシビリティ https://blog.w0s.jp/724

#アクセシビリティ #Edge

ファセットナビゲーションでのURLパラメータの推奨・非推奨 https://www.suzukikenichi.com/blog/google-clarifies-search-engine-friendly-and-unfriendly-url-parameters/

URL 内の & 記号は、例えば <a href="xxx?dollar=1&yen;=152"></a> と書くと xxx?dollar=1¥=152 と認識されてしまうリスクがあるので、HTML4 時代は & だけでなく ; もサポートするよう仕様で推奨されていたくらいですが……。
今どきはフレームワークが自動で &amp; にしてくれるので変換忘れの対策など考慮する必要ないんですかね。

ファセットナビゲーションでのURLパラメータの推奨・非推奨 https://www.suzukikenichi.com/blog/google-clarifies-search-engine-friendly-and-unfriendly-url-parameters/

URL 内の & 記号は、例えば <a href="xxx?dollar=1&yen;=152"></a> と書くと xxx?dollar=1¥=152 と認識されてしまうリスクがあるので、HTML4 時代は & だけでなく ; もサポートするよう仕様で推奨されていたくらいですが……。
今どきはフレームワークが自動で &amp; にしてくれるので変換忘れの対策など考慮する必要ないんですかね。

ファセットナビゲーションでのURLパラメータの推奨・非推奨 https://www.suzukikenichi.com/blog/google-clarifies-search-engine-friendly-and-unfriendly-url-parameters/

パラメーター区切りの & 記号は、例えば <a href="xxx?dollar=1&yen;=152"></a> と書くと xxx?dollar=1¥=152 と認識されてしまうリスクがあるので、HTML4 時代は & だけでなく ; もサポートするよう仕様で推奨されていたくらいですが……。

Edge、画像をマウスオーバーすると右上にアイコンが表示されて画像検索に飛べるんですね。これも知らなかったな。

Customize page colors & scrollbars in Edge to improve browsing & accessibility - Microsoft Edge Blog https://blogs.windows.com/msedgedev/2024/10/24/customize-page-colors-and-scrollbars/

Edge に導入されたというこの機能、設定すると背景色が消えますね。
背景色だけで他と区別をしているコンポーネントでは、印刷時にも区別が付くよう background-color と同色の border を設定するテクニックがありますが、それはこういうときにも有用。
一方で border-color: transparent を設定している箇所の枠線が強制表示されてしまう。display: table の行列間隔を延ばす目的で table-cell な要素に transparent な border を設定するテクニックをやっていると可視化されてしまう……。

Firefox と Brave と Vivaldi のいいところだけを集めた最強ブラウザ欲しい

Firefox と Edge, Brave はブラウザ終了時に Cookie など閲覧データを自動削除する機能があるけれど、Chrome, Vivaldi はないっぽい。
Vivaldi は閲覧履歴の保存をセッションのみに制限することはできるけれど、これは :any-link:visited が完全に無効になるようなもので、やりたいこととちょっと違うし Cookie は消えない。

久しぶりに Vivaldi 立ち上げたら……タブの border-radius 強すぎでは

広尾のローマ字表記、駅名は Hiro-o で交差点は Hiroo

あっ、<cite> 要素が使われている(謎)

JavaScript無効時のコンポーネントの動作とアクセシビリティに関する考え #JavaScript - Qiita https://qiita.com/shamokit/items/24d9c74a1403037d4cb9

> しかし、実際はJSが無効になっていれば動きません。
> 「あれ？動かないぞ」となってしまったらユーザーは混乱しますし、いい印象は受けないはずです。

当該記事にコメントもしたけれど、ブラウザの設定をサイトが壊れる方向に意図的に変更しているユーザーの感情って誤解されがちなのかなあ。
少なくとも私は「動かないボタン」に遭遇しても、というかめちゃ遭遇しますが、それを理由に混乱したり悪い印象を持ったりすることはないです。
「なぜわざわざブラウザの設定を変えるのか」は理解されにくいと思うんですが、「動作しないページに遭遇したらどう思うのか」は誰でも簡単に体験できることなのだから、その感情面にまで言及するのならせめて1週間程度実際にスクリプト無効にして生活してみてほしいです。

ルビの使用で <rp> 要素の記号文字が正しく設定されているかの確認、みんなどうしているんだろう。ユーザースタイルシートかな

<input type="tel"> に maxlength="11" を付けるな高校

秋葉原のジャンク通りて正式名称だったの

Web Components という概念が世に出て10年以上経っているらしい

> パスワードは0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ!"#$%&'()_のいずれかでなければなりません。

すごいエラーメッセージを見た。
a から Z までくまなくあるのかつい確認しちゃう（あった）

<cite> 要素は、本当はリンクテキストにてその真価を発揮すると思うんですよね。
<a href="..."><cite>hogehoge</cite></a> であればリンクをクリックする前にそれがリンク先のタイトルそのものであることが保障される。
<a href="...">hogehoge</a> だとそうとは限らない。
スマホでは PC のようにマウスオーバーでステータスバーに URL を表示することができないので、リンク先に行くかどうかの判断情報を、文章を変えずにマークアップによってユーザーに提示できるのは大きなメリットになるはず。

これはブログ記事のようにいわゆる文中リンクにおいてとくに効果を発揮する潜在力があるはずなんですけど、残念ながらそれをいい感じに表現するブラウザが存在しないこと、Markdown 記法に <cite> が存在しないことから、誰も活用していないのが現状。
そもそも <cite> 自体、著名なサービスだと Wikipedia くらいでしか使われておらず、その Wikipedia も使い方が間違っていてよろしくない。
自分も、静的ページ中心の個人サイトではできるだけ <cite> を使うよう最近は意識するようにしているけれど、ブログの方ではやってない。

「お前ら失明したらどうする？」への回答｜moutend https://note.com/moutend/n/n42f34312967a

なるほど、作品のアニメ化（メディアミックス）はある意味でアクセシビリティでもあると。
昔からドラマCDや、最近では絵は漫画のまま声優が声を当てる「マンガアニメ」なんてものも作品によっては存在するけれど。