Free Press

No passado, falamos sobre como o WordPress se encaixa com outros sistemas de gerenciamento de conteúdo populares como Drupal, Joomla, e até mesmo Squarespace. Mas e se você estiver tentando decidir entre WordPress vs HTML estático para seu site?

A um nível básico, este é um tipo de debate geral entre usar um sistema de gerenciamento de conteúdo baseado em banco de dados (como o WordPress) ou escrever todo o HTML/CSS você mesmo junto com possivelmente usar um framework.

Para ajudar você a tomar sua decisão, vamos explicar o que estes termos significam e então pular para alguns dos prós e contras de cada abordagem.

• Diferença entre WordPress e HTML estático
• Pros e Contras do WordPress
• Pros e Contras do Website HTML estático
• Utilizar WordPress como Gerador de Website estático

Diferença entre WordPress e HTML estático

No final, tudo sai como HTML no frontend. Ou seja, o código do seu site vai parecer algo assim, não importa se você está usando WordPress ou um site HTML estático:

Não importa qual método você escolha, seu código ainda vai parecer assim

A diferença importante está em como esse HTML vem a existir.

Com HTML estático, essa história é bem simples. Você, ou o seu desenvolvedor, escreve o código (incluindo o seu conteúdo). Então, uma vez que está no servidor, é sempre assim. Não há processamento em background – o seu site está sempre ali na sua forma final.

WordPress, por outro lado, é um sistema de gerenciamento de conteúdo que usa PHP e uma base de dados. Em termos simples, isso significa que quando alguém visita seu site WordPress, seu servidor “monta” seu site por:

• Executar o código PHP para montar a versão HTML do seu site
• Consultar sua base de dados para obter o conteúdo a ser inserido nesse HTML

O que é um sistema de gerenciamento de conteúdo, então?

Acima, nós lhe dissemos que o WordPress é um sistema de gerenciamento de conteúdo, mas realmente não explicamos o que isso significa. Um sistema de gerenciamento de conteúdo, muitas vezes abreviado como CMS, é um software que ajuda você a criar, gerenciar e modificar o conteúdo de um site sem a necessidade de interagir diretamente com o código.

Por exemplo, ao invés de precisar adicionar seu conteúdo manualmente formatando-o com HTML como você faria para um site HTML estático, você pode apenas inserir seu conteúdo usando o editor WordPress e o WordPress irá lidar com a exibição do mesmo em seu site:

A interface do editor WordPress

Simplesmente, se você quiser editar esse conteúdo em uma data posterior, você pode simplesmente entrar e editá-lo usando esse mesmo editor, ao invés de precisar editar diretamente o arquivo HTML estático no seu servidor.

Pros e Contras do WordPress

Em um segundo entraremos em alguns dos prós e contras de um site HTML estático, mas vamos começar com algumas das razões pelas quais mais de 39,5% de toda a Internet está agora usando o WordPress.

Gerenciamento de conteúdo sem código

O maior benefício do WordPress é que ele pode eliminar quase completamente o código do gerenciamento do dia-a-dia do seu site. Ao invés disso, a maioria das ações que você vai querer realizar pode ser executada usando uma interface gráfica.

Com esta interface gráfica, você pode:

• Criar novo conteúdo
• Alterar a aparência do seu site
• Alterar o funcionamento do seu site
• Configurar configurações SEO importantes
• Realizar muitas outras ações importantes

Sem você viver e respirar HTML/CSS (e provavelmente mesmo se você o fizer), esta abordagem vai tornar muito mais fácil o gerenciamento de cada aspecto do seu site.

Fácil mudar o aspecto do seu site

Todos os sites WordPress precisam de algo chamado tema. O seu tema determina como o seu site fica no frontend. Para instalar um novo tema WordPress, você basicamente clica num botão ou carrega um único ficheiro e o seu site adopta instantaneamente esse estilo:

Como adicionar um novo tema WordPress

Por outro lado, com um site HTML estático, você controla a aparência do seu site usando o seu próprio CSS. Isto não só consome muito tempo para se configurar, como também será igualmente demorado se quiser alterar radicalmente a aparência do seu site HTML estático no futuro. Sim, existem frameworks CSS que você pode usar para acelerar este processo, mas ainda requer mais trabalho e experiência para ser capaz de gerenciar.

