Design & Programmierung der TEDSoft-Website

Im Sommer 2004 wurde die komplett überarbeitete Version der Website der TEDSoft GmbH online gestellt. Folgenden Punkten, welche noch im Detail erläutert werden, wurde bei der Neugestaltung besondere Beachtung geschenkt:

Standardkonformes Design in XHTML 1.0 Strict und CSS 2

Das → World Wide Web Konsortium hat im Januar 2000 den modernen → XHTML 1.0 Standard verabschiedet. XHTML stellt den Nachfolger zu HTML 4 dar und wird in XML abgebildet. Alle modernen Browser können XHTML-Dokumente interpretieren, da sich XHTML von HTML nur in einigen Details unterscheidet.

Bei der Gestaltung der TEDSoft-Website wurde streng darauf geachtet, nur standardkonformes XHTML 1.0 Strict zu verwenden. Dadurch ist eine einheitliche Darstellung auf allen modernen Browsern sichergestellt. Die Verwendung von XHTML garantiert ebenfalls, dass das Design auch nach dem Erscheinen von neuen XHTML-Vorgaben seine Aktualität nicht verliert und weiterhin von Browsern dargestellt werden kann. Sauberes, korrektes XHTML (aber auch HTML) hat weiterhin eine schnelle und fehlerfreie Darstellung zur Folge.

Modernes Webdesign beinhaltet nicht nur die Verwendung von XHTML, sondern auch die Trennung von Inhalt und Design mit Hilfe von → CSS2. XHTML beschreibt die Objekte und den Inhalt einer Seite, während CSS2 festlegt, wie die Objekte auf dem Ausgabemedium formatiert werden sollen. Unabhängig vom Inhalt lassen sich mit CSS2 durch verschiedene Stylesheets völlig unterschiedliche Formatierungen erstellen. Die Trennung von Inhalt und Stil-Angaben ist eine weitere Ebene der Modularisierung und erleichtert das Zusammenspiel von Webdesigner und die für den Inhalt verantwortliche Person. Durch die Auslagerung der Formatierungsinformationen an eine zentrale Stelle verringert sich der XHTML-Quelltext auf das Wesentliche. Weiterhin ist eine einheitliche Formatierung sichergestellt.

Einfache Wartbarkeit durch modularisierten und dokumentierten PHP-Code sowie Verwendung einer Template-Engine

Für die dynamischen Inhalte, wie z.B. das Navigationsmenü, wird die serverseitige Skriptsprache → PHP in der Version 4 verwendet. Die objektbasierten Fähigkeiten der Sprache, wie Klassen und Vererbung, finden dabei Verwendung. Ein Großteil des PHP-Codes ist in Klassen in separaten PHP-Skripten ausgelagert. Somit kann dieser auch in anderen Web-Projekten ohne oder mit nur geringen Anpassungen wiederverwendet werden. Die objektbasierte Programmierung wurde ebenfalls im Hinblick auf PHP 5 gewählt, welches eine stark verbesserte Implementierung der objektbasierten Sprachkonstrukte enthalten wird.

Der PHP-Quelltext wurde mit speziellen Kommentaren für Methoden und Funktionen versehen, so dass mit Hilfe des Programms → phpDocumentor eine API-Dokumentation aus dem Quelltext erstellt werden kann.

Auf der modernen TEDSoft-Website wird die Template-Engine → Smarty eingesetzt. Smarty ermöglicht eine Trennung von PHP und (X)HTML und somit eine Trennung von Programmlogik und Inhalt/Design. Smarty ist eine ausgereifte Template-Engine mit einer eigenen, kleinen Skriptsprache und bietet die Möglichkeit, einen Cache für eine schnellere Seitendarstellung einzurichten. Die Template-Engine optimiert außerdem das gemeinsame Arbeiten von Programmierer und Designer an einem Web-Projekt. Der Webdesigner muss keine PHP-Kenntnisse besitzen und der Programmierer muss sich keine Gedanken darum machen, wie seine Daten ausgegeben werden.

