Ralph Cope 인터뷰: Trellis 사례 연구

콘텐츠 제작자를 위한 WordPress 사이트를 구축하는 개발자라면 WordPress 프레임워크인 Trellis를 특징으로 하는 이 사례 연구는 당신을 위한 것입니다!

우리는 콘텐츠 제작 전문가이지만 웹사이트의 기본을 유지하는 데 많은 시간을 할애하거나 기술적으로 관심이 없는 게시자를 위해 Trellis를 만들었습니다. 우리는 Google의 엄격한 Core Web Vitals 표준을 충족한다는 구체적인 목표와 함께 즉시 최대 성능을 발휘할 수 있도록 Trellis를 설계했습니다. 콘텐츠 제작자의 기술적 노하우 없이 모든 것이 가능합니다.

그러나 때때로 사이트 소유자가 특정 모양이나 특별한 기능을 원하고 이러한 목적을 달성하기 위해 코드 사용자 지정을 생성하기 위해 개발자의 도움이 필요하다는 것도 알고 있습니다.

여러 프로젝트에서 Trellis 프레임워크로 작업한 프리랜서 개발자 Ralph Cope를 소개하게 되어 기쁩니다. 그는 오늘 Trellis에 대한 "내부" 경험에 대해 논의하기 위해 합류했습니다.

자신에 대해 간단히 알려주세요. 블로그를 운영하고 다른 사이트 및 블로거와 협력한 기간은 얼마나 됩니까?

저는 5년 정도 블로거와 함께 일하고 있습니다. 저는 좀 더 기술적인 역할로 전환하기 전에 상당히 큰 여행 블로그의 작가로 시작했습니다. 나는 꽤 일찍 SEO에 대해 배웠고 지난 몇 년 동안 개발, 성능 최적화, 구조화된 데이터, 시맨틱 SEO 등과 같은 보다 기술적인 측면에 상당히 관여하게 되었습니다.

저는 이제 고객에게 상담과 전체 웹사이트 구축을 주로 제공하는 프리랜서입니다. 물론 두 가지 모두 가장 최신의 SEO 관행을 염두에 두고 있습니다.

Trellis는 어디에서 처음 들었습니까?

Journey Era의 소유자이자 친구의 친구인 Jackson Groves는 자신의 사이트를 새 테마로 전환하는 것에 대해 나에게 접근했습니다. 잭슨은 주로 콘텐츠 제작자이기 때문에 개발 관련 작업을 처리하는 데 불편함을 느끼며 저에게 도움을 요청했습니다.

Mediavine 파트너인 Jackson은 연락 담당자로부터 Trellis에 대해 듣고 한 번 시도해 보기로 결정했습니다. 그는 나와 문서를 공유했고 우리는 일하러 갔다.

테마와 프레임워크를 전환하는 것은 큰 결정이 될 수 있습니다. Trellis를 사용하게 된 동기는 무엇입니까?

많은 긍정적인 피드백을 받은 Jackson은 Trellis 사용에 대해 매우 단호했습니다. 가장 큰 판매 포인트는 웹 사이트 성능과 약속한 속도의 잠재적인 향상이었습니다. 초기 예측에서는 Trellis가 로드 시간을 약 30% 줄이고 광고 수익을 거의 동일하게 높일 것으로 나타났습니다.

2021년은 Journey Era에게도 힘든 해였습니다. COVID의 여러 파도와 몇 가지 경계선 잔인한 Google의 광범위한 핵심 업데이트 사이에 사이트는 상당한 양의 트래픽을 잃었습니다. 테마 전환과 같이 새로운 것을 시도할 시간이 있다면 바로 이 것입니다.

Trellis 이전에 어떤 WordPress 테마/프레임워크(또는 CMS)로 작업했습니까?

개인적으로 Trellis 이전에 다음을 포함하지만 이에 국한되지 않는 여러 가지 테마로 작업했습니다.

• 하위 테마
• Elementor, Kadence 및 Thrive와 같은 테마 빌더
• 엔터프라이즈급 맞춤형 테마

Trellis를 사용하여 어떤 기술적인 문제를 해결하기를 원했습니까?

