|
|
|
|
 Wegweiser:
Startseite >>
Übersicht HTML-Kurs
>>
Kapitel 3: Grafik / Sound
| HTML Kurs - Kapitel 3: Grafik / Sound |
Sie können für die Anzeige einer HTML-Datei ein Hintergrundbild bestimmen.
Dabei wird das Bild über das ganze Anzeigefenster hinweg immer wiederholt, so dass ein
Tapeteneffekt (Wallpaper) entsteht. Besonders geeignet für Wallpaper-Effekte sind
relativ kleine Grafiken, die irgendein abstraktes Muster darstellen.
Die Hintergrundgrafik sollte als Grafikdatei im GIF-Format oder JPEG-Format vorliegen.
Beispiel:
<html>
<head>
<title>Text des Titels</title>
</head>
<body background="background.gif" >
<p>Ein erster Test</p>
</body>
</html>
|
<< So sieht`s aus >>
Die Angabe zum Einbinden eines Hintergrundbildes erfolgt im einleitenden <body>-Tag der
HTML-Datei. Mit dem Attribut background= bestimmen Sie eine Grafikdatei als Hintergrundbild
(background = Hintergrund). Die gesamte HTML-Datei wird auf dem hier definierten Hintergrundbild angezeigt.
Sie können eine Farbe für den Hintergrund des Anzeigefensters bestimmen.
Die gesamte HTML-Datei wird auf dieser Hintergrundfarbe angezeigt.
Beispiel:
<html>
<head>
<title>Text des Titels</title>
</head>
<body bgcolor="#0099FF" >
<p>Ein erster Test</p>
</body>
</html>
|
<< So sieht`s aus >>
Die Angabe zur Hintergrundfarbe erfolgt im einleitenden <body>-Tag der HTML-Datei.
Mit dem Attribut bgcolor= bestimmen Sie die Farbe für den Bildschirmhintergrund
(bgcolor = background color = Hintergrundfarbe). Die gesamte HTML-Datei wird auf der
hier definierten Hintergrundfabe angezeigt. Für die Farbauswahl gelten die Regeln zum
Definieren von Farben in HTML.
Grundsätzlich gibt es zwei Möglichkeiten, Farben in HTML zu definieren:
durch Angabe der RGB-Werte der gewünschten Farbe in Hexadezimalform (RGB = Rot/Grün/Blau-Wert der Farbe)
durch Angabe eines Farbnamens
Wenn Sie hexadezimale Werte angeben, arbeiten Sie Browser-unabhängig, und Sie haben die volle Freiheit zwischen 16,7 Millionen Farben.
Wenn Sie Farbnamen angeben, umgehen Sie die etwas schwierige Definition einer Farbe im Hexadezimal-Modus.
Derzeit sind jedoch nur 16 Farbnamen offiziell standardisiert (z.B. black,green,...).
Sie müssen sich jetzt aber keine Sorgen machen, dass sie alle hex Werte auswendig lernen müssen, dies erledigen die meisten
html Editoren für Sie.
Um Grafiken in Ihre HTML-Dateien einzubinden, referenzieren Sie die Grafikdateien an
gewünschten Stellen im HTML-Quelltext. Geeignete Dateiformate für Web-gerechte Grafiken
sind vor allem GIF und JPEG.
Wenn Sie HTML-Dateien fürs Web erstellen, sollten Sie darauf achten, dass die darin referenzierten
Grafiken nicht zu groß sind, denn aufwendige Grafiken verursachen lange Ladezeiten und Missmut beim
Anwender. Reduzieren Sie in Ihren Grafiken gegebenenfalls die Anzahl der Farben, verringern Sie die
Bildgröße und stopfen Sie nicht zu viele Grafik-Referenzen in eine einzige HTML-Datei.
Sie können an jeder gewünschten Stelle eine Grafik in Ihre HTML Seite einbinden.
Mit dem Attribut alt= können Sie einen Alternativtext angeben, der erscheint wenn man
mit der Maus über das Bild bewegt. Dieser Text wird auch angezeigt, wenn das Bild nicht gefunden wurde.
Beispiel:
<html>
<head>
<title>Text des Titels</title>
</head>
<body bgcolor="#FFFFFF" >
<p><img src="geeko.gif" alt="SuSE Linux"></p>
</body>
</html>
|
<< So sieht`s aus >>
Wenn Sie Grafiken in HTML-Dateien einbinden sollten Sie stets
die Breite und Höhe der Grafik mit angeben. Dadurch entnimmt der Web-Browser bereits der HTML-Datei,
wie groß die Grafik ist, und muss nicht warten,
bis er die entsprechende Header-Information der Grafikdatei ausgelesen hat.
So kann er die gesamte Web-Seite bereits am Bildschirm aufbauen und bei noch nicht
eingelesenen Grafiken erst mal eine entsprechend große Freifläche anzeigen. Wenn Sie
Breite und Höhe nicht angeben, wartet der Browser dagegen mit der Anzeige der Web-Seite,
bis er alle nötigen Größenangaben aus eingebundenen Grafikdateien eingelesen hat,
Beispiel:
<html>
<head>
<title>Text des Titels</title>
</head>
<body bgcolor="#FFFFFF" >
<p><img src="geeko.gif" width="100" height="50" alt="SuSE Linux"></p>
</body>
</html>
|
<< So sieht`s aus >>
Sie können jederzeit auch eine Hintergrundmusik für Ihre Webseite festlegen, Sie sollten aber beachten,
dass dies von vielen Internetbenutzern als nervig angesehen wird und diese Benutzer dazu neigen Ihre Seite
schnell wieder zu verlassen.
Das vorgestellte Beispiel funktioniert jedoch nur unter MS Internet Explorer.
Beispiel:
<html>
<head>
<title>Text des Titels</title>
<bgsound src="passport.mid" loop="infinite">
</head>
<body bgcolor="#FFFFFF" >
<p>Text Text Text</p>
</body>
</html>
|
<< So sieht`s aus >>
|
|
|
