AIB 9: Mehrere Seiten erstellen

Schritt-für-Schritt-Anleitung als Vorbereitung für dein Klassenarbeitsprojekt

1. Ordner erstellen

Erstelle auf dem Desktop oder in deinen Dokumenten einen neuen Ordner.

Nenne ihn: Meine_Webseite

In diesem Ordner werden alle HTML-Dateien und auch die eingebauten Bilder gespeichert.


2. Editor öffnen

Öffne einen Texteditor.

Bei Windows:

  1. Klicke auf das Startmenü.
  2. Suche nach Editor oder Notepad.
  3. Öffne das Programm.

Wichtig: Nicht Word benutzen, weil Word keine einfache HTML-Datei erstellt.


3. Startseite erstellen

Gib bitte den nötigen – schon erlernten – HTML-Code in den Editor ein…

Neu -> HTML-Code für Navigation auf die Seiten und zurück zur Startseite:

<h2>Navigation</h2>
<ul>
<li><a href=seite1.html>Weiter zu Seite 1</a></li>
<li><a
href=seite2.html>Weiter zu Seite 2</a></li>
<li><a href=index.html>Zurück zur Startseite</a></li>

</ul>


4: Datei richtig speichern

Speichere die Datei im Ordner Meine_Webseite.

Der Dateiname muss lauten: index.html

Wichtig:
  • Die Datei darf nicht index.html.txt heißen.
  • Bei Windows im Speichern-Fenster am besten auswählen:
    • Dateityp: Alle Dateien
    • Dateiname: index.html
    • Codierung: UTF-8

5. Datei im Browser öffnen

Öffne den Ordner Meine_Website.

Doppelklicke auf die Datei:

index.html
Die Datei öffnet sich im Browser. Jetzt sollte deine erste Website sichtbar sein.

6. Zweite Seite erstellen

Öffne wieder den Editor. Gib entsprechenden Code ein und speichere die Datei im gleichen Ordner unter dem Namen: seite1.html

Danach öffnest du wieder die Datei index.html im Browser und klickst auf den Link zu Seite 1.

7. Dritte Seite erstellen

Öffne wieder den Editor. Gib entsprechenden Code ein und speichere die Datei im gleichen Ordner unter dem Namen: seite2.html

Danach öffnest du wieder die Datei index.html im Browser und klickst auf den Link zu Seite 1.
Speichere die Datei im gleichen Ordner unter dem Namen: seite2.html

8. Kontrolle

Am Ende muss dein Ordner so aussehen:

Meine_Website
│
├── index.html
├── seite1.html
└── seite2.html
Veröffentlicht unter AIB | Verschlagwortet mit

👋 Willkommen in AIB – Klasse 9

Hallo zusammen,
herzlich willkommen im neuen Schuljahr im Fach AIB (Allgemeine Informatorische Bildung)! 🎉

In diesem Jahr wollen wir gemeinsam:

  • den Computer besser verstehen (Hardware & Software),
  • erste Schritte in der Programmierung mit Python gehen 🐍,
  • Medien clever nutzen (Bilder bearbeiten, Videos schneiden),
  • die Chancen und Grenzen von Künstlicher Intelligenz erarbeiten und lernen, wie Systeme wie ChatGPT funktionieren und sinnvoll genutzt werden können,
  • eine Webseite in HTML programmieren,
  • und lernen, wie man sich sicher im Internet bewegt (Datenschutz, Cybermobbing, Urheberrecht).

Damit ihr gleich ein bisschen in die AIB-Stimmung kommt, hier ein paar symbolische Codes:

Und keine Sorge: Wir fangen einfach an, probieren viel praktisch aus und lernen Schritt für Schritt dazu.
Ihr dürft Fragen stellen, ausprobieren, Fehler machen und daraus lernen – genau so funktioniert Informatik!

Wir starten mit einem -> Quiz über das eigentlich schon Gelernte…

Ich freue mich auf ein spannendes Jahr mit euch. 🚀

Ralf Breuer

AIB 9: Python, HTML, SQL

Das Bild zeigt drei kleine Code-Beispiele in unterschiedlichen Programmiersprachen, die symbolisch den Einstieg ins Fach AIB (Allgemeine informatorische Bildung) darstellen:


🔹 1. Python

print("Willkommen in AIB 9 🎓")
  • Mit print() wird Text auf dem Bildschirm ausgegeben.

  • Hier: eine Begrüßungsnachricht für die Schüler („Willkommen in AIB 9 🎓“).

  • Python wird im Unterricht als Programmiersprache eingeführt.


🔹 2. HTML

<!-- Unser Ziel: Lernen + Spaß + Teamwork -->
<h1>AIB = Lernen mit Technik</h1>
  • <!-- ... --> ist ein Kommentar in HTML, also nur Hinweis für den Programmierer.

  • <h1> ... </h1> ist eine Überschrift (größter Titel auf einer Webseite).

  • Die Botschaft: AIB verbindet Lernen, Spaß und Teamarbeit.


🔹 3. SQL

SELECT * FROM Schueler
WHERE Motivation = 'hoch';
  • SQL ist eine Sprache für Datenbanken.

  • SELECT * FROM Schueler bedeutet: „Zeige alle Daten aus der Tabelle Schueler“.

  • Mit WHERE Motivation = 'hoch' wird gefiltert: nur Schüler mit hoher Motivation.

  • Das ist symbolisch gemeint → die Klasse startet motiviert ins neue Schuljahr.


👉 Das Bild kombiniert also kleine Programmier-Beispiele (Python, HTML, SQL) und zeigt, dass ihr euch in Klasse 9 mit Programmieren, Web, Datenbanken und Technik beschäftigen werdet.