it-swarm.com.de

Sollte der Firmenname im Logo ein Bild oder ein Text sein?

Ich platziere ein Logo (bestehend aus einem Bild und einem Firmennamen) auf meiner Website. Ich bin nicht sicher, ob ich den Firmennamentext als Teil einer Bilddatei oder als eigentlichen Text in HTML speichern und mit CSS formatieren soll.

Wenn ich alles als Bild speichere, muss ich mir natürlich keine Sorgen machen, dass der Benutzer die richtigen Schriftarten usw. hat. Aber ich dachte, dass es für SEO besser sein könnte, sie als Text zu haben.

Ist das Geschmackssache oder ist der eine Weg viel besser als der andere?

11
user1551817

Google mag das alt-Attribut der Firma

Sowohl Google als auch Bing wissen, dass ein Logo in PNG, GIF und JPEG häufig wiederholt wird. Markieren Sie einfach das Logo mit der Alternativbeschreibung, um Suchmaschinen darüber zu informieren, dass es sich bei LOGO um Ihr Unternehmen handelt.

Ein einfaches Beispiel:

<img src="logo.png" alt="Company Name Logo">

Ein Schema-Beispiel:

<div itemscope itemtype="http://schema.org/Organization">
  <a itemprop="url" href="http://www.example.com/">Home</a>
  <img itemprop="logo" src="http://www.example.com/logo.png" alt="Company Name Logo"/>
</div>

Ein Beispiel für ein JavaScript-Schema:

Wenn Sie Ihren Code einfach halten möchten, verwenden Sie das JSON-LD-Schema, da Sie dann niemals den Seitencode bearbeiten müssen, sondern einen Code am Ende Ihrer Seite hinzufügen oder den Google Tag Manager zum Einfügen in die Seite verwenden, ohne einen Finger zu rühren.

z.B

<img src="logo.png" alt="Company Name Logo">
<script type="application/ld+json">
  {
  "@context": "http://schema.org/",
  "@type": "Organization",
  "url": "http://www.example.com/",
  "logo": "http://www.example.com/logo.png"
  }
</script>

Google mag auch SVG-Logos

Wenn Google oder Bing Ihren Firmennamen im Bild sehen soll, können Sie dies im SVG-Format tun. In diesem Format können Sie TEXT innerhalb des Bildes verwenden, das von Benutzern und Suchmaschinen angezeigt wird. Wenn die Zugänglichkeit ein Problem darstellt, sollten Sie den Firmennamen als TEXT und nicht als Form beibehalten, z. B. Konturen erstellen.

zum Beispiel so etwas:

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 500 500" enable-background="new 0 0 500 500" xml:space="preserve">
    <polygon fill="#998675" points="125,466.5 0,250 125,33.5 375,33.5 500,250 375,466.5 "/>
    <rect x="137.5" y="137.5" fill="#534741" width="225" height="225"/>
    <polygon fill="#C7B299" points="250,175 294.1,189.3 321.3,226.8 321.3,273.2 294.1,310.7 250,325 205.9,310.7 178.7,273.2 178.7,226.8 205.9,189.3 "/>
    <text transform="matrix(1 0 0 1 196.3787 253.5039)" font-family="'Montserrat-Bold'" font-size="12">COMPANY NAME</text>
</svg>

Google mag keine von CSS gehackten Logos

Suchmaschinen mögen keine Logos, die mit Tricks oder Ähnlichem angezeigt werden, wie z. B. text-indent e.g -9999px; background: url(logo.png) no-repeat;. Hintergründe sollten immer als Hintergrund verwendet werden. Wenn es sich um ein Ressourcenelement auf der Seite handelt, ist es immer ein Bild und niemals ein Hintergrund. Verwenden Sie die beiden vorherigen Beispiele und nicht dieses. Dies war früher nützlich, wurde aber mit dem verfügbaren Markup nicht mehr benötigt.

Diese Methode ist auch für die Barrierefreiheit (behinderte Benutzer) nicht geeignet.

9
Simon Hayter

Da der Text Teil des Logos ist, würde ich ihn im Bild behalten (spart den Versuch, nicht standardmäßige Schriftarten zuzuordnen und ihn genau so zu positionieren, wie er im Logo ist) - Sie können ihn immer in das alt-Attribut einfügen Oder verwenden Sie Mikrodaten, um Ihr SEO zu verbessern:

<div id="main-logo-holder" itemscope itemtype="http://schema.org/Organization">
  <meta itemprop="name" content="Company Name">
  <meta itemprop="description" content="Company Description">
  <a itemprop="url" id="logo-home" href="https://www.website.co.uk/" class="main-logo">
    <img itemprop="logo" src="logo.jpg" alt="Company Name Logo">
  </a>
</div>

Weitere Informationen zu Organisationsmikrodaten

Google Microdata Validation Tool

Google-Richtlinien für Logo-Markups

17
Pete