こがこんにちは、こがです。CSSについて話をしようと思います。CSSとはなんぞや?だと思います。僕自身も名前自体は最近知りました。これは一体どういうものか?というお話をしていこうと思います。CSSを利用して解決出来ることは何か?とそれによるメリットについてそれは、ユーザーに対して体感としてページのロードを実際よりも短く感じてもらうことです。誤解を恐れずに言うのであれば、ページのロードによって画面が真っ白の状態や遷移前のページの表示のままでいるのを短くしよう。すればユーザーへ早くコンテンツを届けることができるということになります。CSSとは、WEBページの上でユーザー(ブラウザ)が一番最初に目にする(表示される)部分で利用されるCSSのことです。CSSが読み込まれるまではページの表示がされないということです。CSSを早く読み込むことが出来ればそれだけ早い状態でページの表示準備が出来ることになります。スクリプトの読み込みなどのレンダリングブロックによって実際の表示タイミングは左右されますがそれだけページの表示には重要な部分になります。実際にどうするのすることは至って単純です。CSSに該当するCSSをインライン、つまりHTMLに直接記述します。言っても、直接自分の手でHTMLを編集してCSSを弄るというのは現実的ではありませんし、また全体としてCSSを管理するのにも手間が増えてしまいます。CSSのインライン化ですが、今ではaltCSS等を利用するのがメジャーになっていると思います。WebpackなんかのバンドルツールやGulpなどのタスクランナー等で処理しているのではないでしょうか?インライン化などについても上述のツールを用いることで簡単に行うことが出来ます。自分は、gulp-inline-sourceというプラグインを利用してインライン化を行っています。CSSを抜き出して生成してインライン化をしていくというのが一般的なフローになっていくのではないでしょうか。CSSの生成についても手動行うのはとっても厳しいものがあります。この点もWEBツールやプラグイン等を利用することで簡単に行うことが出来ます。Generator等でググると出てきます。本当に早くなるのかこれはケースバイケースという感じはします。CSSやJSのフレームワークを使うのが一般的になってきたりしている昨今では少なからず効果を体感することが出来るのではと思っています。CSSをインライン化して読ませるだけでなく、色々なテクニックを利用してUXを上げる工夫をしています。今回のインライン化をすることによってUXを改善できれば良いなと思います。コメントをキャンセルメールアドレスが公開されることはありません。Awothemes.。