Entrevista com Ralph Cope: Estudo de Caso Trellis

Se você é um desenvolvedor que cria sites WordPress para criadores de conteúdo, este estudo de caso com nosso framework WordPress, Trellis, é para você!

Criamos o Trellis para o editor que é especialista em produzir conteúdo, mas talvez não tenha inclinação técnica ou interesse em dedicar muito tempo à manutenção dos detalhes de um site. Projetamos o Trellis para o máximo desempenho imediatamente com o objetivo específico de atender aos rígidos padrões Core Web Vitals do Google. Tudo sem exigir nenhum conhecimento técnico dos criadores de conteúdo.

No entanto, também sabemos que, às vezes, um proprietário de site deseja uma aparência específica ou um recurso especial e precisa da ajuda de um desenvolvedor para criar personalizações de código para atingir esse objetivo.

Temos o prazer de apresentar o desenvolvedor freelancer Ralph Cope, que trabalhou com a estrutura Trellis em vários projetos e se junta a nós hoje para discutir suas experiências “nos bastidores” com a Trellis.

Conte-nos um pouco sobre você: Há quanto tempo você bloga e trabalha com outros sites e blogueiros?

Trabalho com blogueiros há cerca de 5 anos. Comecei como redator de um blog de viagens bastante grande antes de fazer a transição para uma função mais técnica. Aprendi os meandros do SEO bem cedo e nos últimos anos me envolvi bastante no lado mais técnico das coisas, por exemplo, desenvolvimento, otimização de desempenho, dados estruturados, SEO semântico, etc.

Agora sou um freelancer que fornece principalmente consultas e criações completas de sites para clientes – ambos com as práticas de SEO mais atualizadas em mente, é claro.

Onde você ouviu falar da Trellis pela primeira vez?

Jackson Groves, dono do Journey Era e amigo de um amigo, me procurou para mudar seu site para um novo tema. Sendo principalmente um criador de conteúdo, Jackson não se sentiu confortável em lidar com qualquer tipo de trabalho relacionado ao desenvolvimento e pediu minha ajuda.

Sendo um parceiro do Mediavine, Jackson ouviu falar sobre Trellis de seu ponto de contato e decidiu tentar. Ele compartilhou a documentação comigo e começamos a trabalhar.

Alternar temas e frameworks pode ser uma grande decisão. O que o convenceu a experimentar o Trellis?

Tendo recebido muitos comentários positivos, Jackson foi bastante inflexível sobre o uso do Trellis. O maior ponto de venda foi o potencial aumento no desempenho e velocidade do site prometido. As projeções iniciais apontavam para o Trellis diminuindo os tempos de carregamento em cerca de 30% e aumentando a receita de anúncios na mesma proporção.

2021 também foi um ano difícil para a Journey Era. Entre várias ondas de COVID e algumas atualizações básicas do Google, o site havia perdido uma quantidade considerável de tráfego. Se alguma vez houve um momento para tentar algo novo, como trocar de tema, era esse.

Com quais temas/frameworks do WordPress (ou CMS) você trabalhou antes do Trellis?

Pessoalmente, trabalhei com vários temas diferentes antes do Trellis, incluindo, mas não limitado a:

• Temas filhos
• Construtores de temas, por exemplo, Elementor, Kadence e Thrive
• Temas personalizados de nível empresarial

Quais problemas técnicos você esperava resolver com o Trellis?

Principalmente desempenho do site e tempos de carregamento. O Trellis foi comercializado como o primeiro tema já construído com o Google Core Web Vitals em mente, então parecia a escolha lógica.

Dito isto, Journey Era já era bastante rápido antes de eu começar a trabalhar nele. Os tempos médios de carregamento da página foram de cerca de 785 milissegundos (0,785 segundos) de acordo com os benchmarks iniciais que fiz, o que já é um número bastante impressionante. Trellis e eu teríamos nosso trabalho cortado para nós se fôssemos sérios sobre a redução dos tempos de carregamento.

Quão fácil foi para você configurar o Trellis em um site? O processo correu bem?

Trellis parece ser uma estrutura muito simples, mas tem muitas complexidades sob o capô. A maneira como ele é codificado (o PHP e outros enfeites) é bem diferente de qualquer outro tema que usei antes. Escusado será dizer que houve um pouco de curva de aprendizagem no início.

No início, Trellis se sentiu bastante rígido para trabalhar. Existem opções internas relativamente limitadas quando se trata de personalização de temas (em comparação com outros construtores de temas), que é uma decisão que imagino que os desenvolvedores do Trellis tomaram intencionalmente para mantê-lo o mais leve possível.

Isso significava que eu teria que estilizar o site diretamente usando meu próprio HTML e CSS.

Depois de conhecê-lo melhor, eu realmente comecei a apreciar mais o framework Trellis. Sim, eu tive que customizar quase tudo sozinho – incluindo alguns JS e PHP especiais – mas uma vez que peguei meu ritmo, eu realmente gostei do trabalho. No final, acabei aprendendo alguns novos truques para o desenvolvimento de sites.

Você fez algum trabalho personalizado no site (por exemplo, uma página inicial personalizada ou layout de postagem)? Se sim, quão fácil/difícil foi trabalhar no ambiente Trellis?

