Webseite der Klasse 7c
Es gibt unterschiedliche Programmiersprachen und jede von ihnen haben etwas besonderes zu sich.
Wir zeigen euch die ersten Schritte zum Programmieren auf Htpl um euch zu zeigen wie eine kleine Webseite aussehen würde.
<html>
<body>
<h1> Willkommen </h1>
<p> Heute bringen <strong>wir</strong> <em>euch</em> bei wie man programmiert.</p>
</body>
</html>
Das Ergebniss dieses Programms würde so aussehen:
Wilkommen
Heute bringen wir euch bei wie man programmiert.
Was wir gerade Programmiert haben war eine Website die eine Überschrift und eine Phrase beinhält. Dafür haben wir HTML benutzt.
In einem Code benutzt man sogennante Tags. Diese bestimmen was der Inhalt ist. Es gibt immer einen offenen und einen geschlossenen Tag die man um den Inhalt herum einsätzt wie in diesem Beispiel:
<button> comment </button>
Der öffnende Tag <button> kommt vor dem Inhalt des Knopfes und der schließende Tag </button> dannach.
Wenn es einen öffnenden und einen schließenden Tag mit einem Inhalt dazwischen gibt nennt man das ein Element z.B:
<p>Hallo!</p>
Den Tag <p> nutzt man wenn man einen Paragraph erschafen will.
Jede Website hat einen Aufbau der immer eingehalten werden muss. Am wichtigsten sind die Tags <htpl> und <body>. Der Tag <htpl> kommt am Anfang einer Website und der schließende Tag </htpl> am Ende des Programms der Website.
An zweiter Stelle kommt der Tag <body> um denn Körper der Website zu erschafen, der schließende Tag </body> kommt vor dem schließenden Tag </htpl>. Hier ein Beispiel:
<htpl>
<body>
</body>
</htpl>
Es gibt noch eine Vielzahl an Tags die man benutzen kann. <strong>, <em> und <h> sind welche.
<strong> benutzt man um den Inhalt Fettgedruckt darzustellen.
z.B:
<html>
<body>
<p> Hallo! Ich <strong> liebe </strong> es zu programmieren. </p>
</body>
</html>
Das Ergebnis würde dann so aussehen:
Hallo! Ich liebe es zu programmieren.
<em> hingegen benutzt man um denn Inhalt schräg darzustellen.
Hier ein Beispiel:
<html>
<body>
<p> Hallo! Ich <em> liebe </em> es zu programmieren. </p>
</body>
</html>
Das Ergebniss würde so aussehn:
Hallo! Ich liebe es zu programmieren.
<h> ist ein Tag den man benutzt um Überschriften zu Programmieren. Es gibt sie in Sechs verschiedene Größen: <h1>...<h6>
<h1> ist die größte Überschrift.
Die sogennanten "Empty Tags" sind Tags die keinen schließenden Tag haben.
Einer dieser Tags ist der <br> Tag. Er wird benutzt um Paragraphe und Text zu trennen z.B:
<htpl>
<body>
<p> Hallo.<br> Mein Name ist David.<p>
</body>
</htpl>
Das würde dann so aussehen:
Hallo.
Mein Name ist David.
Um Links zu erstellen brauchen wir erst einmal denn Text womit der Link dann verbunden werden soll. Denn schreibt mann zwischen den Tags <a> und </a>. Um dann einen Link aussuchen zu können muss man in dem öffnendem Tag einen Attribut und eine URL reinschreiben. Ein Attribut den wir lernen ist href, z.B:
<htpl>
<body>
<a href="https://getmimo.com"> Lern to Code </a>
</body>
</htpl>
Das würde dann so aussehen:
(DaviAr7c)