Blog -備忘録-デザインを考える。
投稿日：2025-11-22 /制作工程の話【4】
ウェブページを作る工程で、私がいちばん厄介だと思うのがデザイン。
なかなか納得できるものができず、何回作り直したことか……
まず背景画像を探し彷徨う……
風景画を求めてたどり着いたのが「きまぐれアフター」様のこちらの素材でした。
これだけではちょっと寂しいので右下に猫シルエットを配置。
猫シルエットは「シルエットデザイン」様の素材を使わせていただきました。
どーんと背景にして、少し全体の色を薄くしてみたり、コンテンツに半透明の背景色を敷いたりしてみたものの、ごちゃついてる感が否めず、最終的に右下部分だけが残って現在の形です。
上下に入れた水彩画のような柔らかい装飾は「イラストAC」で見つけた おかか様 の作品（ID: 22902963）です。
1枚絵を background-size: cover で表示していましたが、そうすると主にスマホでスクロール時に画像がカクっとなる時があるんです。ブラウザのアドレスバーが出たり消えたりすることで height が微妙に変化するのが原因。
それがどうしても気になってしまうので、右上と左下で画像を分けることにしました。
右上をbodyの背景で background-attachment: fixed にして、左下は position:fixed にした body:after の背景にしています。
コンテンツの配置も display: grid を使ってみたりいろいろ試行錯誤をしましたけど、最終的にシンプルが一番だと思ってたどり着いたのが現在のデザイン。
デザインって作る人の趣味嗜好が少なからず出ちゃうのは仕方ない。
作ったものを悉く否定され続けたのでデザインは苦手です。
でも嫌いなわけじゃないし、今のサイトは私らしいデザインで良いと思ってます。
流行とかテクニックとかあるけど、デザインは自分が好きなものを作りたいと思っちゃうからやっぱり私にデザインは向いてない……
制作工程の話
Instagram
良い写真が撮れたりした時にたまに投稿してます。