Wer weder Programmierer noch Webdesigner ist, macht sich vermutlich selten Gedanken darüber, was hinter den Programmen und Internetseiten steckt, die man täglich verwendet. Diese fußen auf z. T. sehr komplizierten und langen Anweisungen an Ihren Computer. Den Befehlstext nennt man Quellcode, Quelltext oder – auf Englisch – Source Code. Basierend auf einer bestimmten Programmiersprache legen Programmierer alle Regeln für eine vom Computer ausführbare Anwendung fest. Sollte der Verfasser einen unbemerkten Fehler in seine Arbeit einbauen, der gegen die Vorgaben der Programmiersprache verstößt, wird das Programm gar nicht erst funktionieren oder bei bestimmten Prozessen abstürzen.
Als Quellcode versteht man einen für Menschen lesbaren Text, der in einer bestimmten Programmiersprache verfasst ist. Das Ziel des Quelltextes ist es, dem Computer genaue Regeln und Vorgaben zu machen, die dieser in Maschinensprache übersetzen kann. So sind Quellcodes die Grundlage für Programme und Websites.
Computer – egal ob der heimische PC, moderne Smartphones oder Rechner aus Industrie und Wissenschaft – arbeiten im binären System: an/aus, geladen/nicht geladen, 1/0. Eine Abfolge von Zuständen (Bits) weist den Computer an, was dieser zu tun hat. Während in den Anfangstagen der Computertechnologie noch tatsächlich mit diesen beiden Zuständen Befehle erstellt wurden, ist man längst dazu übergangen, Anwendungen in einer vom Menschen lesbaren Programmiersprache zu schreiben. Das mag zunächst seltsam klingen, denn als Laie erkennt man auch in einem Quellcode hauptsächlich wirres Kauderwelsch.
„Menschenlesbar“ ist in diesem Zusammenhang allerdings als Gegenbegriff zu „maschinenlesbar“ zu verstehen. Während Computer nur mit Zahlenwerten arbeiten, nutzen Menschen zur Kommunikation Wörter. Genau wie Fremdsprachen muss man die verschiedenen Programmiersprachen zunächst lernen, bevor man sie einsetzen kann.
Es gibt hunderte verschiedene Programmiersprachen. Dabei kann man nicht unbedingt sagen, dass es per se bessere oder schlechtere gibt, denn dies ist immer im Kontext des Projekts zu sehen und abhängig von der Anwendung, für die der Quellcode eingesetzt wird. Zu den bekanntesten Programmiersprachen gehören:
Damit der Computer diese Sprachen versteht, müssen sie allerdings anschließend in Maschinencode übersetzt werden.
Damit Computer den von Programmierern verfassten Quelltext weiterverarbeiten können, muss ein Übersetzer zwischen beiden stehen – in Form eines zusätzlichen Programms. Diese Hilfsanwendung kann entweder in Form eines Compilers oder als Interpreter auftauchen:
Man hat nicht die freie Wahl: Die Programmiersprache legt fest, ob ein Compiler oder ein Interpreter zum Einsatz kommen muss. Heutzutage setzt man vermehrt auch eine Zwischenlösung ein: Just-in-time-Kompilierung (JIT). Diese Art der Übersetzung versucht die Vorteile beider Programme (schnelle Analyse und schnelle Ausführung) zu kombinieren und wird z. B. in Browsern eingesetzt, um effektiver mit JavaScript, PHP oder Java umzugehen.
Auch beim Grundgerüst einer Webseite spricht man von einem Quelltext. Grundlage hierfür ist allerdings keine Programmiersprache, sondern die Auszeichnungssprache HTML. Eine Auszeichnungssprache legt fest, wie ein Inhalt strukturiert ist. So lassen sich mit HTML z. B. Überschriften, Absätze oder Hervorhebungen definieren. Ein HTML-Dokument ist an sich kein Programm, kann aber eines enthalten, etwa in Form von JavaScript-Code. Ähnliches gilt für andere Auszeichnungssprachen, etwa XML.
Beim Schreiben von Programmen hält man sich – abhängig von der verwendeten Programmiersprache – an bestimmte Konventionen. Die wenigsten Programmiersprachen erscheinen allerdings aus dem Nichts, die meisten bauen aufeinander auf. Deshalb kommen bestimmte Elemente immer wieder in verschiedenen Programmcodes vor:
Bei der Erstellung eines Quellcodes steht immer ein Problem im Fokus. Entwickler schreiben Programme, um Lösungen anzubieten. Der Weg dahin ist aber nicht festgelegt. Wenn sich zwei Programmierer mit dem gleichen Problem befassen, kann es gut passieren, dass sich die beiden Quelltexte deutlich voneinander unterscheiden – selbst wenn sie in der gleichen Sprache gearbeitet haben.
Auch wenn es in vielen Fällen nicht nur einen richtigen Lösungsweg gibt, haben alle Programmierarbeiten eines gemeinsam: Ein guter Quelltext sollte unnötigen Code vermeiden. Dieser macht das Programm unübersichtlich, langsamer und anfälliger für Fehler. Besonders unübersichtlichen Quellcode, den auch Profis nicht mehr durchschauen, nennt man Spaghetticode, da die Struktur so verworren ist wie die langen Nudeln auf dem Teller.
Um einen Quelltext zu schreiben, bedarf es eigentlich nur eines einfachen Texteditors – wie etwa der Editor (im englischen Original Notepad) unter Windows oder TextEdit beim Mac. So speichert man den Quellcode auch als Plain-Text (z. B. in der ASCII-Kodierung oder als UTF-8) ab mit der für die Programmiersprache korrekten Dateinamenendung. Wenn Sie also etwa eine Datei mit der Endung „.cpp“ auf Ihrer Festplatte finden, dann ist auch diese eigentlich eine Textdatei, enthält aber wahrscheinlich Code in der Programmiersprache C++.
Bei den Dateinamenserweiterungen handelt es sich um Konventionen. Das Suffix, das man in der Regel mit einem Punkt getrennt an den Dateinamen anhängt, soll anzeigen, welches Format die Datei hat. Windows erkennt an der Dateiendung – sofern diese bekannt ist –, mit welchem Programm es die entsprechende Datei ausführen soll. Andere Betriebssysteme, die auf Unix basieren (z. B. macOS), berücksichtigen auch den Inhalt der Datei, um das Format zu bestimmen.
Neben den Standardprogrammen der Betriebssysteme gibt es aber auch erweiterte Texteditoren, die die Arbeit am Quellcode mit verschiedenen Funktionen erleichtern:
Umfangreichere Projekte lassen sich einfacher mit speziellen Programmen realisieren. Integrierte Entwicklungsumgebungen fassen mehrere Werkzeuge, die Entwickler bei der Arbeit benötigen, zusammen (deshalb „integriert“) und beschleunigen so den Arbeitsablauf. Zusätzlicher Vorteil solcher IDEs ist, dass die enthaltenen Werkzeuge nahtlos untereinander kommunizieren und synchron Änderungen vornehmen. Zu diesen Werkzeugen gehören meistens:
Berühmte Beispiele für integrierte Entwicklungsumgebungen sind das quelloffene Eclipse oder das Microsoft-Produkt Visual Studio.
Auch bei dem Grundgerüst von Webseiten spricht man in der Regel von einem Quellcode, selbst wenn es sich dabei um ein Dokument handelt und nicht um ein Programm. Geschrieben werden Webseiten in der Auszeichnungssprache HTML. Generell ist es aber nicht ungewöhnlich, dass in Webseiten auch Elemente enthalten sind, die in Programmiersprachen verfasst werden, etwa JavaScript. Beiden Spracharten gemein ist, dass man mit ihnen in einfachen Texteditoren schreiben kann. Demnach ließe sich auch eine Webseite komplett im Editor oder mit TextEdit verfassen.
Selbst wenn Sie nicht selbst Webdesigner sind, kann es für Sie interessant sein, den Quellcode einer Seite im Internet zu untersuchen, um z. B. schadhafte Elemente zu erkennen. Alle gängigen Browser bieten Ihnen verschiedene Möglichkeiten, um den Quelltext einer Webseite anzusehen. Auch wenn diese jeweils andere Bezeichnungen haben, finden Sie die gleichen Funktionen im Mozilla Firefox, dem Internet Explorer (bzw. Microsoft Edge) und dem Chrome-Browser von Google.
Eine Variante, den Quellcode einer Webseite sichtbar zu machen, ist das Speichern als HTML-Datei. Durch einen Klick mit der rechten Maustaste oder über das Menü können Sie die Seite herunterladen. Wichtig dabei ist, dass Sie sich für „nur HTML“ als Dateityp entscheiden (wenn Sie die komplette Webseite speichern, wird Sie so angezeigt, wie sie im Browser erscheint – also inklusive aller Bilder und ohne, dass Sie HTML-Tags sehen). Anschließend können Sie die Datei mit einem Texteditor öffnen. Die einfachen Editoren, die Ihr Betriebssystem mitliefert, stellen den Code höchstwahrscheinlich jedoch sehr unübersichtlich dar. Mit einem Texteditor, der einen größeren Funktionsumfang besitzt, können Sie den Quellcode so anzeigen, dass er leichter lesbar ist.
Aber auch ohne die Seite abzuspeichern, können Sie den Quelltext einer Webseite einsehen. Moderne Browser stellen Ihnen dafür zwei Methoden zur Verfügung: Entweder lassen Sie sich einfach den HTML-Code der kompletten Webseite anzeigen oder Sie blenden ein Analysetool ein, das Ihnen bei der Untersuchung des Codes hilft. Die erste Variante unterscheidet sich wenig von der Darstellung der heruntergeladenen Datei. Es öffnet sich ein neuer Tab oder eine neue Seite, die den Quelltext mit Zeilennummerierung gegliedert darstellt.
Die zweite Variante ist interessanter und bietet mehr Funktionen: Das Analysewerkzeug finden Sie im Kontextmenü unter dem Punkt „Untersuchen“ (Chrome) oder „Element untersuchen“ (Internet Explorer & Firefox). Daraufhin öffnet sich ein Bereich innerhalb des Fensters. Auch in diesem kann man sich (neben weiteren Funktionen) den Quellcode anzeigen lassen. Der Unterschied zu den anderen Varianten ist, dass Sie innerhalb dieser Entwicklerwerkzeuge durch Bewegen des Mauszeigers über den Quelltext direkt die entsprechenden Elemente auf der Webseite markieren. Das heißt: Das Tool zeigt Ihnen an, welcher Teil von einer Codezeile betroffen ist. Das machen sich auch Webdesign-Profis zunutze, um z. B. die Darstellung ihrer Webseiten zu überprüfen.
Die Untersuchen-Funktion können Sie auf verschiedene Arten öffnen. Außer dem Kontextmenü, das Sie über den Klick mit der rechten Maustaste öffnen, funktioniert in den bekannten Browsern auch das Drücken von F12.
Hinter einem Quellcode steckt jede Menge Arbeit und viel kreative Energie. Deshalb ist der Quelltext eines Programms auch durch das Urheberrecht geschützt. Genau wie bei anderem geistigen Eigentum ist es nicht gestattet, den Code eines Dritten eigenmächtig zu verbreiten oder zu plagiieren. Dies gilt vor allem für sogenannte proprietäre Software.
Anders sieht es mit quelloffenen Programmen aus. Gerade im Bereich der Software-Entwicklung gibt es eine sehr aktive Open-Source-Szene, in der sehr viel freier mit Code umgegangen wird. Sinn dieser offenen Kultur unter Entwicklern ist es, gemeinsam an Projekten zu arbeiten und so auch langfristig Software weiterzuentwickeln und zu verbessern. Bei GitHub, SourceForge oder anderen vergleichbaren Plattformen stellen Entwickler Quellcode für andere Programmierer zur weitgehend freien Verfügung bereit. Allerdings müssen sich Entwickler von Open-Source-Programmen in der Regel auch an bestimmte Auflagen halten, also z. B. Urheber und Lizenz nennen, wenn sie den Code verwenden wollen.
HTML5 ist die neue Kernsprache des Internets. Doch noch immer greifen Webentwickler auf veraltete Auszeichnungssprachen wie HTML 4.01 oder XHTML zurück. Diese erfordern im modernen Webseitenbetrieb oft eine Vielzahl externer Plug-ins, die sowohl die Kompatibilität als auch die Sicherheit einer Webseite gefährden. HTML5 hingegen ermöglicht eine direkte Integration von Multimedia-Elementen und...
Bei der Verwaltung von Repositories greifen die meisten User auf den bewährten Onlinedienst GitHub zurück. Jedoch existieren auch diverse Alternativen, die für spezielle Bedürfnisse unter Umständen besser geeignet sind. In unserer Übersicht erfahren Sie mehr über die aktuellen Alternativen zu GitHub, die sich für die Verwaltung Ihres Projekts als nützlich erweisen können.
WYSIWYG: Die seltsame Buchstabenfolge ist inzwischen der Standard für die meisten Editor-Programme. Deshalb ist für viele Anwender gar nicht vorstellbar, wie es ohne „What You See Is What You Get“ funktionieren soll. Aber gerade im Bereich von HTML-Editoren gibt es auch andere Ansätze und Meinungen. Wir erklären, was genau hinter dem Akronym steckt, zeigen Ihnen die Vor- und Nachteile des Prinzips...
Hyperlinks, Verweise von einer Webpage zur anderen, gehören zu den grundlegenden Elementen des World Wide Web, dem bekanntesten und meistgenutzten Hypertext-System der Welt. Hyperlinks dienen in erster Linie der Navigation im Netz. Aber auch Suchmaschinenanbieter nutzen das Geflecht an Querverweisen, um zu ermitteln, wer auf wen verlinkt. Hyperlinks werden dabei als Empfehlungen interpretiert....
HTML, CSS und JavaScript sind in der modernen Webentwicklung gesetzt. Sollen geschriebene Code-Bausteine im Einzelnen gestaltet oder wiederverwendet werden, offenbaren die Standard-Websprachen aber ihre Schwächen. Die zu den Web Components zählende Technik Shadow DOM verspricht Abhilfe: Sie ermöglicht gekapselte Code-Bausteine mit eigenem Gültigkeitsbereich, die von dokumentweiten Anweisungen...
