Light-on-Dark-Farbschema

Dunkles Thema für Gnom
Versionen einer Website im normalen Anzeigemodus (links) und im Dunklen Modus (rechts)

Light-on-Dark-Farbschema -auch genannt Schwarzer Modus, Dunkler Modus, Dunkles Thema, Nacht-Modus, oder Light-out (Modus)- ist ein Farbschema Das verwendet helle Text, Symbole und Grafische Benutzeroberflächenelemente auf dunklen Hintergrund. Es wird oft in Bezug auf Computer diskutiert Benutzeroberfläche Design und Web-Design. Viele moderne Websites und Betriebssysteme bieten dem Benutzer einen optionalen Light-on-Dark-Display-Modus.

Einige Benutzer finden den dunklen Modus, der visuell ansprechender anzeigt, und behaupten, dass er sich verringern kann Überanstrengung der Augen.[1] Das Anzeigen von Weiß auf volle Helligkeit verbraucht ungefähr sechsmal so viel Kraft wie reines Schwarz auf einem 2016 Google Pixel, was eine hat OLED -Anzeige.[2] Wie konventionell LED -Anzeigen kann nicht von reduziertem Stromkonsruption profitieren.[3] Die meisten modernen Betriebssysteme unterstützen ein optionales Light-on-Dark-Farbschema.[4]

Geschichte

Das Zork Videospiel, das auf einem Green-on-Black-CRT-Display ausgeführt wird

Die Vorgänger moderner Computerbildschirme wie Kathoden-Ray-Oszillographen, Oszilloskope usw. neigten dazu, Diagramme zu zeichnen und andere Inhalte als leuchtende Spuren auf einem schwarzen Hintergrund einzuführen.

Mit der Einführung von Computerbildschirmen wurden ursprünglich Benutzeroberflächen gebildet CRTS wie die für Oszillographien oder Oszilloskope. Das Phosphor war normalerweise eine sehr dunkle Farbe und leuchtete hell, wenn die Elektronenstrahl Schlagen Sie es und scheinen auf schwarzem Hintergrund weiß, grün, blau oder bernsteinhaft zu sein, abhängig von Phosphoren, die auf a angewendet werden einfarbig Bildschirm. RGB Die Bildschirme funktionierten weiterhin ähnlich, wobei alle Strahlen auf "On" eingestellt wurden, um Weiß zu bilden.

Mit dem Aufkommen von TeletetextEs wurden Forschungen durchgeführt, in die primäre und sekundäre Lichtfarben und Kombinationen für dieses neue Medium am besten funktionierten.[5] Cyan oder Gelb auf Schwarz wurde typischerweise aus einer Palette aus Schwarz, Rot, Grün, Gelb, Blau, Magenta, Cyan und Weiß optimal befunden.

Das entgegengesetzte Farbsatz, a Dark-on-Light-Farbschemawurde ursprünglich in eingeführt in Wysiwyg Textverarbeitungen Tinte auf Papier simulieren und zur Norm wurden.

Anfang 2018 erweiterte Designer Sylvain Boyer das Dark -Modus -Konzept auf die Kernschnittstelle von Smartphones mit OLED -Bildschirmen, um Stromverbrauch zu sparen.[6][7]

Die 2016 Windows 10 Jubiläumsaktualisierung war der erste der beliebten Desktop-Betriebssysteme, die nativ einen Light-on-Dark-Modus umfassten. Im Jahr 2018 folgte Apple in macOS 10.14. Im September 2019, iOS 13 und Android 10 Beide führten dunkle Modi ein.

Feuerfuchs und Chrom haben optionales dunkles Thema für alle internen Bildschirme. Es wird auch für Entwickler von Drittanbietern möglich sein, ihre eigenen dunklen Themen umzusetzen.[8]

Im Jahr 2019 wurde eine Option "bevorzugte Farben-Scheme" erstellt Front-End-Webentwickler, sein CSS Eigenschaft, die die Wahl eines Benutzers für ihr System signalisiert, ein helles oder dunkles Farbthema zu verwenden.[9]

Energieverbrauch

Licht auf dunklen Farbschemata erfordern weniger Energie zum Anzeigen OLED Anzeigen. Dies wirkt sich positiv auf die Batterielebensdauer und den Energieverbrauch aus.[10]

Während ein OLED rund 40% der Leistung eines LCD verbraucht, das ein hauptsächlich schwarzes Bild anzeigt, kann er mehr als dreimal so viel Kraft verwenden, um ein Bild mit einem weißen Hintergrund wie einem Dokument oder einer Website anzuzeigen.[11] Dies kann zu einer verminderten Akkulaufzeit und Energieverbrauch führen, es sei denn, ein Leuchtdunk-Farbschema wird verwendet. Der langfristige reduzierte Stromverbrauch kann auch die Akkulaufzeit oder die Nutzungsdauer des Displays und der Batterie verlängern.

Die Energieeinsparungen, die mit einem Light-on-Dark-Farbschema erzielt werden können, sind darauf zurückzuführen, wie OLED-Bildschirme funktionieren: In einem OLED-Bildschirm erzeugt jedes Subpixel ein eigenes Licht und verbraucht nur Strom bei Licht. Dies steht im Gegensatz dazu, wie ein LCD funktioniert: In einem LCD blockieren oder lassen Sie in einem LCD entweder ein Licht von einem immer auf (lit). LED-Hintergrundbeleuchtung passieren.

