So erstellen Sie ein gestochen scharfes Favicon

Ich versuche seit einiger Zeit, ein Favicon für meine Website zu erstellen, und ich bekomme es nicht scharf. Es ist ein einfaches Favicon. Das ist das Beste, was ich machen konnte,Geben Sie hier die Bildbeschreibung ein

Das W wird nicht knackig. Ist dieses Favicon gut genug für Webstandards? Wie kann ich es verbessern?

Ich habe kürzlich hier einen sehr interessanten und informativen Artikel über Favicons gelesen: jonathantneal.com/blog/understand-the-favicon
Was genau meinst du mit "knackig"? Können Sie ein Beispiel für ein "knackiges" Favicon zeigen? Das Symbol, das Sie gepostet haben, sieht mit 16 x 16 Pixeln so scharf aus, wie es nur sein kann. Sie könnten es noch schärfer aussehen lassen, indem Sie das Anti-Aliasing entfernen, aber das würde es auch pixelig aussehen lassen.

Antworten (3)

Das Schwierige an Favicons ist, dass sie winzig klein sind (nun, während das klassische Favicon 16 x 16 Pixel groß war, können Sie jetzt 24 x 24 Pixel verwenden. Immer noch ziemlich klein).

Aus diesem Grund und wie es bei der Arbeit mit kleinen Symbolen im Allgemeinen der Fall ist, müssen Sie Pixel für Pixel eine Version davon erstellen. Skalierung geht einfach nicht. Überprüfen Sie diese verwandte Frage:

Tools oder Methoden zur Optimierung des Favicon-Erscheinungsbilds?

Microsoft empfiehlt, ein 16x16-Pixel- und ein 24x24-Pixel-Favicon einzufügen (wenn die systemweite DPI-Einstellung des Benutzers höher als 100 % ist).

Ich finde es persönlich nützlich, mit einem Tool zu arbeiten, mit dem ich während der Arbeit eine Vorschau des Symbols sehen kann . Ich benutze eine Online-App namens favicon.cc . Sie können ein Bild hochladen und dann die Pixel manuell anpassen, während Sie sich eine Vorschau ansehen:

Geben Sie hier die Bildbeschreibung ein

Das .ico-Dateiformat kann viele Größen des Symbols enthalten - der springende Punkt dabei ist, dass das Programm die beste Übereinstimmung anzeigt. Mac-Programme enthalten Symbole bis zu 1024 Pixel.

Jedes Symbol, das kleiner als 32 x 32 ist, erfordert jedoch normalerweise einige manuelle Anpassungen. Sie erhalten keine guten Ergebnisse, wenn Sie mit einem großen Vektorbild beginnen und es vom Programm verkleinern lassen. Sie müssen die Skalierungsgröße beginnend mit der ursprünglichen Vektorgrafik festlegen, sie in eine Rasterebene konvertieren und dann das Bild manuell anpassen. Bei einer Größe von 16 x 16 (Standard-Websymbol) werden Sie wahrscheinlich jedes Pixel von Hand bearbeiten - das dauert nicht lange, es gibt nur 256 davon. Antialiasing ist möglich, um die Zacken zu beseitigen, aber Sie werden dies auch manuell tun. Es ist einfach nicht genug Platz, damit die üblichen Algorithmen richtig funktionieren.

Heutzutage sind viele Geräte verfügbar. Vor diesem Hintergrund werden viele Favicon-Größen benötigt.

Wenn Sie davon sprechen, dass es auf bestimmten Geräten gestochen scharf ist und auf anderen nicht, müssen Sie alle verwendeten Größen implementieren, um ein gestochen scharfes Favicon auf allen Browsern und Displays zu haben.

Wenn Sie über die Schärfe eines 16 x 16-Symbols sprechen, kommt es auf die Fähigkeit an, es zu entwerfen. Der beste Weg ist, hineinzuzoomen, das Stiftwerkzeug auszuwählen und mit der Bearbeitung dieser Pixel zu beginnen. Auf diese Weise könnten Sie die dünnen Linien des W aufpeppen.

So erstellen Sie ein gestochen scharfes Favicon
AntwortenHierDatenschutz-Bestimmungen1y, 0v