HTML images Bilder einfügen

Ich bin gerade dabei mir eine eigene Internetseite zu machen, aber da diese mit html aufgebaut ist habe ich noch einige kleine Probleme, damit kenne ich mich nämlich kaum aus. Beim Bilder einfügen hat es mir nun angezeigt, dass ich nur html images verwenden kann.

Welches Format entspricht dem denn und wie kann ich meine vorhandenen Bilder so umwandeln, dass ich sie dennoch verwenden kann? Ich habe eigentlich schon alles zusammen, was ich gerne hoch laden möchte, aber das geht ja nun wohl nicht so einfach, wie ich gehofft hatte.

Code: Alles auswählen

<img src="bild.jpg" width="100" height="150" alt="Bild1" />


Wo ist da das Problem? Musst du nur noch den Pfad anpassen und die anderen Daten und schon hast du ein Bild eingefügt. Das Format ist am Ende egal ob du nun .jpg .png oder .gif oder noch etwas anderes nimmst macht keinen Unterschied. Schlau wäre es aber wenn es Fotos sind die Bilder als .jpg zu haben da diese bei Fotos die beste Farbqualität bringt und am wenigsten Speicherplatz benötigt.

Es ist nicht ganz egal welches Format du nutzt, da hier doch einige Unterschiede bestehen. Es kommt eben darauf an, für was die Bilder genutzt werden. Für Buttons eignet sich oft das GIF-Format am besten, für Fotos dagegen das JPG-Format. Aber wie gesagt, es kommt eben darauf an.

Browser können übrigens lange nicht alle Grafik-Formate anzeigen. Daher kann es also sein, dass du die vorhandenen Grafiken in ein anderes Format konvertieren musst, damit diese vom Browser angezeigt werden können. Es gibt einige kostenlose Programme die das können. IrfanView eignet sich dafür z. B. ziemlich gut.

Zum HTML-Code: "src" beschreibt den Pfad und den Dateiname des Bildes. Hier solltest du auf Groß- und Kleinschreibung achten (auch bei der Dateiendung), da es sonst eventuell Probleme mit dem Server geben kann, je nachdem welches System aufgespielt ist.

Unter "width" und "height" gibst du Breite und Höhe des Bildes an. Beide Angaben sind optional, sollten aber für einen besseren und schnelleren Seitenaufbau verwendet werden.

"alt" ist ein Pflichtattribut und muss für validen HTML-Code unbedingt angegeben werden. Dort kannst du einen Alternativtext für das Bild vergeben. Dieser Text wird dann angezeigt, wenn das Bild nicht geladen werden konnte. Du kannst es auch leer lassen (alt=""), aber angegeben werden muss es.

Einige Browser zeigen den alternativen Text auch dann an (obwohl das eigentlich nicht so sein sollte), wenn man mit der Maus über das Bild fährt. Um das zu verhindern, kannst du das "title" Attribut nutzen: title=""

Mit "title" kannst du Titel für Elemente (z. B. Bilder oder auch Tabellenzellen) festlegen. Diese werden angezeigt, wenn man mit der Maus über das entsprechende Element fährt. Zudem hat "title" Vorrang vor "alt". Wird "title" also leer kommentiert, wird auch der Alternativtext nicht angezeigt.