Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- html:grundgeruest [2020/10/17 14:47] – [Unsere erste HTML-Seite] lutz
+++ html:grundgeruest [2021/01/08 09:24] (aktuell) – [Aufgaben] lutz
@@ Zeile 33: / Zeile 33: @@
   </head>
   <body>
-    Dier steht der Inhalt der Seite
+    Hier steht der Inhalt der Seite
   </body>
 </html>
@@ Zeile 46: / Zeile 46: @@
 Wenn man die folgende Datei first.html im Webbrowser öffnet,
+<code html first.html>
+<!DOCTYPE html>
+<html lang="de">
+  <head>
+    <meta charset="utf-8">
+    <title>Meine erste Seite</title>
+  </head>
+  <body>
+    Das ist meine erste selbst programmierte HTML-Seite.
+  </body>
+</html>
+</code>
+erhält man die folgende Darstellung:
+{{ :html:07_bild02.png?600 |}}
+Im folgenden Video wird dargestellt, wie man allgemein beim Programmieren von HTML-Seiten vorgeht:
+{{youtube>nK__njL-1WM}}
+\\
+=====Kommentare=====
+Natürlich wird unser Quelltext irgendwann komplizierter. Um die Übersicht nicht zu verlieren, kann man dann in den Quelltext Kommentare schreiben. Damit die Kommentare im Browser nicht angezeigt werden Schreibt man Sie zwischen ''%%<!--%%'' und ''%%-->%%''. Wie man sie verwendet, zeigt der folgende Quelltext.
+<code html>
+<!-- Hier steht die DOCTYPE -->
+<!DOCTYPE html>
+<html lang="de">
+	<!-- Hier beginnt der Kopf der Seite -->
+	<head>
+		<!-- Hier steht die Titelzeile, die in der Fensterleiste des Browsers angezeigt wird. -->
+		<meta charset="utf-8">
+		<title>Meine erste Seite</title>
+	</head>
+	<!-- Hier beginnt der Körper der Seite. -->
+	<body>
+		Das ist meine erste selbst programmierte HTML-Seite.
+	</body>
+</html>
+</code>
+=====Vertiefung des Themas=====
+[[https://wiki.selfhtml.org/wiki/HTML/Tutorials/HTML5/Grundger%C3%BCst | Grundgerüst bei wiki.selfhtml.org]]
+=====Aufgaben=====
+**Aufgabe 1**
+Erstelle entsprechend dem Video die Datei first.html.
+**Aufgabe 2**
+Schreibe einige Kommentare in die Datei und teste die Darstellung.
+**Aufgabe 3**
+Erstelle mit einem Editor eine Datei second.html, so dass in der Fensterleiste steht: "Meine zweite Seite".
+Im Browserfenster soll der Text erscheinen: "Hurra, ich habe meine zweite HTML-Seite programmiert!".
+[[html:formatierungen| >> Einfache Formatierungen]]
+~~DISCUSSION | Hier können Fragen zum Inhalt der Seite gestellt werden. ~~