徒然もの書きぱん

適当にアニメとかについて書いてます。今期は何について書きましょうか。

WEB言語を学んでブログパーツを自作してみました

はじめに

 こんにちは。

 別の記事でも述べましたが、HTML&CSSとJavascript(jQuery)を学んでブログパーツを自作してみました。本当はこちらの記事で紹介する予定だったのですが、思うことを書いているうちにまじめな雰囲気になってしまったので、こちらで別途紹介という形を取りたいと思います。

 こちらの記事で結構まじめに語っていますのでよければどうぞ。www.palepalette-blog.com

 また勉強に使わせていただいたサイトはこちらになります。上の記事でも紹介しましたが再度紹介いたします。prog-8.com

変更されたデザイン

デザイン全般

変更前:

f:id:palepalette:20150809062734j:plain

変更後:

f:id:palepalette:20150809062746j:plain

 上のバーが無くなったり、フォントが変わったり、カテゴリバーが変わったりといろいろ変わっています。素人感満載ですが許してください。

自作したカテゴリバー

変更前:

f:id:palepalette:20150629073836j:plain

変更後:

クリック前:
f:id:palepalette:20150810123915j:plain

クリック後:
f:id:palepalette:20150810124035j:plain

自作したカテゴリバーのコンセプト

 今回作ったカテゴリバーですが、以前のカテゴリバーではできなかったコンセプトを実現するために自作しました。そのコンセプトとは、「メインカテゴリ→サブカテゴリへの移動を意識する」というものです。
 以前のカテゴリバーではメインカテゴリのみを表示していました。しかし見に来る人にとってはサブカテゴリの方が重要である場合があります。

 僕はブログを店と考え、それぞれ表のようなイメージを持っています。

ブログタイトル 特に意味ない
デザイン 店舗の綺麗さ
メインカテゴリ 店舗のジャンル
サブカテゴリ 店舗に並んでいる商品

このように考えているため、お客さんが商品にたどり着くためにサブカテゴリの整理が必須でした。

自分で言うのもあれですがよく出来たほう

 実際にサブカテゴリへの遷移が増えたかどうかはわかりませんが、よく出来たほうかなと思います。正直これだけのブログパーツですが、かなり作成に手こずりました。

全部手動です

 はい。まだ全部手動で作っています。将来的には自動化したいと思ってます。自動化は夢があります。

作成時間について

 勉強時間は約6時間ぐらい。作成に取り掛かってから完成までに約2日ぐらいかかりました。僕から言いたいことは、
「あのサイトで勉強すればだれでもこれぐらいはつくれるようになる!!」
ということです。それぐらい素晴らしいサイトです。

まとめ

 ブログパーツを作った報告と、今回のカテゴリバーで実現したかったコンセプトについて書いてみました。ブログパーツ作るの楽しいので、自分でほしいと思ったものは積極的に作ってみたいと思います。

 以上です。それではまた別の記事でお会いしましょう。