Websichere Farbe finden

Computer: Software & Programmierung HTML & CSS
#1

Hallo,

ich hatte einen wunderschönen grünen Rahmen erstellt, habe aber leider beim hochladen online festgestellt, dass die Farbe nicht websicher ist. Sie fällt intensiver und greller aus als gewünscht.

Ich suche ein gedämpftes grün.

Ich habe an verschiedenen Stellen Listen websicherer Farben gefunden, z. B.

http://www.design-literatur.de/blog/wp-content/html-…

Aber ich brauche nicht den 6-stelligen Wert sondern das rgb(150, 220, 50)

Gibt es irgendwo eine Übersetzung?

Oder kann mir jemand diese Farbe rgb(150, 220, 50), die bei mir auf dem PC schön ist, im Web aber zu intensiv und grell umändern in irgendwas, das websicher ist? Etwas blasser und grün bis grau-grün.

Die ganze Passage geht

Text

Aus einer grünen Eingabe werden dann also zwei grüne Farben und was ich derzeit habe ist online unschön.

Stephanie

#2

Moin,

Aber ich brauche nicht den 6-stelligen Wert sondern das
rgb(150, 220, 50)

Das ist doch auch sechsstellig. Die ersten zwei Stellen geben den Wert für Rot, die beiden nächsten den für grün, die letzten beiden den für blau an. Nur eben in hexadezimal, nicht dezimal.
150, 220, 50 wäre also #96DC32.

Gibt es irgendwo eine Übersetzung?

Dezimal in Hexadezimal und umgekehrt.

Oder kann mir jemand diese Farbe rgb(150, 220, 50), die bei
mir auf dem PC schön ist,

Das entscheidende ist doch „bei mir auf dem PC“. Du wirst keine Gewissheit bekommen, dass die Farbe bei anderen genauso aussieht. Verschiedene Monitore haben verschiedene Bildqualität und dann bieten sie auch noch die Möglichkeit für den Nutzer, die Einstellungen zu ändern.

Meines Wissens muss man heute nicht mehr auf websichere Farben achten, aber ich lasse mich gerne belehren.

Text

Wozu brauchst Du zur Auszeichnung von Text eine Tabelle? Sind das tabellarische Daten oder kennst Du nur das Tag für „Textabsatz“ nicht?

Aus einer grünen Eingabe werden dann also zwei grüne Farben
und was ich derzeit habe ist online unschön.

Huh?

Liebe Grüße,
-Efchen

#3

Im Jahr 2009 …
… und bei Graphikkarten mit bis zu 32 bit Farbtiefe sind „websafe colors“ überhaupt keine Thema mehr.

Problem ist bei Bildschirmen, wie bei Fernsehern, dass die nicht farbig (im Sinne von wirklichkeitsgetreuer Farbwiedergabe) sondern bunt (im Sinne von irgendwie farbig, wenn auch nicht so wie es in Wirklichkeit ist) sind.

Daneben gibt es heftige Unterschiede zwischen der klassischen Röhrenglotze und den Flachglotzen.

Schau dir mal meine Basis-Homepage auf einem Röhrenbildschirm in 5600 K an, warme Sandtöne. Schau sie dir auf der Werkeinstellung der meisten Flachbildschirme an, eigenartiges Pink.

Damit wirst du leben müssen und bei der Farbgestaltung auf mehreren Bildschirmen Testen müssen und einen Kompromist aussuchen müssen.

ich hatte einen wunderschönen grünen Rahmen erstellt, habe
aber leider beim hochladen online festgestellt, dass die Farbe
nicht websicher ist. Sie fällt intensiver und greller aus als
gewünscht.

Dann gibt es noch das Problem, dass bei starker Datenreduktion JPG nicht mehr farbecht ist.

Aber ich brauche nicht den 6-stelligen Wert sondern das
rgb(150, 220, 50)

Warum? Du kannst RGB-Farbangaben in CSS sowohl in dezimal wie in hex machen:

http://de.selfhtml.org/css/formate/wertzuweisung.htm…

Gruß

Stefan

#4

Hallo,

