この記事では、SEO設定について解説しています。
TOPページのSEO設定やCSSファイルなどの読み込みの設定を行います。
どこで設定するの？
外観 ＞ カスタマイズ ＞ SEO設定 で行います。
ダッシュボード ＞ 設定 ＞ 表示設定 で、「ホームページの表示」を固定ページに設定している場合は、こちらで設定した情報が反映されないので、該当する固定ページの編集で行いましょう。
TOPページSEO設定
TOPページのSEO設定では、トップページのタイトルや説明文などを設定することができます。
TOPページの＜title＞
TOPページの<title＞（タイトル）を入力します。設定したタイトルは、ブラウザーのタブに表示されます。
何も設定していない場合は、ダッシュボード ＞ 設定 ＞ 一般 の「キャッチフレーズ｜サイトのタイトル」が表示されます。
TOPページタイトルをこちらで設定するとこんな感じ。タイトルのみになります。
サイト名を表示したい場合は、タイトル入力欄の下の「｜サンプルサイト（ここは、あなたのサイト名）」を表示するにチェックを入れると表示されます。
TOPページの＜meta description＞
TOPページの＜meta description＞（メタディスクリプション）を入力します。メタディスクリプションはページの説明文にあたります。
ここに入力した内容は、Webサイト上には表示されませんが、GoogleやYahooなどの検索エンジンが検索結果に表示するための目印となります。
検索結果の上位に表示されればアクセス数が増えるので、どのようなキーワードで検索結果に表示させたいのかをよく考え、設定する必要があります。
CSS非同期読み込み設定
テーマに使用しているCSSファイルの非同期読み込みの設定を行います。
非同期読み込み機能を有効にするとページの読み込み速度が向上する代わりに、一瞬デザインが崩れて見えることがあります。
ページの読み込みが遅いと訪問者は離脱（ページを閉じたり、違うサイトへ行ってしまう）してしまうので、できる範囲で設定しておくとよいでしょう。
ファイルの説明
- メインCSS（style.css）
ザ・トールで使用されているテーマのメインCSSファイルです。
- 子テーマのCSS（style-user.css）
子テーマの（style-user.css）ファイルは、「THE THOR（ザ・トール）」にオリジナルのカスタマイズを設定するときに使用します。
- アイコンフォントCSS（icon.min.css）
ザ・トールで使用されているアイコンフォントのファイルです。
- GoogleフォントCSS
WebフォントであるGoogleフォント「Lato」「Fjalla」「Noto Sans JP」のファイルのことです。
- SwiperCSS（swiper.min.css）
メインビジュアルでスライダー機能や記事カルーセル機能を「表示する」に設定している場合のみ出力されるファイルです。
- YTPlayerCSS（jquery.mb.YTPlayer.min.css）
メインビジュアルに背景動画を「表示する」に設定している場合のみ出力されるファイルです。
img非同期読み込み設定
img（画像）ファイルを非同期読み込みに設定できます。
htaccess設定
サイトを高速表示するための「Gzip圧縮とブラウザキャッシュ」の設定を行います。
ブラウザキャッシュ
ブラウザキャッシュとは、Webページにアクセスした際に、ブラウザがデータをキャッシュして保存することをいいます。
ブラウザにデータを保存しておくことで、次回、同じページを訪れた際に、データをダウンロードするのではなく、ブラウザに保存されたデータが読み込まれ、ページの表示スピードが速くなります。
Gzip圧縮
ウェブサイトを構成しているhtml、JavaScript、css、xmlなどのファイルサイズを小さく圧縮することで、データ量が軽くなり、サイトの表示速度を向上させる効果が期待されます。Gzip圧縮を利用するだけで、転送量が40～50％も削減されるそうです。
HTML圧縮設定
HTMLファイルの圧縮設定を行います。
HTMLファイルは、Webページを構成するためのファイルです。HTMLの圧縮とは、HTMLファイルに含まれる改行コードやコメントなどを削除してファイルサイズを最小化・軽量化することを言います。
