Einen Augenblick Geduld...

Tja, Kommentare im Quelltext vergrößern die Datei einer Webseite wirklich. So ist es wohl.
Und ein ''normaler'' Betrachter der Webseite sieht die Kommentare gar nicht erst. Sie bestehen aus einfachem ASCII, bzw. ANSII-Text, den der Renderer eines Webbrowsers einfach ''überliest''.
Er ist für uns Menschen gemacht, die Maschine interpretiert ihn nicht weiter. Aber wofür brauche ich ihn dann nun?
Es ist relativ leicht zu erklären: für die Strukturierung der Webseite. Oft besteht ein Quelltext aus hunderten, oder sogar tausenden Zeilen mit Quellcode. Zum Zeitpunkt der Erstellung kennt man die Routinen, die man da programmiert hat noch. Aber nach einiger Zeit benötigt man den Quellcode vielleicht nochmal und dann ist es einfacher und schneller nachzuvollziehen wenn bestimmte Passagen kurz und prägnant beschrieben wurden.
Und ja, man kann auch Leerzeilen im Quelltext einfügen um Inhalte voneinander zu trennen. Aber die entsprechende Passage ist mit einem vorangesetzen Kommentar besser aufzufinden.
Um eine Passage in einem Quelltext auszukommentieren benötige ich wie bei jedem anderen Befehl eine Startanweisung und eine Endanweisung des Kommentars. Vergesse ich die Endanweisung, wird alles Weitere nach dem Startbefehl als Kommentar interpretiert und letztendlich funktioniert dann gar nichts mehr auf der Webseite. Es würde nur der erste Teil bis zum Kommentar ausgeführt werden, bzw. in einem Browser sichtbar sein. Im schlimmsten Fall würde der Quelltext auf der restlichen Webseite erscheinen.
Bei den Kommentarfunktionen muss man zwischen HTML-, CSS-, und Javascript-Kommentaren unterscheiden. Diese werden unterschiedlich gestartet und beendet. Grundsätzlich gilt, dass jeder Startbefehl eines Kommentars in umgekehrter Reihenfolge der Buchstaben diesen wieder beendet. Ich finde das kann man sich auch ganz gut merken.
Kommen wir also zum Kommentar im HTML-Teil einer Webseite. Eingeleitet wird er mit <!-- und entsprechend anders herum (ohne das Ausrufungszeichen) wieder beendet ( --> ). Es empfielt sich (mind.) ein Leerzeichen zwischen dem Kommentarbefehl und dem jeweiligen Quelltext zu lassen.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Webseitentitel</title>
</head>
<body>
<!-- Ich bin ein Kommentar und werde nicht vom Browser interpretiert -->
<div class="mein_container">
Containerinhalt
</div>
</body>
</html>
In Zeile 10 wird lediglich diese eine Zeile als Kommentar genutzt. Es ist aber auch möglich mehrere Zeilen inkl. den Inhalt mit HTML-Befehlen auszukommentieren. Das sieht dann so aus:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Webseitentitel</title>
</head>
<body>
<!-- Ich kommentiere mehrere Programmzeilen aus und beinhalte HTML-Befehle
<div class="mein_container">
Containerinhalt
</div>
-->
</body>
</html>
Mit der ''Auskommentierung'' mehrerer Zeilen werden diese also nicht mehr im Browser ausgeführt. Gerade dann, wenn man längere Abschnitte in einem Quelltext nicht (mehr) benötigt, lässt sich dadurch besser erkennen bis wohin dieser Abschnitt auskommentiert ist.
In Programmen die HTML interpretieren können (also keine reinen Textverarbeitungsprogramme wie MS Word, OpenOffice, etc.) werden die Kommentare i.d.R. andersfarbig dargestellt. Meist ist es ein Grauton. Das hilft beim Erkennen des Kommentars. Dazu gehört im Übrigen auch der Adobe Dreamweaver oder vergleichbare HTML-Editoren von denen es auch auf dem Freeware- und Shareware-Sektor eine Menge gibt.
Auch im Quelltext von CSS gilt, das ein eingeleiteter Kommentar in umgedrehter Weise wieder beendet wird. Auch dieser kann über mehrere Zeilen hinweg zum Deaktivieren eines Formatierbefehls genutzt werden. Auf diese Weise kann man z.B. mehrere Formatierungen für einen div-Container ausprobieren. Vielleicht benötigt man ja auch eine zuvor generierte Formatierung später erneut. Dafür entfernt man dann die Kommentarfunktion wieder - und schon wird es vom Browser wieder entsprechend interpretiert.
.mein_container {
color: #FFFFFF;
font-size: 30px;
}
/*
.auskommentierter_container {
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #FFFFFF;
font-size: 40px;
font-weight: bold;
text-shadow: 2px 2px 8px #222222;
}
*/
Innerhalb von CSS kann eine Auskommentierung eines einzelnen Formatierbefehls ebenfalls durchgeführt werden.
Wie hier in Zeile 7 kann man einzelne Zeilen, bzw. Formatierbefehle auf diese Art auskommentieren.
.teilweise_kommentierter_container {
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #FFFFFF;
font-size: 40px;
font-weight: bold;
margin-bottom: 20px; /* Rand von 20 Pixeln */
text-shadow: 2px 2px 8px #222222;
}
Die folgende Art der Auskommentierung nutzen gerne Programme wie der Adobe Dreamweaver um sie als deaktivierten Befehl kennzuzeichnen.
.teilweise_kommentierter_container {
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #FFFFFF;
font-size: 40px;
font-weight: bold;
/* [disabled]margin-bottom: 20px; */
text-shadow: 2px 2px 8px #222222;
}
Die Kommentarfunktion wird also hier nicht zum Verfassen von Erklärungen genutzt, sondern dient lediglich dazu bestimmte Formatierbefehle nicht auszuführen (aber bei Bedarf wieder zur Verfügung zu stellen ohne vollständig neu geschrieben werden zu müssen).
Die Kommentarfunktion ist empfehlenswert für die Erklärung der jeweils folgenden Programmzeilen. Andernfalls wird es auch für Programmierer, die den Code lesen und verstehen sollen, teils schwierig. Auch hier lassen sich bestimmte Befehle durch die Kommentarfunktion einfach ausklammern.
In Javascript leitet ein Slash (Schrägstrich) gefolgt von einem Stern (/*) und einem Leerzeichen den Kommentar ein. Beendet wird er in umgekehrter Reihenfolge.
Mit zwei Slashs, gefolgt von einem Leerzeichen erfolgt ein Kommentar nur zeilenweise (// Ich bin der Kommentar ).
Am Ende der Zeile erhält er dann keinen Beendigungsbefehl.
/* Ich bin ein Kommentar in Javascript und erkläre sinnvoller Weise die unter mir stehenden Programmzeilen. */
function dayPart(oneDate) {
var theHour = oneDate.getHours()
if (theHour < 2 )
return "Guten Morgen"
if (theHour < 12)
return "Guten Morgen"
if (theHour < 18)
return "Guten Tag"
return "Guten Abend"
}
// Zurückschreiben des ermittelten Datumswertes.
// eine weitere Zeile mit Hinweisen...
today = new Date()
var header = dayPart(today) + " "
document.write(header)
Die Programmiersprache Python kommt jetzt nicht so oft vor. Ich nutze sie bei Projekten für den Raspberian Pie. Hier werden Kommentare am Zeilenanfang mit einem Hashtag (#) erzeugt.
Viel wichtiger noch ist bei Python die Einhaltung der Tab-Stops (Einrückungen) im Quelltext, da andernfalls das komplette Script nicht funktioniert.
#Bibliotheken einbinden
import RPi.GPIO as GPIO
import time
import os
...
if __name__ == '__main__':
try:
while True:
abstand = distanz()
print ("Gemessene Entfernung = %.1f cm" % abstand)
if abstand <= 53:
# print ("Monitor einschalten")
os.system("echo 'Schalte HDMI an' | /opt/vc/bin/tvservice -p")
...usw.
Da der Kommentar in einem Quelltext fest formatiert ist, bzw. alle Buchstaben den gleichen Abstand haben, können damit auch sog. ''Textbilder'' erstellt werden. Das gilt auch für reine (unformatierte) Textdateien (mit der Endung .txt). Diese sind dann mit dem Editor (unter Windows) und den ''Notizen'' (auf dem Mac unter MacOS) zu öffnen.
Besonders bei ''Informationen'' von dubiosen Quellen wird dies gerne genutzt dafür. So machen entsprechende Gruppierungen von Programmierern damit gerne auf sich aufmerksam. Dem ''normalen'' Betrachter dieser Webseite bleiben diese Informationen dann verborgen und nur der etwas versiertere Betrachter, der sich den Quelltext einer Webseite anzeigen lässt, ist im Stande diese Informationen zu lesen.
Es ist nicht ganz abwegig, dass auf diese Weise auch das Darknet Verbreitung findet um auf bestimmte Domänen zweifelhafter Herkunft hinzuweisen.
Parallel dazu ist daraus aber auch ein eigener Kunstzweig entstanden, da sich damit komplexe Bilder darstellen lassen. Dabei waren damals sicherlich auch die alten Nadeldrucker nicht ganz unbeteiligt, mit denen man sich auf diese Weise schon in den 70er Jahren Bilder (zeilenweise) ausdrucken lassen konnte. Von einer klaren Fotodarstellung war das natürlich noch weit entfernt.
Ich hoffe, das Tutorial war hilfreich.
Ich wünsche viel Erfolg bei der Nutzung von Kommentaren. Sie sind wirklich sinnvoll!