Když poprvé spustíte nový web nebo blog, pravděpodobně ho budete chtít hned sdílet se svými přáteli a rodinou. Pokud jste to ale nenastavili správně, uvidí jen nudný odkaz.
I když náhled načte obrázek, nemusí to být ten, který chcete vidět. Ale můžete to opravit.
Meta tagy jsou tagy HTML, které na vaší webové stránce nezobrazují žádný obsah. Žijí uvnitř značky ve vašem HTML. Když vyhledávače a další služby, jako je Facebook, přečtěte si svou stránku, získají cílené informace z metaznaček.
Pro mnoho lidí je Google internet. Je to pravděpodobně nejdůležitější vynález od samotného internetu. A zatímco se vyhledávače od té doby hodně změnily, základní principy jsou stále stejné.
Meta tagy jsou to, co potřebujete k tomu, abyste dostali sociální média a textové zprávy, abyste správně zpracovali své odkazy. Když například sdílíte odkaz prostřednictvím Facebooku, následuje Facebook odkaz na stránku. Poté přečte stránku a pokusí se přijít na to, co je všechno.
Nejdůležitější je, že se snaží najít název, popis a obrázek. Pokud je nemůže najít, zobrazí pouze jednoduchý odkaz bez ozdůbek. Chcete-li, aby Facebook zobrazoval konkrétní název, popis a obrázek, budete muset přidat konkrétní metaznačky, abyste mu řekli, co hledat.
Pokud weby sociálních médií, jako je Facebook a Twitter, získají z vašeho webu informace, které potřebují, vytvoří kartu. Pokud vše proběhlo podle plánu, mělo by to vypadat, jak byste čekali.
PŘÍBUZNÝ: Jak vytvářet roboty Twitter, Instagram a Reddit pomocí Pythonu
Pokud jste svůj web vytvořili pomocí prostého kódu HTML nebo rozhraní front-end, přidávání metaznaček by mělo být jednoduché. Jdou ve stejné oblasti jako váš název, styl a značky skriptu, jako v následujícím příkladu:
Lee Nathan - autor osobního rozvoje
...
Můžete vidět, že již existuje několik metaznaček. Nejsou to ty, které potřebujete k tomu, aby se váš web zobrazoval správně v odkazu, jsou to jen některá výchozí nastavení na nízké úrovni.
Změna metaznaček ve WordPressu je více zapojena. Kompletní pokyny by zabraly celého průvodce. Takže místo toho je zde několik rad, které vám pomohou začít:
- Pokud jste spokojeni s úpravou motivu, metaznačky by měly být umístěny v souboru header.php soubor aktuálního motivu.
- Pokud nemáte přístup ke svému motivu nebo se s ním nechcete vypořádat, můžete změnit své metaznačky pomocí pluginu, jako je Pokročilá správa metaznaček.
Podívejte se na nejlepší poskytovatelé hostingu WordPress pokud máte zájem o spuštění webu na platformě.
Jak vytvořit kartu na Facebooku
Nyní, když jste zjistili, jak přistupovat k vašim metaznačkám, můžete je začít upravovat. Toto jsou minimální značky, které chce Facebook vidět:
Vlastnosti názvu a popisu říkají Facebooku, jaký text se má zobrazit. Vlastnost URL může odkazovat na podstránku pro speciální propagace nebo testování A / B.
Vlastností image by měla být úplná adresa, nikoli relativní vzhledem k vaší indexové stránce /image.jpg. Nejlepší velikost obrázku, kterou lze použít, je 1 200 x 628, protože tato velikost bude nejkompatibilnější mezi weby a zařízeními sociálních médií.
Jak vytvořit kartu Twitter
Karta Twitter je téměř stejná jako karta Facebook, ale s různými metaznačkami. Takto vypadají metaznačky Twitteru:
Vlastnosti názvu a popisu jsou stejné jako vlastnosti Facebooku; vlastnost image také dodržuje stejná pravidla. A 1200x628 je dobrá velikost pro začátek.
Hlavní rozdíl je vlastnost karty. Tento příklad používá „summary_large_image“ k vytvoření karty, která vypadá přibližně stejně jako karta Facebooku. Twitter však má i jiné možnosti.
Jak zajistit, aby váš náhled vypadal správně
Můžete zveřejnit tweet a rychle ho smazat půl tuctukrát, dokud se vaše karta nedostane správně. Můžete také poslat zprávu z Facebooku sami sobě. Ale tyto metody jsou trochu neohrabané. Naštěstí obě služby poskytují užitečný nástroj, který usnadňuje kontrolu vašich karet.
Facebook má debugger sdílení. A Twitter má validátor karet. Oba nástroje provádějí stejný úkol a umožňují vám vidět, jak odkazy fungují; prostě používají různá jména.
Další aspekty, které byste měli otestovat
Nyní jste dostali odkaz na svůj web, aby vypadal skvěle na dvou velkých sociálních sítích. Je pravděpodobné, že to bude vypadat dobře všude, ale měli byste zkontrolovat, zda to tak je. Například pokud máte informace v dolní nebo horní části obrázku, může se v mobilu oříznout.
mobilní, pohybliví
Než půjdete dále, je dobré se ujistit, že váš odkaz v mobilu stále vypadá dobře. Jak již bylo zmíněno, váš obrázek by se mohl oříznout na menší obrazovce. Příklad zobrazený dříve měl obraz příliš nízký, takže bylo vidět pouze horní polovinu hlavy.
SMS a poslové
Jedná se o jednoduchou věc, kdy si s odkazem pošlete text (nebo zprávu prostřednictvím služby jako WhatsApp). Nemusíte si dělat starosti s ověřovacím nástrojem. Je pravděpodobné, že pokud to v aplikacích pro sociální média vypadá dobře, bude to tady dobře vypadat.
Pokud pracujete na svém osobním webu, určitě chcete, aby vypadal dobře na LinkedIn. Naštěstí, LinkedIn také poskytuje ověřovací nástroj zavolal poštovní inspektor. Také si nemusíte dělat starosti s dalšími metaznačkami, protože LinkedIn používá značky Facebooku.
Na čem dále pracovat
Informace, které jsme pokryli, by měly stačit, abyste mohli začít. Pokud se ale chcete dozvědět více, podívejte se Průvodce značkami na Facebooku nebo Stránka Twitteru o značkách.
Web je plný nástrojů, které pomáhají komukoli vytvářet vlastní profesionálně vypadající obrázky, které lze sdílet. Tady jsou naše oblíbené.
- Programování
- HTML
- Domovská stránka
- Nástroje pro webmastery
Lee je nomád na plný úvazek a polymatik s mnoha vášněmi a zájmy. Některé z těchto vášní se točí kolem produktivity, osobního rozvoje a psaní.
Přihlaste se k odběru našeho zpravodaje
Připojte se k našemu zpravodaji s technickými tipy, recenzemi, bezplatnými elektronickými knihami a exkluzivními nabídkami!
Ještě jeden krok…!
V e-mailu, který jsme vám právě poslali, potvrďte svou e-mailovou adresu.
