追加テンプレート第3弾-レスポンシブデザイン

Tips_機能の拡張 Tips_プチ裏ワザ Tips_iPhone Tips_その他 購入者特典 購入者専用ページ

シリウス追加テンプレート第3弾-レスポンシブデザイン

アイキャッチ画像

 

アイキャッチ画像

 

昨晩7月18日にシリウス専用追加テンプレート第3弾が先行販売されました。

 

このテンプレートはシリウス購入者のみが購入可能で、もちろんシリウス専用のテンプレートとなります。

 

今回の追加テンプレートの最大の特徴は
レスポンシブウェブデザイン

 

レスポンシブウェブデザインというのは、
画面幅(モニター解像度)に応じて臨機応変に最適なレイアウトに変わる仕組みのことで、
流行りと言えば流行りのデザインです。

 

これに対して従来のシリウステンプレートは
PC用・iPhone(スマホ)用・携帯電話用とそれぞれ専用のレイアウト構造を持っています。

 

例えば従来のテンプレートで作成したサイトを
画面幅の広いモニターで見たときのイメージがこちら↓です。

 

キャプチャ画像

 

そのまま画面幅を狭めていった時のイメージがこちら↓です。

 

キャプチャ画像

 

画面が狭くなっても中の表示そのものは変わらないため、見切れが発生しています。

 

これに対してレスポンシブウェブデザイン対応のテンプレートだと、
下のように画面幅を狭めても
画面幅に応じて画像の大きさや表示領域が自動で最適化(小さく)なっていますでしょ。

 

キャプチャ画像

 

これがレスポンシブウェブデザインの一番の特徴です。

 

「じゃあ今回の追加テンプレートの方が断然いいんじゃね?」ということになるかというと
実はそうでもないんですね。

 

レスポンシブウェブデザインは
1つのHTMLに対し表示機器に応じた複数のCSSによってレイアウトを変えているので、
従来型テンプレートのCSSよりも量が多くなっています。

 

これはすなわち読み込み速度と関係してくるわけで
その分量によっては読み込みに若干時間がかかる場合もあります。

 

またアドセンス広告など広告を主体としたアフィリエイトサイトでは、
それまではPC用とスマホ用とで分けて設置していたスクリプトファイルが
レスポンシブウェブデザインの場合、設置方法の敷居が若干高くなります。

 

何も対策しないでおくと、
スマホで表示されたときに広告の一部しか表示されないなんて事態にもなりかねません。

 

要するに横幅の調整が必要だということです。

 

それに従来のテンプレートは
スマホはスマホ専用のレイアウトと割り切ったものなので、
スマホサイトに力を入れたい場合はレスポンシブウェブデザインよりはむしろ
従来型のテンプレートの方が作りやすいのです。

 

このようにそれぞれメリットとデメリットを抱えているので
あなたのサイトの”色”に合わせていずれかを選ぶといいでしょう。

 

それでは特徴を見ていきましょう。

 

テンプレートの種類

今回発売されたテンプレートは以下の6タイプ。

 

ポップ

 

クール

 

キュート

 

スタイリッシュ

 

ゴージャス

 

ビジネス

 

私が購入したのは一番上の「ポップ」という汎用タイプのテンプレートです。

いずれこのレスポンシブウェブデザインテンプレートのカスタマイズも記事としてピックアップしていきます。

こちらが『ポップ』のイメージです。

ビジネス

 

ビジネス

 

今回のテンプレートの共通となる特徴がこちら↓です。

 

キャプチャ画像

 

簡単に言うと、従来のテンプレートに比べて

  • 使いやすさはそのままにデザインを重視
  • サイトの”色”にマッチしたジャンルごとのデザイン構成
  • 既存のシリウスサイトとの差別化
  • 検索エンジン対策用に各テンプレートのHTML構造を微妙に変化

 

従来のテンプレートはどちらかというと
どれも似通って”無難な”サイトに落ち着いています。

 

今回の追加テンプレートはそれらのサイトとの差別化を図ることで
訪問者の心に残りやすいサイトに仕上げる工夫がされています。

 

そして各テンプレートのHTML構成を微妙に変えてるところも特筆すべき点でしょう。

 

同じテンプレートを使ってサイトを量産すれば、
「あ、また同じテンプレートを使っているナ」と
検索エンジン側に不利に思わせるリスクがないとも限りません。

 

そのリスク分散のための手間をわざわざかけるところはさすがシリウスと言わざるをえません。

 

仕様

キャプチャ画像

 

色パターンは6色から10色とさまざまですが、
サイト全体のカラー変更というよりは見出しのボーダーなどの色変更なので
これを変えたからと言ってそんなに見た目が変わるわけではありません。

 

横幅は従来タイプとの互換性を保つため900px。

 

この横幅の広げ方に関しては「テンプレート」→「テンプレートの横幅設定」ではなく、
直接CSSをいじくる必要があります。

 

カラム数はどれも2カラムまでです。3カラム用はありません。

 

販売個数は各テンプレートとも200個限定。
他に全テンプレート一括購入もあり、こちらは300個限定。

 

前述したリスク分散のため限定販売にしているとのことです。

 

専用のランキングサイト作成機能対応

これまでSCKの特典テンプレートでしか利用できなかった
「ランキング作成」機能にも対応してます。

 

この機能はあらかじめ用意された設定項目に入力するだけで、
そのテンプレートのデザインに最適化されたランキングが作成できるというものです。

 

コチラがその一例です。

 

またレスポンシブウェブデザインなので、
当然スマホに最適化された状態で表示されます。

 

どれを買う?

各テンプレートとも単体販売と全6タイプ一括購入の2通りあります。
一括購入だと若干安くなってます。

 

私の場合は一応それなりにHTMLもCSSも使えるので1種類あれば充分と思い、
汎用的な「ポップ」を購入してみました。

 

それを元に派生テンプレートを作ることもできます。

 

そうでない人は一括購入がいいかというとそうでもないです。
必要な分だけに絞ってのテンプレート購入で全く問題ないでしょう。

 

そのうちまた新たな追加テンプレートも販売されるでしょうから。

 

以上です。

 

購入ページへ


てっぺん