it-swarm-eu.dev

Studien zum Syntax-Highlighting-Farbschema

Die meisten Programmierer haben ihre eigenen persönlichen Vorlieben für Syntax-Hervorhebungs-Farbschemata, aber ich habe mich gefragt, ob jemand jemals eine tatsächliche wissenschaftliche Studie über das beste Farbschema durchgeführt hat. Ich stelle mir vor, eine solche Studie würde Dinge wie die Lesbarkeit des Codes untersuchen, ob die Augen des Programmierers auf die wichtigsten Teile gerichtet sind usw.

Vielleicht wurde dies bereits für so etwas wie das Standard-Visual Studio-Thema durchgeführt, aber ich würde gerne wissen, ob es öffentlich verfügbare Studien gibt und was sie gefunden haben.

40

Spezifische Farbschemata können objektiv nicht besser sein als alle anderen Farbschemata, ihre Rangfolge wäre individuell subjektiv, basierend auf Geschmack und kulturellen Faktoren.

Es gelten jedoch bestimmte Regeln für Lesbarkeit/Klarheit, Verwendung in bestimmten Umgebungslichtumgebungen usw. usw., die sich aus Grafikdesign/Typografie, Mensch-Computer-Schnittstelle und anderen verwandten Studien ergeben würden.

Das Solarized-Projekt von Ethan Schoonover ist eine interessante Arbeit: http://ethanschoonover.com/solarized

17
ocodo

Die nur mäßig aktuelle Studie, die sich aus der Ferne auf das mir bekannte Thema bezieht, stammt aus dem Jahr 2004: "Der Einfluss von Text-Hintergrund-Farbkombinationen auf Webseite auf Lesbarkeit, Aufbewahrung und Ästhetik und Verhaltensabsicht " von Hall & Hanna . Es handelt sich jedoch nicht um den Code, sondern um Webseiten. Das einzige Farbschema, das sie berücksichtigen, sind Vordergrund- und Hintergrundfarben.

Ich habe Fragen zu studienbezogenen Farbschemata für Programmierer auf Skepics.SE gestellt: "Sind Hell-Dunkel-Farbschemata für Computerbildschirme für Programmierer besser?". Es wurde seit fast 2 Jahren nicht mehr beantwortet, während diese Art von Frage normalerweise dort ziemlich schnell beantwortet wird. Was mich glauben lässt, dass es keine solchen wissenschaftlichen Studien gibt.

7
vartec

Wir haben kürzlich eine Benutzerstudie zu Code-Präsentationen durchgeführt, die visuell umfangreicher sind als die Syntaxhervorhebung. Es handelt sich zwar nicht ganz um eine Studie zu Syntaxhervorhebungsschemata, aber Sie finden sie möglicherweise aufschlussreich:

D. Asenov und O. Hilliges und P. Müller - Die Auswirkung umfangreicherer Visualisierungen auf das Codeverständnis und hier ist das Video des 10-minütigen Vortrags am CHI 2016.

Wir haben die Standard-Eclipse-Syntaxhervorhebung mit zwei umfangreicheren Code-Präsentationen mit visuellen Extras wie den folgenden verglichen:

  • Konturen statt geschweiften Klammern
  • Wechselnde Hintergrundfarben anstelle von Kommas zum Trennen von Listenelementen
  • Symbole anstelle einiger Schlüsselwörter
  • Zusätzliche Hintergrundfarben für einige Anweisungen und Ausdrücke

Die Studie zeigte, dass die Erhöhung der visuellen Vielfalt der Präsentation einen ziemlich großen Einfluss auf die Geschwindigkeit hatte, mit der Entwickler die Codestruktur verstehen konnten - die Zeit wurde um bis zu 75% reduziert. Es ist wichtig zu beachten, dass es sich um einfache Fragen zur Codestruktur handelt (z. B. "Gibt es verschachtelte Schleifen in der Methode?"). Wir haben keine Aufgaben getestet, die komplexes Denken erfordern (z. B. "Was macht diese Methode?"), Da diese eher von den Fähigkeiten der Person als von den Auswirkungen der Codepräsentation dominiert werden.

