Wenn Sie zum ersten Mal eine neue Website oder ein neues Blog starten, möchten Sie diese wahrscheinlich sofort mit Ihren Freunden und Ihrer Familie teilen. Aber wenn Sie es nicht richtig eingerichtet haben, sehen sie nur einen langweiligen Link.
Selbst wenn die Vorschau ein Bild lädt, ist es möglicherweise nicht das, das Sie sehen möchten. Aber Sie können das beheben.
Meta-Tags sind HTML-Tags, die keinen Inhalt auf Ihrer Webseite anzeigen. Sie leben in der Tags in Ihrem HTML. Wann Suchmaschinen und andere Dienste wie Facebook lesen Ihre Seiteerhalten sie gezielte Informationen aus den Meta-Tags.
Für viele Menschen ist Google das Internet. Es ist wohl die wichtigste Erfindung seit dem Internet selbst. Und obwohl sich Suchmaschinen seitdem stark verändert haben, sind die zugrunde liegenden Prinzipien immer noch dieselben.
Meta-Tags sind das, was Sie benötigen, um soziale Medien und Textnachrichten zu erhalten, damit Ihre Links ordnungsgemäß verarbeitet werden können. Wenn Sie beispielsweise einen Link über Facebook teilen, folgt Facebook dem Link zur Seite. Dann liest es die Seite und versucht herauszufinden, was alles ist.
Am wichtigsten ist, dass versucht wird, einen Titel, eine Beschreibung und ein Bild zu finden. Wenn es diese nicht finden kann, zeigt es nur einen einfachen Link ohne Schnickschnack. Damit Facebook einen bestimmten Titel, eine bestimmte Beschreibung und ein bestimmtes Bild anzeigt, müssen Sie bestimmte Meta-Tags hinzufügen, um anzugeben, wonach gesucht werden soll.
Wenn Social-Media-Websites wie Facebook und Twitter die benötigten Informationen von Ihrer Website erhalten, erstellen sie eine Karte. Wenn alles nach Plan lief, sollte es so aussehen, wie Sie es erwarten würden.
VERBUNDEN: So erstellen Sie Twitter-, Instagram- und Reddit-Bots mit Python
Wenn Sie Ihre Website mit einfachem HTML oder einem Front-End-Framework erstellt haben, sollte das Hinzufügen von Meta-Tags einfach sein. Sie befinden sich im selben Bereich wie Ihre Titel-, Stil- und Skript-Tags, wie im folgenden Beispiel:
Lee Nathan - Autor für persönliche Entwicklung
...
Sie können sehen, dass bereits einige Meta-Tags vorhanden sind. Dies sind nicht die, die Sie benötigen, damit Ihre Website in Links korrekt angezeigt wird. Dies sind nur einige Standardeinstellungen auf niedriger Ebene.
Das Ändern der Meta-Tags in WordPress ist aufwändiger. Vollständige Anweisungen würden eine ganze Anleitung benötigen. Hier sind ein paar Tipps, die Ihnen den Einstieg erleichtern sollen:
- Wenn Sie mit dem Bearbeiten Ihres Themas vertraut sind, sollten sich die Meta-Tags in der befinden header.php Datei Ihres aktuellen Themas.
- Wenn Sie nicht auf Ihr Thema zugreifen können oder sich nicht damit befassen möchten, können Sie Ihre Meta-Tags mit einem Plugin wie ändern Erweiterte Meta-Tag-Verwaltung.
Schau es dir an die besten WordPress-Hosting-Anbieter Wenn Sie daran interessiert sind, eine Website auf der Plattform zu starten.
So erstellen Sie eine Facebook-Karte
Nachdem Sie herausgefunden haben, wie Sie auf Ihre Meta-Tags zugreifen können, können Sie mit der Bearbeitung beginnen. Dies sind die Mindest-Tags, die Facebook sehen möchte:
Die Titel- und Beschreibungseigenschaften teilen Facebook mit, welcher Text angezeigt werden soll. Die URL-Eigenschaft kann für Sonderaktionen oder A / B-Tests auf eine Unterseite verlinken.
Die Bildeigenschaft sollte eine vollständige Adresse sein, nicht relativ zu Ihrer Indexseite wie /image.jpg. Die beste Bildgröße ist 1200 x 628, da diese Größe für Social Media-Websites und -Geräte am besten kompatibel ist.
So erstellen Sie eine Twitter-Karte
Die Twitter-Karte ist fast identisch mit der Facebook-Karte, jedoch mit unterschiedlichen Meta-Tags. So sehen Twitter-Meta-Tags aus:
Die Titel- und Beschreibungseigenschaften sind die gleichen wie bei Facebook. Die Bildeigenschaft folgt ebenfalls denselben Regeln. Und 1200x628 ist eine gute Größe für den Anfang.
Der Hauptunterschied ist die Karteneigenschaft. In diesem Beispiel wird "summary_large_image" verwendet, um eine Karte zu erstellen, die ungefähr der Facebook-Karte entspricht. Twitter hat jedoch andere Möglichkeiten.
So stellen Sie sicher, dass Ihre Vorschau richtig aussieht
Sie können einen Tweet posten und ihn ein halbes Dutzend Mal schnell löschen, bis Sie Ihre Karte richtig verstanden haben. Sie können sich auch eine Facebook-Nachricht senden. Aber diese Methoden sind irgendwie klobig. Glücklicherweise bieten beide Dienste ein praktisches Tool, um das Überprüfen Ihrer Karten zu vereinfachen.
Facebook hat einen Sharing-Debugger. Und Twitter hat einen Kartenprüfer. Beide Tools haben dieselbe Aufgabe, damit Sie sehen können, wie Links funktionieren. Sie verwenden nur unterschiedliche Namen.
Andere Aspekte, die Sie testen sollten
Jetzt haben Sie Ihren Site-Link so gestaltet, dass er in den beiden großen sozialen Netzwerken großartig aussieht. Es besteht die Möglichkeit, dass es überall gut aussieht, aber Sie sollten überprüfen, ob dies der Fall ist. Wenn Sie beispielsweise Informationen unten oder oben in einem Bild haben, werden diese möglicherweise auf Mobilgeräten abgeschnitten.
Handy, Mobiltelefon
Bevor Sie fortfahren, sollten Sie sicherstellen, dass Ihr Link auf Mobilgeräten immer noch gut aussieht. Wie bereits erwähnt, kann Ihr Bild auf dem kleineren Bildschirm abgeschnitten werden. In dem zuvor gezeigten Beispiel war das Bild zu niedrig, sodass Sie nur die obere Hälfte des Kopfes sehen konnten.
SMS und Messenger
Dies ist eine einfache Sache, indem Sie sich einen Text (oder eine Nachricht über einen Dienst wie WhatsApp) mit dem Link senden. Sie müssen sich keine Gedanken über ein Validierungswerkzeug machen. Wenn es in den Social-Media-Apps gut aussieht, sieht es hier wahrscheinlich gut aus.
Wenn Sie an Ihrer persönlichen Website arbeiten, möchten Sie auf jeden Fall, dass sie auf LinkedIn gut aussieht. Glücklicherweise, LinkedIn bietet auch ein Validierungswerkzeug rief den Postinspektor an. Außerdem müssen Sie sich keine Gedanken über weitere Meta-Tags machen, da LinkedIn die Tags von Facebook verwendet.
Woran soll ich als nächstes arbeiten?
Die Informationen, die wir behandelt haben, sollten ausreichen, um Ihnen den Einstieg zu erleichtern. Aber wenn Sie mehr erfahren möchten, schauen Sie sich das an Facebooks Leitfaden zu Tags oder Twitter-Seite über Tags.
Das Web ist voll von Tools, mit denen jeder seine eigenen professionell aussehenden, gemeinsam nutzbaren Bilder erstellen kann. Hier sind unsere Favoriten.
- Programmierung
- HTML
- Startseite
- Webmaster werkzeuge
Lee ist ein Vollzeitnomade und ein Polymath mit vielen Leidenschaften und Interessen. Einige dieser Leidenschaften drehen sich um Produktivität, persönliche Entwicklung und Schreiben.
Abonniere unseren Newsletter
Melden Sie sich für unseren Newsletter an, um technische Tipps, Rezensionen, kostenlose E-Books und exklusive Angebote zu erhalten!
Noch ein Schritt…!
Bitte bestätigen Sie Ihre E-Mail-Adresse in der E-Mail, die wir Ihnen gerade gesendet haben.