投稿日 2024-07-01

こんにちは、世界

屋号のウェブサイトを公開しました。自分についてのまとめや、ブログの執筆をしていきます。

謝辞

制作に当たり、TAKLOGさんで勉強させていただきました。モダンなCSS、アクセシビリティへの考え方など非常に参考になりました。この場を借りて御礼申し上げます。

本サイトの技術構成を紹介します。

静的サイトジェネレーターは様々ありますが、個人的に気になっていたAstroを採用することにしました。

勉強中なので実践の場として採用しました。実践していく中で、inferなどの組み込みの機能を学ぶことができました。

現代のCSSは十分に強力なので、素のCSSで記述しています。ほぼコンテナクエリだけで、レスポンシブ対応が出来てしまいました。

ヘッドレスCMSを使う予定でしたが、個人サイトの規模だとメリットが薄く、物理的に管理したほうが楽なので採用しました。

まだまだ足りないこと・分からないことが多いですが、最大限配慮したコーディングをしました。 VoiceOverを使って確認しています。読み上げが不自然なところは、visually-hiddenしたテキストを用意しました。

Lighthouseの評価を最大限上げるようにしました。モバイル・デスクトップでパフォーマンス・ユーザー補助ともに90以上を目指しました。

初回訪問時、システム設定から初期のモードを設定しています。スイッチで変えると、それ以降はシステムの設定を反映しません。設定したモードを維持します。

モード切替には課題が残っています。スイッチでテーマ切り替えをした後、僅かな間中間状態になるので、その時にチラつきが発生してしまうことです。現在、Transitions APIでページ遷移をしているので、この問題は顕在化していません。

試行錯誤してみましたが、改善できていない状況です。

Astroの組み込み機能を利用しています。コンポーネントを読み込むだけ、という訳にはいきませんでした。ナビゲーションの流れを知らなかったのでハマってしまいました。後日、ハマりポイントを記事にしてみたいと思います。

過去にもブログを運営していた事がありますが、続かずに辞めてしまったので、今回はモチベーションを保つ努力をしていきたいと思います。最低でも月に1度は更新できるようにしていきたいと思います。