Speichern Sie eine Vektorform mit Transparenz mit einem sauberen Umriss in Photoshop?

Das Problem, das ich habe, ist, dass, nachdem ich eine 16 x 16 Pixel große Vektorform (Kreis) mit transparentem Hintergrund gezeichnet habe, alles an der Form so ist, wie ich es brauche, außer dass das Anti-Aliasing auf dem Bild das Bild macht sehen gezackt aus, wenn der Hintergrund nicht weiß ist.

Soweit ich das beurteilen kann, speichere ich das Bild beim Speichern des Bildes in Adobe Photoshop möglicherweise falsch im Dialogfeld "Für Web speichern". Das gewünschte Ergebnis ist eine 16 x 16 (px) große Vektorform mit transparentem Hintergrund (damit sie über einem Farbverlauf schweben kann, wenn das Bild auf einer Webseite platziert wird). Dieses Bild kann .gif oder .png sein, ich nehme beides.

Schritte zum Wiederherstellen:

  1. Öffnen Sie Photoshop
  2. Neues Dokument erstellen
  3. Neue Ebene hinzufügen
  4. Löschen Sie die Hintergrundebene
  5. Wählen Sie das Ellipsenwerkzeug (nicht das Elliptical Marquee Tool)
  6. Klicken Sie mit der linken Maustaste und ziehen Sie auf der Leinwand
  7. Geben Sie 16px für Höhe und Breite in das sich öffnende Dialogfeld ein
  8. Klicken Sie auf Ok, und die Eigenschaften für die gerade hinzugefügte Vektorform sehen so aus:Formeigenschaften
  9. Klicken Sie mit der rechten Maustaste auf die Form im Canvas und wählen Sie sie ausMake Selection
  10. Lassen Sie Feder auf "0" und aktivieren Anti-AliasedSie , klicken Sie auf Ok.
  11. Wählen Sie im ImageMenü ausCrop
  12. Öffnen Sie das Dialogfeld "Für Web speichern" (Strg + Umschalt + Alt + s)
  13. Das Folgende ist eines der über 20 Einstellungsmuster, die ich ausprobiert habe:png Muster für Webeinstellungen speichern
  14. Überprüfen Sie das gespeicherte Bild:Endbild, sieht überhaupt nicht wie ein glatter Kreis aus

Wie wir sehen können, ist dieses letzte Bild kein glatter Kreis, ich kann den gezackten Rand des Bildes anscheinend nicht glätten. Meine anderen Versuche sind glatt, aber leider bleibt das Anti-Aliasing nicht transparent und ähnelt einem weißen, matten Rand. Wenn also der Hintergrund, auf dem ich dieses Bild platziere, weiß ist, sieht alles gut aus, aber das Ziel hier ist, dieses Bild zu platzieren über einem dunklen Hintergrund mit Farbverlauf.

Hilfe wäre willkommen.

Antworten (1)

Sie möchten im zweiten Dropdown-Menü PNG-24 auswählen:

Geben Sie hier die Bildbeschreibung ein

Ihr Punkt sollte wie im Beispiel rechts hier aussehen:

Geben Sie hier die Bildbeschreibung ein

Ich bin keine Autorität im PNG-Dateiformat (Portable Network Graphic), aber ich werde erklären, was ich darüber weiß.

Ein 8-Bit-PNG ist auf 256 Farben beschränkt, während 24-Bit bis zu 16 Millionen Farben haben kann.

Meine Beobachtung ist, dass Sie bei Transparenz den größten Qualitätsverlust feststellen, da Sie in einer 8-Bit-PNG-Datei nur zwei Deckkraftstufen haben, in einer 24-Bit-Datei jedoch nahezu unbegrenzte Stufen.

Dies ist die richtige Antwort, aber es wäre für mehr Menschen hilfreicher, wenn Sie erklären würden, warum PNG-8 das Problem verursacht und warum PNG-24 es behandelt.
Das mache ich bei nächster Gelegenheit.
Maaaan, Circle B ist mit diesen Circle-Antworten wieder am Start!
Ich versuche nur, Kreise um dich herum zu drehen!
Eine Anmerkung: Sie können mehrere Transparenzebenen im PNG-Bild haben. Aber Adobe Photoshop kann dies nicht für Sie tun.