ラルフコープインタビュー:トレリスのケーススタディ

公開: 2022-05-18

あなたがコンテンツクリエーターのためにWordPressサイトを構築している開発者なら、私たちのWordPressフレームワークであるTrellisをフィーチャーしたこのケーススタディはあなたのためです!

私たちは、コンテンツ制作の専門家である出版社のためにTrellisを作成しましたが、おそらく技術的な傾向がなく、Webサイトの要点を維持することに多くの時間を費やすことに興味がありません。 Googleの厳しいCoreWebVitals基準を満たすという特定の目標を掲げて、箱から出してすぐに最大のパフォーマンスを発揮するようにTrellisを設計しました。 コンテンツ作成者からの技術的なノウハウを必要とせずにすべて。

ただし、サイト所有者が特定の外観や特別な機能を必要とし、その目的を達成するためにコードのカスタマイズを作成するために開発者の支援が必要な場合があることもわかっています。

フリーランスの開発者であるRalphCopeを紹介します。彼は、いくつかのプロジェクトでTrellisフレームワークを使用しており、本日、Trellisでの「内部」の経験について話し合うために参加しました。

ラルフコープ

あなた自身について少し教えてください:あなたはどのくらいブログを書き、他のサイトやブロガーと仕事をしていますか?

私はブロガーと約5年間働いています。 私は、より技術的な役割に移行する前に、かなり大きな旅行ブログのライターとして始めました。 私はかなり早い段階でSEOの内外を学び、ここ数年で開発、パフォーマンスの最適化、構造化データ、セマンティックSEOなどのより技術的な側面にかなり関与するようになりました。

私は現在フリーランサーであり、ほとんどの場合、クライアントにコンサルティングと完全なWebサイト構築を提供しています。もちろん、どちらも最新のSEOプラクティスを念頭に置いています。

トレリスについて最初に聞いたのはどこですか?

JourneyEraのオーナーで友人の友人であるJacksonGrovesから、彼のサイトを新しいテーマに切り替えることについて私に連絡がありました。 ジャクソンは主にコンテンツクリエーターであるため、開発関連の作業を快適に処理できず、私の助けを求めました。

Mediavineのパートナーであるジャクソンは、連絡先からトレリスのことを聞いていたので、試してみることにしました。 彼は私とドキュメントを共有し、私たちは仕事に行きました。

テーマとフレームワークの切り替えは大きな決断になる可能性があります。 トレリスを試してみようと思ったきっかけは何ですか?

たくさんのポジティブなフィードバックを受け取ったジャクソンは、トレリスの使用にかなり固執していました。 最大のセールスポイントは、ウェブサイトのパフォーマンスとそれが約束した速度の潜在的な向上でした。 当初の予測では、Trellisは読み込み時間を約30%短縮し、広告収益をほぼ同じように増加させることを示していました。

2021年はジャーニー時代にとっても厳しい年でした。 COVIDのいくつかの波といくつかの境界線の残酷なグーグルの広範なコアアップデートの間に、サイトはかなりの量のトラフィックを失っていました。 テーマの切り替えなど、何か新しいことを試す時間があったとしたら、それでした。

Trellisの前にどのWordPressテーマ/フレームワーク(またはCMS)を使用しましたか?

個人的には、Trellisの前に、次のようないくつかの異なるテーマを扱ってきました。

  • 子供のテーマ
  • Elementor、Kadence、Thriveなどのテーマビルダー
  • エンタープライズレベルのオーダーメイドのテーマ

Trellisで解決したいと思っていた技術的な問題は何ですか?

主にサイトのパフォーマンスと読み込み時間。 Trellisは、Google Core Web Vitalsを念頭に置いて構築された最初のテーマとして販売されたため、論理的な選択のように思われました。

そうは言っても、私が取り組み始める前は、ジャーニー時代はすでにかなり速かった。 私が取った最初のベンチマークによると、平均ページ読み込み時間は約785ミリ秒(0.785秒)でした。これはすでにかなり印象的な数値です。 トレリスと私は、ロード時間を短縮することに真剣に取り組んでいれば、私たちの仕事を切り取ってもらうでしょう。

ウェブサイトでトレリスを設定するのは簡単でしたか? プロセスはスムーズに進みましたか?

Trellisは非常に単純なフレームワークのように見えますが、内部には多くの複雑さがあります。 それがコーディングされる方法(PHPなど)は、私が以前に使用した他のテーマとはかなり異なります。 言うまでもなく、最初は少し学習曲線がありました。

当初、トレリスは非常に扱いにくいと感じていました。 テーマのカスタマイズに関しては、組み込みのオプションが比較的限られています(他のテーマビルダーと比較して)。これは、トレリスの開発者が可能な限り軽量にするために意図的に行った決定だと思います。

つまり、自分のHTMLとCSSを使用してサイトのスタイルを直接設定する必要がありました。

それをよりよく知った後、私は本当にトレリスフレームワークをもっと理解し始めました。 はい、特別なJSやPHPを含め、ほとんどすべてを自分でカスタマイズする必要がありましたが、リズムをつかむと、作業は本当に楽しかったです。 結局、私は実際にウェブサイト開発のためのいくつかの新しいトリックを学ぶことになりました。