Daten, welche in einer Datenbank ausgelagert sind, werden in PHP mit Hilfe der Datenbankschnittstelle → Pear::DB ausgelesen. Pear::DB ermöglicht einen objektbasierten und einheitlichen Zugriff auf eine Datenbank, unabhängig von dem darunter liegenden DBMS (Database Management System). Bei der Verwendung von Standard-SQL ist somit ein reibungsloser Umzug auf ein anderes DBMS garantiert.

Einprägsame und lesbare URLs mit Hilfe des Apache-Moduls mod_rewrite

Oft müssen Daten zwischen zwei Skripten ausgetauscht werden. Dies geschieht in der Regel durch die Übergabe von Parametern in der URL. So muss auf tedsoft.de einem PHP-Skript z.B. mitgeteilt werden, welches Template es darstellen soll. Solche Adressen lassen sich jedoch schlecht lesen und werden von Suchmaschinen oft nicht indiziert. Auf tedsoft.de ist dieses Problem durch einen virtuellen Verzeichnisbaum beseitigt, welcher mit Hilfe des Apache-Moduls mod_rewrite, der Skriptsprache PHP, der Template-Engine Smarty und einer MySQL-Datenbank realisiert ist.

mod_rewrite wird seit Version 1.2 des Apache Webservers mitgeliefert. Es ist eine komplexe, auf Regeln basierende "Engine", welche während einer Anfrage ("on the fly") die übermittelte URL mit Hilfe von regulären Ausdrücken prüft und gegebenenfalls umschreibt. Die umgeschriebene URL wird anschließend wie gewohnt an Apache übergeben, welcher diese weiter verarbeitet. Ein einfaches Anwendungsbeispiel dieses Moduls ist zum Beispiel, nach einem Umzug einer Datei/eines Ordners den Benutzer automatisch zu dem neuen Standort zu leiten. Die Regeln zum Umschreiben der URL können in der globalen Konfigurationsdatei des Apache sowie in den Ordner-spezifischen .htaccess Dateien festgelegt werden.

Die Ordnerstruktur des virtuellen Verzeichnisbaums wird in einer Tabelle der MySQL-Datenbank festgelegt. Dort sind die Beziehungen der Ordner untereinander und die zu verwendenden Templates beschrieben. Mit Hilfe dieser Informationen wird auch das Navigationsmenü der Website dynamisch generiert.

Bei einem Aufruf der TEDSoft-Website wird der Pfad mit Hilfe einer Rewrite-Regel einem PHP-Skript übergeben. Dieses Skript ermittelt anhand des Pfades über eine SQL-Abfrage, welches Template dargestellt werden muss und leitet diese Informationen an Smarty weiter. Der eigentliche Skriptaufruf inklusive der Parameter wird in der Adressleiste nicht dargestellt. Somit entsteht die Illusion eines tatsächlich existierenden Ordners.

Keine Verwendung von Frames und JavaScript

Frames sind im Sprachumfang von XHTML 1.0 Strict nicht mehr enthalten und werden somit auch nicht auf tedsoft.de eingesetzt. Frames mögen auf statischen Internetpräsenzen ein nützliches Werkzeug darstellen, da sie den Änderungsaufwand minimieren können, sind jedoch auf dynamischen Websites, insbesondere bei der Verwendung von Template-Engines, überflüssig geworden. Einzelne Frame-Seiten werden häufig von Suchmaschinen indiziert. Somit können Besucher über eine Suchmaschine auf eine unvollständige Seite gelangen, auf der z.B. das Menü oder der Inhaltsbereich fehlt. Weiterhin können Frames nicht von allen Browsern dargestellt werden. Um diese Probleme zu vermeiden werden Frames nicht eingesetzt.

Auch die Verwendung von JavaScript wird auf tedsoft.de vermieden. JavaScript ist häufig aus sicherheitsrelevanten Gründen deaktiviert. Eine Website sollte somit nicht auf JavaScript angewiesen sein, weil eine einwandfreie Darstellung verhindert wird, falls es nicht verfügbar ist.

Ansprechpartner: Sven Jacobs <jacobs@tedsoft.de>



© 1992 - 2017 TEDSoft GmbH ®
ImpressumDatenschutz
13.12.2017