Farbverlauf
Markus
- grafik
Hallo!
Ich will in einem Frame ein Bild als Hintergrundbild einfügen, allerdings kommt dabei ein Farbverlauf (von rot nach weiss) vor...der dann web-optimiert ziemlich mies aussieht, gibt es da einen Trick?!
Hi,
der Trick lautet: Richtige Optimierung. Farbverläufe sollte man als jpeg speichern. Die richtige Komprimierung kannst du mit einem vernünftigen Grafikprogramm erreichen. :-) Ich gehe mal davon aus, du hattest das Bild als gif oder?
Gruß
Ben
Hi,
Farbverläufe sollte man als jpeg speichern.
Sollte man das wirklich? Ich würde PNG bevorzugen, weil aufgrund der verlustfreien Komprimierung die Qualität besser ist und man außerdem die Möglichkeit hat, Transparenz festzulegen.
Ich habe das Bild als Photoshop Datei zur Verfügung, also optimal, habs auch mit jpg versucht. Aber bin nicht zufrieden damit, denn der Verlauf ist immer noch sehr "balken-artig"...gibt´s da noch Tipps zur Optimierung?! bei png sehe ich keine Verbesserungen, ausser dass die Datei grösser wird:-))
Willst du uns die Datei eventuell mal zeigen?
Vielleicht auch gleich als .psd ;-)
Gruß
Phil
okay, soll ich die datei mailen oder kann ich die hier hinladen?!
das problem an dem spass ist nämlich, dass das weder horizontal noch vertikal ist, sondern der verlauf von links oben nach rechts unten gehen soll, grmpf:-)
Mahlzeit!
der verlauf von links oben nach rechts unten gehen soll
Dann solltest Du das Design überdenken... Für das Web ist dieser Art Verlauf ziemlich problematisch, weil dann meistens auf autom. Kachelung verzichtet werden muß und damit der Speicherbedarf enorm steigt. Jetzt verstehe ich auch, warum Du kein PNG verwenden willst. Welche Auflösung hat denn der Verlauf?
MfG
Danny
nunja ich hatte das ganze bild in 300dpi zur verfügung, habs natürlich runtergesetzt, wiel ich eben dacht, dass ich da eh nicht dran vorbeikomme....
kann ich dir da smal schicken? vielleicht mache ich einfach trotzdem einen horizontalen verlauf...als 1x1280px und setz es als hintergrundbild ein und die eigentliche grafik (die ja auch noch dazugehört), setze ich dann als transpar. gif rein...
Du kannst das Bild temporär auf Deinen Webspace laden und hier einen Link anbieten.
denkst du:-) ich bin seitgestern wieder am herumstreiten,weil mein provider schon wieder unsinn gemacht hat....und ich derzeit nix rauladen kann...alles ein jammer hehe
aber was anderes, ich bin mittlerweiel höchstzufrieden...also mein farbverlauf sieht nun spitze aus....nun hab ich nur noch dieses problem:
also als hintergrundbild hab ich hübsch meinen farbverlauf eingefügt, sehr fein!
den "rest" der grafik füge ich als trans. gif ein....sieht ja auch gut aus,weil alles hübsch freigestellt ist....aber in den frame soll jetzt aber auch noch rel. kleiner text...den ich nicht als bild einfügen kann, weils sonst mies aussieht...aber ich kann auch nicht den text auf mein trans. gif schreiben...bzw darauf eine tabelle machen und da den text einfügen:-((
Hallo.
aber in den frame soll jetzt aber auch noch rel. kleiner text...den ich nicht als bild einfügen kann, weils sonst mies aussieht...aber ich kann auch nicht den text auf mein trans. gif schreiben...bzw darauf eine tabelle machen und da den text einfügen:-((
Inwiefern sieht der grafische Text denn mies aus? Und warum sollte normaler Text nicht funktionieren?
MfG, at
sorry,kann erst jetzt antworten
naja wenn ich den text als grafik einfüge,dann sieht das immer mie saus,weil unscharf und ausgefranst...
aber ich kann ja nicht ein hintergrundbild im frame haben...dann über den ganzen frame drüber ein gif mit transparenz...und dort,wo das gif eben trans. ist,kann ich ja keinen text schreiben,weil der platz des <img> befehls ja auch da steht...kann ja nicht übers gif drüber schreiben oder?!
Hi,
naja wenn ich den text als grafik einfüge,dann sieht das immer mie saus,weil unscharf und ausgefranst...
Das stimmt schon mal nicht wirklich. Du kannst in jedem besseren Grafikprogramm sog. "Anti-Aliasing" einsetzten, wobei die Pixel rund um die Buchstaben abgerundet werden. Photoshop z.B. bietet einige Möglichkeiten, dies bei Texten zu steuern. Normalerweise kann man damit ziemlich scharfe und saubere Typografie erzeugen.
aber ich kann ja nicht ein hintergrundbild im frame haben...dann über den ganzen frame drüber ein gif mit transparenz...und dort,wo das gif eben trans. ist,kann ich ja keinen text schreiben,weil der platz des <img> befehls ja auch da steht...kann ja nicht übers gif
drüber schreiben oder?!
Das klingt alles furchtbar kompliziert. Viel zu kompliziert.
Warum verzichtest Du denn nicht komplett auf Frames? Dein Layout läßt sich dann viel leichter umsetzen. Du kannst übrigens auch CSS-Ebenen verwenden und sehr wohl einen Text übers GIF schreiben. Außerdem gibts es da noch die Möglichkeit, Hintergrund-Bilder einzusetzen...
MfG
Danny
hi
okay ich werd das mal versuchen mit dem anti aliasing....danke für den tip!!!
naja, hintergrundbild hab ich ja schon den farbverlauf...aber ich werd mal versuchen, ob ich das so schaffe...mit css ebenen kenne ich mich bisher gar nicht aus,aber werd ich mich wohl hier bei selfhtml schlau machen!!!
vielen,vielen dank!!
Okay, nix zu danken. Wünsche Dir viel Erfolg.
Bye
Hi,
der Verlauf ist immer noch sehr "balken-artig"...
dann hat das Bild oder der Monitor vermutlich eine zu geringe Farbtiefe. Ein Verlauf wird _nicht_ wie Du eingangs geschrieben hast "web-optimiert", sondern in höchster Qualität gespeichert; allenfalls eine Komprimierung ist in Grenzen möglich. Die Dateigröße sollte trotzdem noch tragbar sein, da man ja nur einen schmalen Streifen benötigt.
freundliche Grüße
Ingo
Hi,
wenn als PNG, dann speichere die Datei bloß nicht mit 256 Farben (PNG8). Bei Farbverläufen mußt Du immer TrueColor, bzw. 24bit (16 Mio. Farben) nehmen, sonst sind Balken natürlich vorprogrammmiert...
Die Größe (Maße) des Bildes sollte bei horizontalem Verlauf 1600 x 1 und bei vertikalem 1 x 1280 sein. Die Datei sollte dann weniger als 10 KB groß sein...
MfG
Danny
Hallo.
wenn als PNG, dann speichere die Datei bloß nicht mit 256 Farben (PNG8). Bei Farbverläufen mußt Du immer TrueColor, bzw. 24bit (16 Mio. Farben) nehmen, sonst sind Balken natürlich vorprogrammmiert...
Unsinn. Für einfache Farbverläufe reichen 256 Farben.
MfG, at
Hi,
nun gut, das mag sein. Aber ich selbst bin irgendwie kein Freund von png. Die Dateien werden dann, wie Markus ja auch schon angemerkt hat, immer recht groß.
Gruß
Ben
Die Dateien werden dann, wie Markus ja auch schon angemerkt hat, immer recht groß.
"Immer" möchte ich bezweifeln und durch "oft" austauschen. Ist klar, dass man Fotos normalerweise nicht als PNG speichert (es sei denn man benötigt einen Alpha-Kanal). Hier geht es ja "nur" um einen Farbverlauf der trotz PNG kaum mehr als 10 KB groß sein müßte.
MfG
Danny
Hi,
meines wissens keinen, außer das richtige Format wählen, ein gif wäre zum beispiel unangebracht.
Geht der Farbverlauf horzontal bzw. vertikal, und nicht schräg, reduzieren den farbverlauf auf einen Pixel Höhe, bzw. Breite. So ist er selbst bei schlechter Kompression schnell geladen.
Gruß
Phil
Hallo, Markus,
Ich will in einem Frame ein Bild als Hintergrundbild einfügen, allerdings kommt dabei ein Farbverlauf (von rot nach weiss) vor...der dann web-optimiert ziemlich mies aussieht, gibt es da einen Trick?!
mach's doch so ...
Für Ausgabegeräte mit hinreichender Farbtiefe schreibst Du den CSS-Stil per Javascript (document.write):
/* Internet Explorer */
body{filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FFFFFF', endColorStr='#999999', gradientType='1');}
/* andere Browser */
body{background: url(verlauf_999999_FFFFFF.gif);}
In allen anderen Fällen (256-Farben-Monitor) wird dann nur die im body angegebene Hintergrundfarbe (ohne Verlauf) dargestellt.
Das Bild mit dem Verlauf würde ich mindestens 1920 px breit (so große Displays gibt es schon) und mindestens 10 px hoch (damit es nicht zu oft gekachelt werden muß) machen.
Der per MS Filter erstellte Verlauf erstreckt sich im Gegensatz zu dem per Bild erzeugten übrigens immer über die gesamte Fensterbreite ...
Grüße,
Sebastian
Hi,
In allen anderen Fällen (256-Farben-Monitor) wird dann nur die im body angegebene Hintergrundfarbe (ohne Verlauf) dargestellt.
nö. Ich würde dann ohne Javascript trotz hoher Farbtiefe keinen Verlauf bekommen. Wenn schon, dann bitte die Grafik ggfls. über Javascript ersetzen.
freundliche Grüße
Ingo
Hi, Ingo
In allen anderen Fällen (256-Farben-Monitor) wird dann nur die im body angegebene Hintergrundfarbe (ohne Verlauf) dargestellt.
nö. Ich würde dann ohne Javascript trotz hoher Farbtiefe keinen Verlauf bekommen. Wenn schon, dann bitte die Grafik ggfls. über Javascript ersetzen.
Ist ja ein recht seltener Fall, und der Verlauf sollte zudem für die vorgeschlagene Lösung schon verzichtbar sein.
Selbstverständlich könnte man für Oberlehrer auch noch einen Noscript-Style definieren oder auf andere Weise das Anzeigen eines Verlaufs für Nicht-JavaScript-Browser sicherstellen.
Dann käme es allerdings wieder zu einer Stufenbildung, falls der Monitor nicht genügend Farben anzeigt, denn eine Farbtiefe-Überprüfung ist ja ohne JavaScript nicht möglich.
Allen kann man's eben selten 100%ig recht machen ...
Grüße,
Sebastian
Hallo.
Allen kann man's eben selten 100%ig recht machen ...
Aber Validität wäre schon einmal ein Anfang.
MfG, at