Html-Kurs: Unterschied zwischen den Versionen

Aus MINT.lentner.net
Zur Navigation springen Zur Suche springen
Zeile 2: Zeile 2:
  
 
===Willkommen beim kleinen HTML-Workshop===
 
===Willkommen beim kleinen HTML-Workshop===
'''HTML''' ('''H'''yper'''t'''ext '''M'''arkup '''L'''anguage) ist ''die Seitenbeschreibungssprache'' des Internets. Letztlich ist in ihr '''jede Internetseite''' geschrieben und kann auf Rechtsklick auch angesehen werden. Sie bestimmt genau, welches Objekt oder Bild, welcher Text oder Link wohin gehört. Der Browser liest den sog. HTML-Quelltext, führt die Anweisungen aus und ordnet alles so an, wie Ihr es dann letztlich auf dem Bildschirm seht (oder als Autor sehen wollt). Das INTERNET besteht aus Milliarden von Seiten, ist also ein gigantisches Projekt mit allen möglichen Anwendungszwecken. Entsprechend gibt es zahllose Erweiterungen für spezielle Zwecke (CSS, XML, PHP, JavaScript, ...). Das übersteigt bei Weitem die Möglichkeiten der Schule. Dieser kleine Kurs hier gibt nur einen Einblick in die Arbeitweise von HTML.  
+
'''HTML''' ('''H'''yper'''t'''ext '''M'''arkup '''L'''anguage) ist ''die Seitenbeschreibungssprache'' des Internets. Letztlich ist in ihr '''jede Internetseite''' geschrieben und kann auf Rechtsklick auch angesehen werden. Sie bestimmt genau, welches Objekt oder Bild, welcher Text oder Link wohin gehört. Der Browser liest den sog. HTML-Quelltext, führt die Anweisungen aus und ordnet alles so an, wie Ihr es dann letztlich auf dem Bildschirm seht (oder als Autor sehen wollt). Das INTERNET besteht aus Milliarden von Seiten, ist also ein gigantisches Projekt mit allen möglichen Anwendungszwecken. Entsprechend gibt es zahllose Erweiterungen für spezielle Zwecke (CSS, XML, PHP, JavaScript, ...). Das übersteigt bei Weitem die Möglichkeiten der Schule. Dieser kleine Kurs hier gibt nur einen Einblick in die Arbeitweise von HTML. Wollt Ihr einen Benutzerdialog integrieren, macht im Anschluss mit dem kleinen [[JavaScript-Kurs]] weiter. Für Einbindung eines Serverdialogs benutzt PHP.
  
 
Ihr lernt hier, einfache Internetseiten zu erstellen. Dazu braucht Ihr keine Programme außer einen Texteditor und einen Browser. Aber den hat ja eh jeder kostenlos zur Verfügung. ... und einen Ordner, in dem Ihr Eure Seite abspeichert. ... soll sie jeder jederzeit "im Internet" sehen können, braucht Ihr noch eine Domain und WEB-Space.
 
Ihr lernt hier, einfache Internetseiten zu erstellen. Dazu braucht Ihr keine Programme außer einen Texteditor und einen Browser. Aber den hat ja eh jeder kostenlos zur Verfügung. ... und einen Ordner, in dem Ihr Eure Seite abspeichert. ... soll sie jeder jederzeit "im Internet" sehen können, braucht Ihr noch eine Domain und WEB-Space.

Version vom 28. November 2020, 14:06 Uhr

Html.png

Willkommen beim kleinen HTML-Workshop

HTML (Hypertext Markup Language) ist die Seitenbeschreibungssprache des Internets. Letztlich ist in ihr jede Internetseite geschrieben und kann auf Rechtsklick auch angesehen werden. Sie bestimmt genau, welches Objekt oder Bild, welcher Text oder Link wohin gehört. Der Browser liest den sog. HTML-Quelltext, führt die Anweisungen aus und ordnet alles so an, wie Ihr es dann letztlich auf dem Bildschirm seht (oder als Autor sehen wollt). Das INTERNET besteht aus Milliarden von Seiten, ist also ein gigantisches Projekt mit allen möglichen Anwendungszwecken. Entsprechend gibt es zahllose Erweiterungen für spezielle Zwecke (CSS, XML, PHP, JavaScript, ...). Das übersteigt bei Weitem die Möglichkeiten der Schule. Dieser kleine Kurs hier gibt nur einen Einblick in die Arbeitweise von HTML. Wollt Ihr einen Benutzerdialog integrieren, macht im Anschluss mit dem kleinen JavaScript-Kurs weiter. Für Einbindung eines Serverdialogs benutzt PHP.