대부분 사이트 성능 및 로드 시간입니다. Trellis는 Google Core Web Vitals를 염두에 두고 구축된 최초의 테마로 마케팅되었으므로 논리적인 선택처럼 보였습니다.

즉, Journey Era는 내가 작업을 시작하기 전에 이미 상당히 빨랐습니다. 내가 취한 초기 벤치마크에 따르면 평균 페이지 로드 시간은 약 785밀리초(0.785초)였으며 이는 이미 상당히 인상적인 수치입니다. Trellis와 나는 우리가 로드 시간을 줄이는 것에 대해 진지했다면 우리를 위해 작업을 중단했을 것입니다.

웹사이트에서 Trellis를 설정하는 것이 얼마나 쉬웠습니까? 진행이 순조롭게 진행되었나요?

Trellis는 매우 단순한 프레임워크인 것처럼 보이지만 내부에는 많은 복잡성이 있습니다. 코드화 방식(PHP 및 기타 등등)은 이전에 사용한 다른 테마와 상당히 다릅니다. 말할 필요도 없이, 처음에는 약간의 학습 곡선이 있었습니다.

처음에 Trellis는 작업하기가 상당히 까다롭게 느껴졌습니다. 테마 사용자 정의와 관련하여 상대적으로 제한된 기본 제공 옵션(다른 테마 빌더에 비해)이 있습니다. 이는 Trellis 개발자가 가능한 한 가볍게 유지하기 위해 의도적으로 내린 결정이라고 생각합니다.

이것은 내가 내 자신의 HTML과 CSS를 사용하여 직접 사이트의 스타일을 지정해야 한다는 것을 의미했습니다.

더 잘 알게 된 후 Trellis 프레임워크에 더 감사하기 시작했습니다. 네, 특별한 JS와 PHP를 포함해 거의 모든 것을 직접 커스터마이징해야 했습니다. 하지만 일단 리듬을 익히고 나니 작업이 정말 즐거웠습니다. 결국 저는 웹사이트 개발을 위한 몇 가지 새로운 트릭을 배우게 되었습니다.

사이트에서 사용자 정의 작업(예: 사용자 정의 홈페이지 또는 게시물 레이아웃)을 수행했습니까? 그렇다면 Trellis 환경에서 작업하는 것이 얼마나 쉬웠습니까? 어려웠습니까?

불행히도 순수 CSS 또는 HTML을 사용하여 수행할 수 없는 Trellis를 사용하여 새 사이트 빌드에 빌드해야 하는 몇 가지 기능이 있었습니다. 그래서 우리는 어린이 테마를 만드는 데 의지해야 했는데, 이는 경험상 피하고 싶은 일이었습니다.

Trellis에 대한 하위 테마를 설정하는 것도 약간 독특한 경우이며, 다시 대부분 프레임워크가 구축되는 방식 때문입니다. 운 좋게도 Mediavine의 개발 팀은 문제 해결과 관련하여 매우 도움이 되었고 실제로 문제를 설명하는 데 도움을 주었습니다.

Trellis에서 어떤 개선 사항을 발견하셨습니까? (사이트 속도, CLS 점수, 트래픽, 수입 등)

먼저 스테이징 환경에서 Trellis를 사용하여 새 사이트를 구축하고 여러 벤치마크를 실행하여 성능을 추적했습니다. 새 사이트를 100% 사용할 준비가 되면 프로덕션으로 밀어넣고 일주일 동안 그대로 둔 다음 최종 벤치마크 세트를 실행했습니다. 모든 벤치마크는 GTMetrix를 사용하여 수행되었습니다.

전반적으로 모든 주요 성과 지표는 긍정적인 움직임을 보였습니다. 콘텐츠가 포함된 첫 번째 페인트, 콘텐츠가 포함된 가장 큰 페인트, 대화형 시간 및 총 차단 시간*이 모두 약 30-40% 향상되었습니다(로드 시간이 단축됨). 대략적으로 총 로드 시간으로 변환되는 속도 지수는 약간의 개선을 보였지만 그럼에도 불구하고 개선되었습니다.

