2026/09/13
本日のアップデート内容
- ページ全体の背景画像を変更し、視差効果を実装しました。
- Indexページ最上部イラストの視差効果をCSSを使用した実装に変更しました。
- Gallery > Illustのサムネイル部分に下記の変更を実施しました。
- 表示が縦に長くなってきていたため、途中から折りたたむようにしました。
- PC画面で表示した際の傾き方が想定と異なっていたため修正しました。
- Gallery > Rakugakiのリンクが数字だけで分かりにくかったため、サムネイル画像を実装しました。
- つぶやき下部メニューの横幅を他のコンテンツと揃えました。
つぶやき下部メニューの横幅、割と前から気になってはいた
ので、ついでに他に気になっていた部分の修正ややってみたかったことも一緒にやっちゃいました。背景にうっすら見えていた画像も、枠だけだとなんか寂しいな~とは前々から思ってたんですよ~
視差効果については、CSSのanimation-timeline: scroll()を使うとスクロールに連動したアニメーションを実装できると何かで知っておもしろ~ってなったので、トップページの一番上のアレと合わせて実装しちゃいました。好みが分かれるところかな~と思ったので、デバイスで視覚効果を減らすような設定がONになっている場合は視差効果を減らす・なくすようにも設定しておいたんですが…
…自分のPCが視覚効果減らす設定になっていたので動く場合の動作確認が出来なくなっちゃった!まあ確認する時だけ設定を変えればいいんですけど…
あと、らくがきログのリンクも、数字だけだと分かりにくくてどうしようかな~と思っていたんですが、この度サムネイル画像を自動で生成する仕組みを裏に構築して、画像を並べる形式に変更しやした。けっこういい感じにできた(と思っている)ので嬉しい。
ただ、Illustのサムネイルと合わせて画像がいっぱい並ぶことになるので読み込みが遅くなったりしないかなという不安はないでもないですが…lazyloadとかなるべく画像を軽くするとか、一応やれることはやったけれどこちらも毛の生えた素人なもんで…ヘイ…
ついでにこれも
なんとなく書き留めておきたくなったので、サイト制作に使用しているツールとか色々を思い出せる範囲で書きました。ホントに便利なものがいっぱいある…すごい時代やで…