Font Awesome5へのアップグレードについて

Font Awesome5へのアップグレードについて

割と重要なお知らせ
2018/03/21 0
vanillaice (Akira)
vanillaice (Akira)
Information

既存テンプレート内に含まれるFont Awesomeのアップグレードについてです。

以前からお伝えしている通り、Font Awesomeのアップグレードだけを目的としたテンプレートメンテナンスはしない方向です。
が、今のところ新テンプレート製作の方は少しお休みをして、既存作のメンテナンスに時間を割いています。
そしてメンテの順については超ランダムです(笑)
テキトーに選んでやってます ^^;

もし「自力で5へのアップグレードを済ませたは良いがテンプレートの見た目がおかしくなった…」という方がいらっしゃいましたら、コソっとお知らせ頂ければ優先メンテも吝かではありません。
もちろん個人カスタマイズやその影響については別ですよ (´・ω・`)
私が出来るのは「FA5とテンプレート」という相関図内だけです。

というわけでリクエストの届きました AxisテンプレートのFAバージョンを5にしました。公式ページは上書き済みです。
カスタマイズ必須部位の作業工程などに変更はありませんので、既にカスタマイズを済ませており再DLを希望されます方はCSS内容を移植できるようにしておいてください。

事のついでにhtmlやCSSのコード内容について、そしてAxisについては今回のメンテナンスで若干の変更(といってもカスタマイズに影響しません)を記しておきます。

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

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

CSSの書き順について

「書き順」というか、プロパティの指定順序 なんですけども。
こちらについては「正解」が存在しません。つまり「公式ルールが存在しない」んですね。
が、各ベンダーによる「推奨」はあります。

これまでは「なるべくアルファベット順」を意識して書いていましたが、カスタマイズされる方もたぶんそんなに意識はしていないと思いますので、今後は好きに書こうと思います(笑)

Googleの推奨は「アルファベット順にしとけ。管理しやすいし。」
ですね。 Mozillaは「視覚整形→ボックスモデル→あれこれなんだかんだ」
という感じで、実際のレンダリングを分析した上で理論的な順序を推奨しています。
書きやすいのはどちらかと言うと後者です。個人的に。
なので今後はMozilla推奨内容っぽくなっていくと思います。もちろん個人のカスタマイズへの影響などは一切ありません。SEOも無関係です。

画像遅延読み込みの対象範囲を拡げました(Axis)

画像の遅延読み込みは通常 htmlのimg要素 に対して行いますが、Axisのエンターページのカテゴリ一覧は CSSのbackground-imageプロパティ で表示しています。
今回のメンテでbackground-imageも遅延対象にしました。
ただしbackground-imageはimg要素と違い transitionが効きません ので、フェイドインでの表示はされず、パッと出てきます。
こちらは表示不備・不具合ではなくCSSの特性ですのでご了承ください。

個人の記事内で利用したFont Awesomeアイコン修正については自己責任で

テンプレート内容については製作者がすべき作業ですが、個人の記事に関しては自己責任で書き換えを行なってください。
記事内でFAアイコンを利用している場合 テンプレートのバージョンアップによって影響が出ることがあります のでご理解頂いた上で再DLをご検討ください。

 0

There are no comments yet.

テンプレートに関するご質問・不具合のご報告の際はご自身のブログアドレス記載必須です。
ご質問の前に 必ずお読みください
テンプレートに関するご質問時のお願い

必ず該当テンプレートの専用記事にお願いします。無関係な記事・別のテンプレート専用記事でのコメントはお控えください。
テンプレートカテゴリ
テンプレート一覧

割と重要なお知らせ