ブログ

ブログ初心者のWebデザイナーから見たワードプレステーマ「JIN」のすごいところ

先日本サイトにて使用しているワードプレステンプレート「JIN」を購入し、サイトの見た目がガラッとかわって超満足のおまつりですこんにちは。

今回の記事は写真系じゃないです。
すいません!
ブログやってないよって方は飛ばしてくださって大丈夫です!

なんでJIN?

このテーマに変える前というのは無料テーマである「stinger8」を使用していました。
stingerは、無料とは思えないほどの様々な構成があり、ブログ初心者におすすめのテーマで感嘆していました。ただ、シンプルであるがゆえ色々なところをカスタムしたくなるんですね。

JIN購入前に記事をカード型にしようとローカル環境でいじいじしてましたし、その他にも正直テンプレをそのまま使用するとTopや下層のUIをカスタムしたくなるんです。
そしていかんせん、無料テーマはカスタムに時間がかかるのです。当然ながら。

stingerは使用者が多いので、cssがわからない方でもぐぐれば結構な情報がでてきます。
少し頑張れば非常に高度な設定までできるので、かなりおすすめのテーマでした。

が、それをさしおいてもちょっと面倒。
cssくらいはわかるけど、裏側のプログラミングが絡むところは触りたくないし。
そう思っての購入です。
値段はちょっと高かったけど・・・

いやでも、なんでJIN?

有料テーマにはSTORKやAFFINGERなど様々なテンプレートがありますが、JINにした理由をざっくり言うと、見た目の好み、表示速度、seo面での信頼感です。
見た目に関しては多少カスタムする前提で買いましたが、カラーリングやロゴデザイン以外での構成作業を極力減らしたく、デフォルトのデザインが好みであったJINを選択したんですね。
あとひつじさんがかわいいから

複数のテンプレが選べる!

JINは一つの見た目だけではなく、複数の構成から使用する見た目をえらぶことができます。

>JIN公式サイト

その中のdemo-7のシンプルさがドンピシャでした。
シンプルさがいい!
写真をメインであつかうブログなので、サムネイルのサイズ感などが気に入ったわけなんです。

JINへの移行にあたって

もうフルリニュですし、これまでなぁなぁにしていたブログのカラーリングをすこし詰めてみました。

込み入った意味付けは割愛しますのでさらっと理由を申しますと、青色のモチーフはマジックアワーを意識し、グラデーションは移りゆく時間。

ロゴのOの部分の形状はレンズと惑星を意識しています。
ロゴに伴ってサイト内カラーリングを決めています。

記事のタグ色を色相変えて分けようかと思いましたが、近々カテゴリを増やす予定もありましたので一旦このサイトのカラーが鮮やかな青だという印象を持ってもらいたく、統一しています。

そんなこんなでJINに移行して、早速素晴らしい点が続々と発見できましたので、抜粋して書いていこうと思います。

JINのすごいとこその1 カスタムしやすすぎる

肝心のカラー設定がすごいやりやすい。カラーピッカーから選ぶだけ。
僕の場合は決め打ちカラーコード入力でしたが、特に決めていない方でも感覚的にえらべるのでは。

JINのすごいとこその2 デザインがお上手

ここまでくると僕が褒めるのすらおこがましいんですが。
そもそもデザインて見た目のことだと思っている方も多いのですが、webに関して言うと、ボタンの押しやすさだったり、文字の大きさ、サムネイルの大きさからsnsボタンの配置位置までを含めてのデザインです。これがJINは気持ちよく設定されている。

あとボタンデザインもフラット、マテリアル、立体などのデザインディテールから選べます。
web界隈ではフラットデザインからマテリアルに移行していますので、このあたりの好みを選ぶことができるのも非常に助かりますね!

まぁカスタムなかったら自分で作ればいい話なんだけどね・・・!

フォントも選べる

ブログのフォントも選別可能です。

選べるフォントはなんとnoto sans
ひつじさんわかってる!泣

notoはgoogleが開発したwebフォントで、美しいweb表示に特化しているのです。

webフォントの導入は簡単ですが、正直わざわざ導入しない人も多いと思います。
それが簡易的に選択できるのはとても良い。
noto使おう。

英字フォントと合わせて利用する時はROBOTOと利用するといいです。
というかそもそもそういう風に開発されたそうなので。
このサイトではgotham使ってるけどね。

長期的に見ればJINが日本のweb全体を綺麗にしているといっても過言ではないのです。笑

あでも、noto sansに限らず、webフォントは基本的に導入したらちょっと重くなると考えたほうがいいです。メリットばかりではないというわけですね。

写真系のブログだとただでさえ重くなる可能性が多いので、標準フォントのほうがいいのかなと思いながらもnoto好きなので使っています。

JINのすごいとこその3 アニメーションが細かい

マウスオーバーアニメーションというのは、静的ページに生命の息吹をもたらすと思っているので、標準で小気味の良いイージングが効いたアニメーションが実装されているのは感動です。自力で設定するの面倒なんですよ。意外と。

Topのふわっと出現するアニメーションはon/off選択が可能。
onにすると記事一覧が出現するまでのディレイでストレスが減るので、ユーザーは離脱しづらくなりますが、そもそもそのせいで表示の遅延もあるのでここは考えどころ。
変えるかもわかんないけど一旦切っておこうかなって感じで当サイトはoffにしてます。

終わりに

まだ変更して数日しか立っていませんが、早速直帰率が下がっているようです。即効性のある対策ってブログでは少ないですが、これはすごい。

カスタムしやすい構造のおかげで記事に集中できるので、一応アフィリエイト専用テンプレートみたいですがブロガーにもめちゃくちゃおすすめできます!

そんなこんなでせっかく素敵テンプレート買ったのでもう少しブログに本腰を入れていきます。
引き続き当サイトをよろしくお願いします!