Ihr lernt hier, einfache Internetseiten zu erstellen. Dazu braucht Ihr keine Programme außer einen Texteditor und einen Browser. Aber den hat ja eh jeder kostenlos zur Verfügung. ... und einen Ordner, in dem Ihr Eure Seite abspeichert. ... soll sie jeder jederzeit "im Internet" sehen können, braucht Ihr noch eine Domain und WEB-Space.

Viel Spaß beim erkunden Algorithmen-erzeugter WEB-SITES.


Ich führe hier ausschließlich frei kopierbare Programme auf, deren kompletter Code in der anzeigenden Site enthalten ist, die also keinerlei ausgelagerte Dateien oder Zugriffe auf externe Bibliotheken benötigen. Ihr könnt Euch die Programme daher leicht auf Eueren PC laden:

Site starten > bei den meisten Browsern dann rechte Maustaste > Quelltext anzeigen (oder View Page Source) > Datei speichern

Am besten dann den Quellcode studieren sowie verändern und die Veränderungen immer wieder testen! Die Site sollte mit allen gängigen Browsern ohne irgendwelche Zusätze lauffähig sein. Viel Spaß beim erkunden Algorithmen-erzeugter WEB-SITES.
Ich führe hier ausschließlich frei kopierbare Programme auf, deren kompletter Code in der anzeigenden Site enthalten ist, die also keinerlei ausgelagerte Dateien oder Zugriffe auf externe Bibliotheken benötigen. Ihr könnt Euch die Programme daher leicht auf Eueren PC laden:

Site starten > bei den meisten Browsern dann rechte Maustaste > Quelltext anzeigen (oder View Page Source) > Datei speichern

Am besten dann den Quellcode studieren sowie verändern und die Veränderungen immer wieder testen! Die Site sollte mit allen gängigen Browsern ohne irgendwelche Zusätze lauffähig sein.

Programmliste:

  1. JavaScript-Anweisungen im html-Text ... man kann einfachste JavaScript-Aktionen an jeder Stelle in eine html-Datei einbauen.
  2. Datentypen in JavaScript - Ausgabe mit alert ... man kann Daten abspeichern und rechnen, wie mit jeder anderen Programmiersprache. Die Handhabung von Datentypen ist allerdings gewöhnungsbedürftig!
  3. Primfaktorzerlegung einer beliebigen Zahl (Aus- und Eingabe) ... die meisten dynamischen WEB-SITES werden durch Eingaben von Besuchern auf Formularen gesteuert.
  4. Liste der Primfaktorzerlegungen der Zahlen von 1 bis 100 (Ausgabe mit document.write) ... man kann aber auch ganz ohne Formulare html-Code erzeugen um z.B. übermäßig großen Tippaufwand zu sparen.
  5. Liste aller Primzahlen von 1 bis 10000 (Ausgabe mit document.write) ... oder eine immense Arbeit zu sparen, die Daten überhaupt erst einmal zu erzeugen.
  6. Listenumfang durch prompt bestimmen (Primzahlen) ... ebenso ist es möglich, das Ergebnis nach Benutzerwünschen auszurichten.
  7. Liste aller Fakultaeten von 1 bis 100 ... Fakultäten sind typische Ergebnisse, die schnell die kapazität von Taschenrechnern sprengen.
  8. Ein selbst programmierter Taschenrechner ... Formulare können ganz einfach zu beliebiger Kompexität und Funktionalität ausgebaut werden.
  9. Sekundenzähler (Zeitverzögerter Funktionsaufruf) ... zeitabhängige Aktionssteuerung/Aufrufverzögerung von Funktionen reizt besonders die Kreativität.
  10. Bilder wechseln (Grafiken austauschen - Animationen) ... wie ändert man eine Seite nachträglich, die bereits angezeigt wurde?






JavaScript Kurs