Belong大規模メンテナンスのお知らせ

Belongテンプレートのメンテンナスを行いました。
公式配布ソースは修正済みです。
今回のメンテナンスでは html構造及びCSS装飾及びJS内容全てに大規模な修正を入れています。
不具合の修正ではありませんので、再度DLを行うか否か新仕様をご確認の上でお決めください。

主な変更点
  • html構造を変更しました
  • jQueryライブラリのバージョンを2.1.3から3.2.1にアップしました
  • リセットCSSを見直し、最小限の内容に変更しました
  • 各ページのデザインを再考しました
  • フォントサイズの指定に rem を採用しました
  • floatレイアウトを廃し、flexレイアウトに変更しました
  • 記事下ユーザータグのリンク先指定を外部(FC2ブログポータル「ユーザータグ」ページ)から内部リンク(自ブログ内「タグ」ページ)に変更しました
  • 個別記事ページの記事タイトルをh2からh1に昇格しました(トップページではh2です)

見た目が大きく変わることはありません。 表示速度については 全文表示タイプ のテンプレートですので、個人設定・個人環境に大きく左右されますことをご承知おきください。

CSSについて

リセットCSSを最小限の内容にすると同時に、変更してほしくない部分・カスタマイズされることがまず無いであろうと推測される内容について 圧縮 を行ないました。

各種ページデザイン変更

トップ以外の種のページでデザインバランスが悪いと感じましたので変更・修正を行いました。
新デザインについては Belond専用記事 の「DEMO」でご確認をお願いします。

ページ表示速度について

ページ表示スピード自体はほとんど変化ありません。ごくごく僅かな改善のみです。

トップページメンテナンス前
トップページメンテナンス後

画像で見るべきスコアは一番左のPageSpeedScoreです。
隣のYslowというのは Yahoo! Exceptional Performance team という、Yahoo!のエンジニアが提供しているオープンソースで、ページ速度を遅らせる原因の指摘と対策が行われているかの判定及び提案です。
対策が行われているとスコアが高くなります(FC2ブログでは不可能なサーバーサイドの対策含む)

全文表示タイプのテンプレートの場合、トップページでの表示負荷は 個人設定と記事の書き方に依存します。
本文に多くの画像や動画を貼っていれば重たくなりますし、ブログ環境設定でSNS関連ボタンを「表示」していると一気に表示が遅くなります。
できればSNS純正ボタンの利用は避けたいところですが強制は致しません。当然ですが。

リストページメンテナンス前
リストページメンテナンス後

こちらもほぼ変わらず。

トップページの速度テストは私の所有ページで 最も条件が厳しいと思われるページ で行なっています。
画像掲載などの少ないページではA評価です。
別ページテスト結果(トップページ 56ページ目)
フォントの rem という単位について

従来は px でのサイズ指定を行なっていましたが、rem (レム) という単位に変更しました。
迷いましたが思い切って切り替えました。
迷った理由はIEがバグを持っているからですが、それ言ってるとIEなんてバグの宝庫なのでもう無視することにします (´・ω・`)

remの特徴や多くあるメリットの説明はここでは省きますがメリットのうちでひとつだけ。
ページのフォントを 全体的に大きくしたい(または小さくしたい) という時がありますよね。
部分的にではなく、各フォントバランスは同じで全体的な拡縮をしたいとき。
pxはそういったことはできませんが、remは可能です。

デフォルトではフォントの基本サイズを 10px で統一しています。
10px = 62.5% = 1rem
こういう相関図です。
13pxなら 1.3rem、16pxなら 1.6rem ですね。
62.5% が1remを10px計算するための指定です。
該当箇所は以下の部分。

html {
  margin: 0;
  font-size: 62.5%;
}

基本を10pxでなく大きく or 小さくしたい場合は、この62.5%の数値を変更します。
remは相対単位ですので、基本数値を基に倍率計算されます。
各単位の対応表は以下のサイトでご確認ください。

PXtoEM.com: PX to EM conversion made simple.

Conversions based on 16px browser default size

くれぐれも仕様の変更内容にご注意頂きましてから再DLをご検討ください。
ご質問は 下記のリンク先専用ページで どうぞ。よろしくお願いします。

Belong - FC2ブログテンプレート

Belong - FC2ブログテンプレート

Belongテンプレートはレスポンシブウェブデザインです。 パソコン・タブレット・スマートフォン等全デバイス間共通でお使いいただけます。 「スマートフォン版の表示設定」を「無効にする」に設定してご利用ください。 設定ページ...

-
2017/12/29 (Fri) 16:18

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

Akira
2017/12/29 (Fri) 16:43

To 年末のご挨拶 内緒さん

ご丁寧にありがとうございますー!
こちらこそ大変お世話になりました。来年も変わらずお付き合い頂けると嬉しいです。
内緒さんもどうぞお風邪など召されませんよう。
インフルエンザ未経験のあきらでございました (ノ゚ェ゚)

-
2017/12/29 (Fri) 16:56

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

vanillaice (Akira)
Akira
2017/12/29 (Fri) 17:09

To Pianissimoアップデート&ご挨拶 内緒さん

またやってもーた((((笑)

こちらこそお世話になりました。
来年もチェックして頂けると助かります(笑)
良いお年を :)

コメントに関する注意事項
  • テンプレートに関するご質問は各テンプレート専用記事でのみ受付致します。また、よくある質問をまとめているページも事前にご参照ください。
  • 専門的なご質問の場合、記事内容と明らかに関連の無い内容はお控えください(雑談の場合はその限りではありません)
  • 第三者が不快と感じる内容や論調でのコメントはお控えください(性的,高圧的,暴力的など)