Aber ich brauche nicht den 6-stelligen Wert sondern das
rgb(150, 220, 50)

Das ist doch auch sechsstellig.

Genau genommen sind 3x3 9 Stellen plus Satzzeichen…

150, 220, 50 wäre also #96DC32.

Danke.

Da meine HTML Kenntnisse eher beschränkt sind habe ich mit Hilfe meines WYSIWYG Programms KompoZer jetzt Helligkeit und Intensität verringert und bin gelandet bei
#9ECA60

Stefan, danke für den Link

style="border-color: #9ECA60;
und
style="border-color: rgb(158, 202, 96);

funktioneieren beide gleich gut, KompoZer hatte das gleich in die untere Version umgewandelt.

Text

Wozu brauchst Du zur Auszeichnung von Text eine Tabelle? Sind
das tabellarische Daten oder kennst Du nur das Tag für
„Textabsatz“ nicht?

?
Das ist ein grüner Rahmen um meinen Text. Oben hellgrün unten dunkelgrün.

Eine Tabelle ist für Rahmen und Hintergrund zwingend erforderlich. Der Text wird in ein Feld auf eine Webseite eingefügt, den Rest der Webseite und insbesondere den Head kann ich nicht beeinflussen.

Wäre irgendwer noch mal so freundlich zu testen

Text

ob das Ergebnis bei euch wie bei mir oben gedämpftes blassgrün unten dunkelgrün ergibt? Leider habe ich keinen anderen Test Monitor und es wäre mir unlieb, wenn Standard Monitore daraus pink machen würden, wie Stefan sagte dass es bei ihm passiert.

Stephanie

#5

Text

Wozu brauchst Du zur Auszeichnung von Text eine Tabelle? Sind
das tabellarische Daten oder kennst Du nur das Tag für
„Textabsatz“ nicht?

?
Das ist ein grüner Rahmen um meinen Text. Oben hellgrün unten
dunkelgrün.

Nein, das ist der Inhalt „Text“, den Du als tabellarische Daten deklariert hast, was offensichtlich falsch ist.

Eine Tabelle ist für Rahmen und Hintergrund zwingend
erforderlich.

Nein, natürlich nicht. Wer Dir das erzählt hat, hat entweder keine Ahnung oder er lügt. Eine Tabelle ist ein semantisches Mittel, Rahmen und Hintergrund sind optische Mittel. Das sind zwei völlig unterschiedliche Dinge!

Wenn Du Denen Inhalt als Tabelle auszeichnest, dann vermittelst Du jeglichen Clients, die die Struktur Deiner Seiten untersuchen (Vorlesebrowser und Suchmaschinen zum Beispiel), dass da jetzt tabellarsiche Daten kommen.

Du musst in HTML Deinen Inhalt so beschreiben, wie er gedacht ist, ihm eine logische Bedeutung verpassen. Dazu ist HTML schließlich da, nicht aber um damit das Aussehen zu machen. Dazu ist CSS da.

Un um einem Element einen Rahmen und einen Hintergrund zu verpassen, braucht es keine Tabelle, das geht selbstverständlich in jedem Element. Immerhin kommt es bei der Wahl des richtigen HTML-Tags ja nicht auf das spätere Aussehen an.

Der Text wird in ein Feld auf eine Webseite
eingefügt, den Rest der Webseite und insbesondere den Head
kann ich nicht beeinflussen.

Sicher kannst Du das. Das kann man immer. Im Zweifelsfalle, indem man das Programm, das einem versucht, weis zu machen, dass man das nicht ändern kann, zu ersetzen.

Liebe Grüße,
-Efchen

1 Like
#6

Hallo,

Nein, das ist der Inhalt „Text“, den Du als tabellarische
Daten deklariert hast, was offensichtlich falsch ist.

OK, das hier
Text

macht einen Rahmen plus innere schwarze Linie um den Text.

Das hier

Text

Macht einen Rahmen ohne zusätzliche schwarze Innenlinie. Die Linie gefiel mir eigentlich ganz gut.

Der Text wird in ein Feld auf eine Webseite
eingefügt, den Rest der Webseite und insbesondere den Head
kann ich nicht beeinflussen.