Sabemos disso em primeira mão devido ao fato de que a maioria do site Kinsta foi criado com bons commits de ole Github (leitura sugerida: git vs Github). Sim, nós utilizamos um tema e um framework do WordPress, e nosso código está envolvido em funções do WordPress, mas a maior parte do que você vê no nosso site foi criada pela nossa equipe. Isto pode às vezes permitir maior flexibilidade, mas também requer ter desenvolvedores na equipe. Se você quer economizar tempo e não tem desenvolvedores em tempo integral, ir com um tema pré-construído do WordPress pode acelerar drasticamente seu fluxo de trabalho.

Tema-padrão do WordPress

Adicionalmente, você precisa se preocupar em fazer com que todo o seu CSS reaja (AKA parece bom no celular), enquanto quase todos os temas do WordPress são responsivos por padrão hoje em dia.

Fácil de adicionar novas funcionalidades

WordPress também oferece algo chamado plugins que permitem que você amplie facilmente a funcionalidade do seu site. Deseja adicionar um formulário de contacto ao seu site? Com HTML estático, você precisará lidar com a validação e o que acontece com os dados que um usuário submete. Com WordPress, basta instalar um plugin…

Como adicionar um novo plugin WordPress

A lacuna de dificuldade fica ainda maior com funcionalidades maiores. Quer adicionar um fórum ao seu site? Boa sorte em fazer isso por conta própria. Mas com o WordPress, você só precisa instalar um plugin para fórum.

Você pode até mesmo rapidamente fazer tack em eCommerce ou funcionalidade de redes sociais.

Desenvolvimento Rápido e Mudanças

A combinação de temas e plugins, juntamente com a funcionalidade geral do WordPress como um sistema de gerenciamento de conteúdo, significa que você pode rapidamente girar até mesmo sites complicados.

O HTML estático pode ser rápido para um site muito básico com apenas algumas páginas… mas se você precisar de alguma funcionalidade não-padrão, o WordPress quase certamente vai permitir que você construa um site mais rápido.

Quer mais vantagens? Veja estas 10 boas razões pelas quais você deve usar o WordPress.

Are There Any Cons to Using WordPress?

Você vai encontrar algumas pessoas dizendo coisas como “sites HTML estáticos carregam mais rápido” ou “sites HTML estáticos têm melhor classificação no Google”. Mas algumas destas coisas devem ser tomadas com um grão de sal. Embora seja verdade que PHP e uma base de dados introduzem tempo de carregamento adicional e atrasos, não é tão difícil obter tempos de carregamento do WordPress inferiores a um segundo – que é bastante rápido.

Você deve se perguntar, vale a pena desistir das vantagens que o WordPress tem a oferecer por ter um site estático um pouco mais rápido? Além disso, o desempenho do PHP melhorou drasticamente nos últimos cinco anos. Em nossos recentes testes de benchmark PHP, concluímos que o PHP 7.3 pode lidar com 3x mais pedidos (transações) por segundo do que o PHP 5.6. 🚀

WordPress 5.0 PHP benchmarks

Existem também formas de negar facilmente os atrasos do PHP e das bases de dados, utilizando o cache para servir versões HTML estáticas das suas páginas. Isto significa que cada carregamento de página pode essencialmente carregar um raio rapidamente, tal como faria com um site HTML estático.

O quanto o caching tem impacto num site WordPress? Aqui está um teste rápido num blog WordPress antes e depois da cache.

Sem cache

Fazemos primeiro um teste com a cache desactivada no blog WordPress.

Site WordPress sem cache (Pingdom test)

Como pode ver, há um atraso significativo no primeiro carregamento de HTML DOC. Isto deve-se ao facto de não servir a partir da cache no servidor.

Sem cache de atraso

Com cache

Fizemos um teste com cache ativado no blog do WordPress. Nada mais foi alterado.

Site WordPress com cache (Pingdom test)

Como você pode ver, há uma melhoria maciça. De facto, simplesmente servir a página inicial a partir da cache no servidor diminuiu o tempo de carregamento em 32.2%.

Com cache

Kinsta trata automaticamente do cache ao nível do servidor para todos os clientes de alojamento WordPress. Isto significa que você não precisa se preocupar com plugins de cache de terceiros.

No que diz respeito aos rumores de ranking que você pode ouvir, existem ótimos plugins SEO para WordPress que permitem otimizar seu SEO para WordPress, controlando cada aspecto técnico e SEO na página do seu site. Se os sites WordPress realmente tivessem um desempenho pior do que os sites HTML estáticos nos rankings de busca, você não veria isso sendo usado por plataformas massivas como The Wirecutter ou TechCrunch.

