O princípio norteador do WordPress é que a internet é para todos e que qualquer pessoa pode fazer um site, mesmo sem conhecimento de codificação. E é verdade – você precisa exatamente de zero conhecimento de codificação para criar um site, mas isso significa contar com a codificação de outra pessoa.
As armadilhas são óbvias: pode acontecer que seu site passe a conter código, geralmente em CSS, que realmente não precisa ser executado. Este tutorial é sobre como remover CSS não utilizado do seu site WordPress. Mas o que é CSS? Por que seu site tem um código de que não precisa? Se o código não faz nada, por que não deixá-lo? Tentaremos responder a essas perguntas e muito mais. Aqui está o que vamos falar:
CSS significa folhas de estilo em cascata. Isto é um conjunto de instruções para um navegador que dita a aparência de uma página da web para os usuários. Uma página da web é estruturada usando uma linguagem de marcação, como HTML, mas o HTML não é legível para o usuário. Um navegador da web lê HTML e apresenta o conteúdo a um usuário de forma legível.
Mas a interpretação padrão de um navegador de um texto marcado tornaria muitas páginas indistinguíveis, e é aí que entra o CSS. O CSS tem muitos usos: alterar o tamanho da fonte, cores e tipo, quebras de linha e espaçamento de parágrafo, adicionar e manipular imagens de fundo e muito mais.
Existem muitas maneiras de como um código desnecessário pode chegar ao seu site. Quando se trata de CSS, provavelmente se resume a algo que você instalou no seu site WordPress, o que afeta a forma como é apresentado ao usuário. Por exemplo, um tema tem seu próprio CSS, tornando seu site diferente de todos os outros que não usam o mesmo tema. Um plugin como um construtor de páginas pode ter seu próprio CSS, assim como fontes, fontes de ícones e muitos outros softwares que você pode instalar.
Mas qual é o problema, ouvimos você perguntar. Bem, o resultado final é que seu site está carregando muitos arquivos que não precisam para funcionar, o que significa que o tempo de carregamento é desnecessariamente estendido. Tempos de carregamento lentos não afetam apenas a experiência do usuário dos visitantes – os mecanismos de pesquisa consideram as taxas de rejeição (a rapidez com que um usuário “desiste” do seu site) e o tempo de carregamento.
E embora os arquivos CSS tendam a ser pequenos, pode haver muitos deles em qualquer site. É por isso que não existe código inofensivo e inútil.
Determinar se um site apresenta problemas de CSS não utilizados é relativamente fácil: o Google tem uma ferramenta específica para isso. Você pode usar Google PageSpeed Insights para determinar se o seu site sofre de lentidão desnecessária e ver quantas delas podem ser atribuídas a CSS não utilizado.
Executamos o teste em um site que, obviamente, tem muitos problemas. Você pode expandir os resultados para exclusão de CSS não utilizado para ver as sugestões do Google.
Claramente, isso só funciona para os critérios do Google. No entanto, embora todos os mecanismos de pesquisa tenham algoritmos diferentes, eles tendem a funcionar de maneiras semelhantes. Além disso, tempos de carregamento lentos são tempos de carregamento lentos, não importa como você o corta, e ninguém quer isso.
O desafio aqui é saber qual CSS é inútil. A resposta? Você não precisa saber disso. Você pode e deve confiar mais uma vez no código de outra pessoa. Nesse caso, é um plugin: Limpeza de ativos.
Primeiro, instale e ative o plugin. Você será levado imediatamente para a página do plugin Começando tela. Para começar a remover CSS não utilizado, selecione Configurações no menu do lado direito.
Para testar diferentes configurações sem afetar os visitantes do site, você precisa habilitar o modo de teste do plug-in. Para fazer isso, selecione o Modo de teste guia e deslize o controle deslizante e clique Atualizar todas as configurações.
Agora, este plugin tem muitas opções e configurações. Estaremos nos concentrando na remoção de CSS não utilizado. Para fazer isso, precisamos do Gerenciador de CSS e JS definições. Vai abrir no Pagina inicial subguia. É aqui que você pode ver quais arquivos estão carregados na página inicial do seu site.
Rolando para baixo na lista, você pode ver cada um desses arquivos, junto com muitos dados relevantes, como sua fonte, posição, tamanho do arquivo e o resto. Você também pode obter um Dica, uma dica útil sobre se um trecho de código é necessário ou não na página.
No caso de Formulário de Contato 7, por exemplo, você pode ver que o arquivo está relacionado a um formulário. A recomendação é que o arquivo seja descarregado no Pagina inicial se não houver formulários nele. O mesmo vale para todas as outras páginas que não usam um formulário.
Para descarregar Formulário de Contato 7CSS de Pagina inicial, ative o controle deslizante e clique Atualizar.
E é tão simples quanto isso: agora você deixou seu site um pouco mais rápido para carregar removendo CSS não utilizado.
O problema é que você precisa fazer tudo isso para todas as postagens e páginas também. Para carregar uma lista de CSS para uma postagem, por exemplo, mude para o Publicar guia e pesquise-a no campo de pesquisa e selecione uma postagem da lista.
Quando estiver satisfeito com o CSS que você descarregou, teste se tudo carrega corretamente e pronto. Você pode em seguida, desligue o modo de teste, para fazer com que as configurações se apliquem a todos os usuários, e não apenas aos administradores conectados.
Para concluir
Como você pode ver, existem boas razões para você ter certeza de que seu site sofre de CSS não utilizado. É difícil remover todos os CSS não utilizados do seu site, especialmente se ele contiver muitas páginas, mas os resultados valem a pena – seus visitantes apreciarão tempos de carregamento mais rápidos, enquanto os mecanismos de pesquisa não irão penalizá-lo por lentidão e taxa de rejeição , levando a mais visitantes em potencial.
Apoie o nosso trabalho ❤️
Se você gostou deste artigo, considere deixar uma gorjeta para nos ajudar a continuar publicando conteúdo de qualidade.
