Tipps

wordpress website icon

Deshalb ein WordPress Website-Icon!

 Mit dem WordPress Update 4.3 „Billie“ ist es Benutzern nun fernab von Plug-ins direkt im Backend möglich, Website-Icons hinzuzufügen. Wie genau das funktioniert und was ein Website-Icon eigentlich besonders macht, erklären wir Ihnen in diesem Beitrag.

Was sind Website-Icons?

Website-Icons sind ein kleiner und praktischer Zusatz für Ihre Website, der ihr einen spürbaren Wiedererkennungswert gibt. Im Browser sorgen Icons (auch Favicons genannt) in den Tabs dafür, dass wir schnell wissen, wo wir welche Inhalte geöffnet haben. Als Lesezeichen abgespeichert, prägen sich Besucher die Website-Icons schnell ein und wissen, welcher Website, welches Icon besitzt. Es ist also sehr empfehlenswert, das eigene Logo angepasst als Icon zu nutzen und so einen Wiedererkennungswert bei seinen Besuchern zu schaffen.

Website Icons

Aber auch für mobile Benutzer, die Ihre Website regelmäßig über ihr Smartphone erreichen wollen, ist das Website-Icon von Vorteil. Legen regelmäßige Besucher Ihrer Website Ihre Website auf ihrem Home-Bildschirm als Icon ab, um jederzeit einen schnellen Zugriff zu haben, können Sie mit dem Website-Icon das Aussehen professionalisieren.

Apple-Touch-Icon-für-Elbnetz

Und so geht es

Um nun Ihrer eigenen Seite dieses kleine Extra zu verpassen, müssen Sie dank des neuen Updates von WordPress gar nicht mehr viel unternehmen. Zunächst suchen Sie die zentrale Anpassungsfunktion in WordPress auf. Diese erreichen Sie entweder, indem Sie in der Hauptebene der Toolbar auf „Anpassen“ klicken, oder im Backend unter Design → Anpassen aufsuchen. Beides erfordert wenige Klicks.
Das Dashboard und der Weg zum Anpassen

“Anpassen” im Backend

Nun befinden Sie sich bei den Anpassungsfunktionen. Da es hier um ein Icon für die Website geht, ist diese Einstellung unter den Website-Informationen zu finden.
Bei den Anpassugen

Die “Anpassen”-Oberfläche

In diesem Bereich können Sie den Titel der Website, einen Untertitel und wie erwartet das Website-Icon anpassen. Hier wählen Sie nun „Datei auswählen“.

Bei den Website-Informationen

Die Website-Informationen

Das folgende Fenster ist das Bildupload-Fenster, in welchem Sie mehrere Dinge beachten sollten. Zunächst werden Sie darauf hingewiesen, dass das Bild, welches Sie hochladen, nicht kleiner als 512px (Höhe und Breite) sein darf, größer ist hingegen in Ordnung. Achten Sie auf die Datengröße Ihrer Datei.
Der Bilduploadbereich

Das “Datei auswählen” Fenster

Nun haben Sie drei Möglichkeiten Ihr Bild hochzuladen:

  1. Sie haben es zuvor in die Mediathek geladen und müssen es nun nur noch auswählen.
  2. Sie ziehen es aus Ihrem Ordner per Drag-and-Drop in dieses Fenster.
  3. Sie wählen das Bild nach einem Klick auf den „Dateien auswählen“ Button in Ihrem Ordner aus.

Das Icon anpassen

Zuschneide-Optionen für das Icon

Ist das soeben gewählte Bild größer als 512px zu 512px, gibt Ihnen WordPress nun die Möglichkeit, einen passenden Bildausschnitt für Ihr Website-Icon aus diesem Bild auszusuchen. Rechts erhalten Sie bereits eine Vorschau Ihres Icons, wie es als Browser und als App-Icon bei iOS/Android erscheinen wird. Sobald Sie zufrieden mit dieser Vorschau sind, dürfen Sie gerne auf „Bild zuschneiden“ klicken.

Nun erscheint Ihr Website-Icon auch unter Website-Informationen. Zu guter letzt drücken Sie auf „Speichern & Publizieren“ und Ihr Icon erscheint Ihren Besucher.

Das Icon veröffentlichen

Speichern und Publizieren

Ein Extra: Das Add to home screen WP Plugin

Die Nachricht auf einem SmartphoneDa Sie nun ein funktionierendes Website-Icon besitzen, welches auch von mobilen Benutzern als Home-Bildschirm Icon verwendet werden kann, zeigen wir Ihnen hier noch ein sehr praktisches Plug-in, welches gut in Verbindung mit der neuen Funktion von WordPress funktioniert. Das „Add to home screen WP Plug-i“ sorgt dafür, dass die mobilen Besucher Ihrer Website aufgefordert werden, diese als Icon zum Hauptbildschirm ihres Smartphones hinzuzufügen.
Installieren Sie das Plug-in bei WordPress und aktivieren es. Das ist alles, was Sie unternehmen müssen, damit diese Funktion auf Ihrer Website ermöglicht ist. Im Dashboard → Plug-ins → Installierte Plug-ins können Sie bei dem neuen Plug-in natürlich noch Änderungen an den Optionen vornehmen, damit diese Aufforderung Ihren Wünschen entspricht.
Wer braucht jetzt noch eine eigene App?

turned_in_notBenutzerfreundlichkeit

1 Kommentar. Wir freuen uns über Ihren Kommentar

Wir freuen uns über Ihren Kommentar!

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Fill out this field
Fill out this field
Bitte geben Sie eine gültige E-Mail-Adresse ein.
You need to agree with the terms to proceed

expand_less
Elbnetz GmbH hat 4,96 von 5 Sternen 50 Bewertungen auf ProvenExpert.com