우리 노동의 진정한 결실은 최종 벤치마크 이후 잠시 후에 나타났습니다. Trellis를 구현하고 사이트에 대한 철저한 SEO 감사를 수행한 지 한 달 만에 트래픽이 140%, 즉 두 배 이상 증가했습니다. 광고 수익도 꽤 늘었다.

* 이 4가지 측정항목(FCP, LCP, TTI, TBT)은 누군가가 주어진 페이지에서 Google Lighthouse 테스트를 실행할 때 가장 먼저 표시됩니다. 일반적으로 전체 페이지 로드 시간을 판단할 때 좋은 지표입니다.

Trellis를 다른 개발자와 블로거에게 추천하시겠습니까? 그 이유는 무엇?

예, 사이트에 대한 가벼운 테마/프레임워크를 찾고 있는 블로거 또는 개발자에게 Trellis를 추천합니다. 학습 곡선에도 불구하고 Trellis는 우수한 성능과 투자 수익을 입증했습니다.

현재로서는 콘텐츠 제작자에게만 Trellis를 추천할 수 있습니다. 블로그 콘텐츠를 최적으로 처리하고 렌더링하는 작업은 훌륭하지만 전자 상거래와 같은 더 복잡한 웹 사이트에 사용할 수 있는지 또는 어떻게 사용할 수 있는지 모르겠습니다.

Trellis로 이사를 준비하는 사람에게 조언을 해주신다면?

Trellis에서 맞춤형 사이트를 개발할 계획이라면 최소한 HTML과 CSS에 능숙해야 합니다. JS와 PHP도 플러스입니다.

Trellis에서 제공하는 사용자 지정 옵션만 사용하여 웹 사이트를 만들 수는 있지만 수행할 수 있는 작업이 제한됩니다. 이 프레임워크를 최대한 활용하고 프론트엔드를 완전히 창의적으로 제어하고 싶다면 어느 정도는 모든 것을 직접 스타일링하고 구축할 수 있어야 합니다.

아직 발견하지 못했다면 개발 작업에 Chrome DevTools를 사용하는 것이 좋습니다. 이것은 제가 처음 개발을 시작하고 많은 기술적 노하우에 눈을 떴을 때 저에게 신의 선물이었습니다. 나는 여전히 매일 그리고 확실히 Trellis와 함께 일할 때 그것을 사용합니다.

Trellis에서 가장 좋아하는 기능은 무엇입니까?

Trellis 개발자가 가능한 한 많은 속도 최적화를 Trellis 자체에 통합하여 추가 플러그인을 설치할 필요가 없도록 최선을 다한 방식이 마음에 듭니다. CSS/JS 최소화, 이미지 지연 로딩 및 코드 삽입은 모두 Trellis에서 처리되므로 Autoptimize, Code Snippets 또는 Asset CleanUp과 같은 플러그인을 사용할 필요가 없습니다.

그렇긴 하지만, 나는 여전히 WPRocket을 캐싱 플러그인으로 사용하는데, IMO 중 최고입니다. Trellis의 자체 기능과 충돌하지 않도록 CSS, HTML 및 JS 최적화 처리를 해제해야 합니다.

귀하의 경험에 대한 다른 의견이 있으십니까?

사이트를 간소화하고 웹 개발에 대해 한두 가지를 배우려는 콘텐츠 제작자에게 Trellis는 훌륭한 선택입니다. 다른 테마 빌더만큼 기능이 많지는 않지만 아마도 좋은 일입니다. 그렇게 하면 훨씬 빠르며 블로그나 사이트에 포함하려는 항목에 대해 비판적으로 생각해야 합니다.

Ralph, 오늘 우리와 채팅해 주셔서 감사합니다. Trellis가 귀하의 고객이 비즈니스 목표를 달성할 수 있도록 지원하게 된 것을 기쁘게 생각합니다!

우리는 Trellis가 만들어낸 결과에 대해 정말 자랑스럽게 생각하며, 우리 팀은 콘텐츠 제작자와 그들의 비즈니스 목표를 지속적으로 제공하기 위해 이 프레임워크를 개선하고 향상시키는 데 전념하고 있습니다. Trellis에 대해 자세히 알아보고 더 많은 사용후기를 읽으려면 다른 사례 연구를 확인하십시오.