レスポンシブデザインのSIRIUSテンプレート(STINGER風)

SIRIUSカスタム研究所

SIRIUSのレスポンシブウェブデザイン・テンプレートを公開

ということで、
ありそうでなかったレスポンシブウェブデザインのSIRIUSテンプレートの無料公開をしてみます。

 

まだまだベータ版なので完成度は低いかもしれないけど(随時更新予定)、需要もあるかもしれないので、一応公開しときます♪

 

デモサイト

 

 

特徴

①レスポンシブwebデザイン

・PC、スマホ、タブレット等、いろんな媒体に対応させるためのマルチなデザイン

 

②SEOに拘る

・トップページ以外の<title>は「ページタイトル|サイトタイトル」にする
・h1、h2、h3…の位置を調整
・最もクリック率が高い左上のサイトロゴとなる部分の文言をどのページでも同じになるようにする
 等など、色々といじくってます。

 

③超シンプル設計

・画像は極力使わないシンプルな設計

 

④広告効果の高いデザイン

・実績豊富なSTINGERの仕様を参考にテンプレを構成
・960px(記事部分=630px、サイドバー=300px)の幅広設計なので、広告を入れやすい

 

⑤文字コードUTF8に照準を絞った構成に

・現在主流のバイリンガルな文字コードUTF8仕様のテンプレ
・㈱や①等の特殊文字や最近新たに流通しだした顔文字等の文字化け率が低くなる
(。◕‿◕。)  ლ(╹◡╹ლ)  (´◉◞౪◟◉`)b  (☄ฺ◣д◢)☄ฺワシャー  ʅ(´◔౪◔)ʃ

 

⑥SNSボタンを標準搭載

・ツイッター、はてブ、facebook、google+の4つを全ページに配置

 

⑦ページの先頭に戻るボタンを配置(後日公開/当サイト採用済み)

・ニュルーっと「先頭に戻る」ボタンを搭載。ある程度スクロールした時のみ現れる仕様

 

⑧追尾型サイドバー(後日公開/当サイト採用済み)

・サイドバーに追尾型エリアを設け、縦長のページになった際の無駄な余白を生じさせない

 

 

使用方法

①ダウンロードしたファイルを解凍

 

②解凍されたフォルダ"SIRIUSカスタム研究所"を「SIRIUSがインストールされているフォルダ\templates」に放り込む

 

③"サイト全体設定"の"サイトURL(半角英数字)"を入力

 

④"サイト全体設定"の"テンプレート(必須)"から"SIRIUSカスタム研究所"の"2カラム(右)"を選択して"OKを押す"
 ※文字コードの関係上からか、プレビューの表示が異常に遅い場合があります

 

⑤"サイトオプション" → "サイトデザイン"タブ → "文字サイズ・文字の位置"タブ → "ページタイトルの位置/表示"を"非表示(HTMLから削除・推奨)"にする

 

⑥"サイトオプション" → "iPhoneサイト設定" → "iPhoneサイトを同時生成する"のチェックを外す

使用条件

copyright部分の当サイトへのリンク(nofollow)さえ消さなければ、自由に使ってもらって結構です。

 

ただし、テンプレートそのものの販売や商材販売用特典としての配布はご遠慮ください。

 

また、その他ご不明な点は以下までご連絡お願いします。

 

テンプレートのダウンロード

自作SIRIUSテンプレート更新履歴

2014年6月28日(Ver0.0.3)スマホで見た時の文字サイズを調整2014年6月21日(Ver0.0.2)不安定だった「先頭に戻る」「追尾型スペース」機能をとりあえず外す2014年6月19日(Ver0.0.1)ベータ版として公開

≫続きを読む

 
このエントリーをはてなブックマークに追加

ホーム RSS購読 サイトマップ
カスタマイズ テンプレート 開発メモ 独自タグ一覧 関数一覧

先頭へ戻る