Sicher kannst Du das. Das kann man immer. Im Zweifelsfalle,
indem man das Programm, das einem versucht, weis zu machen,
dass man das nicht ändern kann, zu ersetzen.

Soweit war ich nur auf mein grün fixiert. Aber wenn ihr mir noch weitere Alternativen vorschlagen möchtet:

Ich will einen grünen Rahmen und hellen Hintergrund für das Feld Artikelbeschreibung bei ebay.

Dazu sind mir folgende Lösungen bekannt: Tabelle oder Div Container. Wenn man einen div Container nimmt, muss man dann als nächstes beginnen den Rahmen zu schreiben, da erschien mir Tabelle einfacher.

Mit Java Script könnte man theoretisch auch einiges machen, die Verwendung von Java Script ist aber nur in Ausnahmefällen erlaubt. Keinesfalls darf das Javascript Elemente außerhalb des Feldes Artikelbeschreibung beeinflussen.

Falls jemand Lust hat mir ein besseres, alternativen Rahmen Script zu schreiben, gerne. Ansonsten bleibt es beim Tabellenrahmen.

Stephanie

#7

OK, das hier

Text

macht einen Rahmen plus innere schwarze Linie um den Text.

Nein, in erster Linie deklariert es „Text“ als „tabellarische Daten“, und das ist falsch. Dein HTML-Code ist sinnfrei und falsch. Dass dieses falsch eingesetzte Tag dennoch den gewünschten optischen Effekt hat, bestreite ich nicht, aber es ist eben nicht nur sinnfrei und falsch, sondern auch völlig unnötig.

Das hier

Text

Macht einen Rahmen ohne zusätzliche schwarze Innenlinie. Die
Linie gefiel mir eigentlich ganz gut.

Das wiederum ist syntaktisch sogar völlig falsch und jegliche optische Ausgabe die dadurch erzeugt wird, ist undefiniert und kann in jedem Browser anders aussehen.

Aber bei HTML geht es eben nicht um das Aussehen sondern um die Semantik.

Ich will einen grünen Rahmen und hellen Hintergrund für das
Feld Artikelbeschreibung bei ebay.

border:1px solid green;
background-color:???

für das entsprechende HTML-Element.

Bei ebay wird vermutlich sogar auch eine Tabelle eingesetzt. Tja, „never change a running system“. Deswegen heißt das nicht, dass das richtig ist.

Dazu sind mir folgende Lösungen bekannt: Tabelle oder Div
Container.

Beides Quatsch. Wenn Du das Aussehen beeinflussen willst, benutzt Du dafür CSS und änderst das entsprechende Element. Welches Element das ist, hängt keineswegs vom Aussehen ab. Eine Tabelle ist dazu da, tabellarische Daten auszuzeichnen (z.B. eine Fußballtabelle) und das allgemeine Block-Element ist dazu da, MEHRERE Elemente zu GRUPPIEREN. Beide Elemente - wie auch alle anderen HTML-Tags - sind nicht dazu da, das Aussehen zu beeinflussen.

Du wählst auch nicht eine andere Fremdsprache, um über ein anderes Thema zu sprechen.

Wenn man einen div Container nimmt, muss man dann
als nächstes beginnen den Rahmen zu schreiben, da erschien mir
Tabelle einfacher.

Verstehe Deine Argumentation nicht.
Aber im Sinne von HTML ist beides falsch.
Aber bei ebay gelten eben nicht die Gesetze der Physik.

Mit Java Script könnte man theoretisch auch einiges machen,

aber nur wenn die Nutzer auch JavaScript aktiviert haben.

Falls jemand Lust hat mir ein besseres, alternativen Rahmen
Script zu schreiben, gerne. Ansonsten bleibt es beim
Tabellenrahmen.

Dein Problem ist, dass Du nur in ebay tätig bist. Da gelten die normalen Regeln der Web-Entwicklung offensichtlich nicht. Wenn dann irgendwas nicht funktioniert an der eigenen Auktion, dann wird die Verantwortlichkeit einfach auf ebay geschoben oder man verkauft halt einfach nichts.