Ein interessanter Befund aus unserer Studie ist, dass wir keine visuelle Überlastung aufgrund der reichhaltigeren Visualisierungen beobachtet haben. Obwohl viele Teilnehmer sagten, dass sie eine visuelle Überlastung oder Verwirrung verspürten, zeigten die von uns gesammelten Daten (Zeit, um eine Antwort zu geben und ob sie korrekt waren) nur eine Verbesserung mit umfassenderen Visualisierungen.

In Bezug auf die Hervorhebung der Syntax legen unsere Ergebnisse indirekt nahe, dass die Verwendung einer größeren visuellen Vielfalt (z. B. mehr Farben und Farben für mehr Arten von Programmierkonstrukten) vorteilhaft ist. Z.B. Ein Thema mit separaten Farben für integrierte Typen, Schlüsselwörter für den Kontrollfluss und den Rest der Schlüsselwörter verbessert in einigen Fällen wahrscheinlich das Verständnis der Codestruktur im Vergleich zu einem einfachen Thema, das für alle Schlüsselwörter eine einzige Farbe verwendet .

7
Dimitar Asenov

Ich glaube nicht, dass solche Studien existieren. In der Praxis wenn ein Unternehmen eine neue IDE erstellt, basiert das Syntaxhervorhebungsfarbschema auf den vorhandenen Schemata anderer IDEs.

Beispiel: das Standarddesign von Visual Studio enthält weder Neues noch Original. Die blaue Farbe wurde jahrelang für Schlüsselwörter verwendet, auch von alten Ada-IDEs. Gleiches gilt für grüne Kommentare. Einige Farben waren mehr oder weniger "neu", wie z. B. blaugrün für die Namen von Klassen, aber Sie können den Grund für die Auswahl dieser Farben leicht verstehen: Es wäre vernünftig, eine Farbe festzulegen, die nicht weit von Blau entfernt ist (da dies der Fall ist) ziemlich wie reservierte Wörter: Int32 für .NET, int für C # usw.), aber es muss eine Grundfarbe bleiben, die sich vom bereits verwendeten Blau unterscheidet.

Was ist nun mit alternativen Schemata wie dem beliebten hellen Text auf dunklem Hintergrund? Sie wurden nicht von einem Wissenschaftler erstellt, der sich jahrelang mit dem Thema befasst und einige komplizierte Berechnungen durchgeführt hat, um die exakte perfekte Übereinstimmung zu erzielen. Stattdessen erstellt ein Entwickler ein Schema, das für ihn lesbar ist. Er teilt es auf einer Website und es wird populär. Das ist die ganze Magie.

