A resposta curta: para consultar Open Graph en liña, pega o enderezo da páxina no depurador gratuíto PromoPilot de Open Graph. Lerá todas as etiquetas og:* e Twitter Card, comprobará a presenza e o tamaño da imaxe, avaliará a integridade do marcado e mostrará vistas previas de ligazóns para Facebook, X (Twitter) e LinkedIn, ademais de recomendacións sobre que engadir. Non é necesario rexistrarse. A continuación atoparás as etiquetas necesarias, o tamaño de og:image requirido e como actualizar unha vista previa "atascada".
Levo 12 anos creando sitios web e escoito a pregunta "Por que Telegram non ten unha imaxe?" dos clientes con máis frecuencia que preguntas sobre clasificacións. Normalmente é un traballo de cinco minutos, se sabes onde buscar.
Que comproba o depurador de gráficos Open Graph?
Cando inseris unha ligazón nunha publicación ou mensaxe, a plataforma vai á páxina e busca etiquetas de Open Graph. Se atopa unha, saca unha tarxeta. Se non a atopa, colle o que atope ou mostra un URL simple. A ferramenta só comproba o que len as redes sociais.
| Que comproba? | Que está mirando? | Por que necesitan isto as empresas? |
|---|---|---|
| Todas as etiquetas og:* | og:title, og:description, og:image, og:url, og:type, og:site_name, og:locale | A partir disto, os sitios recompilan o título, a descrición e a imaxe da tarxeta. |
| Tarxeta de Twitter | twitter:tarxeta, twitter:título, twitter:descrición, twitter:imaxe | X (Twitter) le as súas etiquetas e, se están ausentes, as og parcialmente. |
| Imaxe orixinal | Hai algunha imaxe e de que tamaño é? | A pequena imaxe converte a tarxeta nunha icona diminuta no lateral |
| Avaliación da integridade | Cantas etiquetas recomendadas se completaron? | Referencia rápida: está todo no seu sitio? |
| Vistas previas da rede | tarxetas para Facebook, X e LinkedIn | Podes ver como quedará a publicación antes da publicación. |
| Recomendacións | Que debería engadir ou corrixir? | Unha lista de tarefas xa preparada para un desenvolvedor ou para ti |
Como consultar páxinas de Open Graph en liña?
- Abrir Depurador de gráficos.
- Introduza o URL da páxina que quere compartir: un artigo, un produto ou unha páxina de destino de publicidade. Faga clic en "Comprobar".
- Revisa a lista de etiquetas: cales están definidas, cales están baleiras e se hai un enderezo estranxeiro ou de proba en og:url.
- Comproba a vista previa de cada rede: o título está cortado, a imaxe é visible e hai algún texto importante nos bordos.
- Engade as etiquetas que faltan segundo as recomendacións e comproba a páxina de novo.
Páxina de ferramentas: campo de enderezo, botón "Comprobar", lista de comprobacións e preguntas frecuentes.
A ferramenta é lixeira: un límite diario abonda para que un convidado poida consultar todos os modelos do sitio: a páxina de inicio, a categoría, o produto e o artigo. Tras o rexistro gratuíto, o límite triplícase.
Cales son os erros máis comúns en Open Graph?
Isto é o que atopo en case todos os demais sitios e en que orde debo solucionalo.
- Non hai og:image ou está especificada como unha URL relativa. As redes sociais non entenderán
content="/img/cover.jpg": requírese a URL completa que comeza porhttps://. Sen unha imaxe, o alcance da publicación diminúe significativamente. - A imaxe é demasiado pequena. O logotipo de 200x200 converte a tarxeta nun pequeno cadrado no lateral. Necesítase unha imaxe de 1200x630.
- Unha imaxe og: para todo o sitio. Todos os artigos e todos os produtos nas redes sociais deben ter o mesmo aspecto, co logotipo. Para o blog e o catálogo, a imaxe debe tomarse da foto principal da páxina.
- og:url leva a outro enderezo: a páxina de inicio, un dominio de proba ou a versión
http://. A plataforma pode consolidar todas as ligazóns nunha única páxina. - Non existe a twitter:card. Sen ela, X adoita mostrar unha tarxeta pequena. Para unha imaxe máis grande, necesitas
summary_large_image. - og:title duplica o título con "mercar" e a marca. Nun feed de redes sociais, isto semella un anuncio; un título animado, como o dunha publicación, é mellor.
O conxunto mínimo correcto ten este aspecto:
<meta property="og:title" content="Как выбрать кожаный рюкзак: 7 признаков качества"> <meta property="og:type" content="article"> <meta property="og:url" content=" https://example.com/blog/kozhanyj-ryukzak/"> <meta property="og:image" content=" https://example.com/img/og/kozhanyj-ryukzak.jpg"> <meta name="twitter:card" content="summary_large_image">Como preparar unha imaxe para og:image?
A imaxe é a parte máis rechamante da tarxeta, e é onde a xente adoita escatimar. Aquí tes algunhas regras que sigo:
- O tamaño é de 1200 × 630 e a orientación é horizontal. A rede social recortará a parte superior e inferior dunha foto cadrada do produto, o que pode provocar que ao produto lle falte a cabeza ou a sola.
- O importante está no centro. As diferentes plataformas recortan os bordos de xeito diferente e, no feed móbil, a tarxeta é aínda máis pequena. Mantén o texto grande e lonxe dos bordos.
- Texto mínimo. O título xa está debaixo da imaxe; abonda con 3-6 palabras ou sen subtítulos na propia imaxe.
- Ficheiro lixeiro. Un JPG ou PNG de tamaño razoable cargarase rápido e a plataforma non se agardará.
- Unha imaxe dedicada para cada páxina clave. Para artigos e produtos, é conveniente crear unha automaticamente: unha portada de artigo ou a foto principal do produto.
Unha boa proba é abrir a vista previa no depurador do teu teléfono. Se a ligazón non é clara sen ampliar, é necesario reelaborar a imaxe.
Como actualizo unha vista previa antiga despois dunha corrección?
Un escenario común: corrixiches as etiquetas, pero a rede social teimosamente mostra a imaxe antiga. O motivo é a caché: a plataforma lembrou a vista previa da primeira compartición. En Facebook recompilar os datos no Depurador de compartición axuda, en LinkedIn, con Post Inspector e en Telegram, co bot @WebpageBot, ao que envías a ligazón. Se todo o demais falla, engade un parámetro inofensivo ao enderezo, como ?v=2: para a plataforma, esta é unha nova ligazón.
Comparación: Depurador de grafos abertos e alternativas
| Ferramenta | Que é gratis? | Restricións | Para quen é axeitado? |
|---|---|---|---|
| PromoPilot - Depurador de grafos abertos | Todas as etiquetas de og e Twitter, og: tamaño da imaxe, vistas previas para Facebook, X e LinkedIn, recomendacións | Non borra a caché das redes sociais | Revisa a túa páxina inmediatamente antes de publicala en calquera rede social |
| Depurador de compartición (Meta) | Vista previa Facebook e recompilación de datos | Só para Facebook, é necesario iniciar sesión na conta | Restablecer a vista previa antiga en Facebook |
| Inspector de publicacións de LinkedIn | Vista previa e actualización da caché de LinkedIn | Só en LinkedIn, é necesario iniciar sesión | Para os que se promocionan en LinkedIn |
| @WebpageBot en Telegram | Actualizando a vista previa da ligazón en Telegram | Só Telegram, non analiza as etiquetas | Para os propietarios de canles Telegram |
Conclusión: necesítanse depuradores de plataformas oficiais para limpar a caché, pero cada plataforma só mostra a súa propia rede. Para ver todas as vistas previas e unha lista das etiquetas que faltan dunha soa vez, un depurador universal é máis cómodo.
Por certo, PromoPilot ten 87 ferramentas de SEO gratuítas. Se aínda non escribiches etiquetas, temos un artigo na nosa serie sobre un xerador de metaetiquetas que creará un bloque Open Graph cunha vista previa.
En que se diferencia o depurador de grafos abertos da análise de metaetiquetas?
A análise de metaetiquetas examina unha páxina a través dos ollos dun motor de busca: título, descrición, canonical, hreflang e Open Graph son só un grupo. O depurador céntrase nas redes sociais: crea tarxetas para diferentes plataformas, comproba o tamaño da imaxe e fai recomendacións baseadas especificamente nas vistas previas. Se as ligazóns ao teu sitio se comparten activamente nas redes sociais e nas aplicacións de mensaxería, o depurador é máis útil.
Ambos teñen unha limitación: len o HTML que devolve o servidor. Se un script do navegador insire etiquetas, moitas redes sociais non as verán; isto debe solucionarse no sitio web. Outro detalle: o depurador comproba as etiquetas, pero non o xeito en que se comparte. Se a páxina está protexida por contrasinal, xeobloqueada ou protexida contra bots, é posible que a rede social non poida acceder a ela mesmo se todas as etiquetas están presentes.
Cando non abonda cunha ferramenta gratuíta?
Un depurador mostrará que a páxina non ten og:image. Pero se hai miles de páxinas, non é posible inserir imaxes manualmente. Necesítase un especialista cando:
- cada produto ou artigo debería ter a súa propia imaxe de vista previa, recollida automaticamente;
- o sitio devolve etiquetas usando un script e as redes sociais non as ven;
- Lanzas anuncios e envíos onde cada vista previa afecta o custo por clic;
- Necesitamos unha combinación de "páxina web + canle Telegram + publicación automática" coas tarxetas axeitadas.
Que podo facer polo teu sitio web?
Son Valeriy Danyuk, desenvolvedor e especialista en SEO con 12 anos de experiencia e máis de 200 clientes. Unha fermosa vista previa de ligazóns é de acceso gratuíto e personalízoa para cada proxecto.
SEO e promoción
- Auditoría SEO de sitios web chave en man: reviso todas as etiquetas do modelo, configuro imaxes de vista previa automáticas e corrixo o código.
Sitios web e tendas en liña
- Transferindo a túa tenda de Instagram ao teu sitio web: produtos con vistas previas axeitadas para compartilas facilmente.
- Unha páxina de destino para un novo produto creada nunha noite: un caso práctico de NordHarvest cunha tarxeta xa feita para as redes sociais.
- Un sitio web de clínica de cirurxía plástica con IA e aplicacións a través de Telegram.
- Sitio web en 1001site: as vistas previas para as redes sociais e a publicación automática en Telegram configúranse automaticamente.
Bots e automatización
- Bot Telegram con IA para unha tenda de salsas en liña.
- QuestFlow é un creador SaaS Telegram con IA.
- Axentes de comercio electrónico en lugar de chatbots.
Mándame unha ligazón que se vexa mal nun Messenger en Telegram e direiche cal é a etiqueta que falta.
Resultado
- Un verificador en liña de Open Graph mostra o aspecto dunha ligazón en Facebook, X e LinkedIn, e que etiquetas faltan.
- O mínimo esixido é og:title, og:type, og:image (1200×630, enderezo completo) e og:url, ademais de twitter:card.
- Despois de arranxalo, restablece a caché dos sitios: Sharing Debugger, Post Inspector, @WebpageBot.
- Para o catálogo e o blog, as imaxes de vista previa deberían recollerse automaticamente, como en 1001site.
Revisa a páxina que estás a piques de compartir no depurador gratuíto Open Graph antes de que os teus seguidores vexan a publicación.
Fontes
- Páxina da ferramenta Depurador de gráficos abertos de PromoPilot: lista de comprobacións e preguntas frecuentes.
- Protocolo de grafos abertos (ogp.me): propiedades obrigatorias e opcionais.
- O Depurador de publicacións de Meta e o Inspector de publicacións de LinkedIn son as ferramentas oficiais das plataformas.
