Moderne Webentwicklung: Grundlagen und Werkzeuge

Seit der Kommerzialisierung des Internets Anfang der 1990er Jahre unterliegt die Webentwicklung einem ständigen Wandel. Waren Internetseiten früher als Ansammlungen schmuckloser Textfelder angelegt, steht heute eine aufwendige Präsentation multimedialer Inhalte im Vordergrund. Die ursprüngliche Informationsplattform ist zum Unterhaltungsmedium geworden. Internetnutzer fordern interaktive Websites, die durch ein ansprechendes Design überzeugen und sich intuitiv bedienen lassen. Um dem nachzukommen, können Webentwickler mithilfe verschiedener Werkzeuge dynamische Inhalte einbinden und Websites individuell auf den User zuschneiden. Voraussetzung dafür ist ein professionelles Webhosting, das die nötigen Ressourcen bereitstellt und aktuelle Webstandards unterstützt.

Die Grundlage einer jeden Internetpräsenz ist Speicherplatz auf einem Server. Diesen bieten spezialisierte Internetdienstleister an, sogenannte Webhoster. Das Angebot umfasst dabei in der Regel Komplettpakete, die neben dem benötigten Festplattenspeicher Serverleistungen wie RAM, eine eigene Domain, Datenbanken und die nötigen Werkzeuge für die Webentwicklung beinhalten. Welche physischen Maschinen die in Anspruch genommenen Ressourcen hosten, bleibt dem Nutzer eines Webhosting-Pakets in der Regel verborgen. Anders ist das bei alternativen Hosting-Modellen wie dedizierten Webservern, die als eigenständige Hardware-Komponenten in einem Rechenzentrum angemietet werden.

Domain

Jedes Projekt im World Wide Web lässt sich über einen einzigartigen, eindeutigen Namen aufrufen. Diese sogenannte Domain gehört zu den Grundbestandteilen eines Webhosting-Pakets. Domains folgen strikt dem hierarchischen Aufbau des Domain-Name-Systems und bestehen aus einer den Namensraum definierenden Top-Level-Domain (z. B. de), einem frei wählbaren Domain-Namen (der Second-Level-Domain) und fakultativen Subdomains. Die Domain-Registrierung erfolgt durch einen Internetdienstleister, der den Antrag an die zuständige Verwaltungsstelle weiterleitet. Bei der Wahl der Domain bieten sich kurze prägnante Formulierungen und geläufige Top-Level-Domains an.

Webspace

Jede Webseite besteht aus Daten, die für Abrufe aus dem Internet auf einem Webserver bereitgestellt werden. Webhosting-Pakete beinhalten daher immer ein gewisses Speicherkontingent für HTML-Dokumente, Stylesheets, Bilder, Videos oder Datenbanken. Das Aufspielen der Daten erfolgt in der Regel über das File Transfer Protocol (FTP) und ein Client-Programm (FTP) wie FileZilla oder WinSCP. Ein Webhosting-Paket sollte so gewählt werden, dass sich der Webspace bei Bedarf erweitern lässt.

Datenbank

Sollen Webseiten nicht statisch auf dem Webserver bereitgestellt, sondern bei jedem Seitenaufruf bedarfsgerecht generiert werden, greifen Webentwickler meist auf relationale Datenbanken zurück. Bei dieser Art der Datenverwaltung werden Informationen als Datensätze in Tabellen strukturiert und durch IDs mit anderen Datensätzen in Beziehung gesetzt. Der Abruf und die Bearbeitung von Datenstrukturen erfolgen in der Regel über die Datenbanksprache SQL (Structured Query Language). Eines der weltweit verbreitetsten relationalen Datenbanksysteme für dynamische Webauftritte dieser Art ist die Open-Source-Software MySQL.

Steht die Basis des Webprojekts in Form eines Webhosting-Pakets oder Servers, haben Nutzer verschiedene Möglichkeiten, eine eigene Website zu erstellen. Die Bandbreite reicht von der intuitiven Webseiten-Software mit eingeschränkten Gestaltungsmöglichkeiten über flexible Content-Management-Systeme (CMS) bis hin zum selbst geschriebenen Quellcode. Während sich Homepage-Baukästen nach dem WYSIWYG-Prinzip („What You See Is What You Get“) in erster Linie an Einsteiger ohne Programmierkenntnisse richten, erfordert der Betrieb eines CMS ein gewisses Vorwissen. Maximale Freiheit sichern sich Webentwickler, die ihr Projekt in einem Editor von Grund auf selbst programmieren. Dies setzt jedoch die Kenntnis grundlegender Programmiersprachen wie HTML, CSS, JavaScript und PHP voraus.

HTML

Die Hypertext-Auszeichnungssprache (Hypertext Markup Language) dient in der Webentwicklung der semantischen Grobstrukturierung digitaler Inhalte durch sogenannte Tags. Auf diese Weise lassen sich Elemente wie Textabschnitte, Überschriften, Grafiken oder Hyperlinks definieren. Ein derart ausgezeichneter Quellcode stellt das Grundgerüst einer jeden Webpage dar. Eine einfache statische Website ist im Grunde nichts anderes als eine Auswahl miteinander verknüpfter HTML-Dokumente. Die aktuelle Version HTML5 erweitert das Markup zudem um Auszeichnungen für Audio- und Video-Elemente. Die visuelle Darstellung der Inhalte hingegen wird durch die Formatierungssprache CSS definiert.

CSS

Bei Cascading Style Sheets (kurz CSS) handelt es sich um die Standard-Formatierungssprache für HTML-Dokumente. Webentwickler nutzen CSS, um den im HTML-Code definierten Elementen Regeln für die Darstellung im Browser zuzuweisen. Der aktuelle Standard CSS3 umfasst neben Anweisungen für Layout, Farbgebung und Typografie auch Animationen, Farbverläufe und Schatten.

JavaScript

Moderne Webseiten interagieren mit ihren Besuchern durch interaktive Eingabefelder, ausklappbare Menüs oder Slideshows. Sollen dynamische Inhalte dieser Art in eine HTML-Seite integriert werden, kommt JavaScript zum Einsatz. Die Skriptsprache erweitert das Grundgerüst aus HTML und CSS, indem Benutzerinteraktionen ausgewertet und Seiteninhalte nachgeladen, aktualisiert oder verändert werden.

PHP

Während statische Webseiten abrufbereit auf dem Webserver liegen, werden dynamische Webseiten erst bei der Anforderung durch einen Webbrowser generiert. Möglich machen dies Skriptsprachen wie PHP. Eine PHP-Programmierung wird serverseitig interpretiert. Statt den Quellcode dynamischer Webseiten direkt an den Browser auszuliefern, übermittelt der Webserver die Datei an einen PHP-Interpreter. Dieser erzeugt die angeforderte Webseite – oft auf Basis von in Datenbanken hinterlegten Informationen – und gibt diese an den Webserver zurück, von wo aus die Interpreter-Ausgabe an den Browser gesendet wird. Weitere Skriptsprachen zur Entwicklung dynamischer Webseiten sind Perl und Python.

Insbesondere wenn man komplexere Webprojekte selbst programmiert, ist das Testen ein wichtiger Bestandteil der Qualitätssicherung. Für die Webentwicklung stehen dafür verschiedene Testing-Werkzeuge zu Verfügung. Sollen nur Bestandteile des programmierten Webprojekts getestet werden, greift man auf Modultests zurück. Dafür wiederrum gibt es verschiedene Tests-Frameworks, wie beispielsweise PHPUnit für PHP oder JSUnit für JavaScript.