Existem algumas pequenas desvantagens, no entanto, e a primeira é a manutenção. Embora a escolha de uma hospedagem WordPress gerenciada com qualidade possa eliminar grande parte da pior manutenção, você ainda será responsável por garantir que o software principal do WordPress, plugins e temas sejam atualizados e compatíveis. Isto é bastante fácil hoje em dia, mas é algo que você não precisa fazer com um site HTML estático.

A segunda desvantagem provavelmente seria a qualidade. Devido à extrema popularidade do WordPress, há muitos plugins e temas ruins por aí. E soluções gratuitas às vezes simplesmente deixam o mapa completamente. Classificar através dos maus para encontrar os bons pode ser demorado.

Pros e Contras de um site HTML estático

Você ouviu do WordPress – mas agora vamos cavar alguns dos prós e contras de um site HTML estático.

Não há software subjacente para manter

Falamos sobre isso há um segundo atrás, mas vamos voltar a falar rapidamente aqui porque é um dos maiores benefícios do HTML estático.

Quando você usa WordPress e temas/plugins, você é responsável por atualizar todo aquele código subjacente e certificar-se de que não há nenhum problema de compatibilidade. Enquanto isso é bem simples (você normalmente só precisa clicar em um botão), é algo que você precisa fazer para manter seu site seguro e funcionando.

Por outro lado, se você escreveu HTML estático limpo, você deve ser capaz de praticamente deixar as coisas em paz e nunca se preocupar com atualizações.

Easier Access to the Underlying Code

Embora o WordPress lhe permita acessar todo o código subjacente ao seu site, um site HTML estático tornará um pouco mais simples a entrada de certos tipos de marcação. Ao invés de precisar lidar com arquivos de templates temáticos e o loop do WordPress, tudo está bem ali na sua frente.

Por exemplo, enquanto existem plugins de esquemas para WordPress, você pode controlar mais facilmente a marcação de esquemas em um site HTML estático.

Quais são as desvantagens de criar um site HTML estático?

Embora um website HTML estático seja certamente bom para um website básico, os principais problemas surgem quando você tenta aumentar a escala, seja em termos da quantidade de conteúdo ou funcionalidade.

A maioria dessas desvantagens são simplesmente o oposto das vantagens do WordPress. Nomeadamente:

• Adicionar ou editar conteúdo não é fácil de usar porque você precisará escavar no código.
• Adicionar nova funcionalidade requer que você mesmo a codifique.
• Mudar a aparência do seu site requer reescrever seu CSS.

Adicionalmente, a menos que você mesmo saiba HTML/CSS, todas essas coisas também exigirão o pagamento de um desenvolvedor, enquanto que o WordPress permitiria que você mesmo as fizesse, na maior parte do tempo.

Utilizar o WordPress como Gerador de Sites Estático

Geradores de sites estáticos diferem ligeiramente das duas opções acima, pois pegam o conteúdo de um sistema de gerenciamento de conteúdo, como o WordPress, combinam-no com um tema e geram páginas HTML estáticas. Jekyll é um dos mais populares, que você pode usar para hospedar todo o seu site ou blog nas Páginas do GitHub e empurrar seu novo conteúdo com um comando. O lado negativo? Não é fácil (para dizer o mínimo) configurá-lo, e mesmo para desenvolvedores, pode ser demorado.

Se você tiver uma tarde livre para aprender mais sobre Jekyll então dê uma olhada neste artigo de Mike Neumegen. Alternativamente, um CMS de arquivo plano como Grav pode facilitar o gerenciamento de conteúdo, evitando a necessidade de uma base de dados.

Se você tem conhecimentos técnicos, é até possível obter o melhor de ambos os mundos e usar o WordPress como um gerador de sites HTML estático. No entanto, basta lembrar que se você usar o WordPress desta forma, você terá que fazer sacrifícios:

• Não haverá nenhum conteúdo dinâmico “em tempo real” no seu site, de forma alguma.
• Não há artigos recomendados para você ou widgets que mudam para cada visitante.
• Você não pode usar o sistema de comentários embutido do WordPress.

Essencialmente, tudo que é gerado do lado do servidor (PHP) se tornará estático e atualizado manualmente. Os geradores de sites estáticos criarão uma página HTML completa baseada no seu conteúdo e, uma vez feito, não importa quantas pessoas visitem seu site, ele não será regenerado; a menos que você digite um comando específico no seu computador.