Havia algumas funções que precisavam ser incorporadas à nova construção do site usando Trellis que infelizmente não podiam ser feitas usando CSS ou HTML puro. Como tal, tivemos de recorrer à criação de um tema infantil, que é algo que normalmente gosto de evitar apenas por experiência.

A configuração de um tema filho para o Trellis também é um caso único, principalmente devido à maneira como a estrutura é construída. Felizmente, a equipe de desenvolvimento da Mediavine foi bastante útil na solução de problemas e realmente se esforçou para ajudar a explicar as coisas.

Que melhorias você notou com o Trellis? (Velocidade do site, pontuações CLS, tráfego, ganhos, etc.)

Construímos o novo site usando o Trellis primeiro em um ambiente de teste e executamos vários benchmarks para acompanhar o desempenho. Uma vez que o novo site estava 100% pronto, nós o colocamos em produção, deixamos descansar por uma semana e então executamos um conjunto final de benchmarks. Todos os benchmarks foram feitos usando GTMetrix.

No geral, todas as principais métricas de desempenho mostraram um movimento positivo. A primeira pintura com conteúdo, a maior pintura com conteúdo, o tempo para interação e o tempo total de bloqueio* foram todos melhorados (o que significa menos tempo de carregamento) em cerca de 30-40%. O índice de velocidade, que se traduz aproximadamente no tempo total de carregamento, teve melhorias marginais, mas mesmo assim melhorou.

Os frutos reais do nosso trabalho apareceram um pouco depois dos benchmarks finais. Dentro de um mês de implementação do Trellis e fazendo uma auditoria de SEO completa do site, o tráfego aumentou em 140%, ou seja, mais que dobrou. A receita de anúncios também aumentou bastante.

* Essas quatro métricas (FCP, LCP, TTI e TBT) são exibidas em primeiro lugar quando alguém executa um teste do Google Lighthouse em uma determinada página. De um modo geral, eles são bons indicadores ao julgar os tempos gerais de carregamento da página.

Você recomendaria o Trellis para outros desenvolvedores e blogueiros? Por que ou por que não?

Sim, eu recomendaria o Trellis a qualquer blogueiro ou desenvolvedor que estivesse procurando por um tema/framework leve para seu site. Apesar da curva de aprendizado, a Trellis provou ter um bom desempenho e retorno do investimento.

No entanto, direi que só posso recomendar o Trellis no momento para criadores de conteúdo. Embora faça um bom trabalho de manipulação e renderização de conteúdo de blog de forma otimizada, não sei se ou como poderia ser usado para sites mais complexos, como e-commerce.

Que conselho você daria para alguém que está se preparando para se mudar para a Trellis?

Se você planeja desenvolver um site personalizado no Trellis, você precisa ser competente pelo menos em HTML e CSS. JS e PHP também são uma vantagem.

Você pode criar um site usando apenas as opções de personalização fornecidas pelo Trellis, mas ficará limitado no que pode fazer. Se você realmente quer tirar o máximo proveito desse framework e ter total controle criativo do frontend, você precisa ser capaz de estilizar e construir tudo sozinho até certo ponto.

Se você ainda não o descobriu, recomendo usar o Chrome DevTools para o trabalho de desenvolvimento. Isso foi uma dádiva de Deus para mim quando entrei no desenvolvimento e realmente abriu meus olhos para muito conhecimento técnico. Eu ainda o uso diariamente e certamente quando estava trabalhando com o Trellis.

Qual é o seu recurso favorito do Trellis?

Eu gosto de como os desenvolvedores do Trellis fizeram o possível para incorporar o maior número possível de otimizações de velocidade no próprio Trellis, eliminando assim a necessidade de instalar plugins adicionais. A minimização de CSS/JS, carregamento lento de imagem e injeções de código são todos tratados pelo Trellis, o que significa que não preciso usar plugins como Autoptimize, Code Snippets ou Asset CleanUp.

Dito isto, eu ainda uso o WPRocket como um plug-in de cache, pois é um dos melhores do gênero IMO. Eu apenas me certifico de desligar o manuseio de otimizações CSS, HTML e JS para que não entre em conflito com os próprios recursos do Trellis.

Algum outro comentário sobre sua experiência?

Para criadores de conteúdo que desejam otimizar seu site e talvez aprender uma ou duas coisas sobre desenvolvimento web, o Trellis é uma ótima opção. Ele não tem tantos recursos quanto outros construtores de temas por aí, mas isso provavelmente é uma coisa boa. É muito mais rápido dessa forma e exigirá que você pense criticamente sobre o que realmente deseja incluir em seu blog ou site.

Obrigado, Ralph, por conversar conosco hoje. Estamos muito satisfeitos que a Trellis esteja ajudando você a ajudar seus clientes a atingir suas metas de negócios!

Estamos muito orgulhosos dos resultados que a Trellis produziu, e nossa equipe está comprometida em melhorar e aprimorar essa estrutura para continuar atendendo aos criadores de conteúdo e seus objetivos de negócios. Saiba mais sobre o Trellis e, se quiser ler mais depoimentos, confira nossos outros estudos de caso.