[PHP] Websitegestaltung ohne Frames
Dies ist meine Informatik-Facharbeit zum o.g. Thema. Geschrieben habe ich sie am 06.04.2005 und natürlich habe ich in der Zeit seitdem (und eigentlich auch schon vor der Abgabe) vieles dazugelernt, womit man das, was im folgenden ausgeführt wird, wesentlich verbessern könnte. Dennoch präsentiere ich euch die Facharbeit so wie ich sie abgegeben habe.
Inhaltsverzeichnis:
- 1.) Einleitung
- 2.) HTML
- 3.) PHP
- 3.1.) Verbesserung der Homepage durch PHP
- 3.2.) Ein Kontaktformular
- 3.3.) Ein Gästebuch
- 4.) Anhang
- 5.) Literaturverzeichnis
1.) Einleitung
In dieser Facharbeit wird erklärt, wie man eine Website ohne Frames gestalten kann, ohne das Menü oder andere immer wiederkehrende Elemente in jede Datei schreiben zu müssen.
HTML-Kenntnisse werden dafür vorausgesetzt und nicht näher erläutert.
Die großen Quelltexte zu den Beispielseiten befinden sich im Anhang und werden nicht mit in den Text eingebunden.
2.) HTML
2.1.) Eine einfache Homepage ohne Frames
| Quelltext: | |
1 |
|
Diese einfache Seite besteht aus dem HTML-Grundgerüst und einer simplen Tabellenkonstruktion, die eine Zeile und zwei Spalten umfasst.
| Das HTML-Grundgerüst: | |
1 |
|
Die Tabelle hat eine Rahmendicke von einem Pixel, keine Innenabstände in den Zellen und auch keine Abstände zwischen den Zellen. Dies wird mit den Attributen border="1" align="center" cellspacing="0" cellpadding="0" im <table>-Tag festgelegt.
In der linken Spalte befindet sich das Menü (die Navigation), mit dessen Hilfe man auf die anderen Seiten gelangt. In der rechten Spalte steht der Inhalt der aktuellen Seite.
Mit <td align="left" valign="top"> wird angegeben, dass eine neue Tabellenzelle beginnt, deren Inhalt linksbündig und am oberen Rand ausgerichtet ist.
Die Links im Menü erhalten mit • einen kleinen Punkt (•) als Listenzeichen, zur besseren Übersicht.
Zwischen <head> und </head> (dem einleitenden und abschließenden Tags für den Kopf der Seite) könnten mit CSS (Cascading StyleSheets) noch einige Formatierungen definiert werden. Möglich sind u.a. Angaben zur Farbgebung, Schriftgrößen und -arten, Rahmenbreite und -aussehen, Textausrichtungen usw..
Mit <br /> werden Zeilenumbrüche erzwungen. Da <br /> keinen abschließenden Tag besitzt, wird er mit einem Schrägstrich im selben Tag abgeschlossen. Dies muss seit XHTML 1.0 (Extended Hypertext Markup Language) mit allen Tags standardmäßig geschehen, die keinen abschließenden Tag haben.
Alles, was zwischen <a> und </a> steht, ist ein Link, dessen Ziel mit href angegeben wird.
2.2.) Probleme dieses Aufbaus
Das Hauptproblem beim Aufbau von Websites mit dieser Methode besteht darin, dass man das Menü in jeder Datei braucht. Das bedeutet für eventuelle Änderungen am Menü, dass jede Datei einzeln angepasst werden muss. Bei großen Websites entstünde so ein gewaltiger Zeitaufwand.
Auch müssen in jeder Datei das HTML-Grundgerüst und die Tabellenkonstruktion vorhanden sein. Bei aufwendigen Seiten mit vielen, ineinander verschachtelten Tabellen kann das schnell zu Verwirrung und damit zu Fehlern führen.
Für diese Probleme müssen Lösungen gefunden werden.
Eine Lösung dafür wären sogenannte Frames (engl. Rahmen), deren Handhabung allerdings nicht sonderlich einfach ist. Werden die einzelnen Seiten, die durch die Frames zur Website zusammengesetzt werden, zu lang, tauchen viele Scrollbalken auf, die den Inhalten den Platz nehmen können und beim Betrachter nur Verwirrung stiften. Zudem ist es oft auch schwierig, die Rahmen der Frames (vergleichbar mit den Tabellenrahmen) zu entfernen, ohne dass sichtbare Übergänge zurückbleiben. Und es gibt immer noch genug Browser, die Framekonstruktionen nicht interpretieren und somit die Website nicht anzeigen können.
3.) PHP
3.1.) Verbesserung der Homepage durch PHP
Voraussetzung für diese Art der Homepagegestaltung ist ein Server mit PHP ab Version 3. Das Endprodukt ähnelt später der framelosen Tabellenkonstruktion. Dank PHP und der Funktion include() (include = einfügen), werden einzelne Dateien zu einer Datei zusammengesetzt. Auf diese Weise braucht man nur noch eine Datei mit der Tabellenkonstruktion und Dateien, die die jeweiligen Inhalte enthalten.
Die framelose Seite wird in folgende Dateien aufgespaltet:
- index.php --> enthält die Tabellenkonstruktion
- navi.tpl --> enthält die Navigation aus der linken Zelle
- seite1.tpl --> enthält den Inhalt der ersten Seite
- seite2.tpl usw.
Die Dateiendung tpl kann auch durch andere Endungen, wie z.B. txt ersetzt werden. Die Abkürzung tpl steht hierbei für Template (Schablone).
Die Quelltexte befinden sich im Anhang.
In der index.php wurde die komplette Navigation durch <?php include("navi.tpl"); ?> ersetzt. Mit <?php wird der PHP-Code eingeleitet. In HTML wird das entsprechend mit <html> gemacht.
Mittels include("navi.tpl"); wird die Datei navi.tpl, die die Navigation enthält, in die index.php eingefügt.
In PHP ist es sehr wichtig, dass nach jedem Befehl ein Semikolon (;) steht, da sonst eine Fehlermeldung ausgegeben wird.
Da in der Navigation mehrere Seiten zur Auswahl stehen, die in die Tabellenkonstruktion eingefügt werden können, braucht man eine so. switch-case-Abfrage (switch = Wechsel, Weiche, Schalter; case = Fall, Umstand). Diese vergleicht den Wert einer Variablen mit angegebenen Möglichkeiten und führt entsprechende Befehle aus. Bei dieser Seite gibt es die Variable "site", die ihren Wert über die Links (<a href="?site=seite1">Seite 1</a>) in der Navigation erhält. Da die Navigation in die index.php eingefügt wird, sind die Links auch ein Teil dieser Seite. Nach erfolgtem Klick auf den Link, sieht die URL der Seite folgendermaßen aus: http://www.domain.de/index.php?site=seite1
Mit dem Fragezeichen wird angegeben, dass eine Variable folgt; in dem Fall die Variable site. Sie erhält den Wert seite1.
Folgen weitere Variablen, werden diese mit einem kaufmännischen Und (&) miteinander verknüpft. Zum Beispiel: ?site=seite1&var=2
Die switch-case-Abfrage erhält damit also einen Wert, den es zu vergleichen gilt. Ist der Wert von site gleich seite1, wird die Datei seite1.tpl eingefügt, die den Inhalt der ersten Seite enthält.
Hat die Variable site keinen Wert oder einen Wert, der nicht angegeben wurde, wird die Anweisung hinter default: (default = Nichterfüllung, Vorgabe) ausgeführt.
Bei switch-case-Abfragen muss am Ende jeder Zeile ein break; (break = Abbruch) stehen, da sonst alle nachfolgenden Befehle auch noch ausgeführt würden.
3.2.) Ein Kontaktformular
Ein Kontaktformular bildet den einfachsten Weg der Kommunikation zwischen Besuchern und Webmaster einer Homepage. Darüber lassen sich Fragen stellen, Fehler melden oder Kritiken abgeben.
PHP besitzt die Funktion mail() (to mail = versenden; mail = Post), mit deren Hilfe man eMails verschicken kann.
Allgemein ausgedrückt lautet der Befehl:
mail(Empfänger, Betreff, Nachricht, Header) Der Empfänger ist die eMail-Adresse der Person, die die eMail erhalten soll. Im Betreff steht ein String, der in der Betreffzeile des eMail-Clients angezeigt werden soll. Die Nachricht erklärt sich von selbst. Im Header stehen zusätzliche Informationen zur eMail, wie etwa das Format (HTML oder Text) oder die Wichtigkeit.
Zuerst benötigt man das eigentliche Formular, das zwischen <form> und </form> steht. Als Ziel (action) gibt man die gleiche Datei an, in der sich auch das Formular befindet: action="?site=kontakt".
In das Formular kommen dann sämtliche Eingabefelder. Vom Namen, über die eMail-Adresse, zum Text. Einige unsichtbare Felder, die Informationen für die eMail enthalten und auch solche, die für die Verarbeitung später (<input type="hidden" name="sent" value="1" />) gebracht werden. Einen Button zum Absenden der Daten und einen zum Löschen und das Formular ist fertig.
Wird das Formular abgeschickt, werden alle Eingaben in Variablen (name="XYZ") gespeichert und an den PHP-Teil der Datei gesendet. Dort wird zuerst einmal die Variable sent auf ihren Wert überprüft: if(sent==1). Ist der Wert 1, so wurde das Formular abgeschickt. Nun muss geprüft werden, ob auch alle Felder ausgefüllt wurden: if($name and $email and $betreff and $nachricht). Ist dies nicht der Fall, wird sofort eine Fehlermeldung ausgegeben:
| PHP: | |
1 |
|
Sind alle Angaben gemacht worden, werden im Nachrichtentext alle unnötigen Zeilenumbrüche am Anfang und am Ende des Textes mit der Funktion nl2br($nachricht); entfernt - die "Korrektur" wird in der Variablen $message gespeichert. Danach wird der Header (Kopf) der eMail deklariert. Im Beispiel wird lediglich angegeben, wer der Absender der eMail ist ($header="from: $email";). Im Anschluss daran wird die eigentliche eMail generiert, indem alle Eingaben in einer Variable gespeichert werden ($text="$name -- $email -- Betreff: $betreff -- Text: $message ---- IP: $ip";).
Dann wird die eMail an den Empfänger, der ebenfalls im Formular in einem unsichtbaren Feld angegeben wurde (<input type="hidden" name="empfaenger" value="webmaster@madman-maniac.de" />), gesendet (mail($empfaenger, $betreff, $text, $header);) und es wird ein kurzer Text ausgegeben, der über den Erfolg des Vorgangs aufklärt (echo "<div align=\"left\">Danke, ".$name.", die E-Mail wurde versandt.</div>";).
Mit echo "TEXT"; können Zeichenketten ausgegeben werden. Diese können auch HTML-Tags beinhalten, allerdings muss in den Zeichenketten vor allen Anführungszeichen ein Backslash (\) stehen, da die Zeichenkette selbst auch zwischen Anführungszeichen stehen muss und PHP sonst durcheinanderkommt. Um einen Backslash in einer solchen Zeichenkette auszugeben, müssen zwei Backslashs aufeinanderfolgen (\\). Ebenso verhält es sich mit dem Dollar-Zeichen (\$), da dieses in PHP eine Variable einleitet.
Will man den Inhalt einer Variablen mitten in einer Zeichenkette ausgeben, so wird die Zeichenkette zuerst mit den Anführungszeichen beendet, gefolgt von einem Punkt, dann der Variablenname, noch ein Punkt und die Zeichenkette mit neuen Anführungszeichen wieder einleiten: echo "<div align=\"left\">Danke, ".$name.", die E-Mail wurde versandt.</div>";. Es ist auch möglich, die Variable ohne Unterbrechungen direkt in die Zeichenkette einzufügen, aber das wäre "unsauber" programmiert.
Mit <input type="hidden" name="ip" value="<?php echo $_SERVER['REMOTE_ADDR']; ?>" /> wird der Variablen ip die aktuelle IP (Internet Protocol) des Benutzers zugewiesen. Das ist eine reine Schutzmaßnahme, um eventuellem Spam (unerwünschte eMails; Spam = engl. Frühstücksfleisch) nachgehen zu können.
3.3.) Ein Gästebuch
In ein Gästebuch können sich die Besucher einer Website eintragen und Lob/Kritik, Grüße, Wünsche etc. äußern. Es besteht aus einem Formular, in das die Besucher ihren Text und ihre Daten eingeben können, einer Seite, die die Eintr&auuml;ge geordnet anzeigt, einer Administrationsseite, auf der der Webmaster Einträge freischalten, sperren oder löschen kann und einer Seite, die wieder alle Seitenteile zusammensetzt. Die Quelltexte hierzu befinden sich wieder im Anhang.
Hierzu ist eine mySQL-Datenbank nötig, in der alle Einträge gespeichert werden. Es muss also zuerst einmal eine entsprechende Tabelle angelegt werden. Dazu werden in phpmyadmin (ein Programm, mit dessen Hilfe man mySQL-Datenbanken verwalten kann) folgende Befehle ausgeführt:
| SQL: | |
1 |
|
Damit wird eine Tabelle namens "guestbook" angelegt, die die Spalten id, name, email, hp, icq, ip, datum, uhrzeit, message und check umfasst.
Mit `id` INT( 14 ) UNSIGNED NOT NULL AUTO_INCREMENT , wird beispielsweise eine Spalte namens id erzeugt, die vom Typ Integer ist, also nur Ganzzahlen beinhalten kann. Zudem kann diese Zahl nur eine Länge von 14 Zeichen umfassen. Die Daten in dieser Spalte sind unsigniert und dürfen nicht Null sein. Außerdem erhöht sich der Wert ganz von selbst jeweils um eins.
Damit werden die Einträge später sortiert, sodass der jüngste Beitrag ganz oben im Gästebuch steht.
Mit `check` VARCHAR( 2 ) DEFAULT '-1', wird eine Spalte erzeugt, deren Inhalt aus maximal zwei verschiedenen Zeichen (Buchstaben, Zahlen, Sonderzeichen) bestehen kann. Standardmäßig ist der Inhalt aber -1.
Hierüber wird entschieden, welche Einträge freigeschaltet (1) oder gesperrt (-1) sind.
In der index.php wird wieder entschieden, welche Datei eingefügt und damit angezeigt werden soll.
Standardmäßig wird die gb.php eingefügt und angezeigt. Sie gibt alle Gästebucheinträge aus.
Zuallererst wird festgelegt, wie viele Einträge pro Seite ausgegeben werden sollen: $anzeigen=15;. Anschließend wird geprüft, ob man bereits eine Seite vor oder zurück gegangen ist, denn dementsprechend werden die Einträge und später auch die vor- und zurück-Links ausgegeben.
Dann werden die Einträge ausgelesen und in einem Array gespeichert. Dazu wird zuerst festgelegt, welche Tabelle in der Datenbank angesprochen werden soll ($tabellenname = "guestbook";), es wird eine Verbindung zum Datenbank-Server erstellt ($link = mysql_connect("SERVER", "NAME", "PASSWORT");), die richtige Datenbank wird ausgewählt (mysql_select_db("DATENBANK", $link);) und der Befehl, der an die Datenbank gesendet werden soll, wird erstellt ($sql = "SELECT * FROM $tabellenname WHERE `check`='1' ORDER BY `id` DESC LIMIT $start , $anzeigen";) - hierbei sollen die 15 ($anzeigen) Datensätze der Tabelle ausgewählt werden, bei denen check den Wert 1 hat, wobei die Datensätze dann absteigend nach ihrer id sortiert werden sollen, angefangen mit dem Xten Datensatz in der Tabelle, wobei X den Wert von $start hat.
Ist all das geschehen, werden alle so erhaltenen Datensätze in der Variable $result zwischengespeichert, sofern kein Fehler passiert ist. Der Inhalt dieser Variablen wird nun in einem Array abgelegt ($ergebnis[$i]=mysql_fetch_array($result);).
Nun wird ermittelt, wie viele freigeschaltete Gästebucheinträge existieren, was wiederum nur für das Blättern der einzelnen Seiten relevant ist.
Nach der Ausgabe des Links zum Eintragen in das Gästebuch werden die Einträge ausgegeben. Und zwar formatiert mit Tabellen. Innerhalb einer for-Schleife, die so oft durchlaufen wird, wie Einträge auf der Seite ausgegeben werden können, wird für jeden Eintrag eine Tabelle erstellt, in deren Zellen sich dann die Einzelteile befinden. Mit $ergebnis[$i][name] wird z.B. vom Eintrag i der Inhalt der Zelle name in die Tabelle geschrieben. Auf diese Weise werden alle Einträge für die Seite durchlaufen und ausgegeben.
Am Ende der Seite werden ggf. Links ausgegeben, mit denen man im Gästebuch vor- oder zurückblättern kann. Der Link zum Zurückblättern wird folgendermaßen zusammengesetzt: if($start>=$anzeigen){ echo "<a href=\"".$PHP_SELF."?limit=".$start."&back=1\">« Zurück</a>"; }. Hier wird geprüft, ob die Variable start größer oder gleich 15 ist. Wenn ja, wird ein Link ausgegeben, dessen URL sich aus der Aktuellen URL ($PHP_SELF), der neuen Grenze (?limit) und der Angabe, dass zurückgeblättert wurde, zusammensetzt.
Der Link zum Vorwärtsblättern wird analog dazu zusammengesetzt.
Die Datei form.php enthält das Eingabeformular und die Tabelle mit den Smilies (auch Emoticons genannt), die man in seinen Beitrag einfügen kann. Außerdem wird über diese Datei jeder eingegangene Eintrag in die Datenbank geschrieben.
Wurde das Formular ausgefüllt und wurde dabei kein Fehler gemacht, dann werden mit dem Befehl trim(); zuerst einmal alle Leerstellen vor/hinter dem ersten/letzten Zeichen entfernt. Im Anschluss daran werden mögliche HTML-Tags mit strip_tags(); entfernt. Dies dient der Sicherheit der Seite und spart Platz in der Datenbank.
Mit $message = nl2br($message); werden Zeilenumbrüche im eingegebenen Text beibehalten.
Sollten die Felder Name und Message nicht ausgefüllt worden sein, so wird eine Fehlermeldung generiert und ausgegeben.
Ist alles korrekt, werden Smiley- und BBCodes (Vereinfachtes und auf ein Minimum an Tags reduziertes HTML; wird oft in Foren, sog. BulletinBoards, angewandt) mit Hilfe der Funktion str_replace("zu ersetzende Zeichenkette", "Ersatz", "zu durchsuchende Zeichenkette"); ersetzt.
Danach wird der Eintrag in die Datenbank geschrieben und eine Bestätigungs-Meldung ausgegeben.
Die admin.php kann man nur mit einem Passwort, welches man direkt in die URL schreiben muss (zum Beispiel: http://www.domain.de/gb/admin.php?pw=1234), aufrufen.
Ist das Passwort korrekt, werden alle(!) Gästebucheinträge untereinander ausgegeben, beginnend mit dem jüngsten Eintrag. Zusätzlich stehen unter jedem Eintrag drei Links, mit denen man den jeweiligen Eintrag sperren, freischalten oder löschen kann.
Zum Freischalten bzw. Sperren von Einträgen macht man sich den SQL-Befehl UPDATE $tabellenname SET `check`='1' WHERE `id`=$id (hier wird ein Beitrag freigeschaltet) zu Nutze. Klickt man allerdings auf den Link zum Löschen eines Eintrages, wird der Befehl DELETE FROM $tabellenname WHERE `id`=$id ausgeführt. Die id des Beitrages wird jeweils über den Link in der URL übergeben.
Im Anhang (Seite 23) befindet sich ein Bild, das die Interaktion des Browsers mit dem Weberver bei einer SQL-Abfrage darstellt.
Ruft man also mit dem Browser eine PHP-Datei auf, werden - anders als bei HTML - die Befehle direkt auf dem Weberver ausgeführt. Dieser stellt ggf. eine Verbindung zum SQL-Server und somit zur Datenbank her. Dieser sendet die geforderten Informationen zurück an den Webserver, von wo aus alles an den Browser des Benutzers weitergeleitet wird.
Eine PHP-Datei wird also erst im Browser angezeigt, wenn alle Anfragen auf dem Webserver abgearbeitet wurden.
4.) Anhang
Der Anhang kann im PDF-Download weiter unten gefunden werden. Es wäre zu viel, die ganzen Quelltexte hier auch noch reinzustellen.
5.) Literaturverzeichnis
Bücher:
Born, Günther, HTML/XHTML. Das Programmier-Handbuch. München 2001
Peyton, Christine, PHP. Der leichte Einstieg. München 2002
Internetadressen:
http://www.uni-giessen.de/~g004/php/startseite.htm --> PHP-Client, 02.03.2005
http://www.uni-giessen.de/~g004/php/mysql/mysqlserver4.gif, 02.03.2005
http://www.madman-maniac.de/, 20.03.2005
Download: informatik_facharbeit_06042005.pdf
