|
|
|
|
Bilder in deiner Seite
Nun könnt ihr also schon mit Schriften Veränderungen auf eure Seite bringen und ihr könnt sogar Bereiche einfärben, aber nun mag ich euch auch noch erzählen, wie man Bilder in eine Seite einfügt.
|
|
Sicherlich wollt ihr neben euren Worten auch manchmal ein Bild stehen haben, egal ob es nun ein Foto von euch ist, eine Grafik, die ihr in einen Malprogramm gemalt habt, oder sonst irgendetwas Buntes oder einfach Bildartiges. Hierbei solltet ihr jedoch darauf achten, dass ihr das Bild als *.jpg oder *.gif abspeicherst. Dadurch sind die Dateien auch nicht soooo groß. Je größer so eine Datei ist um so länger braucht dann die Seite zum Laden... nunja nicht nur Unki ist oft ein ungeduldiger Mensch im Internet, auch andere warten manchmal nicht so gerne. :-)
Auf der anderen Seite auf schöne Grafiken wartet man dann doch manchmal schon wieder um einiges lieber.
Eigentlich bin ich ja ganz schüchtern, aber da ihr schon so neugierig schaut verate ich euch doch wie dieses alles in HTML funktioniert. Etwas schüchtern bin ich deswegen, weil ich auch auf diese Weise in diese Seite eingefügt worden bin, aber reden wir nicht weiter davon, sondern lieber davon wie dieses alles nun geht.
Nehmen wir an, ihr habt jetzt ein Bild erstellt und es in eurem Ordner für eure Seite
gespeichert. Nun ist der große Moment gekommen. Ihr bindet es mit folgendem Befehl auf eure Seite ein:
<img src="Bildname" height="Bildhöhe" width="Bildbreite" alt="Beschreibung" title = "Text border="0">
Das schaut arg wild aus, oder? Naja ich erkläre es euch mal an mir. Also ich bin eigentlich die Datei htmling.gif, das ist dann der Bildname. Dann bin ich 174 Pixel breit und 216 Pixel hoch. Dieses hat mir ein kleines Grafikprogramm verraten. Unki benutzt dafür unheimlich gerne Irfanview (dieses findest ihr im Kapitel Tools und weitere Hilfen).
Nun fragt ihr euch vielleicht noch was das alt="Beschreibung" soll? Nun manche Menschen haben die Anzeige von Grafiken ausgeschaltet oder können diese nicht sehen, beispielsweise weil sie blind sind, um nun aber auch ihnen zu sagen, was ihr dort anzeigen wollt könnt ihr einen beschreibenden Text dazu machen.
Durch title="Text" könnt ihr dann auch einen Hinweis einbauen, der erscheint, wenn Ihr mit der Maus über das Bild geht.
*lächel* wenn ihr da unten mal mit eurer Maus über mich fahrt seht ihr, was ich meine. :o). Nungut fehlt noch die Erklärung für border="0". Damit sagt ihr mir, dass dein Bild keinen Rand haben soll, wodurch es beispielsweise auch als Link geeignet ist.
Aber hey, ich habe da eine Idee wir setzen mich jetzt mal hier unten hin, dann kann ich mir mal selbst auf dieser Seite "Hallo" sagen... :o) Also fangen wir an:
<img src="htmling.gif" width="174" height="216" title="Hallo HTMLing :o)" alt="Ein Bild vom HTMLING" border="0">
Und nun als Beispiel mal ohne Bild von mir... :-) Ich hoffe, damit wird der Unterschied zwischen ALT und TITLE klarer.
Wenn ihr da unten jetzt mit der Maus über mich fahrt, solltet ihr auch das Hallo HTMling :o) sehen und ich kann ganz geschmeichelt ein Hallo an mein Spiegelbild zurück geben *freu*. Sofern Ihr keine Bilder sehen könnt, habt Ihr hier zusätzlich den Hinweis, dass hier ein Bild vom HTMLING zu sehen ist.
Nebenbei ebenso wie bei den HTML-Dateien ist es enorm wichtig, dass ihr
den Dateinamen genau so schreibt, wie er auch gehört.
Besonders häufig hat Unki vergessen auf Groß- und Kleinschreibung zu achten. Naja, zwischen htmling.gif und htmling.GIF ist im Internet durchaus ein Unterschied, deswegen auch hier der Tipp von meiner Seite, Dateien grundsätzlich Namen mit kleinen Buchstaben anzugeben (auch bei der Endung, also gif oder jpg)... :o) Verwendet bitte auch keine Leerzeichen in euren Bilddateien, da es sonst auch noch zu Schwierigkeiten kommen kann. Ferner sollten die Bilddateien auch an der Stelle sein, wo ihr sie angebt. Wenn ihr also eure Internetseite einmal online stellt oder sie weitergebt... vergesst die Bilder nicht. :-)
 |
 |
|
|