"Amoliert Schwarze "Farbschemata, die reines Schwarz anstelle von dunkelgrau verwenden) sparen nicht unbedingt mehr Energie als andere Farbschemata, die dunkelgrau anstelle von Schwarz verwenden, da der Stromverbrauch auf einem AMOLED-Bildschirm proportional zum Durchschnitt abnimmt Helligkeit der angezeigten Pixel. Obwohl es wahr ist, dass AMOLED Schwarz mehr Energie als dunkelgrau spart, sind die zusätzlichen Energieeinsparungen häufig vernachlässigbar; AMOLED SCHWARZ wird nur eine zusätzliche Energieeinsparung von weniger als 1%ergeben, zum Beispiel über die Dunkelheit Gray, das im dunklen Thema für Googles offizielle Android -Apps verwendet wird.[12] Im November 2018, Google bestätigte, dass der dunkle Modus auf Android die Akkulaufzeit sparte.[13]

Probleme mit dem Web

Einige argumentieren, dass a Farbschema Mit hellem Text auf einem dunklen Hintergrund ist auf dem Bildschirm leichter zu lesen, da die niedrigere Gesamthelligkeit weniger Augen verursacht. Andere[14][15][16] im Gegenteil argumentieren. Die Einschränkung ist, dass die meisten Seiten auf der Netz sind für weiße Hintergründe ausgelegt; GIF und Png Bilder mit einem Transparenzbit anstelle von Alpha -Kanäle Tendieren Sie mit abgehackten Umrissen und verursachen Probleme mit anderen grafischen Elementen.

Da ist ein bevorzugt die Farbscheme Medienfunktion auf CSS, um festzustellen, ob der Benutzer helles oder dunkles Farbschema angefordert hat und das angeforderte Farbschema serviert. Es kann durch die Betriebssystempräferenz des Benutzers oder a angegeben werden User-Agent.[9][17]

CSS -Beispiel:

@Medien (bevorzugt die Farbscheme: dunkel) {  Karosserie {  Farbe: #CCC;  Hintergrund: #222;  } } 

JavaScript -Beispiel:[18]

wenn (Fenster.MatchMedia("(bevorzugt Farbscheme: Dunkel)").Streichhölzer) {  dunkel(); } 

Siehe auch

Verweise

  1. ^ "Der dunkle Modus ist für Ihre Augen und Ihre Batterie einfacher". 21. November 2018.
  2. ^ Emily Price (11. November 2018). "Verwenden Sie den Dark -Modus, um die Batterieleistung Ihres Telefons zu erhalten.". Lifehacker. Abgerufen 20. März, 2021.
  3. ^ EFERTE, Henriette; Kristallovich, Felix (2020). Der Aufstieg des Dunklen Modus: Eine qualitative Untersuchung eines aufstrebenden Trends der Benutzeroberflächendesign.
  4. ^ David Murphy. "Umarmen Sie das Böse, indem Sie den dunklen Modus in jeder App aktivieren". Lifehacker. Abgerufen 15. November, 2020.
  5. ^ Petterson, Rune (März 1985). "Verwendung von Farben in TeleText und Videotex". ResearchGate.{{}}: CS1 Wartung: URL-Status (Link)
  6. ^ Wilson, Mark. "Diese Smartphone -Benutzeroberfläche spart Ihren Akku (und sieht edel aus)" ". Schnelle Firma.
  7. ^ Duong, Amy. "Sylvain Boyer entwirft das Friendlui -Telefon mit organischen Elementen". Trendjäger.
  8. ^ Porter, Jon (3. Juni 2019). "Der dunkle Modus kommt zu iOS 13". Der Verge. Abgerufen 5. Juni, 2019.
  9. ^ a b "bevorzugt Farbschema-CSS: Cascading-Stilblätter | Mdn". MDN Web Docs. Abgerufen 18. März, 2021.{{}}: CS1 Wartung: URL-Status (Link)
  10. ^ Gottsegen, Gordon. "Die Verwendung von Androids dunklem Modus verbessert die Akkulaufzeit, bestätigt Google". CNET.
  11. ^ Stokes, Jon. (2009-08-11) In diesem September nicht mehr "drei bis fünf Jahre entfernt", "nicht mehr" Archiviert 2012-01-25 bei der Wayback -Maschine. Arstechnica.com. Abgerufen 2011-10-04.
  12. ^ Raga, Dylan (27. Juni 2019). "Nein", "Amoled Black" spart nicht mehr Batterie als dunkelgrau. ". Xda.
  13. ^ Welch, Chris (2. November 2018). "Google bestätigt, dass der Dark -Modus eine große Hilfe für die Akkulaufzeit von Android ist". Der Verge.
  14. ^ "Love Dark Modus? Hier ist, warum Sie es vielleicht noch vermeiden möchten.". Android Autorität. 29. Juni 2020. Abgerufen 12. September, 2020.
  15. ^ Clarke, Laurie (30. Juli 2019). "Der dunkle Modus ist nicht so gut für Ihre Augen, wie Sie glauben". Wired UK. ISSN 1357-0978. Abgerufen 12. September, 2020.
  16. ^ Budiu, Raluca (2. Februar 2020). "Dunkler Modus vs. Lichtmodus: Was ist besser?". nngroup.com.
  17. ^ Walsh, David (28. Januar 2019). "bevorzugt Farbscheme: CSS Media Query". David Walsh Blog. Abgerufen 18. März, 2021.
  18. ^ "Window.matchmedia () - Web -APIs | Mdn". Entwickler.mozilla.org. Abgerufen 18. März, 2021. Die MatchMedia () -Methode der Windows Interface gibt ein neues MediaqueryList{{}}: CS1 Wartung: URL-Status (Link)