Wie erstelle ich ein Favicon?

Dies ist das Logo, das ich verwende, und es ist der PSA-Teil, den ich in ein Favicon umwandeln möchte.

Ich versuche, ein Favicon mit dem ersten Teil des Logos (PSA) für eine Website zu erstellen, die ich erstelle, aber ich bin ratlos, wie? Ich bin immer noch ein ziemlicher Anfänger, wenn es um Photoshop cc und Illustrator cc geht, daher ist jede Hilfe großartig.

Hallo Dominic, willkommen bei GD.SE. Ich will nicht unhöflich sein, aber hast du deine Frage gegoogelt? Der Begriff „Wie erstelle ich ein Favicon“ ergibt bei mir etwa 8 Millionen Ergebnisse. Bitte überprüfen Sie einige davon und bearbeiten Sie Ihre Frage mit Einzelheiten, wenn Sie an einem Teil nicht weiterkommen. Danke!
Hallo Vincent, tut mir leid, dass ich besser hätte suchen sollen. Ich werde dafür sorgen, dass es nicht wieder vorkommt.
Es ist in Ordnung, Sie müssen sich nicht so viel entschuldigen :) Wir verlangen jedoch etwas Rechercheaufwand für Ihre Fragen. Werfen Sie einen Blick auf die Tour und das Hilfezentrum, um besser zu verstehen, wie die Dinge hier funktionieren. Danke!

Antworten (3)

Im Photoshop:

Beginnen Sie mit dem Zuschneidewerkzeug, um es nur mit dem Kreis in ein Quadrat zu schneiden. Verzerren Sie es nicht, um es zu einem perfekten Kreis zu machen - lassen Sie es als Oval und haben Sie einfach zusätzlichen Platz an den Seiten. (Stellen Sie sicher, dass Sie eine Kopie der Originalvorlage speichern)

Verwenden Sie dann die Zauberstabauswahl, um das gesamte Weiß zu entfernen - machen Sie es transparent (Wenn Sie dies nicht tun, sieht es im Browser komisch aus (da die Farbe der meisten Browser nicht weiß ist).

Geben Sie hier die Bildbeschreibung ein

Beachten Sie, dass es möglicherweise besser aussieht, wenn Sie das Weiß innen und die Außenseite transparent lassen - das liegt an Ihnen.

Geben Sie hier die Bildbeschreibung ein

Ändern Sie dann die Größe des Bildes auf 16 x 16 Pixel oder möglicherweise höher . Lesen Sie mehr darüber auf Stack Overflow. .

Datei als PNG speichern (um die Transparenz zu erhalten - JPG und andere Formate reichen nicht aus)

Sie können dann ein Online-Tool verwenden, um Ihr PNG in ein Favicon umzuwandeln (einige der beliebten einfachen Website-Builder lassen Sie es einfach als PNG einfügen).

Erwähnenswert ist, dass einige Tools zum Erstellen von Websites es Ihnen ermöglichen, einfach ein hochauflösendes PNG des Favicons hochzuladen, und sie übernehmen die Skalierung für Sie – Sie laden einfach das Bild hoch und das System kümmert sich um den Rest.

Machen Sie es nicht selbst, besonders wenn Sie sich nicht sicher sind, wie Sie vorgehen sollen. Um vollständig kompatibel (und damit nützlich) zu sein, muss ein Favicon in einer Vielzahl von Formaten und Größen erstellt werden.

Ich würde empfehlen, eine Online-Lösung / einen Online-Generator wie https://realfavicongenerator.net/ zu verwenden, sobald Sie Ihr Bild erfolgreich zugeschnitten haben (mit einer der anderen Antworten). Eine andere Option wäre, dem (langen, inklusiven, mit Photoshop) Tutorial unter http://www.emergeinteractive.com/insights/detail/The-Essentials-of-FavIcons-in-2017 zu folgen

Weitere technische Details, die sich an Webmaster richten, gebe ich in einer anderen Antwort .

Verwenden Sie das Zuschneidewerkzeug in Photoshop und stellen Sie die Höhe und Breite so ein, wie Sie es benötigen, normalerweise 16 x 16, 50 x 50 oder 150 x 150. Dadurch wird das Schnittquadrat erstelltGeben Sie hier die Bildbeschreibung ein

Ziehen Sie das Bild nach rechts, sodass das Zuschneidequadrat links hineinpasstGeben Sie hier die Bildbeschreibung ein

Bild zuschneiden und als PNG speichernGeben Sie hier die Bildbeschreibung ein

Erledigt!

In Pixelgröße ist es (kann sein) 16x16 usw. ... aber in Wirklichkeit [in Bezug auf das Zuschneiden] ist es nur ein 1x1-Verhältnis und wird dann auf ein kleineres Bild skaliert.
Wie erstelle ich ein Favicon?
AntwortenHierDatenschutz-Bestimmungen1y, 0v