soanema's blog、始まります。
2024.08.19
お久しぶりです。そあねまです。
どうも皆さんお久しぶりです。そあねまです。最近はYouTubeの更新も滞っており、大変申し訳ございません。
そんな私ですが、本日、soanema’s blogを皆様に公開することができました！！(ﾔｯﾀｰ)
今まで動画を投稿していなかったり、ねまブログ(前のブログサイト)の更新をしていない間にこのサイトを制作しておりました…！！私の数カ月間の努力の結晶、隅々まで御覧ください。
作ろうとしたきっかけ
さあ、それでは本題に入りたいと思います。
いままではWordPressで制作した、”ねまブログ”というサイトでブログを更新しておりました。
ではなぜ新たにブログページを制作したのか気になりますよね？それはズバリ、WordPressが使いにくかったからだ！
ねまブログはWordPress(テーマはCocoon)で制作しておりました。
▲ ねまブログのトップページ
ねまブログ制作中にも思いましたが、とにかくWordPressは使いにくい！
もちろん、機能が豊富で様々なサイトをノーコードで作れることは非常に画期的だと思いました。ただ、私の場合、機能が豊富すぎて何をどうすればいいのかわかりにくかったと感じました。また、あれやりたいこれやりたいと調べているうちに面倒くさくなり、結局ブログデザインをこだわりきれずに公開。その結果、制作意欲も低下、更新がほぼなくなりました。
それから数ヶ月たったある日、「WordPressが使いにくならhtmlで制作すればよいのでは！？」と思い、制作に乗り出しました。
苦労したところとか
制作するにあたって、頭の中の構想を描き起こさなければなりません。
ということで、いつも通りFigmaを使用してデザインカンプを制作しました。
デザインカンプはかなりスラスラ完成し、頭の中の構想がかなり忠実に再現できました。
▲ デザインカンプ(2024年2月下旬に制作)
地獄はここから始まります。
デザインカンプが制作終わったあとはhtmlとcss、必要に応じてJavascriptを使用してコーディングを開始しました。
まずはサイトにアクセスした際に表示される、画像の部分の制作を開始しました。ここが一番の難関だったと思います。
私の力だけで制作することは困難だったので、ChatGPTを使用して制作を行いました。ただ、これがなかなかうまく行きませんでした。ChatGPTにコードを生成してもらって、修正して、生成してもらって、修正して…の繰り返しでした。
ここだけで3ヶ月以上かけ、制作を行いました。
次に新着記事の部分の制作を行いました。ここに関しては、LCのWebサイトや、自分のportfolio等で得た知識をフル活用し、制作を行いました。
比較的早めにできたと思います。
次にヘッダーとフッダーの制作です。フッダーに関してはportfolioからそのままコピペし、cssを少しいじって制作しました。
ヘッダーはhtml部分は1から制作したものの、cssはportfolioからコピペし、少しいじくって制作しました。
最後に、今皆さんが見ていただいている記事ページの制作です。
ここもそこまで難しいものではなかったとおもいます。ただ、テキストサイズがどのサイズが適切なのかわからなくなっており、様々なサイトを参考にし、決定しました。
デザインとしてのこだわり
苦労したところを話したところで、次にデザインとしてのこだわりについて話したいと思います。
今回のサイトは白と黒寄りの色を使用し、統一感をもたせるようにデザインを行いました。
また、角丸を基調とし、現代の流行を取り入れました。(今の流行って角丸だよね？)
ただ、私はデザインを詳しく勉強している身ではなく雰囲気で制作しているので、違和感などございましたらお気軽にご連絡ください。
最後に
今回はブログページが更新しましたというお知らせでした。
次回からは動画に出ていない商品や出ている商品を紹介します。更新された際はぜひ御覧ください。
最後までご覧いただき、ありがとうございました！
この記事をシェアする
