Wikibooks

HTML5: Unterschied zwischen dynamischen und statischen Websites


In der Entwicklung von Projekten wird zwischen zwischen dynamischen und statischen Projekten unterschieden.

Statische Projekte

Bearbeiten

Statische Projekte bestehen aus Inhalt (typisch (X)HTML oder SVG) und Dekoration (typisch CSS), welche von den Entwicklern zunächst komplett entwickelt werden. Diese werden danach auf einen Dienstrechner hochgeladen und bei jedem Aufruf immer wieder gleich ausgegeben. Nutzer greifen also nur auf bereits vorhandene Dokumente zu, die nicht an den jeweiligen Zugriff angepaßt werden. Der beim Nutzer ankommende Inhalt ist also so statisch in Dokumentform auf dem Dienstrechner vorhanden, daher die Bezeichnung.

CSS und SVG haben allerdings einige Funktionen, um die Präsentation der Dokumente trotzdem an das jeweilige Darstellungsprogramm anzupassen. Bei (X)HTML-Dokumenten richtet sich die Präsentation auch immer nach den jeweiligen Gegebenheiten. Der Unterschied liegt also nicht in der konkreten Darstellung. Bei statischen Projekten handelt es sich immer um die gleichen Dokumente, die ausgegeben werden. Der Inhalt ist gleich, nicht notwendig die Präsentation.

Eine mittlerweile etablierte Anwendung von statischen Seiten ist ein Archiv mit einer Sammlung von Dokumenten: Ein digitales Buch. Das Standardformat für digitale Bücher ist EPUB, welches in der Version 2 im Wesentlichen XHTML 1.1, SVG, CSS und das Format 'Digital Talking Books' (DAISY) verwendet, in der Version 3 im Wesentlichen die XML-Variante von HTML5, SVG, CSS.

Ähnlich geläufig ist die Verwendung statischer Projekte etwa für Bedienungsanleitungen auf CDs oder DVDs.

Ein großer Vorteil von statischen Projekten ist deren Stabilität. Sie sind selbst auf einem Dienstrechner weitgehend unempfindlich gegenüber Angriffen aus dem Netz, im Bedarfsfalle wieder einfach durch eine Sicherheitskopie zu ersetzen.

Bei umfangreicheren Projekten ist es auch möglich, diese etwa mit einer Skriptsprache wie PHP auf dem lokalen Rechner komplett zu erzeugen und danach statisch auf den Dienstrechner hochzuladen. Das Ergebnis ist somit nicht darauf angewiesen, daß der Dienstrechner die Skriptsprache PHP (in einer bestimmten Version) interpretiert, das Projekt ist also unempfindlich gegenüber Aktualisierungen von Programmen auf dem Dienstrechner, welcher zudem durch die bloße Auslieferung der Dokumente deutlich weniger Rechenleistung benötigt.

Dynamische Projekte

Bearbeiten

Dynamisch wird ein Projekt, wenn es über veränderbare Inhalte und Dekoration verfügt - also Projekte, die serverseitig (auf dem Dienstrechner, englisch: server, auf dem die Dokumente zum Zugriff bereitgestellt werden) oder anwenderseitig (die Änderung oder Dynamik ergibt sich erst nach der Auslieferung mit dem Programm des Anwenders) verändert werden können. Dazu zählen zum Beispiel Interaktionen durch die Skriptsprache JavaScript (anwender- sowie serverseitig) oder Skripte durch PHP (ausschließlich serverseitig).

Ziemlich bekannt sind CMS (Systeme zur Verwaltung von Inhalten, englisch: Content Management System). Dies kommuniziert mit einer Datenbank (zum Beispiel über PHP) und erhält so Informationen, um die jeweilige Ausgabe zu erzeugen und auszuliefern.

Entwickler können zum Beispiel PHP-Skripte auf den Dienstrechner hochladen, welche je nach Nutzeranfrage und sonstigen Kriterien den daraufhin ausgegebenen Inhalt automatisch zusammenstellen.

PHP ist eine Skriptsprache, die auf dem Dienstrechner ausgeführt wird, das Ergebnis ist also unabhängig von den vom Publikum verwendeten Programmen. Um veränderten oder neuen Inhalt zu bekommen, sendet das Publikum wie bei statischen Seiten einfach eine neue Anfrage an den Dienstrechner. Das stellt hinsichtlich der Zugänglichkeit zum Inhalt keine weiteres Problem dar. Der Zugriff unterscheidet sich aus Sicht des Publikums nicht von dem auf eine statische Seite. Die Verwendung ist besonders dann unumgänglich, wenn Eingaben vom Publikum verarbeitet werden sollen, etwa wenn diese Daten über ein Formular an den Dienstrechner senden. Typisch sind folglich Anwendungen, bei welchen verschiedene Nutzer eines Projektes Daten untereinander austauschen sollen (Foren, Spiele etc).

