Parede social 
Análise de feeds 
Se alguma vez colaste o código de incorporação do Instagram numa página, viste que funcionava bem durante alguns meses e, depois, encontraste um espaço em branco onde antes estava o feed, já sabes qual é o problema de que trata este artigo.
A maioria das pessoas que gere um feed social no WordPress acaba por se deparar com alguma variante deste problema. O feed fica em branco e não há nada no painel de controlo que permita resolver a situação. Ignora os tipos de letra do tema, pelo que parece sempre um pouco desajustado.
Ou continua a funcionar na perfeição durante meses, enquanto as publicações vão ficando cada vez mais antigas, porque a atualização sempre foi um trabalho manual e essa tarefa acabou por ser deixada de lado.
Nada disso se nota no primeiro dia. Ambas as abordagens parecem adequadas no primeiro dia.
Portanto, esta comparação diz respeito ao sexto mês. O que cada um carrega em cada visualização de página, o que cada um mostra quando a fonte deixa de responder e onde se encontra a solução quando o feed deixa de funcionar: no teu painel de controlo ou no de outra pessoa.
Neste artigo:
- Plugin de feed social vs. widget incorporado: a resposta curta
- Espera lá, um widget incorporado é a mesma coisa que um feed social?
- O que é que, na verdade, deixa de funcionar depois de o sistema de alimentação já estar a funcionar?
- Testei os feeds e widgets sociais: eis o que descobri
- O feed parece adequado ao seu site?
- Como é que um feed de um plugin continua a ser apresentado quando a plataforma não o faz
- Então, qual deles deve usar?
- A Verdadeira Diferença
Plugin de feed social vs. widget incorporado: a resposta curta
Ambos demoram cerca de dez minutos a configurar. É por isso que a configuração não é o aspeto certo para comparar.
Um plugin de feed social armazena os dados do seu feed na sua instalação do WordPress e apresenta-os através do próprio código do seu site. Um widget incorporado apresenta o conteúdo a partir de um local que não está sob o seu controlo.
Quase tudo o que corre mal mais tarde remonta àquela única divisão.
| Plugin de feed social | Incorporar widget | |
|---|---|---|
| Onde se encontram os dados do feed | No interior da sua instalação do WordPress | Nos servidores da plataforma |
| O que é apresentado na página | O próprio código HTML e CSS do seu site | Um bloco ou iframe carregado a partir de outro local |
| Quando a fonte está inacessível | Continua a efetuar a renderização a partir de dados locais | Espaço em branco onde estava o feed |
| Quem é que consegue repará-lo quando se avaria? | Tu, no teu painel de controlo | Quem for o dono da coisa que se partiu |
É à última linha que eu prestaria atenção. Quando uma incorporação deixa de funcionar, o elemento com problema normalmente nem sequer se encontra no teu site, pelo que não há nenhuma configuração que possas alterar e nada a fazer a não ser esperar.
Espera lá, um widget incorporado é a mesma coisa que um feed social?
Resposta curta: não, são coisas diferentes, mesmo que ambas sejam utilizadas para incorporar conteúdos das redes sociais.
O código de incorporação do Instagram é o trecho que se copia de uma publicação específica. Um iframe do YouTube ou do Twitter/X funciona da mesma forma. Basta obter o código da plataforma, colá-lo na sua página e a plataforma apresenta o conteúdo.
Essa última parte é o essencial. O que aparece na tua página é apenas um marcador de posição que indica ao navegador onde deve ir buscar o conteúdo.
Assim, sempre que uma página é carregada, o navegador do visitante solicita a sua página ao seu servidor, lê esse marcador de posição e, em seguida, faz um segundo pedido a um local completamente diferente.
A tua publicação só aparece depois de essa troca de dados estar concluída, nem um momento antes.
Um feed social funciona de forma inversa. Um plugin liga-se à sua conta, importa as suas publicações para a sua instalação do WordPress e armazena-as aí. Quando alguém carrega a página, o feed já se encontra nela. Não há nada para ir buscar, nem ninguém por quem esperar.
A outra diferença reside no conteúdo que se coloca na página inicialmente. Uma incorporação é uma publicação única, fixada no momento em que a colou. Um feed é um conjunto contínuo de publicações que se atualiza à medida que vai publicando.
É por isso que os dois são comparados, mas raramente trocados. Um serve para mostrar uma publicação específica. O outro serve para mostrar a última publicação que fizeste.
O que é que, na verdade, deixa de funcionar depois de o sistema de alimentação já estar a funcionar?
Quase todos os proprietários de sites com quem falo sobre feeds descrevem o mesmo cenário. A configuração correu bem. Meses mais tarde, algo correu mal. E quando tentaram resolver o problema, descobriram que não havia nada no painel de controlo que pudessem corrigir.
Há três versões dessa história que surgem repetidamente. O que é interessante não é o fracasso em si, mas sim quem conseguiu fazer alguma coisa a esse respeito.
O espaço em branco onde antes ficava o feed
Este é aquele que tem a parte final mais longa sem conteúdo. O feed deixa de ser apresentado e o que resta é um espaço vazio onde antes estavam as publicações.
Ninguém recebe um alerta quando isso acontece. O WordPress não sabe que o feed desapareceu, porque, do ponto de vista da sua instalação, nada mudou no seu site.
Assim, as pessoas descobrem por acaso. Um visitante menciona o assunto. Ou então, meses mais tarde, ao editarem essa página por um motivo alheio ao assunto, dão por si que há uma lacuna.
O feed que ignora o teu tema
Isto não é um fracasso. É uma irritação gradual que se transforma num projeto.
O proprietário repara que o feed parece ter sido adicionado à pressa. O tipo de letra está errado, a cor do link está errada, os cantos são demasiado arredondados ou não o suficiente. O site tem um estilo próprio e o feed claramente não se enquadra nele.
Por isso, tentam alterar o estilo, mas é aí que tudo fica por aí. O estilo não está disponível no personalizador do tema nem nas definições dos blocos, porque o código não lhes pertence. Chegou já com o estilo definido, independentemente da origem de onde foi carregado.
O feed que ficou desatualizado sem dar erros
Este é o mais complicado e vale a pena separá-lo do bloco em branco.
Está visível um bloco em branco. É óbvio que falta alguma coisa, por isso, mais cedo ou mais tarde, alguém vai comunicar o problema. Um feed desatualizado não mostra absolutamente nada. O feed é apresentado. As imagens carregam. O layout parece estar correto.
As publicações têm apenas três meses.
Isto acontece porque um feed incorporado não é um feed. Trata-se, sim, das publicações que incorporou no dia em que criou a página, e continua a ser essas publicações.
Quando publicas um novo vídeo, este vai para o teu canal, não para o teu site. A única forma de o vídeo aparecer na tua página é se voltares atrás, copiares outro código de incorporação e o colares lá.
O que não faz mal no primeiro mês. No oitavo mês, é uma tarefa que foi discretamente retirada da lista, e ninguém repara porque nada avariou.
Já vi isto a correr muito mal. O site está a fazer uma campanha, a página inicial mostra um feed e a publicação mais recente nesse feed é de há uma época atrás. Todos os visitantes viram isso. Ninguém o sinalizou, porque não havia nada para sinalizar.
É esse o padrão comum aos três. O espaço em branco, o estilo descoordenado, as publicações desatualizadas. Em cada um dos casos, o que era preciso fazer não era algo que o teu painel de controlo pudesse fazer por ti.
Portanto, ou esperas que isso passe, ou convives com a situação, ou alteras a forma como o feed é apresentado na página desde o início.
Testei os feeds e widgets das redes sociais: eis o que descobri
Tudo o que foi abordado até agora tem a ver com a localização dos dados do feed. Esta é a secção em que isso se traduz em números.
Criei duas páginas num site de teste do WordPress. O mesmo tema, o mesmo modelo de página, a mesma localização no layout. Uma das páginas apresentava incorporações sem formatação.
O outro apresentava um feed do plugin Smash Balloon. O mesmo conteúdo, o mesmo número de publicações. Depois, avaliei ambos com o PageSpeed Insights, o Chrome DevTools e o Pingdom.
Começa pela página inteira, porque é essa a parte que ninguém espera.
| Página de incorporação do Raw | Incorporação de plugin | |
|---|---|---|
| Tamanho da página | 8,4 MB | 1,1 MB |
| Pedidos | 176 | 42 |
Uma página de 8,4 MB não é uma página lenta. É uma página que está a descarregar algo enorme, e o feed é a única coisa nela que é suficientemente grande para explicar isso. Por isso, dividi a carga útil por domínio para ver quem a estava realmente a enviar.
Incorporar página, tamanho do conteúdo por domínio:
| Domínio | Tamanho | Partilhar esta página |
|---|---|---|
| www.youtube.com | 7,5 MB | 91.31% |
| fonts.gstatic.com | 292,3 KB | 3.56% |
| www.google.com | 211,5 KB | 2.58% |
| c0.wp.com | 71,4 KB | 0.87% |
Leia novamente a linha superior. O YouTube enviou 91,31% dessa página. A minha instalação do WordPress contribuiu com o tema, o texto e as imagens que eu tinha carregado, e praticamente nada mais em termos de peso. A página era, na sua maior parte, composta por servidores de terceiros.
Página de feeds do plugin, os mesmos domínios contactados:
www.youtube.com—widgetapi.jscom 9 KiB eiframe_apicom 4 KiB, e nenhum deles carrega o leitor até que alguém cliquei.ytimg.com— miniaturas, com cerca de 49-57 KiB cada
Essa é toda a intervenção externa. A página do plugin continua a comunicar com o YouTube, mas não lhe transfere a página. O leitor só aparece quando um visitante solicita um vídeo, e não antes.
O DevTools apresenta a mesma perspetiva do ponto de vista de terceiros e acrescenta a parte que realmente dói.
| Custos de terceiros | Página de incorporação do Raw | Página de atualizações do plugin |
|---|---|---|
| Conteúdo do YouTube | 8 772 KiB | 457 KiB |
| Hora do tópico principal | 6 036 ms | — |
| Tempo total de bloqueio | 4 510 ms | 0 ms |
A carga útil diminuiu cerca de 95%. Mas o número que eu destacaria é o Tempo Total de Bloqueio, que passou de 4 510 ms para 0 ms, porque esse valor não tem nada a ver com o tamanho do download.
Isso significa que o thread principal do navegador está ocupado a executar JavaScript de terceiros, período durante o qual a página não consegue responder a um toque ou a um deslocamento. Foram quatro segundos e meio, numa página que «parecia estar tudo bem».
Incluído na pontuação que as pessoas realmente alcançam:
| Antes (incorporação em iFrame) | Após (feed do plugin) | |
|---|---|---|
| PageSpeed para dispositivos móveis | 49 | 72 |
| PageSpeed para computador | 52 | 99 |
| Índice de Velocidade Móvel | 15.1s | 4.9s |
O Índice de Velocidade Móvel é o que importa. 15,1 s contra 4,9 s: é essa a diferença entre uma página que se carrega enquanto a pessoa espera e uma página que já está praticamente carregada quando a pessoa acede.
É o mesmo mecanismo dos outros: o feed da página incorporada estava alojado em servidores que não controlo, pelo que cada visitante pagava o custo total da sua obtenção, e não havia nenhuma configuração no meu painel de controlo que permitisse reduzir esse custo.
A página do plugin apresentava o feed a partir de dados que já se encontravam na instalação do WordPress, pelo que a única coisa que faltava obter eram os ficheiros multimédia que o visitante realmente solicitava.
Dica de especialista: Se quiseres saber mais, temos um guia sobre se os feeds das redes sociais podem tornar o teu site mais lento, onde abordamos o assunto com mais pormenor.
O feed parece adequado ao seu site?
Eis a pergunta que mais ouço sobre os elementos incorporados, normalmente formulada com alguma frustração: por que é que isto não se parece em nada com o resto do meu site?
São as mesmas duas páginas de teste, com o mesmo tema ativo em ambas. Insirai um feed criado com o Smash Balloon e comparei-o com a incorporação manual que tinha feito anteriormente.
O feed do plugin adaptou-se ao tema. Os seus títulos utilizam o tipo de letra definido pelo tema e as suas ligações utilizam a cor definida pelo tema, uma vez que essa marcação é renderizada através da folha de estilos do seu próprio site, tal como qualquer outro conteúdo da página.
O feed incorporado não o fez. Chegou com a tipografia e as cores definidas noutro local e aplica-as independentemente do que o tema indicar.
É esse o mecanismo na íntegra. Um feed é formatado pelo teu site. O outro é formatado antes de chegar ao teu site.
Como é que um feed de um plugin continua a ser apresentado quando a plataforma não o faz
Tudo o que está acima desta linha constitui o problema. Esta secção apresenta o mecanismo que lhe dá resposta. Eis como cada elemento se relaciona com uma falha sobre a qual já leu.
Mantém uma cópia local do seu feed
Com um plugin de feed social de alta qualidade como o Smash Balloon, dispõe de um sistema de cache de segurança que armazena os dados do seu feed na sua instalação do WordPress.
Quando o Instagram fica indisponível ou a API deixa de responder, o plugin tem conteúdo para apresentar. O teu feed continua a ser exibido, em vez de ficar com um espaço em branco.
É essa a diferença em que se baseia todo o artigo. A página do plugin tem os teus artigos armazenados na base de dados, pelo que tem algo para apresentar quando a plataforma não responde.
Mas a página incorporada tem um marcador de posição e um endereço, e se não for devolvido nada a partir desse endereço, nada é apresentado.
Não carrega iframes de terceiros
O Smash Balloon apresenta os feeds sem carregar iframes de terceiros que tornam as páginas mais lentas.
É por isso que a página do plugin contactou menos domínios externos e pesava 1,1 MB, em comparação com os 8,4 MB da página incorporada. Não há cadeia de pedidos porque não há nada para recuperar.
Utiliza carregamento diferido e armazenamento em cache inteligente
As imagens são carregadas à medida que o visitante se desloca até elas, e os dados do feed armazenados em cache significam que o seu servidor não tem de aceder à API em cada visualização de página.
Este é o resultado do «Tempo Total de Bloqueio»: 4 510 ms na página incorporada e 0 ms na página do plugin.
A solução está no seu próprio painel de controlo
Não é necessário saber programar. As definições do feed encontram-se no painel de administração do WordPress, ao lado de tudo o resto que gere.
Este é o aspeto que eu consideraria mais importante. Mesmo na rara eventualidade de algo correr mal, basta abrir um ecrã ao qual já tem acesso ou contactar a equipa de apoio. Com as integrações manuais, fica à espera de uma infraestrutura que não controla.
Cerca de 1,75 milhões de pessoas utilizam os feeds do Smash Balloon nos seus sites WordPress, o que é importante saber sobretudo porque significa que as situações de falha acima referidas já ocorreram e foram geridas em grande escala.
Então, qual deles deve usar?
A questão decisiva não é qual delas é mais fácil de configurar. É esta: quando o feed deixa de funcionar, a solução está no teu painel de controlo ou no de outra pessoa?
Eis como eu responderia a essa pergunta, dependendo do que estás realmente a construir.
- Estás a incorporar uma publicação ou um vídeo num artigo. Utiliza o código de incorporação da plataforma. Trata-se de um único conteúdo que não se destina a ser atualizado, pelo que a opção básica, embora limitada, é a mais adequada.
- Estás a gerir um feed contínuo numa página que queres que seja rápida e esteja indexada. Usa um plugin. Os números de desempenho apresentados anteriormente neste artigo são a razão: 8,4 MB contra 1,1 MB, 176 pedidos contra 42. Um feed em tempo real carrega em cada visita, por isso, seja qual for o custo, esse custo repete-se constantemente.
- Não acedes ao teu site todas as semanas, nem tens um cliente ou freelancer a tratá-lo. Usa um plugin. O problema aqui é o silêncio. Não aparece qualquer aviso de erro; o feed simplesmente deixa de ser apresentado e a página continua a carregar normalmente.
- Estás a utilizar feeds de mais do que uma plataforma. Recorre a um plugin, e escolhe um que abranja todas elas. Códigos de incorporação separados para sites diferentes significam que as coisas podem falhar de cinco formas diferentes. O Smash Balloon Social Wall permite-te criar feeds para todas estas plataformas e até combiná-los num único painel social.
A Verdadeira Diferença
Ambos parecem bastante semelhantes no início, mas a diferença torna-se evidente no dia em que algo corre mal. Quando tornei a fonte de ambos os feeds inacessível, a página do plugin continuou a apresentar publicações a partir dos dados armazenados na instalação do WordPress.
A página incorporada não tinha nada local a que recorrer. É essa a verdadeira diferença. Uma abordagem mantém os dados do feed no seu próprio servidor e a correção no seu próprio painel de controlo. A outra mantém ambos num local ao qual não tem acesso.
Se estiveres a gerir um feed contínuo, o Smash Balloon Instagram Feed Pro é um excelente ponto de partida, e permite-te criar feeds para a plataforma visual n.º 1 do mercado.
Tem feeds de mais do que uma plataforma? O Pacote All Access reúne o Instagram, o Facebook, o YouTube e o X num único ecrã de definições.
