Ir para o conteúdo principal
Início
HubSpot Central de conhecimento
Isenção de responsabilidade de tradução: esse conteúdo foi traduzido para sua conveniência com o uso de software e pode não ter sido revisado por uma pessoa. O texto oficial é a versão em inglês e sempre será o texto mais atualizado. Para ver a versão em inglês, clique aqui.

Configurar o robots.txt e as metatags de imagem do seu site para visualizações do link de posts sociais

Ultima atualização: Janeiro 19, 2023

Disponível para

Marketing Hub Professional, Enterprise
Marketing Hub Basic (versão anterior)

Ao criar e publicar um post social no HubSpot, a rede social correspondente tentará gerar uma visualização de imagem para seu post. Com base no link que você inseriu para o post, a rede social vai examinar as metatags no código fonte da sua página e rastrear o arquivo robots.txt do seu site.

Se você estiver hospedando seu site em um provedor externo, como o WordPress, e a visualização da sua publicação não aparecer como esperado, siga as instruções abaixo.

Atualizar seu robots.txt

Um arquivo robots.txt informa aos mecanismos de pesquisa como indexar seu site. Se você não tiver adicionado ou configurado seu arquivo robots.txt corretamente, redes sociais não poderão analisar o conteúdo das suas páginas. O Facebook e o Twitter oferecem as strings de agente do usuário que você precisará adicionar ao seu arquivo robots.txt:

Agente do usuário: facebookexternalhit
Não permitir:

Agente do usuário: Twitterbot
Não permitir:

O LinkedIn não fornece documentação para sua string de agente do usuário, mas você pode usar o inspetor de post do LinkedIn para confirmar se o LinkedIn pode rastrear o conteúdo do seu site.

Adicione várias metatags à <head>seção das páginas do seu site

Os mecanismos de pesquisa e redes sociais analisarão a seção do cabeçalho do seu HTML para procurar o metadados necessário para gerar uma visualização da página. Você deve incluir o metadados para o Facebook e Twitter após suas metatags principais:

<!-- Primary Meta Tags -->
<title>Metatags — Visualizar, editar e gerar</title>
<meta name="title" content="Meta Tags — Preview, Edit and Generate">
<meta name="description" content="With Meta Tags you can edit and experiment with your content then preview how your webpage will look on Google, Facebook, Twitter and more!">

<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com">
<meta property="og:title" content="Title of your Website Page">
<meta property="og:description" content="Description of your Website Page">
<meta property="og:image" content="https://example.com/image.png">

<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://example.com/">
<meta property="twitter:title" content="Title of your Website Page">
<meta property="twitter:description" content="Description of your Website Page">
<meta property="twitter:image" content="https://example.com/image.png">

Preencha os atributos de conteúdo para cada uma das metatags acima com os valores correspondentes para sua página. Você pode validar suas metatags usando a ferramenta de depurador do Facebook, validador de cartão do Twitter e inspetor de post do LinkedIn.

Se a imagem destacada for um link que você inseriu e não estiver aparecendo corretamente em sua visualização social (por exemplo, a imagem é cortada ou a proporção está incorreta), pode ser necessário editar a imagem para que ela tenha as dimensões certas para a rede social em que está publicando, para depois republicar a página. Se você estiver publicando no Facebook, pode aprender mais sobre os requisitos de imagem em destaque em sua documentação.

As seguintes dimensões são recomendadas para otimização da imagem em destaque em cada rede:

  • Facebook: 1.91:1
  • Twitter: 16:9 para posts de fotos e 1.91:1 para imagens em destaque nos posts de link
  • Instagram (quadrado): 1:1
  • Instagram (retrato): 4:5
  • Instagram (paisagem): 1.91:1
  • LinkedIn (paisagem): 1.91:1

Certifique-se de que qualquer mídia incluída em seus posts sociais sigam as diretrizes de tamanho de arquivo para cada rede. Se a HubSpot determinar que um arquivo é muito grande para publicar em uma determinada rede, um aviso será exibido. O tamanho máximo de arquivo para cada rede social está listado abaixo:

  • Facebook: 8MB (menos de 1 MB recomendado para arquivos PNG para evitar pixelação)
  • Instagram: 8MB
  • Twitter: 5MB (15MB para GIFs)
  • LinkedIn: 10MB

Discrepâncias na cor e nitidez da imagem

Diferenças na cor da imagem

Os perfis de cores incorporados podem afetar a forma como a imagem em destaque é exibida no post social. Os sistemas processam perfis de cores fora do comum de maneiras diferentes, e é por isso que as cores podem parecer diferentes ao visualizar a imagem no gerenciador de arquivos. Você pode executar seu URL de imagem por meio de uma ferramenta externa para ver se está usando um perfil de cor não comum. Se necessário, você pode remover o perfil de cores com interferência em uma ferramenta de edição de fotos como o Photoshop e republicar a página antes de publicar os posts sociais.

Diferenças na nitidez da imagem

O gerenciador de arquivos do HubSpot usa a compressão de imagem em JPEGs e PNs para ajudar a otimizar as velocidades de carregamento em seu conteúdo hospedado pelo HubSpot. As redes de mídias sociais também usam compressão de imagem nos posts, mas a qualidade pode variar em relação à compressão usada pelo HubSpot. Por isso, é recomendável usar imagens com resolução relativamente alta (na relação de aspecto recomendada) para cada rede. Se a imagem não estiver em conformidade com os requisitos de uma rede social, um aviso será exibido na ferramenta de publicação social do HubSpot para ajudá-lo a ajustar sua imagem.

 

Se você ainda encontrar problemas com as visualizações do link não aparecendo corretamente, confira nosso guia de solução de problemas.
Esse artigo foi útil?
Este formulário deve ser usado apenas para fazer comentários sobre esses artigos. Saiba como obter ajuda para usar a HubSpot.
New to HubSpot? Use these guides to get started.
/pt/social/configure-your-websites-robots.txt-and-image-meta-tags-for-social-post-link-previews