サイトでカスタム作業を行いましたか(カスタムホームページや投稿レイアウトなど)? もしそうなら、トレリス環境内での作業はどれほど簡単/困難でしたか?

Trellisを使用して新しいサイトビルドに組み込む必要のある関数がいくつかありましたが、残念ながら、純粋なCSSまたはHTMLを使用して実行することはできませんでした。 そのため、私たちは子供のテーマを作ることに頼らなければなりませんでした。それは私が通常経験から避けたいものです。

Trellisの子テーマを設定することも、フレームワークの構築方法が主な理由で、少しユニークなケースです。 幸いなことに、Mediavineの開発チームはトラブルシューティングに関して非常に役に立ち、実際に物事を説明するのを手伝ってくれました。

Trellisでどのような改善に気づきましたか? (サイトの速度、CLSスコア、トラフィック、収益など)

最初にステージング環境でTrellisを使用して新しいサイトを構築し、パフォーマンスを追跡するためにいくつかのベンチマークを実行しました。 新しいサイトの準備が100%完了したら、本番環境にプッシュし、1週間放置してから、最終的なベンチマークセットを実行しました。 すべてのベンチマークは、GTMetrixを使用して取得されました。

全体として、すべての主要なパフォーマンス指標は前向きな動きを示しました。 最初の満足のいくペイント、最大の満足のいくペイント、インタラクティブまでの時間、および合計ブロッキング時間*はすべて約30〜40%改善されました(つまり、ロード時間が短縮されました)。 総ロード時間に大まかに変換される速度インデックスでは、わずかな改善が見られましたが、それでも改善されました。

私たちの労働の本当の成果は、最終的なベンチマークの少し後に示されました。 Trellisを実装してサイトの徹底的なSEO監査を行ってから1か月以内に、トラフィックは140%増加し、2倍以上になりました。 広告収入もかなり増加しました。

*これらの4つの指標(FCP、LCP、TTI、TBT)は、特定のページでGoogle Lighthouseテストを実行すると、何よりもまず表示されます。 一般的に、これらは全体的なページの読み込み時間を判断する際の優れた指標です。

Trellisを他の開発者やブロガーに勧めますか? なぜまたはなぜそうではないのですか?

はい、サイトの軽量テーマ/フレームワークを探しているブロガーや開発者にはTrellisをお勧めします。 学習曲線にもかかわらず、トレリスは優れたパフォーマンスと投資収益率であることが証明されました。

ただし、現時点では、コンテンツ作成者にトレリスを推奨することしかできません。 ブログコンテンツを最適に処理およびレンダリングすることはできますが、eコマースなどのより複雑なWebサイトで使用できるかどうか、またはどのように使用できるかはわかりません。

トレリスに引っ越す準備をしている人に何かアドバイスはありますか?

Trellisでカスタムサイトを開発することを計画している場合は、少なくともHTMLとCSSに精通している必要があります。 JSとPHPもプラスです。

Trellisが提供するカスタマイズオプションだけを使用してWebサイトを作成することはできますが、実行できることは制限されます。 このフレームワークを最大限に活用し、フロントエンドを完全にクリエイティブに制御したい場合は、ある程度自分ですべてをスタイリングおよび構築できる必要があります。

まだ発見していない場合は、開発作業にChromeDevToolsを使用することを強くお勧めします。 これは、私が最初に開発を始めたときの天の恵みであり、多くの技術的ノウハウに本当に目を向けました。 私は今でも毎日、そして確かにトレリスと一緒に働いていたときにそれを使用しています。

トレリスのお気に入りの機能は何ですか?

Trellisの開発者が、可能な限り多くの速度最適化をTrellis自体に組み込んで、追加のプラグインをインストールする必要をなくすために最善を尽くした方法が気に入っています。 CSS / JSの最小化、画像の遅延読み込み、コードインジェクションはすべてTrellisによって処理されます。つまり、Autoptimize、Code Snippets、AssetCleanUpなどのプラグインを使用する必要はありません。

そうは言っても、私は今でもWPRocketをキャッシングプラグインとして使用しています。これは、この種のIMOの中で最高のものの1つです。 トレリス自身の機能と競合しないように、CSS、HTML、およびJSの最適化の処理を必ずオフにしてください。

あなたの経験について他にコメントはありますか?

サイトの合理化を検討していて、Web開発について1つか2つ学ぶことを検討しているコンテンツ作成者にとって、Trellisは優れたオプションです。 他のテーマビルダーほど多くの機能はありませんが、それはおそらく良いことです。 そうすればはるかに高速になり、ブログやサイトに本当に含めたいものについて批判的に考える必要があります。


ラルフ、今日はおしゃべりしてくれてありがとう。 Trellisが、クライアントのビジネス目標の達成を支援してくれることを大変うれしく思います。

Trellisが生み出した結果を本当に誇りに思っており、私たちのチームは、コンテンツクリエーターとそのビジネス目標に引き続きサービスを提供するために、このフレームワークの改善と強化に取り組んでいます。 Trellisの詳細をご覧ください。さらに多くの証言を読みたい場合は、他のケーススタディをご覧ください。