You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
226 lines
12 KiB
HTML
226 lines
12 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
|
|
<html><head><title>Entwurfskriterien und Erfahrungsbericht über die Erstellung der Homepage</title>
|
|
|
|
|
|
|
|
<meta name="author" content="Rolf-Fredrik Matthaei">
|
|
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
|
|
<script type="text/javascript" language="Javascript" src="Entwurfskriterien-Dateien/navigate.js">
|
|
</script>
|
|
|
|
<link rel="stylesheet" type="text/css" href="Entwurfskriterien-Dateien/gelb.css"></head><body>
|
|
<table align="center" border="2" bordercolor="red" cellpadding="5" cellspacing="0">
|
|
<tbody><tr>
|
|
|
|
<td colspan="2" bgcolor="#003366">
|
|
<h4 align="center"><font color="white">Entwurfskriterien und Erfahrungsbericht über die Erstellung der Homepage</font></h4>
|
|
</td>
|
|
<td valign="top"><a href="http://home.arcor.de/fredrik.matthaei/HTML/index.htm" onmouseover="MausDrauf(0)" onmouseout="MausWeg(0)"><img src="Entwurfskriterien-Dateien/zurueckoff.gif" border="0" height="19" width="32"><br>
|
|
Auswahlseite</a></td>
|
|
</tr>
|
|
</tbody></table>
|
|
|
|
<table align="center" border="2" bordercolor="red" cellpadding="5" cellspacing="0" width="600">
|
|
<tbody><tr>
|
|
<td>"Fredriks Homepage" ist seit Mitte 2000 im World Wide Web. Seitdem
|
|
ist sie -aber das geht den meisten Homepages so- ständig umgebaut und
|
|
erweitert worden.
|
|
<p>Im Laufe der Zeit habe ich einige Editoren ausprobiert.</p>
|
|
|
|
<p>Fast alle der jetzigen Bestandteile sind mit dem Editor "Ulli
|
|
Meybohms HTML EDITOR" entstanden. Dies ist ein komfortabler
|
|
Freeware-Editor. Er ist quelltextorientiert, erfordert also gewisse
|
|
HTML-Kenntnisse.</p>
|
|
|
|
<p>Wenn man im Quelltext herumbastelt, schleichen sich leicht Fehler ein. Dagegen hilft <a href="http://www.w3.org/People/Raggett/tidy.exe" target="_blank">Tidy</a>, ein Fehlerkorrekturprogramm, das ebenfalls als Freeware von vielen
|
|
Webseiten herunter geladen werden kann. Thorsten Vitt hat ein <a href="http://vitt.tsx.org/" target="_blank">Plugin</a>
|
|
als Freeware bereitgestellt, das Tidy und Ulli Meybohms HTML EDITOR
|
|
miteinander verbindet. Die Tidy-Version vom
|
|
1.Januar 2002 verfälscht allerdings bei Imagemaps den Eintrag
|
|
usemap, so dass die Imagemap mit dem Netscape-Browser von Unix und
|
|
Linux unter Umständen nicht funktioniert.</p>
|
|
|
|
<p><b>Java</b> benutze ich überhaupt nicht. Ich habe mich mit Java
|
|
beschäftigt und auch ein wenig damit programmiert. Aber es bringt mir
|
|
keinen Spaß zu sehen, dass die gleichen Applets bei dem einen Browser
|
|
funktionieren und bei dem
|
|
anderen nicht.</p>
|
|
|
|
<p><b>Javascript</b> benutze ich nur sehr sparsam im wesentlich als
|
|
Spielerei bei den Navigationsicons. Andere Dinge, wie Laufschrift,
|
|
Datumsberechungen u.ä. hatte ich früher verwendet, aber der Nutzen ist
|
|
minimal. Hinzu kommt, dass einige
|
|
Benutzer Java und Javascript abgeschaltet haben. Sie sind wohl um die
|
|
Sicherheit besorgt und ärgern sich über Pop-Up-Fenster.</p>
|
|
|
|
<p><b>Rückwärtssprünge mit Javascript</b> lassen sich sehr einfach programmieren, indem man codiert:<br>
|
|
<A href="javascript:history.back()">Zur vorigen Seite zurück</A><br>
|
|
Ich habe auf diese Möglichkeit verzichtet, da sie genau dann nicht in
|
|
meinem Sinne funktioniert, wenn der Besucher über eine Suchmaschine
|
|
oder einen externen Link auf die betreffende Seite gelangt ist. Sie
|
|
funktioniert wohl auch nicht,
|
|
wenn der Besucher Javascript bei seinem Browser abgeschaltet hat.</p>
|
|
|
|
<p><b>Cookies</b> lassen sich mit Javascript recht einfach
|
|
programmieren. Bei meiner Homepage werden aber keine Cookies gesetzt.
|
|
Sie würden nur dann Sinn machen, wenn man einen Internetprovider
|
|
benutzt, der CGI-Unterstützung für Cookies
|
|
anbietet. Davon abgesehen, ist die Anwendung von Cookies etwas
|
|
umstritten.</p>
|
|
|
|
<p><b>Frames</b> habe ich als nützlich empfunden. Trotzdem habe ich
|
|
versucht, auf sie weitgehend zu verzichten, denn sie nehmen Platz auf
|
|
dem Bildschirm weg. Wenn ich sie verwende, ist die Grenzlinie zwischen
|
|
den Frames immer verschiebbar
|
|
gehalten, damit der Benutzer sich den Bildschirm nach eigenen
|
|
Vorstellungen einteilen kann.
|
|
</p><p>Ein Pferdefuss tritt in Erscheinung, wenn jemand durch eine
|
|
Suchmaschine die Website findet, die Teil eines Frames ist. Es gibt
|
|
zwei Möglichkeiten<b>:</b></p>
|
|
|
|
<ul>
|
|
<li>Die Suchmaschine verweist auf den Navigationsrahmen. In der Anzeige
|
|
der Suchmaschine steht dann meistens als Erläuterung ein Teil der
|
|
Fehlermeldung, beispielsweise<b>:</b> "Leider unterstützt Ihr Browser keine Frames - wollen Sie sich nicht mal einen etwas neueren Browser beschaffen?"</li>
|
|
|
|
<li>Oder die Suchmaschine verweist auf eine Inhaltsseite. Der "Kunde"
|
|
öffnet sie, schaut sie sich an - nur ohne den dazugehörigen
|
|
Navigationsrahmen kann er weder vor noch zurück.</li>
|
|
</ul>
|
|
|
|
<p>Um das zweite Problem zu umgehen, habe ich auch in den Inhaltsseiten Navigationselemente angebracht.</p>
|
|
|
|
<p><b>CSS-</b> Die Stilvorgaben sind nützlich und tragen zu einem guten
|
|
und einheitlichen Erscheinungsbild bei. Ich verwende sie lediglich für
|
|
die Auswahl der serifenlosen Schrift,
|
|
denn sie erleichtern das Editieren auf Quellencodebasis nicht.
|
|
Angeblich sind auf Bildschirmen serifenlose Schriften besser lesbar als
|
|
Schriften mir Serifen. Bei gedruckten Texten ist es genau umgekehrt.</p>
|
|
|
|
<p>Zur Unterstützung der Druckausgabe findet sich in einigen meiner Seiten ein Seitenvorschub. Der Befehl dazu lautet:<br>
|
|
<b><br clear="all" style='page-break-before:always'></b></p>
|
|
|
|
<p><b>Hochladen (Upload):</b> Um die geänderten Bestandteile an den
|
|
Provider zu schicken, verwende ich das Programm “ftp-uploader”. Man
|
|
kann es sich zum Ausprobieren als funktionsreduzierte Sharewareversion
|
|
bei
|
|
www.ftp-uploader.de herunterladen. Es führt den kompletten ftp-Vorgang
|
|
durch und schickt nur die Dateien zum Server, die sich seit dem letzten
|
|
Mal geändert haben oder die dazugekommen sind. Außerdem beinhaltet es
|
|
einen recht ordentlichen
|
|
ftp-Klienten. Wenn die Homepage etwas umfangreicher geworden ist,
|
|
reicht schnell die Sharewareversion nicht mehr aus und man kann sich
|
|
dann gegen einen angemessenen Preis registrieren lassen.</p>
|
|
|
|
<p><b>Hintergrundbilder-</b> Fast jeder Themenbereich hat sein eigenes
|
|
Hintergrundbild bekommen. Es handelt sich hier zumeist um eine
|
|
Verkleinerung eines der Bilder, die zu dem Thema gehören. Die
|
|
Hintergrundbilder sind in jedem Fall
|
|
farbverfremdet, so dass die Kontraste stark reduziert sind und die
|
|
Farben blasser erscheinen. Damit man die Schrift trotzdem lesen kann,
|
|
befindet sich die Normalschrift <b>immer</b> auf einem hell gehaltenen Hintergrund <b>ohne</b>
|
|
Hintergrundbild.</p>
|
|
|
|
<p><b>Zusatzfenster</b> werden, sofern sie sich auf der eigenen
|
|
Homepage beziehen, in einem einzigen immer gleichen Fenster gehalten.
|
|
Das bedeutet, es erscheint nur ein einziges Zusatzfenster, solange man
|
|
meine Homepage nicht verlässt.</p>
|
|
|
|
<p><b>Zugriffstatistiken-</b> Auf der ersten Seite (der sogenannten
|
|
Indexseite, ziemlich am Ende der Seite) werden Zugriffstatistiken
|
|
geführt. Sie sind nachvollziehbar, d.h., durch Anklicken der Icons kann
|
|
man sich Jeder über den Umfang
|
|
und Inhalt der Statistiken informieren. Ein Rückschluss auf die
|
|
Identität des Benutzers ist nicht möglich.</p>
|
|
|
|
<p><b>Suchmaschinen-</b> Praktisch alle externen Anfragen zu meiner Homepage kommen über Google. Daraus kann man schließen<b>:</b> es reicht aus, sich bei einer einzigen Suchmaschine (eben bei Google) anzumelden.</p>
|
|
|
|
<p><b>Aufgeteilte Homepage-</b> Meine Homepage ist auf zwei Provider
|
|
aufgeteilt. Ursprünglich sollte sie bei nur einem Provider (Arcor)
|
|
liegen. Leider hatte Arcor im Spätsommer 2002 die bis dahin kostenlosen
|
|
Homepages ab einer bestimmten
|
|
Größe und einem bestimmten Verkehrsaufkommen kostenpflichtig gemacht.
|
|
Aus diesem Grund liegen einge Teile meiner Homepage beim Provider
|
|
Compuserve. Die Aufteilung
|
|
der Homepage auf mehrere Provider erschwert die Pflege der Homepage.
|
|
Andererseits liefert sie einige externe Links zur Homepage, und dies
|
|
wiederum ergibt bei den Suchmaschinen eine bessere Bewertung.</p>
|
|
|
|
<p><b>Rechtschreibung und tote Links-</b> leider habe ich für beides
|
|
noch keine befriedigende Lösung gefunden. Es ist mir bekannt, dass sich
|
|
trotz Einsatz eines Prüfprogrammes viele Rechtschreibfehler auf den
|
|
Seiten befinden. Ich verwende
|
|
das Freewareprogramm "CSE HTML Validator Lite v3.50", um die
|
|
Rechtschreibung wenigstens etwas zu verbessern. Dies Programm lässt
|
|
sich bei www.htmlvalidator.com zusammen mit zwei Wörterbüchern
|
|
(deutsche Rechtschreibung vor und nach der
|
|
Rechtschreibreform) herunterladen. Es führt zusätzlich eine Überprüfung
|
|
der logischen Struktur der HTML-Seite durch.</p>
|
|
|
|
<p>Die Links habe ich zumindest bei der Erstellung der Seiten geprüft;
|
|
eine regelmäßige Überprüfung ist jedoch praktisch nicht machbar.
|
|
Zumeist führen die Links zu einer Unterseite einer Website, nicht auf
|
|
die Startseite. Wenn sich die
|
|
Adresse der Unterseite nicht geändert hat, ist dies die beste
|
|
Möglichkeit. Zuverlässiger ist ein Link auf die Startseite der
|
|
verlinkten Website. Allerdings muss dann der Gast dort selbst nach dem
|
|
gewünschten Thema suchen.</p>
|
|
|
|
<p><b>Wahrheitsgehalt-</b> hier ist es wie bei den Links. Ich versuche,
|
|
nur Tatsachen zu bringen. Tatsachen beruhen jedoch auf Quellen, und
|
|
heutzutage ist neben eigener Anschauung und Literatur das Internet <b>die</b> Informationsquelle
|
|
überhaupt. Bei gefundenen Widersprüchen oder Unsicherheiten über den Wahrheitsgehalt weise ich auf diese hin.</p>
|
|
|
|
<p><b>index.htm-</b> Jedes Verzeichnis auf dem Server benötigt eine
|
|
eigene Datei mit dem Namen index.htm. Fehlt diese Datei, so ist unter
|
|
Umständen der gesamte Inhalt des betreffenden Verzeichnisses auf dem
|
|
Server sichtbar, wenn man sich
|
|
das entsprechende Verzeichnis mit ftp anschaut. Der Inhalt einer
|
|
solchen Datei "index.htm" in einem Unterordner kann sich auf einen Link
|
|
auf die oberste Seite der Homepage (die auch index.htm heißt)
|
|
beschränken, z.B. so:</p>
|
|
|
|
<pre><html>
|
|
<head>
|
|
</head>
|
|
<body>
|
|
<a href="../index.htm">Hier geht es nach Fredriks Homepage</a>
|
|
</body>
|
|
</html>
|
|
</pre>
|
|
|
|
Häufig kann man diese Datei mit einem sinnvollen Inhalt füllen<b>:</b>
|
|
es kann eine Framedefinition oder eine Auswahlseite sein, mit der die
|
|
Navigation innerhalb dieses Teils der Homepage gesteuert werden soll.
|
|
<p><b>Favoriten-Icon:</b> Beim Internet-Explorer heißen die
|
|
Lesezeichen bzw. Bookmarks "Favoriten". Wenn Sie beim Internet-Explorer
|
|
die Startseite meiner Homepage als Favorit abgelegt haben, sollte ein
|
|
besonderes Icon angezeigt werden.</p>
|
|
|
|
<p>Dies wird durch zwei Dinge erreicht<b>:</b> eine 16 mal 16 Pixel
|
|
große Datei mit dem vorgeschriebenen Namen favicon.ico im gleichen
|
|
Verzeichnis wie die Startseite auf dem Webserver, und den Eintrag<br>
|
|
<b><link rel="SHORTCUT ICON"href="http://home.arcor.de/fredrik.matthaei/favicon.ico"></b><br>
|
|
im Head-Bereich der Datei HTML-Datei für die Startseite (es ist die
|
|
Datei index.htm). Das Verfahren ist im Web an mehreren Stellen
|
|
beschrieben, so dass ich keine weitere Erklärungen dazu bringen möchte.</p>
|
|
|
|
<p><b>Downloadsperre für Bilder:</b> Gelegentlich wundert man sich,
|
|
wieso man von Webseiten die Bilder durch Anklicken mit der rechten
|
|
Maustaste nicht herunterladen kann. Der Trick ist ein einfacher
|
|
Javascript, der auf der Webseite mit
|
|
angegeben ist.</p>
|
|
|
|
<p>Der Script verhindert die Verwendbarkeit der Maustasten und des
|
|
Contextmenues, die man zum Herabladen der Bilder benötigt. Der Surfer
|
|
kann diese eher lächerliche Maßnahme dadurch umgehen, dass er entweder
|
|
die Seite komplett
|
|
herunterlädt, oder dass er Javascript abschaltet, oder im Cache des
|
|
Browsers sich die entsprechenden Dateien sucht. Ich sehe keinen Sinn in
|
|
einer solchen "Schutzmaßnahme", denn sie verärgert ausgerechnet
|
|
Diejenigen, denen die Webseite so
|
|
gut gefällt, dass sie Teile dauerhaft speichern möchten.</p>
|
|
</td>
|
|
</tr>
|
|
</tbody></table>
|
|
</body></html> |