Mit Web-Entwicklung - aus der meine Einwände kommen - hat das nichts mehr zu tun. Ich hoffe nur, solltest Du jemals echte Websites schreiben wollen, dass Du Dich von diesem grundlegenden Unfug lösen kannst.

Dir weiter irgendwas über HTML erzählen zu wollen, ist so gesehen wahrscheinlich sinnlos.

Liebe Grüße,
-Efchen

#8

Hallo,

Dir weiter irgendwas über HTML erzählen zu wollen, ist so
gesehen wahrscheinlich sinnlos.

ganz recht, mit mir über die theoretischen Hintergründe und Ästhetik von HTML und CSS zu diskutieren ist völlig sinnlos, da ich nur einen Basis und Anfänger Wissensstand habe.

Wenn du mir fertig übernehmbare Alternative anbieten möchtest, würde ich die gerne nutzen. Mein Ziel ist optisch ein 1 cm breiter Rahmen, zentriert und 100 % des verfügbaren Platzes.
Mit Textabstand zum Rahmen optisch ca. 0,5 cm.
Mein Rahmengrün #9ECA60 wird derzeit aufteilt in hellgrün oben und dunkelgrün unten oder diese grüns wären auch gut hellgrün CAE8BB dunkelgrün 336600
Hintergundfarbe #FFFFF2

Stephanie

#9

Hallo,

nachdem meine Tabelle so heftig bekrittelt wurde, bin ich noch mal Alternativen suchen gegangen und habe tatsächlich etwas gefunden.

Für den Rahmen

Textabsatz
mit Rahmendicke 12px und Typ inset.

Und für den Hintergrund