Leitura de Suggested: Como enviar um arquivo HTML para WordPress.

Desenvolvedores resolvem o “problema” de comentários, ou não o usando ou mudando para soluções baseadas em JavaScript, sendo os mais populares Disqus ou comentários do Facebook.

Existem alguns plugins de cache do WordPress que você pode usar para criar arquivos HTML estáticos dos seus posts e páginas, mas se você estiver usando o Nginx como seu servidor web (se não estiver, você realmente deveria, mas esse é um tópico para outro artigo) você pode simplesmente ligar o cache de páginas completo e configurá-lo para expirar em um dia ou uma semana. Quanto mais tempo você puder “dar-se ao luxo” de defini-lo, melhor.

O que acontece a seguir é que o primeiro visitante terá o servidor a gerar os ficheiros HTML completos, em cache, e quaisquer visitantes consecutivos dentro do período de expiração pré-definido serão servidos esses ficheiros. Aqui um Kinsta, nossos servidores usam o nginx fastcgi cache module para o cache de páginas. Como prepará-lo, perguntas tu? Bem, se você administra seus próprios servidores aqui está um guia extremamente detalhado da DigitalOcean que você pode seguir.

Se você é um cliente Kinsta, isto é automático para cada site WordPress e o cache por padrão expira a cada uma hora. Você pode, no entanto, abrir um ticket com a nossa equipe de suporte dentro do seu painel do MyKinsta e solicitar uma duração de cache mais longa. Por favor, certifique-se de compreender completamente as consequências de fazê-lo.

Cloudflare Full Page Cache

Você também pode utilizar as regras da página Cloudflare com o WordPress e servir todo o seu site a partir do cache. Nós fornecemos todos os detalhes aqui sobre como configurar o cache Cloudflare para seus posts e páginas do WordPress.

Isso pode ser muito benéfico para sites que estão lançando um evento ou estão esperando uma enorme onda de tráfego. Lembre-se, no entanto, se você estiver servindo inteiramente a partir do cache, você provavelmente terá problemas com o checkout do WooCommerce, sua barra de ferramentas de administração do WordPress, e outras várias coisas que você precisará corrigir ou encontrar soluções.

Leitura de erros: Como configurar o APO Cloudflare para WordPress.

Damos o Melhor de Ambos os Mundos

Não recomendamos geralmente servir seu site inteiro a partir do cache, a menos que você tenha tempo para testar tudo corretamente. Por exemplo, quando se trata de WooCommerce: você pode colocar em cache a página inicial “estática”, categorias, páginas de produtos (se você não alterá-las com muita freqüência) e então sim, ele será carregado quase que instantaneamente! Mas assim que alguém clicar em “adicionar ao carrinho” você terá que mudar para uma versão sem cache, caso contrário eles verão o carrinho sempre vazio.

Aqui em Kinsta, nós temos regras a nível de servidor para soluções de comércio eletrônico e blogs para garantir que o que deveria estar em cache é, e o que não deveria, não é.

Alguns exemplos incluem certas páginas WooCommerce e EDD como carrinho, minha conta, e checkout, estão excluídos do cache. E os usuários contornam automaticamente o cache quando o cookie woocommerce_items_in_cart ou edd_items_in_cart é detectado para garantir um processo de checkout suave e in-sync.

Isso fornece a você um site WordPress de carregamento rápido, mas sem ter que se preocupar com as coisas quebrando.

Pilha de componentes de cache

Não quer hospedar todo o seu site com Kinsta, mas quer aproveitar a funcionalidade dinâmica do seu blog WordPress? Você pode querer olhar para carregar o seu site através de um proxy reverso. Nós suportamos estes tipos de configurações.

WordPress ou Static?

Agora para a questão do milhão de dólares… Se você está apenas construindo um pequeno site que é improvável que mude ou requeira novo conteúdo, HTML estático é uma boa abordagem. Mas para qualquer outra coisa, o WordPress vai ser quase certamente uma escolha melhor. Isto é especialmente verdade se você não tiver acesso a um desenvolvedor.

Its facilidade de uso, combinada com sua extensibilidade, são as principais razões pelas quais ele está agora alimentando mais de 39,5% de todos os sites na Internet. Agora para você – você alguma vez construiria um site com HTML estático sobre WordPress? Ou você já desceu a rota do gerador de sites estáticos?