/** Geminiが自動生成した概要 **/
記事では、PageSpeed Insightsのユーザー補助スコアを100点にするための取り組みが紹介されています。
具体的には、記事タイトル下のカテゴリ名のリンクで指摘されていた「背景色と前景色には十分なコントラスト比がありません」という問題を解決しています。
解決策としては、WebAIMのConstract Checkerを用いて、背景色と文字色のコントラスト比を調整しました。スライダーで色を調整し、Passになるまで繰り返した結果、問題を解消できました。
ただし、サムネイル画像の低解像度に関する指摘は未解決で、別の対応策を検討する必要があるとのことです。
/** Geminiが自動生成した概要 **/
SOY CMS用のユーザー補助プラグインが開発されました。このプラグインは、画像のalt属性が空の場合に自動でファイル名を挿入することで、WebアクセシビリティとSEOを向上させます。PageSpeed Insightsで新たに導入されたユーザー補助項目に対応し、既存記事の修正や新規記事作成時の負担を軽減します。プラグインはサイト管理者の負担を軽減し、ウェブサイトのアクセシビリティ向上に貢献します。ダウンロードは[https://saitodev.co/soycms/](https://saitodev.co/soycms/)から可能です。
/** Geminiが自動生成した概要 **/
HTMLScriptElement は `<script>` タグを制御するインターフェース。`src` 属性で外部スクリプトを読み込み、`async` 属性を設定すると解析を妨げずに非同期でスクリプトを実行、`defer` 属性はHTML解析完了後に実行、`type` 属性でスクリプト言語を指定。`text` 属性に直接コードを記述も可能。`onload` イベントで読み込み完了を検知、`onerror` でエラー処理。`crossorigin` 属性はCORSリクエストを制御。`integrity` 属性はSubresource Integrity を使用し、読み込んだスクリプトの整合性を検証。`referrerpolicy` はリファラーヘッダーを制御。`nomodule` はES Modulesをサポートしないブラウザでスクリプトを実行。
/** Geminiが自動生成した概要 **/
Google Analyticsのスクリプトをページ読み込み直後に移動することで、Core Web Vitals、特にFID(First Input Delay)を改善する方法を解説しています。通常、Google Analyticsのスクリプトは</body>直前に配置されますが、これだとスクリプトのダウンロードと実行が完了するまでブラウザが他の操作を受け付けず、FIDが悪化します。記事では、async属性を追加し<head>内に移動することで、スクリプトを非同期で読み込み、ブラウザのレンダリングを妨げないようにする方法を紹介。async属性はIEでは機能しないため、IE用に条件分岐で対応する必要性も説明しています。さらに、Google Tag Managerを使用している場合は、設定変更だけで対応可能であることも解説しています。これらの修正により、FIDが大幅に改善され、ユーザーエクスペリエンスの向上が期待できます。
/** Geminiが自動生成した概要 **/
PHPのOPCacheは、バイトコードをキャッシュしてパフォーマンスを向上させる機能。設定項目`opcache.revalidate_freq`はスクリプトの更新チェック頻度を制御する。デフォルトは2秒だが、CMSサイト等でPHPスクリプトの更新が少ない場合は、この値を大きくすることで更新チェックのオーバーヘッドを減らせる。設定変更は`php.ini`で`opcache.validate_timestamps`を有効化し、`opcache.revalidate_freq`を例えば86400（1日）に変更、サーバー再起動で行う。今回の検証ではパフォーマンスの顕著な差は見られなかった。
/** Geminiが自動生成した概要 **/
SOY Shop 2にHTMLキャッシュプラグインが追加され、高速化が可能になった。カートウィジェットの問題は非同期通信で解決し、カート内商品数と合計金額をJSONで取得できる。ヤマトリップショップではこの機能とLazyLoadプラグイン、jpegoptimにより、ページ表示速度が3.3秒から1秒以下になり、PageSpeed InsightsのスコアもPCで90を超えた。スマホは90に届かなかったが、Gueztliによる画像最適化で改善が見込まれる。SOY Shop 2正式版は近日公開予定。
/** Geminiが自動生成した概要 **/
SOY CMSのLazy Loadプラグインは、記事中の画像3枚目以降に`loading="lazy"`属性を付与し、遅延読み込みを実現することでSEO対策とPageSpeed Insightsスコア向上に貢献します。リソース消費を軽減するため、HTMLキャッシュプラグインとの併用が推奨されます。
関連するHTML圧縮の記事では、HTML、CSS、JavaScriptの圧縮によりファイルサイズを削減し、ページの読み込み速度向上によるSEO対策、ユーザーエクスペリエンス向上、サーバー負荷軽減などのメリットが得られると説明されています。gzip圧縮、minifyツール、SOY CMSのHTML圧縮プラグインの利用方法などが紹介されています。
/** Geminiが自動生成した概要 **/
SOY CMSの静的化プラグインが改良され、ページ単位での静的化設定、全プラグイン実行後の静的化処理、ページ更新時の静的ファイル一括削除、サイトキャッシュ削除時の静的ファイル削除が可能になった。従来の静的化はフロントコントローラやRewriteモジュールの処理を回避することで高速化を実現していたが、今回の改良でさらに柔軟性と効率性が高まった。HTMLキャッシュプラグインと併用することで、標準ページは静的化、ブログページはHTMLキャッシュと使い分け、サーバー負荷軽減に効果的。改良版はsaitodev.coからダウンロード可能。高速化に加え、SEO対策にも有効。
/** Geminiが自動生成した概要 **/
SOY CMSのHTMLキャッシュプラグインは、サイト高速化を実現する強力なツールです。従来の静的化プラグインの欠点を克服し、標準ページを含む全ページをキャッシュ対象としつつ、ページごとにキャッシュの有効/無効を設定できる柔軟性を備えています。これにより、SOY Shop連携など動的なコンテンツを含むページでも最適なパフォーマンスを実現できます。HTMLキャッシュは、PageSpeed Insightsのスコア向上に貢献するだけでなく、メディア露出時の急激なアクセス増加にも対応できる安定性を提供します。内部SEO対策としても有効で、情熱大陸放送後のアクセス集中を乗り切った事例からもその効果が実証されています。パッケージはsaitodev.coからダウンロード可能です。SEO対策に関する詳細はsaitodev.co/category/SEOをご覧ください。
/** Geminiが自動生成した概要 **/
PageSpeed Insightsのスコア向上のため、公式SNSボタンを自作のものに置き換えた。公式ボタンはJavaScriptを使用し、ページ速度に悪影響を与えていた。記事詳細ページのTwitterボタンを例に、自作方法を紹介。HTMLでは`<a>`タグでツイートリンクを作成し、記事タイトルとURLを動的に設定。CSSでボタンのスタイルを定義。SOY CMSでは`cms:id="title_plain"`と`cms:id="entry_url"`を用いて記事タイトルとURLを取得し、JavaScriptを使わずにツイートボタンを実装。これにより、ページ読み込み速度が向上し、PageSpeed Insightsのスコアも改善された。
/** Geminiが自動生成した概要 **/
CSSの読み込み方を変えることでSEO対策とページ表示速度の高速化を実現する方法を紹介。従来headタグ内に記述していた外部CSSをbody閉じタグ後へ移動することでレンダリングブロックを回避し、表示速度を向上させる。さらに、HTTP/2環境下ではファイル数削減が有効となるため、CSSをHTML内に直接記述する方法も提示。ただし、保守性向上のためにCMSのモジュール機能を活用し、HTML末尾にCSSを挿入する手法を推奨。この際、モジュールファイルの読み込みによる速度低下を防ぐため、最終HTMLのキャッシュ機構を併用することが重要となる。
/** Geminiが自動生成した概要 **/
Google Mapsの遅延出力により、PageSpeed Insightsのスコアが80点台から100点に改善。iframeを隠して「地図を表示」ボタンを表示し、クリック後3秒後にGoogle Mapsをロードするコードを追加した。これにより、ページの読み込みが遅くなるGoogle Mapsの出力を遅らせ、ページのパフォーマンスを向上させた。
/** Geminiが自動生成した概要 **/
SQLiteを採用するSOY CMSでサイト表示を高速化するため、最終生成HTMLのキャッシュ化機能を導入した。データベースやファイル読み込みを省略することでPageSpeed Insightsのスコアが大幅に向上。この機能はHTMLキャッシュプラグインをインストール後、index.php内のexecute_site()をexecute_site_static_cache()に変更することで有効になる。ただし、カート内容の表示など動的なコンテンツはキャッシュ化できないため、リッチなサイト構成との両立は難しい。高速化とSEO対策には見栄えよりも内容重視の割り切りが必要となる。SOY Shopでも同様のキャッシュプラグインが開発されている。
/** Geminiが自動生成した概要 **/
PageSpeed Insightsでスコア100を目指すため、サーバー側の処理速度向上に取り組んだ。SEO対策として、PHP製CMSを使う場合、PHPバージョンを最新に保つことが重要。PHP7系はOPCacheにより高速化されており、バージョンアップだけでスコア向上も期待できる。VPSサーバでのバージョンアップ方法は過去記事を参照。PHP8ではJitコンパイラ導入で更なる高速化が見込まれる。かつてGo言語への移植も検討したが、PHPでスコア100達成できたため中止した。
/** Geminiが自動生成した概要 **/
この記事では、ウェブサイトのSEO対策として画像ファイルサイズの削減に焦点を当てています。GoogleのJPEGエンコーダGuetzliを導入することで、画像品質を維持しながらファイルサイズを大幅に削減できることを実例で示しています。具体的には、115.8kbの画像がGuetzliによって9.4kbまで圧縮され、80%以上の削減に成功しています。また、PageSpeed InsightsによるWebP等の次世代フォーマットの推奨についても触れつつ、Safari非対応やPageSpeed Module導入によるパフォーマンス低下を理由に現状では採用を見送っていることを説明しています。
/** Geminiが自動生成した概要 **/
個人事業主がSEO対策として行ったデータ転送量削減策を紹介。コンテンツの充実を最優先としつつ、今回はデータ圧縮に着目。GoogleのPageSpeed Insightsを参考に、Brotliアルゴリズムを用いてデータ転送量の削減を試みた。Brotliは対応サーバーが限られるため、Deflateやgzipも選択肢として提示。HTMLや画像のデータ量削減は今後の課題とし、データ転送に関する更なる改善策を予告している。
/** Geminiが自動生成した概要 **/
SEO対策として表示速度向上に取り組んでいるサイト運営者が、SOY CMSの記事詳細表示を高速化するプラグインを開発した。従来、柔軟性のため記事テーブルのエイリアスカラムにUNIQUEインデックスを貼っていなかったが、今回ユニーク制約を設けることで高速化を実現。同時に、記事の投稿時刻にもインデックスを追加し、アーカイブページの表示速度も向上させた。投稿時刻は同時刻投稿の場合、1秒ずらす仕様とした。このプラグインはダウンロード後、有効化することでデータベースに反映される。
/** Geminiが自動生成した概要 **/
常時SSL化はSEOに効果があると考えられる。理由は、常時SSL化で利用可能になるHTTP/2がページ表示速度を劇的に向上させるため。Googleは表示速度をSEOの評価基準にしているため、HTTP/2対応は間接的にSEO向上に繋がる。著者のサイトもHTTP/2導入後、PageSpeed Insightsのスコアが99点を記録、PV数も右肩上がりだ。
HTTP/2の恩恵を受けるにはVPSや専用サーバー等が必要で、相応の知識も求められる。しかし、HTTP/2を抜きにしても、フォームからの情報漏洩防止の観点から、特にログインや問い合わせフォームを持つサイトは常時SSL化が推奨される。専門知識を持つユーザーはSSL化されていないサイトのフォームは利用しないだろう。つまり、常時SSL化はセキュリティ面でもユーザー獲得に繋がるため、SEO効果があると結論付けられる。
/** Geminiが自動生成した概要 **/
SOY CMSを利用したネットショップ運営において、初期段階では自由度の高さがメリットとなるが、注文データの増加に伴い表示速度の低下という課題に直面する。これはGoogle検索ランキングにも影響する。記事では、表示速度低下の原因としてデータベース設計の冗長化、特にTEXTカラムの多用を指摘。SOY CMS/Shopでは不要な機能をインストールしない、外部データベースの活用などで冗長化を回避しているものの、注文データテーブルでのTEXTカラム使用は課題として残る。解決策として、サイト高速化とデータベースチューニングの必要性を提示している。具体的な対策は後述としているが、別記事ではPageSpeed Insightsのスコア99達成についても言及している。
/** Geminiが自動生成した概要 **/
SOY CMS/Shop開発者が最も感銘を受けたネットショップは、1日に約3万件もの注文を処理しながら、サクサクとした動作を維持しているサイトです。この驚異的なパフォーマンスは、MySQLデータベースの綿密なチューニングと、徹底的なキャッシュ戦略によって実現されています。数百台ものサーバーが複雑なシステムを支え、注文処理から配送までがシームレスに連携。サイト運営者の技術力と、顧客満足度を最優先に考えた設計思想に開発者は深く感銘を受け、自らの開発にも活かそうと刺激を受けています。膨大なアクセスと注文を処理しながらも快適なユーザー体験を提供するこのサイトは、ネットショップ開発の理想形として、開発者の心に深く刻まれています。
/** Geminiが自動生成した概要 **/
SOY CMSサイトのバックアップをDropboxで自動化する方法を紹介しています。記事では、Dropbox Uploaderを利用したバックアップ方法を解説し、cronで定期実行を設定することで手間を省いています。具体的な手順として、Dropbox Uploaderのインストール、トークンの取得、アップロードコマンドの作成、cronへの登録方法を詳しく説明。さらに、バックアップ後のメモリ解放コマンドも追記し、サーバー負荷軽減にも配慮しています。この方法により、安全かつ効率的なバックアップ体制を構築できるでしょう。
/** Geminiが自動生成した概要 **/
Dropboxへのバックアップ時に、個人情報を含むデータベースをzip圧縮する際のセキュリティ強化策として、パスワード付きzipファイルの作成方法を紹介している。
zipコマンドの-eオプションで暗号化が可能だが、対話式でパスワード入力を求められるため、crontabでの自動化にはexpectコマンドを使用する必要がある。サンプルスクリプトでは、expectでパスワード入力を自動化し、指定ディレクトリをパスワード付きzipファイルとしてDropboxにバックアップする方法を示している。
スクリプトの実行例として、Dropboxへのアップロードとダウンロード後の解凍時にパスワードが要求されることを確認し、セキュリティが向上したことを示している。さらに、パスワードの強度を高める方法や都度生成する仕組みの必要性にも言及している。
/** Geminiが自動生成した概要 **/
SOY CMSサイトのDropboxバックアップ方法を紹介。まずDropboxアカウントを作成し、サーバーに64ビット版CLI版Dropboxをインストール。サーバをDropboxアカウントにリンク後、バックアップスクリプト(dbbackup.sh)を作成し、cronで毎朝3時にサイトディレクトリをzip圧縮してDropboxへ同期させるよう設定。自動起動設定としてcrontabの@rebootを利用。debファイル経由のインストール方法も追記。再起動しない場合はdropbox start -iコマンドを試す。パスワード付きzip化などの関連記事へのリンクも掲載。
/** Geminiが自動生成した概要 **/
SOY CMSサイトのPageSpeed Insightsスコアを99にするため、静的化プラグインを開発。標準ページをHTMLファイル化し、システムを経由せず直接読み込むことで高速化を実現。記事更新時はindex.html、ページ更新時は該当HTMLを削除し、即時反映を維持。DB接続回数を減らしサーバー負荷も軽減。内部SEO対策にも有効。プラグインはフォーラムで配布中だが、Google Analytics設置に関する提案への対応は未解決。
/** Geminiが自動生成した概要 **/
SOY CMSでサーバサイド画像リサイズを実装後、PageSpeed Insightsで「ロスレス圧縮で容量削減可能」と指摘されたため、jpegoptimを導入した。Ubuntuに`sudo apt-get install jpegoptim`でインストール後、`/CMSインストールディレクトリ/common/im.inc.php`の`imagejpeg`実行後に`jpegoptim $savepath`を実行するよう改修。これにより、ロスレス圧縮の指摘が解消され、PageSpeed Insightsのモバイルスコアが93から96に向上した。変更コードはフォーラムで配布されている。
/** Geminiが自動生成した概要 **/
SOY CMSのキャッシュモードを利用することで表示速度を大幅に向上させることができます。キャッシュモードには、「出力キャッシュ」「ブロックキャッシュ」「データキャッシュ」の3種類があります。出力キャッシュはページ全体をキャッシュし、ブロックキャッシュはページの一部のブロックをキャッシュ、データキャッシュはデータベースへのアクセス結果をキャッシュします。それぞれのキャッシュモードは管理画面から簡単に設定でき、サイトのアクセス状況や更新頻度に合わせて最適な設定を選択することで、サーバー負荷を軽減し、表示速度を向上させることができます。特に、頻繁に更新されない静的なページやアクセス数の多いページでは、出力キャッシュが効果的です。キャッシュのクリアも管理画面から簡単に行えます。
/** Geminiが自動生成した概要 **/
SOY CMSでサイト表示を高速化するために、表示直前にサーバ側で画像リサイズを行う方法を紹介しています。Google PageSpeed Insightsで低評価を受けた画像サイズの問題を解消するため、サムネイルプラグインではなく、SOY CMSの隠し機能を活用。
具体的には、カスタムフィールドに画像パスを入力し、imgタグのsrc属性に`im.php?src=[画像パス]&width=[幅]`を指定することで、動的にリサイズされた画像を表示。従来のHTMLのwidth属性による縮小表示よりもパフォーマンスが向上し、PageSpeed Insightsのスコアも改善。
記事では、設定変更前後の具体的なコード例やスクリーンショットを交えながら解説。リサイズ処理はJPEG、PNG、GIFに対応し、作業フローを簡略化しつつサイト高速化を実現。次回、CSSや画像のキャッシュ設定について解説予定。