LoginSignup
1

More than 1 year has passed since last update.

文字サイズ変更ボタンというガラパゴス的因習

Last updated at Posted at 2022-04-05

(2022/4/6) タイトルを変更させていただいた。ガラパゴスゾウガメは絶滅させてはならない。進化の神秘を我々に教えてくれる種族であり、地球上から貴重な生物の種がいなくなることは非常に悲しいことである(一人ぼっちのジョージ、ご冥福を)。このタイトルはガラパゴス化の一種であることを強調するために付けたものであったが、あまりにも不適切であった。現存するすべてのガラパゴスゾウガメの皆様にお詫び申し上げたい所存である。

謎のボタン

少なくない日本企業・組織のwebページに、文字サイズ変更ボタンが付いているのは皆さんご覧になったことがあるだろう。あんなのが付いている海外webページを見たことが無い。早く廃止すべきというのはwebデベロッパーなら誰でも思うことだろう。今回はそんなありふれた問題を愚痴る記事である。

不要な理由

そもそもブラウザでフォントサイズを変更できる

これは最近見過ごされがちなことである。昔のIEみたいに堂々と表示されているわけじゃなくて、設定の奥深くに隠れているからね。でも今でも有効だ。古いデータだが、いじっている人は数%いる。ブラウザのフォントサイズを変更しても設定が適用されないのはよくある問題だ。原則論として、ユーザーがフォントサイズを変更したのが反映され、かつ破綻しないようにCSSを組む必要がある。

ページの表示倍率を変更できる

でも、最近のユーザーは、むしろページ全体の表示倍率を変更することの方が多い。文字が見づらいなと思ったユーザーの大多数が、ctrl + ;で画面を拡大するはずだ。世の中には逆にctrl + -で縮小表示するという奇特な方もいらっしゃる。そんな時にページの表示が崩れる(昔ながらのfloatレイアウトならよくある)のは避けたいところだ。

これまでで見た最悪の文字サイズ変更ボタン

このページを見て、記事を書くことを決意しました。

試しにボタンを押して欲しい。全く動作しないだろう。ボタンの下にカーソルを合わせると指マークになるので、これで文字サイズが大きくなる…と思いきゃ、トップページに移動してしまう。ここまでくると怪奇現象である。

ソースを見ると<!DOCTYPE html>が宣言されているなど、頑張ってHTML5で書こうとしているにもかかわらず、不適切なマークアップが散見される。ナビゲーションを<aside>で括っていたり、<main><article>ではなく<section>を酷使している。<body>内に<style>が入っているとか…<script>txtファイルを読み込むなんて初めて見たぞ。そして、ボタンは<img>というのがとどめだ。

このページは相当古いらしく、<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">なんて書かれている。アンカーを付けるために<a>要素を用いていたり、時代を感じさせる。スクリプトも随所壊れているなど、問題山積だ。

セマンティクスを改善しようにも、ツッコミどころが多すぎる。このページを提供している「アジア歴史資料センター」さんの名誉のために行っておくと、メインページの方はちゃんと今どきのHTMLのようなので安心したい。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
1