Einstieg: Fehler im Quelltext

Fehler im HTML-Quelltext

Wie reagiert der Browser, wenn der HTML-Quelltext Fehler enthält? Dieser Frage gehen wir im Folgenden nach. Der folgende Quelltext enthält eine Vielzahl an Fehlern und Ungereimtheiten. Findest du sie alle?

Aufgabe 1: Fehler mit dem HTML-Tool untersuchen

(a) Untersuche erst die „Vorderseite“, also die Webseite selbst. Welche Fehler kannst du hier bereits erkennen?

(b) Betrachte nun die „Rückseite“, also den Quelltext. Findest du die Fehler wieder, die du in (a) vermutet hast? Gibt es weitere Fehler, die dir in (a) noch nicht aufgefallen sind?

(c) Die „Rückseite“ des HTML-Tools ist fehlertolerant, das Tool versucht also in der Darstellung Fehler aus dem Quelltext zu beheben. Suche nach Beispielen, bei denen das Tool trotz Fehlern das gewünschte Ergebnis erzielt. Suche auch nach Beispielen, wo das nicht gelingt. Probiere gern weitere Fehler aus, die aktuell noch nicht im Quelltext enthalten sind.

(d) Der Editor des HTML-Tools ist teilweise fehlererkennend, das Tool versucht also im Quelltext-Editor Fehler zu markieren. Suche nach Beispielen, bei denen das Tool Fehler erkennt. Suche auch nach Beispielen, wo das nicht gelingt. Findest du Beispiele, wo ein Fehler angezeigt wird, der aber an einer ganz anderen Stelle aufgetreten ist? Probiere gern weitere Fehler aus, die aktuell noch nicht im Quelltext enthalten sind.

(e) 💭 Was schätzt du: Wie kann das HTML-Tool von inf-schule im Quelltext Fehler erkennen?

Aufgabe 2: Fehler mit dem Browser untersuchen

Wir lösen uns nun vom HTML-Tool auf inf-schule und betrachten stattdessen den Umgang mit Browser und Text-Editor:

(a) Klicke im Tool oben auf „Download“, um den aktuellen Quelltext herunterzuladen. Öffne die Webseite dann in einem Browser. (Das Bild musst du separat herunterladen, wenn du dieses auch sehen möchtest.) Überprüfe, ob dein Browser ebenfalls fehlertolerant ist. Wenn du mehrere Browser hast, dann vergleiche auch mit anderen Browsern: Werden die Fehler in gleicher Weise korrigiert?

(b) Öffne den Quelltext der Seite nun in einem Text-Editor deiner Wahl. Ist hier eine Fehlererkennung möglich?

(c) ✏️ Notiere dir eine kurze Definition der Begriffe „Fehlertoleranz“ und „Fehlererkennung“ im Kontext von Webseiten.

Fehler in anderen Situationen

Der folgende Text sieht auf den ersten Blick etwas merkwürdig aus. Kannst du ihn dennoch lesen und verstehen?

rtkl 3
(1) ll Mnschn snd vr dm Gstz glch.
(2) Mnnr nd Frn snd glchbrchtgt. 
Dr Stt frdrt d ttschlch Drchstzng dr Glchbrchtgng vn Frn nd Mnnrn nd 
wrkt f d Bstgng bsthndr Nchtl hn.
(3) Nmnd drf wgn sns Gschlchts, snr bstmmng, snr Rss, snr Sprch, 
snr Hmt nd Hrknft, sns Glbns, snr rlgsn dr pltschn nschngn bnchtlgt 
dr bvrzgt wrdn. Nmnd drf wgn snr Bhndrng bnchtlgt wrdn.

Aufgabe 3: Sind Fehler unerwünscht?

(a) 💬 Soll man Texte so schreiben wie oben gezeigt - man versteht sie doch? Was spricht dagegen?

(b) 💬 Soll man HTML-Quelltexte so salopp schreiben wie oben gezeigt - der Browser versteht sie doch? Was spricht dagegen?

(c) 💬 Für Expert:innen: In manchen Fällen werden HTML-Dokumente automatisiert weiter verarbeitet. So besteht inf-schule zum Beispiel aus ganz vielen Text-Dateien mit HTML-Elementen. Ein Programm erzeugt daraus dann automatisiert die fertige Website. Warum ist das ein sehr starkes Argument dafür, sich an Syntax-Regeln zu halten?