Anders ist die Situation bei der Verwendung von JavaScript, welches anwenderseitig ausgeführt werden soll (prinzipiell kann auch der Dienstrechner JavaScript ähnlich wie PHP ausführen, was aber eher selten angewendet wird, daher hier nicht weiter betrachtet):
JavaScript ist also eine Skriptsprache, welche ähnlich wie eine Stilvorlage verwendet wird, zudem anwenderseitig im Darstellungsprogramm des Publikums ausgeführt wird. Das Ergebnis ist also abhängig vom verwendeten Programm, aus verschiedenen Gründen kann das Publikum die Interpretation anwenderseitiger Skripte komplett unterbinden. Daher eignen sich anwenderseitige Skripte nicht für die Veränderung des eigentlichen Inhaltes einer Seite, die Änderungen sind also dekorativ zu sehen oder als alternativer Zugang zu dem ohnehin vorhandenen Inhalt durch mehr Interaktivität in einer anderen Präsentation des Inhaltes.

Im Rahmen des Schichtenmodells wird davon ausgegegangen, daß anwenderseitige Skripte eine zusätzliche Schicht darstellen. Dabei ist hinsichtlich der Anforderungen von Zugänglichkeit und Barrierefreiheit der Inhalt eines Projektes immer in der Inhaltsschicht verfügbar ((X)HTML oder SVG typisch). Für eine alternative Präsentation kann mittels Stilvorlagen (CSS typisch) eine weitere Schicht angeboten werden. Dynamik und Interaktivität mit JavaScript sind eine dritte Schicht, welche eine weitere alternative Präsentation des Inhaltes erlaubt, allerdings keine neuen Inhalte bereitstellt, weil diese ja bereits in der Inhaltsschicht vorhanden sind, die auch ohne Interpretation der dynamischen Schicht komplett zugänglich ist.

An das Publikum wird also immer das gleiche JavaScript-Dokument ausgeliefert, so gesehen hat der Einsatz von JavaScript auch immer eine stark statische Komponente. Die Dokumente und Daten auf dem Dienstrechner ändern sich nicht. Von daher sind die Übergänge letztlich fließend:

Teilweise Auflösung der Unterschiede

Bearbeiten

Dynamik und Interaktion im eigentlichen Sinne des Wortes kann auch bereits deklarativ in einem statischen Projekt stattfinden, bei der Stilvorlagensprache CSS etwa gibt es einige Pseudo-Eemente und Pseudo-Klassen, die auf Zustandsänderung reagieren, also ebenfalls auf Interaktionen des Nutzers hin eine Änderung der Präsentation bewirken.

Beim Format SVG gibt zudem die Möglichkeit der deklarativen Animation samt Interaktion. SVG kann auch innerhalb von HTML5 verwendet werden.

In Arbeit befindlich sind zudem Module für Übergänge und Animationen in CSS. Obwohl die Arbeit an den diesbezüglichen CSS-Modulen derzeit (2020) noch nicht abgeschlossen ist, finden sich dazu im Netz bereits zahlreiche Projekte, welche diese verwenden oder testen.

Die Möglichkeiten dieser Funktionalitäten von SVG und CSS sind insbesondere hinsichtlich der Interaktivität deutlich eingeschränkter als die Anwendung von JavaScript. Weil die Methoden aber rein deklarativ sind, ist es wesentlich einfacher, die Dynamik damit barrierefrei und zugänglich zu gestalten. Diese Möglichkeiten zeigen ferner, daß letztlich der Unterschied zwischen statisch und dynamisch zunehmend historisch zu sehen ist. Mittlerweile gibt es zahlreiche Anwendungen, die rein mit den klassisch als statisch angesehenen Methoden gelöst werden können, die also keine Skripte verwenden.

Ein wesentlicher Unterschied besteht eher zwischen Anwendungen, welche einen externen Speicher benötigen, eine Datenbank etwa, dazu zwingend einen Anschluß an das Netz, etwa um Daten mit anderen Nutzern auszutauschen, und solchen Anwendungen, die das nicht benötigen, also komplett autark auf einem Rechner verfügbar sind, etwa wie digitale Bücher.



Abgerufen von „https://de.wikibooks.org/w/index.php?title=HTML5:_Unterschied_zwischen_dynamischen_und_statischen_Websites&oldid=911025“