{"id":6084,"date":"2015-01-09T11:11:12","date_gmt":"2015-01-09T10:11:12","guid":{"rendered":"http:\/\/www.aquasoft.de\/blog\/de\/?p=4295"},"modified":"2018-11-05T10:41:02","modified_gmt":"2018-11-05T10:41:02","slug":"welche-farbe-hat-die-transparenz","status":"publish","type":"post","link":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/","title":{"rendered":"Welche Farbe hat die Transparenz?"},"content":{"rendered":"

Wenn ein Bild tranparente Teile hat, sind diese nicht zu sehen. Gut, darauf k\u00f6nnen wir uns sicher einigen. Aber auch wenn es so aussieht, das Bild hat dennoch kein Loch im Speicher. Da muss etwas sein, das dem Computer sagt, male hier bitte ein farbiges Pixel und dort bitte keines.<\/p>\n

Ein Bild ist im Arbeitsspeicher nichts anderes als eine Folge von Pixeln gespeichert. Dabei besteht jedes Pixel aus vier Elementen: Rot, Gr\u00fcn, Blau und Alpha. Die Farbe mischt sich aus den drei Farbkomponenten. Das Geheimnis der Transparenz liegt aber im Alpha. Dieser Wert gibt die Deckkraft eines Pixels an. 100% Alpha bedeutet, die Farbe hat 100% Deckkraft, 50% Alpha zeichnet die Farbe genau halbtransparent. 0% Alpha zeichnet den Pixel komplett transparent. Ja, Sie haben richtig gelesen. Er wird transparent gezeichnet! Auch wenn ein Bild nur aus einer Millionen komplett transparenter Pixel best\u00fcnde, m\u00fcsste jedes einzelne davon angeschaut, deren Alpha-Wert analysiert und entsprechend behandelt werden. Und was steht im Farbanteil eines transparenten Pixels? Eine Farbe nat\u00fcrlich und zumeist ist es auch egal, welche Farbe darin steht. Es k\u00f6nnte Wei\u00df sein, ein knalliges Rot, oft ist es Schwarz. Welche Farbe darin steht, ist abh\u00e4ngig vom dem Programm mit dem ein solches Bild erstellt oder wie es exportiert wurde. Man hat als Anwender darauf meist wenig Einfluss.<\/p>\n

Die Farbe eines transparenten Pixels sieht man doch nicht, warum ist Sie dennoch wichtig? Gut dass Sie fragen! Man sieht die Farbe nur nicht, wenn das Bild exakt so gro\u00df dargestellt wird, wie es ist. Sowie das Bild aber verkleinert oder vergr\u00f6\u00dfert wird, f\u00e4ngt es an schwierig zu werden. Nehmen wir einen einfachen Fall: Ein Bild soll mit 150% seiner Originalgr\u00f6\u00dfe dargestellt werden. Dann werden aus 2 Pixeln im Bild, 3 Pixel auf dem Bildschirm. Welche Farbe hat das dritte Pixel?<\/p>\n

\"Farbmischung<\/p>\n

Richtig, das neu enstandene dritte Pixel hat als Farbe den Mittelwert seiner Nachbarpixel. In dieser Darstellung habe ich den Alphawert ganz bewusst noch weggelassen. Die Farbwerte (abgek\u00fcrzt durch R, G, B) sehen in Zahlen etwa so aus:<\/p>\n

\"Farbmischung<\/p>\n

Sind die Farbkomponenten noch nicht gemischt, sondern einzeln visualisiert, s\u00e4he das ganze Bild so aus:<\/p>\n

\"Farbe<\/p>\n

Man kann auf diesem Bild gut sehen, wie die einzelnen Farbkomponenten ineinander \u00fcbergehen (z.B. Hellblau \u2192 Blau \u2192 Dunkelblau)<\/p>\n

Wie man sieht, wird hier jede Farbkomponente einzeln betrachtet, d.h. der Mittelwert zwischen den beiden Rotkomponenten, Gr\u00fcnkomponenten und Blaukomponenten berechnet. Was passiert nun mit dem Alpha? Genau das selbe nat\u00fcrlich! In den oberen Bildern w\u00e4re der Alpha-Wert 100% f\u00fcr beide Pixel und auch der mittlere neue Pixel h\u00e4tte damit 100%.<\/p>\n

Nun drehen wir aber die Transparenz des orangen\u00a0Pixels voll auf, d.h. den Alpha setzen wir auf 0%.<\/p>\n

\"Farbmischung<\/p>\n

Jetzt kommen wir zur urspr\u00fcngliche Frage zur\u00fcck. Welche Farbe hat die Transparenz? Nat\u00fcrlich Orange! \ud83d\ude09
\nWenn Sie auf die Farbwerte schauen, dann sehen Sie, dass diese immernoch die gleichen sind, wie in den oberen Bildern. Das Orange ist nur nicht zu sehen, weil es eben transparent ist. Man kann nun im rechten Teil des Bildes sehen, was beim Skalieren des Bildes passiert: Die Farbwerte werden gemischt wie eh und je. Damit rutscht nun der orange Farbton in den (nun halbtransparenten) mittleren Pixel mit hinein.<\/p>\n

\"Farbe<\/p>\n

Dieses Bild zeigt nun die finalen Werte nach der Skalierung.<\/p>\n

Jetzt haben Sie etwas \u00fcber die Theorie gelernt, aber was hat das nun f\u00fcr eine Bedeutung im Computeralltag? Kurze Antwort: Farbs\u00e4ume<\/strong> in freigestellten Bildern. Obwohl ein Bild in den freigestellten Bereichen unsichtbar sein sollte, enthalten diese Bereiche dennoch eine transparente Farbe, die sich beim Vergr\u00f6\u00dfern\/Verkleinern in die Nachbarfarben mischt und somit unerw\u00fcnschte Farbs\u00e4ume hinterl\u00e4sst. Ob man den Saum sieht, h\u00e4ngt oft auch davon ab, auf\u00a0welchem Hintergrund das freigestellte Bild angezeigt wird. Einen schwarzen Farbsaum sieht man auf dunklem Hintergrund evtl. gar nicht, einen wei\u00dfen daf\u00fcr deutlich.<\/p>\n

Wie kann man Farbs\u00e4ume vermeiden?<\/h2>\n

Kann man \u00fcberhaupt? Ja, man kann. In unserem Beispiel h\u00e4tte man das orange Pixel einfach blau f\u00e4rben k\u00f6nnen, denn dann h\u00e4tte sich der falsche Farbton nicht eingemischt. Aber wer wei\u00df denn, welche Farbe die richtig ist? Und bei einem realen Bild, sind es sowie sehr viele verschiedene Farben rund um die Kontur. Hier hilft ein kleines einfaches Tool namens „ColorBleeder“<\/a> von uns. Es l\u00e4sst die sichtbaren Farben einfach in den unsichtbaren Bereich auslaufen. Optisch macht das keinen Unterschied, beim Skalieren aber mischt sich nun nicht mehr irgendeine Farbe mit dem Bild, sondern die Farbe der Nachbarpixel.<\/p>\n

So kann ein Vorher-Nachher-Bild aussehen. Bitte beachten Sie, dass diese farbigen Muster nicht wirklich zu sehen sind, sondern sich komplett in den transparenten Bereichen des Bildes verstecken.<\/p>\n

\"ColorBleeder\"<\/p>\n

Laden Sie hier das Tool herunter<\/a>\u00a0(ca. 3 MB). Die Benutzung ist ganz einfach. Entpacken Sie die ZIP-Datei und starten Sie ColorBleeder.exe. Geben Sie die Dateinamen Ihrer PNG-Dateidatei bei Quelldatei<\/em> ein und bei Zieldatei<\/em> den Namen unter dem die angepasste Version gespeichert werden soll. Achtung: Passen Sie auf, dass Sie Ihr Original nicht \u00fcberschreiben. Ein Klick auf „Start“ erzeugt das Zielbild. Die Berechnung kann je nach Bildgr\u00f6\u00dfe einige Sekunden dauern.<\/p>\n

K\u00f6nnte man die Farbs\u00e4ume beim Skalieren verhindern, wenn man anders rechnet?<\/h2>\n

Oha, hier hat jemand weit mitgedacht! Nat\u00fcrlich k\u00f6nnte man und macht man auch. Nur ist die Formel f\u00fcr die Verrechnung der einzelnen Pixel deutlich komplexer und damit dauert die Berechnung viel l\u00e4nger. Daher arbeiten die meisten Programme und auch die Hardware der Grafikkarten intern mit dem einfacheren Algorithmus, eben aus Geschwindigkeitsgr\u00fcnden. Insbesondere weil die Grafikhardware so rechnet, k\u00f6nnen wir relativ wenig gegen diese Artefakte tun.<\/p>\n","protected":false},"excerpt":{"rendered":"

Wenn ein Bild tranparente Teile hat, sind diese nicht zu sehen. Gut, darauf k\u00f6nnen wir uns sicher einigen. Aber auch wenn es so aussieht, das Bild hat dennoch kein Loch im Speicher. Da muss etwas sein, das dem Computer sagt, male hier bitte ein farbiges Pixel und dort bitte keines.<\/p>\n","protected":false},"author":4,"featured_media":6893,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[92418],"tags":[],"yoast_head":"\nWelche Farbe hat die Transparenz? - Videobearbeitung Tipps & Tricks - AquaSoft Blog<\/title>\n<meta name=\"description\" content=\"Wenn ein Bild tranparente Teile hat, sind diese nicht zu sehen. Aber was sagt dem Computer, male hier bitte ein farbiges Pixel und dort bitte keines?\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Welche Farbe hat die Transparenz? - Videobearbeitung Tipps & Tricks - AquaSoft Blog\" \/>\n<meta property=\"og:description\" content=\"Wenn ein Bild tranparente Teile hat, sind diese nicht zu sehen. Aber was sagt dem Computer, male hier bitte ein farbiges Pixel und dort bitte keines?\" \/>\n<meta property=\"og:url\" content=\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/\" \/>\n<meta property=\"og:site_name\" content=\"Videobearbeitung Tipps & Tricks - AquaSoft Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/aquasoft.de\" \/>\n<meta property=\"article:published_time\" content=\"2015-01-09T10:11:12+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2018-11-05T10:41:02+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1440\" \/>\n\t<meta property=\"og:image:height\" content=\"680\" \/>\n<meta name=\"twitter:card\" content=\"summary\" \/>\n<meta name=\"twitter:creator\" content=\"@AquaSoft_DE\" \/>\n<meta name=\"twitter:site\" content=\"@AquaSoft_DE\" \/>\n<meta name=\"twitter:label1\" content=\"Gesch\u00e4tzte Lesezeit\">\n\t<meta name=\"twitter:data1\" content=\"5\u00a0Minuten\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/#organization\",\"name\":\"AquaSoft\",\"url\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/\",\"sameAs\":[\"https:\/\/www.facebook.com\/aquasoft.de\",\"https:\/\/www.youtube.com\/user\/aquasoftgmbh\",\"https:\/\/twitter.com\/AquaSoft_DE\"],\"logo\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/#logo\",\"inLanguage\":\"de\",\"url\":\"https:\/\/www.aquasoft.de\/blog\/hilfe\/files\/2014\/07\/Logo-Quadrat.png\",\"contentUrl\":\"https:\/\/www.aquasoft.de\/blog\/hilfe\/files\/2014\/07\/Logo-Quadrat.png\",\"width\":180,\"height\":180,\"caption\":\"AquaSoft\"},\"image\":{\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/#logo\"}},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/#website\",\"url\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/\",\"name\":\"Videobearbeitung Tipps & Tricks - AquaSoft Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"de\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/#primaryimage\",\"inLanguage\":\"de\",\"url\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz.jpg\",\"contentUrl\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz.jpg\",\"width\":1440,\"height\":680,\"caption\":\"Welche Farbe hat die Transparenz?\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/#webpage\",\"url\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/\",\"name\":\"Welche Farbe hat die Transparenz? - Videobearbeitung Tipps & Tricks - AquaSoft Blog\",\"isPartOf\":{\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/#primaryimage\"},\"datePublished\":\"2015-01-09T10:11:12+00:00\",\"dateModified\":\"2018-11-05T10:41:02+00:00\",\"description\":\"Wenn ein Bild tranparente Teile hat, sind diese nicht zu sehen. Aber was sagt dem Computer, male hier bitte ein farbiges Pixel und dort bitte keines?\",\"breadcrumb\":{\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"item\":{\"@type\":\"WebPage\",\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/\",\"url\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/\",\"name\":\"Startseite\"}},{\"@type\":\"ListItem\",\"position\":2,\"item\":{\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/#webpage\"}}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/#webpage\"},\"author\":{\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/#\/schema\/person\/f78e223989d85e590ba66ac37aaf83aa\"},\"headline\":\"Welche Farbe hat die Transparenz?\",\"datePublished\":\"2015-01-09T10:11:12+00:00\",\"dateModified\":\"2018-11-05T10:41:02+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/#webpage\"},\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/#organization\"},\"image\":{\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/#primaryimage\"},\"articleSection\":[\"DiaShow\"],\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/welche-farbe-hat-die-transparenz\/#respond\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/#\/schema\/person\/f78e223989d85e590ba66ac37aaf83aa\",\"name\":\"Steffen Binas\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/#personlogo\",\"inLanguage\":\"de\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/78de40128567a355a071c279f48e57e5?s=96&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/78de40128567a355a071c279f48e57e5?s=96&r=g\",\"caption\":\"Steffen Binas\"},\"sameAs\":[\"http:\/\/www.aquasoft.de\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","uagb_featured_image_src":{"full":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz.jpg",1440,680,false],"thumbnail":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz-150x150.jpg",150,150,true],"medium":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz-300x142.jpg",300,142,true],"medium_large":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz-768x363.jpg",768,363,true],"large":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz-1024x484.jpg",1024,484,true],"1536x1536":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz.jpg",1440,680,false],"2048x2048":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz.jpg",1440,680,false],"thumb-small":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz-160x160.jpg",80,80,true],"thumb-standard":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz-320x320.jpg",320,320,true],"thumb-medium":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz-520x245.jpg",520,245,true],"thumb-large":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz-720x340.jpg",720,340,true],"thumb-xlarge":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz.jpg",953,450,false],"thumb-xxlarge":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz.jpg",1059,500,false],"yarpp-thumbnail":["https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/files\/2015\/01\/welche-farbe-hat-die-transparenz.jpg",120,57,false]},"uagb_author_info":{"display_name":"Steffen Binas","author_link":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/author\/steffenbinas\/"},"uagb_comment_info":5,"uagb_excerpt":"Wenn ein Bild tranparente Teile hat, sind diese nicht zu sehen. Gut, darauf k\u00f6nnen wir uns sicher einigen. Aber auch wenn es so aussieht, das Bild hat dennoch kein Loch im Speicher. Da muss etwas sein, das dem Computer sagt, male hier bitte ein farbiges Pixel und dort bitte keines.","_links":{"self":[{"href":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/wp-json\/wp\/v2\/posts\/6084"}],"collection":[{"href":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/wp-json\/wp\/v2\/comments?post=6084"}],"version-history":[{"count":2,"href":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/wp-json\/wp\/v2\/posts\/6084\/revisions"}],"predecessor-version":[{"id":6895,"href":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/wp-json\/wp\/v2\/posts\/6084\/revisions\/6895"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/wp-json\/wp\/v2\/media\/6893"}],"wp:attachment":[{"href":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/wp-json\/wp\/v2\/media?parent=6084"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/wp-json\/wp\/v2\/categories?post=6084"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogneu.aquasoft.de\/blog\/hilfe\/wp-json\/wp\/v2\/tags?post=6084"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}