Der Übergang von HTML 4 nach HTML 5
Sd, 2017
HTML
(Hypertext Markup Language),
Markups sind die sog. Tags, z.B. <body>Mit HTML können Sie Webseiten in Bereiche wie Kopf, Inhalt, Fuß, Navigation und Artikel unterteilen. Weiter können Sie Überschriften, Textabsätze, Listen und Tabellen erzeugen. Sie können anklickbare Verweise auf beliebige andere Webseiten oder Datenquellen im Internet erzeugen. Nicht-textuelle Inhalte können Sie referenzieren. Sie können Formulare in den Text integrieren. Und last but not least bietet HTML Schnittstellen für Erweiterungssprachen wie CSS oder JavaScript an, mit deren Hilfe Sie HTML-Elemente nach Wunsch gestalten oder
Interaktionen mit dem Anwender realisieren können.
Eine der wichtigsten Eigenschaften von HTML ist die Möglichkeit, Verweise (Hyperlinks) zu definieren. Verweise (Links, Hyperlinks) können zu anderen Stellen der eigenen Website führen, aber auch zu beliebigen anderen Adressen im World Wide Web und sogar zu Internet-Adressen, die nicht Teil des Web sind.
HTML-Dokumente können Sie mit einem beliebigen Texteditor bearbeiten, der Daten als reine Textdateien abspeichern kann.(z.B. Notepad++)
(Quelle: http://webkompetenz.wikidot.com/html-handbuch:web-technologien)
CSS
CSS bedeutet Cascading Style Sheets. Es handelt sich um eine beschreibende
Ergänzungssprache für HTML. Sie klinkt sich nahtlos in HTML ein und hat zwei Aufgaben: das Formatieren von Inhalten und das Gestalten von Webseitenlayouts.
Wenn Sie ein HTML-Dokument ohne CSS-Angaben im Browser anzeigen, werden grundsätzliche Strukturen visuell unterscheidbar dargestellt. So werden Überschriften in grafischen Browsern größer und fett dargestellt, Tabellen sind sichtbar, und wichtige Auszeichnungen im Text werden z.B. kursiv, fett oder in nicht-proportionaler Schrift dargestellt. Man spricht in diesem
Zusammenhang von einem internen Default-Stylesheet, das Browser verwenden, um HTML- Elemente darzustellen.
An diesem Punkt setzen die Cascading Stylesheets (CSS) ein. Mit Hilfe von Stylesheets können Sie beispielsweise festlegen, dass alle Überschriften 1. Ordnung 24 Pixel groß sind, in roter Helvetica-Schrift, mit einem Nachabstand von 16 Pixel und mit einer grünen doppelten Rahmenlinie oberhalb dargestellt werden. Sie können aber genauso gut auch für einen beliebigen Text festlegen, dass nur dieser Text 3 Zentimeter groß sein soll und eine gelbe Hintergrundfarbe erhält.
CSS erlaubt es, zentrale Formate zu definieren, beispielsweise für alle Überschriften erster Ordnung, oder für alle Textabsätze mit einem bestimmten Klassennamen, oder für
hervorgehobenen Text, der innerhalb einer Tabellenzelle vorkommt. Die zentralen Formate können in eine externe Style-Datei ausgelagert werden, die Sie dann in beliebig vielen HTML- Dokumenten einbinden können. So ermöglicht CSS seitenübergreifende, einheitliche Layouts und Formatierungen.
(Quelle: http://webkompetenz.wikidot.com/html-handbuch:web-technologien)
Der Übergang von HTML 4 nach HTML 5
Sd, 2017
Html 4
:Tags mit Attributen für den Inhalt und das Layout (das Aussehen der Webseite), z.B.
<html>………</html> oder <Body bgcolor=“red“ background=“bild.jpg>………</body>
d.h. eine Vermischung von Struktur und Layout einer Webseite
HTML 5
:Trennung Strukur und Layout (mit CSS realisiert) und ggf. noch JavaScript oder PHP für dynamische Webseiten.
Hier gibt es i.W. nur einfache Tags <body>… für die Struktur der Webseite und einem Attribut class oder id für den Aufruf einer CSS-Anweisung für das Layout
<body id=“css für body”>………</body>
Damit kann dann die gleiche Webseite mit einem bestimmten Inhalt mal so oder anders
aussehen, je nachdem welche CSS-Anweisungen man aufruft über das Attribut class oder id (die auch in einer datei.css abgelegt sein können).
(ein Beispiel wäre die Webseite mal auf dem Desktop oder Tablet oder Handy mit unterschiedlichem Layout schon allein wegen der Größe des Bildschirms)
Content Management Systeme (CMS)
Fast alle größeren Webprojekte werden heutzutage mit Hilfe von Content Management
Systemen (CMS) erstellt und gepflegt, bei dem man nicht unbedingt HTML und CSS-Kenntnisse haben muss. Dies geschieht eher nach dem WYSWYG-Verfahren, bei dem dann der
entsprechende HTML / CSS-Code im Hintergrund generiert wird. Das wird oft auch mit den Webseiten der Schulen gemacht.
Typo3, Joomla, Wordpress
