|
| |
Ausführliche und auch für Anfänger geeignete Anleitung
zum Erstellen von HTML-Dateien mit allen Tags und Attributen
und vielen Beispielen.
Die Anleitungs ist selbst in HTML erstellt und kann online
gelesen werden oder komplett heruntergeladen werden.
Der Web-Server von EBE-Online bietet eine Möglichkeit, die Zugriffe
auf eine beliebige Webseite mitzuzählen und den aktuellen Zählerstand
auf der Webseite als kleine Graphik auszugeben.
Um auf einer eigenen Webseiten einen solchen Zähler auszugeben, muß die folgende
Zeile in den HTML-Code der Seite eingebaut werden:
-
<IMG SRC="http://www2.ebe-online.de/cgi-bin/counter/counter.exe
?link=http://www.ebe-online.de/home/XXXXXXX
&style=odometer
&width=4">
Zeilenschaltungen wurden hier nur zur besseren Lesbarkeit eingefügt.
Der Counter-Aufruf darf eigentlich keine Zeilenschaltungen enthalten und sollte genau genommen
so aussehen:
-
<IMG SRC="http://www2.ebe-online.de/cgi-bin/counter/counter.exe?link=http://www.ebe-online.de/home/XXXXXXX&style=odometer&width=4">
Die einzelnen Zeilen und Parameter bedeuten dabei:
Der Counter-Aufruf ist in einen normalen IMG-Tag eingebunden.
Dieser IMG-Tag kann behandelt werden wie jeder andere IMG-Tag auch und auch die
gleichen Attribute tragen.
Innerhalb der " " des SRC ist insbesondere auf das ? hinter
dem counter.exe zu achten (?link=; damit werden die einzelnen Argumente
für das Programm eingeleitet) und auf die &-Zeichen vor den einzelnen
Argumenten (&style= und &width=; damit werden die Argumente
voneinander abgetrennt).
Programm-Aufruf
-
<IMG SRC="http://www2.ebe-online.de/cgi-bin/counter/counter.exe
Das ist der eigentliche Programmaufruf (counter.exe). Hier sollte nichts geändert werden!
Überwachte Webseite
-
?link=http://www.ebe-online.de/home/XXXXXXX
Hier wird der vollständige URL der Webseite angegeben, die gezählt werden soll.
Statt der XXXXXXX wird hier also etwa
kobermay/index.htm angegeben,
um die Zugriffe auf meine Webseite zu zaehlen.
Anzeige-Stil
-
&style=odometer
Hier wird das Aussehen der Anzeige festgelegt.
Dabei kann statt odometer aus folgenden Möglichkeiten ausgewählt werden:
-
beach
chalk
curly
cyan
ebeonline
eggs
electric
fancy
frozen
lcd
led
neat
noisy
odometer
oldstyle
orange
red
schrift
scorebrd
sf
speckled
timex
(Auf der Titelseite des EBE-Online-Servers wird "ebeonline" verwendet,
ansonsten erfreut sich "odometer" großer Beliebtheit.)
Stellenzahl der Anzeige
-
&width=4">
So viele Stellen werden angezeigt!
(In den meisten Fällen dürften hier 4 Stellen ausreichen -
womit ich jedoch niemand die Hoffnung auf viele zehntausend Zugriffe nehmen will.)
... noch Fragen?
Wenn es nicht funktioniert, prüfen Sie bitte, ob Sie
alle " ",
alle ? und
alle &-Zeichen
an den richtigen Stellen plaziert haben und ob der Aufruf der zu zählenden Seite
korrekt eingetragen ist!
Im WWW werden zwei Grafik-Formate verwendet, wobei jedes seine speziellen Vorteile und Nachteile hat.
Diese Formate, nämlich gif und
jpg werden kurz und prägnant beschrieben im Rahmen
des in HTML-Tip 1 vorgestellten HTML-Tutorials. Wer mehr darüber erfahren möchte, gehe zu
Grafik-Formate.
Das folgende Beispiel sollte die (richtige) Verwendung dieser tags näher erläutern. Es ist aus dem Buch "HTML - The Definitive
Guide" von Chuck Musciano und Bill Kennedy entnommen, das bei O'Reilly erschienen ist.
Fügt man in den Kopf eines HTML-Dokuments folgende Zeilen ein
-
<meta http-equiv="keywords" content="kumquats, cooking, peeling ,eating">
<meta http-equiv="expires" content="31 Dec 2008">
so wird neben dem eigentlichen Inhalt der HTML-Datei noch folgende Information an den Browser übermmittelt:
-
content-type: text/html
keywords: kumquats, cooking, peeling ,eating
expires: 31 Dec 2008
Dabei wird die Zeile
-
content-type: text/html
natürlich stets, d.h. auch ohne Verwendung von meta-tags, an den Browser übertragen, der daran erkennt, um welche
Art von Datei es sich handelt. Die beiden folgenden Zeilen
-
keywords: kumquats, cooking, peeling ,eating
expires: 31 Dec 2008
können nun zusätzlich von Suchmaschinen für den Eintrag in Suchmaschinen benutzt werden.
Neben der Verwendung des Attributes
http-equiv kann man auch das Attribut
name
verwenden, wobei dann jedoch nur der Eintrag in Suchmaschinen möglich ist, die Übermittlung der Information an den Browser jedoch unterbleibt.
Ein erster wichtiger Gesichtspunkt ist, dass Seiten im Web nicht zu lang sein sollten. Dies betrifft einerseits die Dateigröße
(um zu lange Übertragungszeiten zu vermeiden), andererseits die Größe auf dem Bildschirm (um unnötiges Scrollen zu vermeiden).
Aus diesem Grund sind auch diese HTML-Tips jetzt auf mehrere Seiten aufgeteilt worden.
Seiten sollten auf verschiedenen Bildschirmgrößen gut vom Browser dargestellt werden können. In diesem Zusammenhang
sollte man bei der Verwendung von Frames möglichst dynamische Fensteraufteilungen vorsehen.
Um die Navigation zu erleichtern, sollte man Steuerleisten verwenden. Damit diese auch sichtbar sind (ohne großes Scrollen!) ist es wieder wichtig,
dass die Seiten nicht zu lang sind. Es empfiehlt sich auch, diese Steuerleisten nicht unbedingt rechts anzubringen, um sie
bei verschiedenen Bildschirmgrößen auch stets benutzen zu können.
Generell ist zu sagen, dass man dem Browser einige Freiheit lassen sollte, da in jedem Fall der Benutzer eigene Einstellungen vornehmen kann
und ein zu starres Konzept dann eher zu negativen Effekten führt. Wenn möglich sollte man auch seine Homepage mit verschiedenen Browsern testen.
Obwohl der Internet Explorer von Microsoft heute mit weit über 80% der am
häufigsten verwendete Browser ist, sollte man andere Browser wie Netscape
und Opera nicht vernachlässigen.
Sowohl die Verfasser als auch die Leser von
HTML-Dokumenten sollten sich einiger stilistischer Richtlinien
für HTML bewusst sein. Es gibt gute Gründe dafür, dass viele
HTML-Dokumente über ein ähnliches Layout verfügen. Wenn Sie
sich dieser Gründe bewusst sind, hilft Ihnen dies dabei, sich
bestens innerhalb dieser Seiten zurechtzufinden.
HTML-Autoren sollten drei generelle Richtlinien beim Entwurf
ihrer World Wide Web-Seiten in Betracht ziehen:
- Wartungsfreundlichkeit: Ein
HTML-Dokument kann im Internet für Monate oder gar Jahre
verfügbar sein. Während dieser Zeit werden Änderungen
am Dokument nötig, um Fehler zu berichtigen, neue
Informationen hinzuzufügen und um mit den Änderungen
des Systems, des Internet oder des HTML-Standards selbst
Schritt zu halten.
- Zugriffsmöglichkeit: Nicht alle
verwenden den gleichen Browser, und die heute populären
Browser gibt es morgen vielleicht nicht mehr. Aus diesem
Grund vermeiden umsichtige Designer Merkmale, die
lediglich in bestimmten Browsern zur Verfügung stehen.
Denken Sie daran, dass sich vielfach noch textorientierte
Browser im Einsatz befinden. Tatsächlich ziehen viele
Leute textorientierte Browser vor, weil diese sehr viel
schneller sind und werden sie möglicherweise auch dann
noch weiterverwenden, wenn grafische Browser verfügbar
sind.
- Geschwindigkeit: Die Teilnehmer
verfügen über unterschiedliche Anschlüsse. Jemand, der
über ein langsames Modem zugreift, wird es nicht
besonders schätzen, wenn er bis zu fünf Minuten
auf den Empfang einer großen Abbildung warten muss.
Vielfach werden diese Aspekte weitgehend vernachlässigt und
HTML-Dokumente lediglich für einige gute Freunde mit schnellem Zugang zum
Internet entworfen, die alle den gleichen
Browser verwenden. Viele Geschäftsleute beschäftigen aber auch
professionelle Gestaltungskünstler, die hart arbeiten, um
Dokumente zu erzeugen, die diese Belange berücksichtigen. Es
folgen einige besonders zu berücksichtigende Gedanken:
- Halten Sie es einfach: Professionelle
Designer brauchen Jahre, um die wirkungsvolle Kombination
verschiedener Effekte zu erlernen. Sie lernen das
Ausbalancieren der Effekte, so dass unwichtige Teile des
Entwurfs (wie ein einzelnes hervorgehobenes Wort) nicht
den Rest des Dokuments »erschlagen«. Das Erreichen
dieser Balance wird dadurch erschwert, das jeder Browser
die Dinge etwas anders handhabt. (Beispielsweise weicht
die Ausrichtung von Bildern und Text zwischen
verschiedenen Browsern voneinander ab.) Der wohl am
häufigsten von Schöpfern neuer World Wide Web-Dokumente
begangene Fehler liegt im Einsatz zu vieler
Spezialeffekte.
- Verwenden Sie keine verworfenen Eigenschaften: Bestimmte
HTML-Tags (zum Beispiel XMP, LISTING oder PLAINTEXT)
werden in den Referenzen als verworfen gekennzeichnet.
Diese Kennzeichnung bedeutet, dass sich diese Tags bei
intensiver Nutzung von HTML als wenig sinnvoll erwiesen
haben. Neue Browser unterstützen diese Tags
möglicherweise gar nicht mehr.
- Verwenden Sie Grafiken mit Interlace:
Die GIF-Grafiken in den meisten World Wide Web-Dokumenten
verwenden das Zeilenspringverfahren, bei dem zunächst
jede achte, dann jede vierte Zeile usw. übertragen wird.
Einige Browser zeigen das Bild während der Übertragung
nach und nach an, wodurch man bereits lange vor dem
vollständigen Empfang einen recht guten Eindruck vom
Bild erhält.
- Verwenden Sie Bilder sparsam: Bilder
benötigen viel mehr Übertragungszeit als Text, und
Anwender mit langsamen Verbindungen werden eine Seite
kaum mehrmals aufsuchen, wenn deren Anzeige zu viel Zeit
beansprucht. Wenn Sie ein wenig sorgfältig vorgehen,
können Sie mit einigen kleinen Abbildungen den gleichen
Effekt wie mit einer wesentlich größeren Abbildung
erzielen; diese lassen sich aber schneller laden und
anzeigen.
- Verwenden Sie Skizzen: Grafiken werden
in komprimierter Form übertragen. Je besser sich die
Grafiken komprimieren lassen, desto schneller werden sie
übertragen. Grafiken mit wenigen Farben lassen sich
wesentlich besser komprimieren. Holzschnitte oder
Art-Deko-Bilder können sehr modern aussehen und lassen
sich gleichzeitig gut komprimieren. Grafiken mit weichen
Farbübergängen lassen sich andererseits nur sehr
schlecht komprimieren.
- Lagern Sie große Bilder aus: Statt ein
großes Bild oder Imagemap in die Mitte der Seite zu
stellen, setzen umsichtige Designer kleine Versionen der
Bilder als Verknüpfung zur größeren Version ein. Auf
diese Weise können die Leser Ihrer Seite entscheiden, ob
sie auf das große Bild warten wollen oder nicht.
- Verwenden Sie Bilder mehrmals: Die
meisten HTML-Browser erkennen die Mehrfachnutzung
einzelner Bilder und laden sie nur einmal, auch wenn das
Bild auf vielen verschiedenen Seiten erscheint. Dieses
Verfahren sorgt für farbigere Seiten ohne größeren
Geschwindigkeitsverlust.
- Wählen Sie angemessene Größen:
Verschiedene Arten von Informationen passen auf
verschieden umfangreiche Seiten. Wenn Sie erwarten, dass
ein Text komplett gelesen oder herunter geladen und später
gelesen wird, setzen Sie alle Informationen auf eine
einzige Seite. Wenn Sie erwarten, dass nur kleinere
Abschnitte gelesen werden, verteilen Sie den Text auf
mehrere Seiten, so dass der Leser die interessanten Teile
leicht finden und direkt zu ihnen verzweigen kann.
Vermeiden Sie sehr umfangreiche Seiten, die für manche
Leser ungewohnt sind.
- Verwenden Sie keine Browser-spezifischen
Eigenarten: Wenn eine bestimmte Eigenart nur in
einigen Browsern verfügbar sind, verwenden Sie diese
Eigenart in Ihren Seiten nur vorsichtig. Das Resultat
kann in anderen Browsern seltsam aussehen. Bedenken Sie
auch, dass diese Eigenart in anderen Browsern
möglicherweise bewusst nicht implementiert wurde.
- Vorsicht bei ungewöhnlichen Symbolen:
Der HTML-Standard verwendet gegenwärtig 150 Latin 1,
aber nicht alle Browser haben Zugriff auf diesen
Zeichensatz. Vorsicht bei Nicht-ASCII-Zeichen. Ein
verbreiteter Fehler in HTML-Referenzen ist die
Behauptung, dass Microsoft Windows den ISO Latin
1-Zeichensatz verwenden würde. Diese Aussage ist nicht
richtig. Microsoft Windows unterstützt einige Zeichen,
die in ISO Latin 1 fehlen, unter anderem An- und
Abführungszeichen (» und »), en-Striche und em-Striche
(- und -).
- Verwenden Sie Trennlinien: Insbesondere
in umfangreicheren Dokumenten stellen Trennlinien
(horizontale Linien quer über die Seite) ein einfaches
und effektives Mittel zur Trennung wichtiger Teile dar.
Einige HTML-Autoren haben ersatzweise eine breite
horizontale Grafik verwendet. Wenn Sie dies ebenfalls
machen wollen, seien Sie vorsichtig. Derartige Bilder
verändern ihre Größe nicht mit dem Fenster; Anwender
könnten bei der Änderung der Fenstergröße
Überraschungen erleben.
- Verwenden Sie logische Auszeichnungen:
Auch wenn HTML über Tags verfügt, mit denen Sie
bestimmte Schriftauszeichnungen (fett, kursiv,
unterstrichen) veranlassen können, unterstützen nicht
alle Browser diese spezifischen Effekte. Alle Browser
beherrschen aber irgendeine Form der Hervorhebung.
- Verwenden Sie wenige Schriftarten: Einer
der häufigsten Fehler der Amateur-Grafikdesigner ist die
Verwendung zu vieler Schriftarten. Im allgemeinen sind
Fließtext und Hervorhebungen unter gelegentlichem
Einsatz von CODE- oder SAMP-Tags ausreichend.
- Verwenden Sie für Verknüpfungen mit anderen
Dokumenten einen Ort: Die schlimmsten
Kopfschmerzen hinsichtlich der Dokumentwartung verursacht
bei HTML-Autoren die Kontrolle, ob ihre Verbindungen zu
anderen Dokumenten weiterhin gültig sind. Ein Weg zur
Vereinfachung dieser Aufgabe besteht darin, der
Versuchung zu widerstehen, eine Fülle von Links über
die gesamten Seiten zu verteilen. Wenn Sie die externen
Verknüpfungen auf Seiten mit den Titeln Literaturverzeichnis,
Weiterführende Informationen oder Andere coole
Quellen sammeln, brauchen Sie lediglich eine Seite zu
überprüfen, um sicherzustellen, dass alle externen
Links weiterhin gültig sind.
- Verwenden Sie relative Adressen: Links
zwischen nahe verwandten Seiten müssen keine absoluten
URLs verwenden. Wenn Sie lediglich den letzten Teil der
URL angeben und den Browser die korrekte vollständige
Adresse zusammenstellen lassen, sind die Seiten besser
gegen bestimmte Formen allgemeiner Änderung isoliert.
- Links zur eigenen Home Page: Von Zeit zu
Zeit befindet man sich auf merkwürdigen Seiten und will
wieder zur zugehörigen Home Page zurück. Diese
Situation kann entstehen, wenn jemand anderes eine
direkte Verbindung zu der Seite hergestellt hat oder wenn
jemand eine Seite herunter geladen hat, um sie sorgfältig
zu überarbeiten. In beiden Fällen sorgen Links zur Home
Page auf allen Ihren Seiten dafür; dass die Leser wieder
zurückfinden.
- Verweise auf andere Home Pages: Home
Pages bleiben üblicherweise verfügbar, auch wenn oft
Zweifel hinsichtlich des Arrangements der übrigen Seiten
bestehen. Soweit möglich bzw. sinnvoll, verwenden Sie
die Home Pages anderer Autoren als Ziel Ihrer Verweise
anstelle der spezifischen interessierenden Seite. Wenn
Sie eine Verbindung zu einer speziellen Seite herstellen
müssen, versetzt einen ein zusätzlicher nahe gelegener
Verweis auf die zugehörige Home Page in die Lage, die
Informationen selbst dann aufzufinden, wenn die spezielle
Seite verschoben wurde.
- Unterzeichnen Sie Ihre Seiten:
Mittlerweile ist es Tradition, dass jede Seite einen
Querverweis mit dem Namen des Autors und seiner
Mail-Adresse enthält. Das Ziel dieses Verweises ist eine
Seite mit Informationen über den Autor, manchmal mit
Foto, Rücksprung und anderen Informationen.
- Lesen Sie Ihre Seiten Korrektur: Ein
gewichtiger Umstand, der die wenigen guten
lnternet-Quellen ans der erdrückenden Menge schlechter
Quellen unterscheidet, ist der, dass die guten
sorgfältig geprüft und bearbeitet werden. Die Zeit, die
für das Korrekturlesen, Sammeln von Kommentaren von
Freunden und bewusste doppelte Prüfung aufgewendet wird,
kann den Hauch von Professionalität verleihen, der Ihren
Seiten das Überleben sichert. Derartige
Nachbearbeitungen kosten Zeit, worin genau der Grund
liegt, warum so viele Leute diese Arbeiten
vernachlässigen.
Weiterführende Informationen
Wenn Sie Zugang zum World Wide Web haben, stellt die Home Page
von W3, die die Entwicklung vieler World Wide
Web-Standards unterstützen, einen guten Startpunkt dar. Suchen
Sie mit Ihrem Browser http://www.w3.org für nähere Einzelheiten
auf. Selbst wenn Sie das Lesen eines guten Buchs zum Thema
vorziehen, stellt diese Seite eine gute Quelle aktueller
Informationen dar. Weil sich die Standards mit großer
Geschwindigkeit entwickeln, werden Sie in jedem Buch veraltete
Informationen finden.
Angesichts des schnell wachsenden Interesses am
World Wide Web gibt es einige gute Bücher, die speziell dem
Thema HTML gewidmet sind. lan Grahams HTML Sourcebook ist
eine gute Referenz für HTML und HTTP.
HTML-Editoren und andere Werkzeuge für den Macintosh finden
Sie in den Info-Mac-Archiven im text/_HTML-Verzeichnis.
Yahoo verfügt über ein wohl organisiertes Verzeichnis mit
HTML-Werkzeugen für viele Plattformen, inklusive eigenständiger
Editoren und Tools zur Konvertierung verschiedener
Textverarbeitungsformate nach HTML. Im Hauptindex von Yahoo
wählen Sie Computers and Internet, dann World Wide Web
und schließlich HTML Editors.
|
