• Aktualisierte Forenregeln

    Eine kleine Änderung hat es im Bereich Forenregeln unter Abschnitt 2 gegeben, wo wir nun explizit darauf verweisen, dass Forenkommentare in unserer Heftrubrik Leserbriefe landen können.

    Forenregeln


    Vielen Dank

Bilder mit runden Ecken herstellen (fürs Web)

Worrel

Spiele-Guru
Mitglied seit
22.03.2001
Beiträge
25.103
Reaktionspunkte
10.315
Bilder mit runden Ecken herstellen (fürs Web)

Hallo.

Ich erstelle zur Zeit eine Webseite mit runden Ecken. ^^

Daher müßten die Bilder auch runde Ecken haben.
Bei den bisherigen Bildern war ein schwarzer Hintergrund vorhanden, also habe ich einen Viertelkreis in der darüberliegenden Ebene in die Ecke gelegt und alles dahinter schwarz gemalt - das klappt auch perfekt.

Das Problem: Jetzt habe ich Ecken vor einem helleren Hintergrund - und daher bräuchte ich transparente Ecken.
Wie krieg ich jetzt die transparenten quasi Antialiasmäßig ausgeschnitten?

Transparenz + Format an sich ist nicht das Problem - das krieg ich mit .PNG Dateien hin. Bloß: Wie erzeuge ich die halbtransparenten Pixel, so daß das nicht so ausgeffranst ausseiht wie bei .GIFs?
 
AW: Bilder mit runden Ecken herstellen (fürs Web)

Mit GIMP:

- das ganze Bild markieren ( Menü "Auswahl" -> "Alles auswählen")
- die Ecken abrunden ( Menü "Auswahl" -> "Anbgerundete Ecken")
- in die Schnellmaske umschalten ( Menü "Auswahl" -> "Schnellmaske umschalten" oder im Zeichenfenszter links unten das Icon anklicken)
- die Ecken weichzeichnen ( Menü "Filter" -> "Weichzeichnen" -> "Gaußscher Weichzeichner")

Die Werte für die runden Ecken und den Weichzeichner sind abhängig von der Größe des Bildes.
 
AW: Bilder mit runden Ecken herstellen (fürs Web)

Eol_Ruin am 09.08.2008 22:48 schrieb:
Mit GIMP:

- das ganze Bild markieren ( Menü "Auswahl" -> "Alles auswählen")
- die Ecken abrunden ( Menü "Auswahl" -> "Anbgerundete Ecken")
- in die Schnellmaske umschalten ( Menü "Auswahl" -> "Schnellmaske umschalten" oder im Zeichenfenster links unten das Icon anklicken)
- die Ecken weichzeichnen ( Menü "Filter" -> "Weichzeichnen" -> "Gaußscher Weichzeichner")

Die Werte für die runden Ecken und den Weichzeichner sind abhängig von der Größe des Bildes.
Danke schonmal - eine anleitung für Paint Shop Pro hast du nicht zufällig ?

edit

Hmm, funktioniert nicht ..

Es gibt nur "angerundetes Rechteck" und beim "Schnellmaske umschalten" per Menü wird dann die Auswahl aufgehoben ...

Beim umschalten per Icon wird danach das ganze Bild weichgezeichnet ...
 
AW: Bilder mit runden Ecken herstellen (fürs Web)

Worrel am 09.08.2008 23:10 schrieb:
Hmm, funktioniert nicht ..

Es gibt nur "angerundetes Rechteck" und beim "Schnellmaske umschalten" per Menü wird dann die Auswahl aufgehoben ...

Beim umschalten per Icon wird danach das ganze Bild weichgezeichnet ...

Ja - heißt "abgerundetes Rechteck",

Und bei schnellmaske wird nicht die auswahl aufgehoben sondern das was "nicht rot" ist ist dann die Auswahl - Dann kann man die Auswahl bearbeiten (pinsel etc...) und danach wieder mit "schnellmaske umschalten" zurückschalten.
 
AW: Bilder mit runden Ecken herstellen (fürs Web)

Eol_Ruin am 09.08.2008 23:58 schrieb:
Worrel am 09.08.2008 23:10 schrieb:
Hmm, funktioniert nicht ..

Es gibt nur "angerundetes Rechteck" und beim "Schnellmaske umschalten" per Menü wird dann die Auswahl aufgehoben ...

Beim umschalten per Icon wird danach das ganze Bild weichgezeichnet ...

Ja - heißt "abgerundetes Rechteck",

Und bei schnellmaske wird nicht die auswahl aufgehoben sondern das was "nicht rot" ist ist dann die Auswahl - Dann kann man die Auswahl bearbeiten (pinsel etc...) und danach wieder mit "schnellmaske umschalten" zurückschalten.
Da ist aber gar nichts rot bei mir ...

Hab's inzwischen aber in PSP gefunden: Unter "Auswahl > Ändern > Glätten" kann man die Ecken abrunden.

Danke nochmal für deine Hilfe =)
 
AW: Bilder mit runden Ecken herstellen (fürs Web)

"Paint Shop Pro"? :B

Also ich kann dir sagen wie es in Photoshop funktioniert.

Nimm eine neue Ebene, Zeichne ein Rechteck hinein, Auswahlwerkzeug/Rechtsklick/Kannten verbessern/Abrunden/Auswahl umkehren/Löschen.
Dann hast du ein Bild mit runden Ecken.

Format für Tranzparents bei Webdesigns -> IMMER PNG-24

Wäre in PS
Speichern für Web und Geräte/PNG-24/Speichern/Fertig

Zu doof das du kein Photoshop hast :-D
 
AW: Bilder mit runden Ecken herstellen (fürs Web)

Hachse86 am 10.08.2008 23:11 schrieb:
Zu doof das du kein Photoshop hast :-D
Ist ja auch das günstigste Progi auf dem Markt, gelle.
Oder meinst du PS-Elements?
 
AW: Bilder mit runden Ecken herstellen (fürs Web)

Hachse86 am 10.08.2008 23:11 schrieb:
"Paint Shop Pro"? :B
Was hast du gegen PSP ? :confused:
Bis auf das extrem langsame Verarbeiten von großen Textblöcken (zB Liedtext auf CD Cover - Farbe ändern) kann ich in meiner langjährigen PSP Nutzung keine Nachteile finden ...

... Format für Transparents bei Webdesigns -> IMMER PNG-24
Schon klar - das war nicht das Problem - das Problem war das "Antialiasing" an den Ecken.
Aber das hatte ich ja inzwischen schon rausgefunden:
[q= Worrel]Hab's inzwischen aber in PSP gefunden: Unter "Auswahl > Ändern > Glätten" kann man die Ecken abrunden.[/quote]

Zu doof das du kein Photoshop hast :-D
Da bei Photoshop schon das Upgrade dreimal soviel kostet wie ein komplettes PSP, kannst du dir ja denken, wieso ich zweiteres verwende ...
 
Zurück