Diese Graphik heißt comics20.gif und wird durch den Befehl
<img scr="...."> in die Seite eingebettet (zur Anzeige gebracht).
Damit es so aussieht, als ob der Hase über den Bildschirm läuft, wird der Befehl
<marquee></marquee> verwendet, der eigentlich eine Laufschrift erzeugt. Sollten Sie den Hasen jetzt nur auf der Stelle laufen sehen, so liegt das an Ihren Browser. Der Tag lautet so:
<marquee><img src="comics20.gif"></marquee>
Wichtig beim Umgang mit Graphiken ist die Größe der Dateien. Das hat nichts mit der Breite und Höhe des Bildes zu tun, sondern mit der Datenmenge also der Bildauflösung und dem Dateiformat. Die im Internet vorrangig verwendeten Formate sind .jpg und .gif, weil diese Bilder komprimiert sind das heißt wenig Daten für viel Inhalt.
Ein Foto mit einer digitalen Kamera aufgenommen hat ca. 0,8 bis 1,5 Megabyte. Bei einer Datenübertragung mit einem analogen Modem werden ca. 56 Kilobit pro Sekunde übertragen. Somit ist die Ladezeit einer unbearbeiteten Aufnahme 15 bis 20 Sekunden. Bei fünf Bildern pro Seite also ca. 1,6 Minuten. So lange wird kein User (Benutzer) warten.
Man muss solche Dateien mit entsprechender Software verkleinern indem man die Auflösung verringert.
| Auflösung gering 4 KB Ladezeit kurz 240 x 180 Pixel |
Auflösung hoch 72 KB Ladezeit lang 960 x 720 Pixel |
![]() |
![]() |
Natürlich muss man ein Kompromiss eingehen, was die Qualität angeht. Eine Möglichkeit mit diesem Problem umzugehen ist, dass man auf der Hauptseite nur kleine Dateien zeigt, will ein Benutzer genauer hinsehen ruft er mit einem Klick auf die Graphik eine neue Seite auf, die nur aus dem Foto besteht.
Der Befehl für das Einbetten einer Graphik lautet: <img scr="Datei">
Wenn Sie die Bilddateien in den Gleichen Ordner "Hochladen" (auf den
Server Ihres Anbieters speichern). Geben Sie ein Verzeichnis ein, wenn sie einen Unterordner für die Bilder benutzen. Des weiteren
ist zu beachten, dass Sie nicht die klassische Schreibweise mit \ benutzen,
sondern / wie im Internet üblich
<img scr="Verzeichnis/Datei.Erweiterung">
Folgende Befehle formatieren die Graphik (sie können auch weggelassen werden):
| width="78"* | - die Breite beträgt 78 Pixel (bei Weglassen Originalgröße) |
| height="58"* | - die Höhe beträgt 58 Pixel |
| border="1" | - die Rahmenstärke ist 1 Pixel |
| style border-color="#..." | - Nr. bestimmt die Rahmenfarbe (hier nicht nötig, Link) |
| alt="Link zur Vollansicht" | - dieser Text erscheint, wenn der Kursor darauf ist |
Das alles wird dann noch in den Befehl zur Formatierung des Absatzes zentriert <p align="center"> und im Hyperlink <a href="...> eingebettet :
* Die Befehle width und height haben nur Einfluß auf die dargestellte Breite und Höhe im Browser. Auch wenn sie in Pixel angegeben sind, haben sie keinen Einfluß auf die Datenmenge, die die Bilddatei hat.
Man kann also ein Bild, das nur 80 mal 60 Pixel groß ist mit 800 mal 600 im Browser darstellen.
Das sieht dann so aus:

Darum empfiehlt es sich, jede Datei in ihrer tatsächlichen Größe darzustellen.
Das Problem, dass Anfänger haben, ist das Feststellen der wirklichen Größe der Graphik in Pixel. Öffnen Sie dazu die Graphik in einem entsprechenden Bearbeitungsprogramm. Einige Programme zeigen die Größe gleich an in anderen müssen Sie danach suchen, z.B. im Mikrosoft Fotoeditor unter Datei / Eigenschaften.