サイトをリニューアルしてしまいました。つい魔がさして。
主目的はCSSフレームワークの変更です。これまで採用してきたMaterial Design Lite(MDL)は重たい上に早々に開発終了したので移行は長年の懸案だったのですが、移行先の第一候補としていたGoogle公式の後継プロジェクトは進捗がはかばかしくなく、一方たまに思いついて情報収集するくらいではよさそうなCSSフレームワークに巡り合えず、でいままで来てしまっていました。しかし最近になって知ったdaisyUIがJavaScriptなしにもかかわらず見た目が今風、リニューアル前にMDLで実現していたことはすべて解決できたので、この機を逃してはなるまいと切り替えに踏み切った次第です(daisyUIがベースとするTailwind CSSは個人的には肌に合わないのですが、そこはこだわりポイントではないので妥協)。
結果として見た目の印象が軽くなりテキストの可読性も向上したので目的は達しました。ほぼ既定のままで現在ご覧になっている状態ですから、スタイルをもっと詰めて設定していけばよりよいデザイン・レイアウトにできると思います。ただLighthouseのユーザー補助のスコアが若干下がった(daisyUIがJavaScriptなしでの実現のために行儀の悪いことをしている模様)ので、アクセシビリティを重視するのであれば採用は慎重に検討したほうがよさそうです。
その他の構成は変えていません。コンポーネントはLitで定義、コンテンツはeleventyで生成。メインDOMにアタッチするLitコンポーネントで slot 要素を使えるようにする方法を全面的に生かして、スタイル関連の定義のLitコンポーネントへの閉じ込めにほぼ成功しました。コンポーネント側でのリテラル指定がまだすこしあって、これが取り除ければ完璧だったのですが、まあ無理しても益なしということで……(セマンティックWebに夢を見た人間としてはもうすこしなんとかしたい思いはありますが)。
これで次のCSSフレームワーク変更がやりやすくなりました。ただその代償としてLitコンポーネント適用までの時間が目視できる程度にかかるようになったので、簡単なトリックで目立たないようにしています。
他にはこんなことも。
- 各ページのタイトルの見直し
- トップページの整理
- Twitterの関連コンポーネントを削除
- 古いコンテンツをほんの少しだけアップデート
- Adobe Flash Playerの利用を原則削除
- 古いHTMLの文字符号化方式をUTF-8に変更
リンクの整理は手つかず(大量のリンク切れがあると思います)、表示がおかしかったりレイアウトが崩れていたりする箇所もあるはずですが、そのあたりはご容赦いただければ。なにしろ20年近くの蓄積があるもので……
書き手側としてはワークフローの整理ができて気が楽になりました。だからと言って更新頻度が上がるわけではありませんが。
「次のCSSフレームワーク変更」と書きましたが、これが最後になってもおかしくないな、と思いながら今回は作業していました。いつまであるかわからないこのサイト、消え去る日までご愛顧いただければ幸いです。