.gelbbox { background-color:#FFFFF2; padding:20px; margin:0px; }

gelber text gelber text gelber text

Wie man die beiden zusammen wurstelt ist mir noch nicht ganz klar.
So ist es wohl noch nicht ganz richtig

.gelbbox { background-color:#FFFFF2; padding:20px; margin:0px; } gelber text gelber text gelber text

Da ich jetzt den grundlegenden Befehl hervorgesucht hat, hat noch jemand Nerv sich ans Verbessern zu machen?

Stephanie

#10

Hallo Stephanie,

sollte der schwarze Text auf gelben Grund in der Box sein? Dann wäre die Kombination etwa so (hab das Gelb etwas stärker gemacht):

schwarzer text gelber hintergrund gelber text ist anders

Du hast zwar beide Informationen in eine Datei gepackt, aber nur hintereinandergeschrieben. Also einmal eine Kiste mit grünem Rand, einmal Text mir gelben Hintergrund. Genau das ist dabei auch rausgekommen.

An der Stelle muss ich Efchen mal das Wort reden. HTML und CSS haben zwei verschiedene Aufgaben und gehören getrennt. Man kann dieses Mischmasch in einer Datei machen, es ist aber weder der Übersichtlichkeit noch dem Verständnis zuträglich. Wenn Du grundsätzlich Spaß an so etwas hast, dann empfehle ich Dir ein Tutorial mit dem Du die Grundlagen erlernen kannst. Lernwillig bist Du ja ganz offensichtlich.

Gruß

osmodius

1 Like
#11

Hallo,

sollte der schwarze Text auf gelben Grund in der Box sein?

Ja genau.

Evtl. etwas längerer Text also kann der Hintergrund ruhig unauffällig pergament blass sein mit #FFFFF2. Nur durchgehend weißen Hintergrund mag ich auf meinen Seiten nicht gerne, ich finde das sieht hart und kalt aus.

schwarzer text
gelber hintergrund gelber text ist anders

Super vielen Dank! Alles in einem.

Text mit Strg c Strg v einfügen klappt auch wie gewohnt. Das ist gut, der Rahmen bleibt, der Text darin wechselt öfters.

Enter produziert allerdings in KompoZer eine zweite Tabelle statt eine neue Zeile. Für eine neue Zeile muss ich ein Bracket setzen.
Warum enter da keine neue Zeile produziert verstehe ich nicht.

Wenn Du grundsätzlich Spaß an so etwas hast, dann empfehle ich
Dir ein Tutorial mit dem Du die Grundlagen erlernen kannst.

Ein bischen Spaß, ein Gelegenheits-Hobby, etwa einmal monatlich nehme ich eine kleine Verbesserung an einer Webseite vor und lerne ein oder zwei neue HTML oder CSS Befehle. Die ganze Sprache samt Syntax zu lernen, lohnt sich bei mir nicht, wenn ich das so selten benutze, das vergesse ich sonst nur.

Stephanie

#12

Moin,

Wenn Du grundsätzlich Spaß an so etwas hast, dann empfehle ich
Dir ein Tutorial mit dem Du die Grundlagen erlernen kannst.
Lernwillig bist Du ja ganz offensichtlich.

So würde ich ja normalerweise auch reden. Aber da es hier ja wohl um ebay Auktionen geht, bei der sie keinen Zugriff auf die eigentliche Seite hat, sondern nur auf einen Teil des bodys wird es zwangsläufig damit enden, dass ganz grundlegende HTML-Regeln über den Haufen geschmissen werden MÜSSEN, weil man es sonst nicht umsetzen könnte, z.B. ein -Block innerhalb des <body> statt des <head>.

#13

Hallo,

Enter produziert allerdings in KompoZer eine zweite Tabelle
statt eine neue Zeile. Für eine neue Zeile muss ich ein
Bracket setzen.
Warum enter da keine neue Zeile produziert verstehe ich nicht.

Ist halt ein schlechtes Programm, dass für die Erstellung von Webseiten eigentlich nicht geeignet ist. Das ist leider die Mehrheit dieser Programme - sie erzeugen schlechten und oft sogar falschen Code, der nur zufälligerweise funktioniert.

Ein bischen Spaß, ein Gelegenheits-Hobby, etwa einmal
monatlich nehme ich eine kleine Verbesserung an einer Webseite
vor und lerne ein oder zwei neue HTML oder CSS Befehle.

Das kann nicht sein, denn weder HTML noch CSS sind Programmiersprachen. Und Befehle gibts es nämlich nur bei diesen. In HTML spricht man von Tags, in CSS von Eigenschaften.

Die
ganze Sprache samt Syntax zu lernen, lohnt sich bei mir nicht,

Wenn Du eine echte Website hast, also nicht nur Angebote bei ebay, dann ist es unerlässlich, dass Du HTML & CSS lernst, denn das bist Du als Anbieter eines weltweiten Services Deinen Besuchern schuldig.

wenn ich das so selten benutze, das vergesse ich sonst nur.

Dann solltest Du Deine Website von jemandem machen lassen, der ein Ergebnis erzeugen und Deine Site warten kann, so dass Deine Besucher zufrieden sein können.

Liebe Grüße,
-Efchen

P.S.: Wenn Du Deinen Herd nicht selbst anschließen kannst, lässt Du auch einen Elektriker kommen und sagst nicht „Ach ich mach das einfach mal selbst, die Fachrichtung zu lernen würde nichts helfen, da ich das sowieso nur vergesse.“

#14

Hallo,

habe es jetzt ein paar Mal benutzt

schwarzer
text gelber hintergrund gelber text ist anders

und es klappt super, nochmals danke.

Mir ist jetzt auch das Problem mit Enter eingefallen, dann beginnt man offenbar einen neuen Paragraph p statt Bracket br. Auf Enter zu drücken muss ich mir noch abgewöhnen.

Für die Syntax Puristen sei noch gesagt: da habe ich tatsächlich wenig Gelegenheit zur Anwendung. Ich benutzte etwas HTML oder CSS im Body bei ebay und BCC Code im Body von zwei anderen Seiten, meine ganz eigene Internetseite ist erstmal verstaubt in die Ecke abgeschoben, da ich gerade anderes zu tun habe…

Bisher habe ich meinen Erfolg mit HTML oder CSS Befehlen einzig daran gemessen ob es so aussieht, wie ich plante. Aber ihr habt recht, wenn der verwurschtelte Code die Fuktionalität der Seite beeinträchtigt geht das zu weit.

Stephanie

#15

beginnt man offenbar einen neuen Paragraph p statt Bracket br.

Jett verstehe ich… „bracket“ heißt auf Deutsch „Klammer“. Das Tag
steht aber nicht für Klammer, sondern für „break“ = „Zeilenumbruch“.

Für die Syntax Puristen sei noch gesagt

Das ist aber keine Krankheit, sondern das, was man beim Erstellen von Websites wissen muss, auch wenn das viele Anbieter minderwertiger „Homepage-Baukästen“ gerne so verkaufen.

Bisher habe ich meinen Erfolg mit HTML oder CSS Befehlen

Es gibt Befehle nur bei Programmiersprachen. Weder HTML noch CSS sind welche.

einzig daran gemessen ob es so aussieht, wie ich plante.

HTML aber hat nichts damit zu tun, wie etwas aussehen soll. Dafür st allein CSS da. Mit HTML legt man die logische Struktur des Inhalts fest.

Aber
ihr habt recht, wenn der verwurschtelte Code die Fuktionalität
der Seite beeinträchtigt geht das zu weit.

Suchmaschinen verstehen den Inhalt dann nicht richtig, Vorlesebrowser lesen den Inhalt falsch vor. Das ist ein KO-Kriterium für eine Website, die von Besuchern benutzt werden soll.

Liebe Grüße,
-Efchen

#16

Hallo,

beginnt man offenbar einen neuen Paragraph p statt Bracket br.

Jett verstehe ich… „bracket“ heißt auf Deutsch „Klammer“.
Das Tag
steht aber nicht für Klammer, sondern für „break“
= „Zeilenumbruch“.

Huch, ja, falsch übersetzt.

Es gibt Befehle nur bei Programmiersprachen. Weder HTML noch
CSS sind welche.

einzig daran gemessen ob es so aussieht, wie ich plante.

HTML aber hat nichts damit zu tun, wie etwas aussehen soll.
Dafür st allein CSS da. Mit HTML legt man die logische
Struktur des Inhalts fest.

Hmpf, ja, ich habe soweit nur festgestellt dass
Text
Text
Text
Alle ungefähr das gleiche machen, Tag mit Befehl gleichgesetzt und keine weiteren Unterscheidungen getroffen :smile:
Außer das b /b offenbar auch auf dieser Seite des Text fett macht, das hatte ich bisher noch nicht probiert.

Aber
ihr habt recht, wenn der verwurschtelte Code die Funktionalität
der Seite beeinträchtigt geht das zu weit.

Suchmaschinen verstehen den Inhalt dann nicht richtig,
Vorlesebrowser lesen den Inhalt falsch vor. Das ist ein
KO-Kriterium für eine Website, die von Besuchern benutzt
werden soll.

Ja, das ist ein hervorragendes Argument besser aufzupassen, was man schreibt.

Stephanie

#17

Hmpf, ja, ich habe soweit nur festgestellt dass
Text
Text
Text
Alle ungefähr das gleiche machen

Tun sie ja gar nicht.
**und sind nur physische Inhaltsauszeichnung und werden daher in HTML nicht mehr benutzt. Nur die zweite Lösung ist richtig.
Je nachdem, welchen Zweck das fett darstellen erfüllen soll, ist aber auch alles falsch, nämlich wenn das fett ausgeben bedeuten soll, dass „Text“ *wichtig* ist. Denn dann muss es mit ausgezeichnet werden, wenn es *sehr wichtig* sein soll, mit .
Außerdem ist in CSS nicht festgelegt, wie die Elemente dargestellt werden, es ist also völlig legitim, dass die drei Tags oben in einem Browser alle drei unterschiedlich dargestellt wird. Nur das zweite wird immer fett dargestellt.
In CSS gilt, dass nur die Eigenschaften, die Du explizit setzt, Dir auch zugesichert werden.

Tag mit Befehl gleichgesetzt

Geht nicht. Sind zwei völlig unterschiedliche Dinge. Du setzt auch nicht Äpfel mit Birnen gleich.

Grüße,
-Efchen**