忍者ブログ

忍者ツールズ デザイナーなブログ

忍者ツールズを運営するサムライファクトリーのメンバーがお送りする情報ブログ! ブログテンプレート、デザイン、サービスやIT技術など…

[PR]

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

コメント

現在、新しいコメントを受け付けない設定になっています。

【ブログテンプレート】まとめブログ風デザイン テンプレート バージョンアップ【レスポンシブ】

ご好評を頂いている忍者ブログのレスポンシブ ブログテンプレート、
【まとめブログ風】テンプレートシリーズ(+α)ですが、バージョンアップしました。

バージョンアップ内容としましては、
レスポンシブ部分(スマホ、タブレット時)のナビゲーションです。
いままでページ内にあった、"ページ機能" と "カテゴリー" タブをサイドナビに収納しました。


現在、使ってる人からみたら普及されてるサイドナビ(ハンバーガーボタン)&ファーストビューに記事のタイトルが入るので、
ブログへの訪問者にとっても、SEO強化にとってもプラスになる事間違いないです。
(ヘッダーと記事の間にプラグインが入る為、プラグインが多いとファーストビューに記事タイトルが入らなくなります。その際はプラグインの調整お願いいたいます。)

ちなみに、
こういうサイドナビほとんどのサイトはjsを使って動かしていると思いますが、
今回【まとめブログ風】テンプレートシリーズに導入したのはCSSのみです!!
つまりページサイズが多少軽量なになるのでSEOにも強い内部施策の一つをしているブログテンプレートになります。

さらに、
Appleのスマホナビで採用されてる
クリックした時 "≡" → "☓" にアニメーションで変化するのも実装しています。

\このサイドナビが対応のレスポンシブデザインのブログテンプレート/

下記のブログテンプレートがレスポンシブ&サイドナビ搭載のブログテンプレートになります。
※プラグイン3を削除してます。
※IE非対応です。(スマホにはIEは無いので対応させてないです。)


               
【無料】忍者ブログを作成する
※忍者ブログを作成するには忍者ツールズに登録【無料】する必要があります。
CSSのみでギミックのある動きを出来るのを発見した人、神ですね!!

■参考サイト
□動くCSSのためのメモ。
http://lopan.jp/css-animation/

□3本線のメニューボタンをパネルの開閉にあわせてバツに変化させてみる
http://weboook.blog22.fc2.com/blog-entry-406.html

拍手[2回]

PR

コメント

現在、新しいコメントを受け付けない設定になっています。

バナー:忍者レコメンド

ブログ内検索

最新記事

アクセス解析

PR

バナー:忍者おまとめボタン

この記事を読んだ人はこの記事も読んでいるようです