Letzte Sache: Gibt es Lesbarkeitsregeln? Nicht zu viel.

  • Zum größten Teil es ist etwas Subjektives: Sie können nicht behaupten, dass ein blaues Schlüsselwort besser lesbar ist als ein lila Schlüsselwort, da jemand in der Lage wäre zu antworten, als für ihn auf seinem Monitor das lila Schlüsselwort ist viel besser lesbar als die blaue.

  • Für einen anderen Teil es ist nur logisch. Ein Schwarzweißschema wäre nicht so lesbar wie das Standardschema. Auf die gleiche Weise können Sie Schlüsselwörter nicht hellgelb und Kommentare hellgrau festlegen (sagen wir #eee) auf weißem Hintergrund, weil es nicht lesbar ist und Sie nicht einmal erklären müssen, warum. Dies sind die gleichen Regeln, wenn Sie eine Website erstellen oder ein Buch drucken oder was auch immer.

2

Als eine Art grobe Studie zeigen die folgenden Screenshots 3 Farbthemen, die zur Syntaxhervorhebung von XSLT verwendet werden. Ich habe mich für XSLT entschieden, da es aufgrund der großen Anzahl von Sprachelementen eine besondere Herausforderung darstellt - und auch, weil viele Entwickler es als hässlich beschreiben.

Solarisiert

enter image description here

Morgen Nacht

enter image description here

Github

enter image description here

Beobachtungen

Die Anzahl der im Beispiel verwendeten Farben hilft bei der Unterscheidung der verschiedenen Sprachelemente, kann jedoch einen Entwickler ablenken.

Es hilft, wenn möglich von kalten zu warmen Farben zu wechseln, wobei kalte Farben für die neutraleren Teile der Sprache verwendet werden. Eine Alternative besteht darin, von Pastelltönen zu lebendigeren zu wechseln (Farbsättigung).

Die Hintergrundfarbe hat einen großen Einfluss auf die Wahrnehmung der Vordergrundfarben.

Einige benachbarte Vordergrundfarben können zu schlechten Zusammenstößen führen, die das Auge stören. Insbesondere Rot und Grün scheinen nicht gut zusammen zu passen.

Mit einem dunklen Hintergrund ist es einfacher, eine breite Palette von Vordergrundfarben mit ausreichendem Kontrast zueinander und zum Hintergrund bereitzustellen.

Schließlich machen externe Faktoren wie das Umgebungslicht sowie die Qualität und Kalibrierung des Monitors einen großen Unterschied.

Fazit

Es ist am besten, Tools zu verwenden, die eine erweiterbare Möglichkeit zum Festlegen von Farbthemen bieten, da es unwahrscheinlich ist, dass ein einzelnes Farbthema die Anforderungen aller Entwickler erfüllt, und selbst derselbe Entwickler kann seine Präferenzen abhängig von einer Vielzahl von Faktoren häufig ändern.

1
pgfearo

Nun, ich denke die erste Frage wird sein, ob der weiße Hintergrund eine so großartige Idee ist oder nicht. Nur weil es sich um echtes Papier handelt und wir es heutzutage überall im Internet finden, ist es nicht unbedingt eine gute (oder darf ich sagen perfekte) Wahl.

Ich erinnere mich, dass wir vor (vielen, vielen) Jahren nur das gelb-auf-schwarz "Farbschema" hatten. Und ich erinnere mich auch, dass es nicht so schlimm war. Es hatte diesen Kontrast nicht so schwarz-weiß. Vor nicht allzu langer Zeit habe ich gelernt, dass es auch für das menschliche Auge besser ist.

Manchmal frage ich mich wirklich, wer die Farbschemata entwirft, die z. mit Betriebssystemen ausgeliefert werden. Normalerweise ignoriere ich sie, aber ich erinnere mich, dass ich wirklich tolle Mischungen aus Pink und Grün und so weiter gesehen habe. Nun, ich nehme keine Drogen ...

Es gibt einige Studien darüber, was Farben mit Ihrem Unterbewusstsein tun (beruhigen, Aggressionen verursachen, ...). Ich denke, dass die häufig verwendeten Farbschemata etwas darauf basieren. Vielleicht haben sie nur die Lesbarkeit hinzugefügt. Codierung sollte keine Selbstmordmission sein.

Aber was das Farbschema der aktuellen IDEs betrifft, bin ich damit einverstanden. Seien wir ehrlich: Die einfache Idee dahinter ist, es einfacher zu machen, etwas zu finden, das sich vom allgemeinen "Code-Rauschen" unterscheidet. Und um ehrlich zu sein, ist es mir egal, welche Farben sie verwenden, um das zu ermöglichen. Es sollte einfach nicht meine Augen verletzen oder Teile des Codes in meinen Hinterkopf brennen, wie ein grelles Rot auf einem Grünton.

Die Codierung sollte entspannend sein. Und das ist es für mich.

0
sjngm