Tabelle, Bilder und Abbbildungsbezeichnung

[novice]

Hallo Zusammen.

Ich habe einige Fragen bzgl. der Handhabung von Bildern auf einer Hopempage.

1. Wenn ich die Bilder über eine Tabelle positioniere (Anfängerarbeitsweise,was?;-)), kann man dann die Bilder automatisch an die Spaltenbreite(2 Spalten a 50%) anpassenlassen?

2. Wie kann ich das Bild/Foto mit der Abbildungsbezeichnung (class-definiert) fest miteinander verknüpfen, damit die Abbildungsbezeichnung immer unter dem Bild/Foto steht, auch wenn das Browserfenster veränder wird? (bislang "haut" dann der eigentlich rechtstehende Text dazwischen?)

3. Bringen mir Definitionsleisten (dt und dd) was? Nur dann steht die Abbildungsbezeichnung nicht unter dem Bild, sondern rechts daneben...

es wäre schön, wenn mir jemand weiterhelfen könnte?

Danke im Vorraus, Novice

[Gunnar Bittersmann]

@@novice:

1. Wenn ich die Bilder über eine Tabelle positioniere (Anfängerarbeitsweise,was?;-))

Ja. Vergiss Tabellen zum Layouten gleich wieder.

kann man dann die Bilder automatisch an die Spaltenbreite(2 Spalten a 50%) anpassenlassen?

Die Veränderung der Bildgröße durch den Browser ist selten eine gute Idee. Browser haben nicht so gute Skalierungsalgorithmen wie Bildverarbeitungsprogramme; die Bildqualität leidet bei der Skalierung im Browser.

2. Wie kann ich das Bild/Foto mit der Abbildungsbezeichnung (class-definiert) fest miteinander verknüpfen,

Leider bietet HTML für Bilder keine Auszeichnung der Bildunterschrift an, wie es mit dem 'caption'-Element für Tabellen zur Verfügung steht.

damit die Abbildungsbezeichnung immer unter dem Bild/Foto steht, auch wenn das Browserfenster veränder wird?

Bild und Bildunterschrift in einem Element gruppieren:

<div class="BildMitBildunterschrift">  
  <img src="foo" alt="bar" />  
  <br />  
  Lorem ipsum  
</div>

Ohne 'br' ginge es auch; dann .BildMitBildunterschrift img {display: block} setzen.

3. Bringen mir Definitionsleisten (dt und dd) was?

AFAIS nein.

Live long and prosper,
Gunnar

[suit]

3. Bringen mir Definitionsleisten (dt und dd) was?

AFAIS nein.

da scheiden sich die geister, manche leute behaupten suchmaschinen würden das besser verstehen da ein bezug zwischen defintion = bild und dem term = beschreibungstext entsteht

in allen fällen ist der missbrauch von defintionslisten aber eine unart - da ist gunnars vorschlag in jedem fall besser - in xhtml 2.0 wird das aber angeblich alles anders ;) da wirds dann hoffentlich <img src="blah">mein text</img> geben

[Gunnar Bittersmann]

@@suit:

in xhtml 2.0 wird das aber angeblich alles anders ;) da wirds dann hoffentlich <img src="blah">mein text</img> geben

Wenn das Bild angezeigt wird, wird es der Elementinhalt nicht. [XHTML2 §20] Das ist also lediglich eine andere Syntax für <img src="blah" alt="mein text" /> – eine Anpassung an die schon in HTML 4/XHTML 1 bestehende Syntax beim 'iframes'- und 'object'-Element.

(Warum zum Geier heißt es bei 'object' in HTML 4/XHTML 1 nicht 'src', sondern 'data'; bei 'iframe' wiederum 'href'?)

(X)HTML 5 wird vielleicht ein 'figure'-Element einführen. [HTML5 §3.14.1*, xhtml.com]

Live long and prosper,
Gunnar

* Achtung: 2 Megabyte! Der Autor weiß offenbar nicht, was Hypertext ist und wie man ein großes Dokument sinnvoll in mehrere kleine teilt.

[suit]

Wenn das Bild angezeigt wird, wird es der Elementinhalt nicht. [XHTML2 §20] Das ist also lediglich eine andere Syntax für <img src="blah" alt="mein text" /> – eine Anpassung an die schon in HTML 4/XHTML 1 bestehende Syntax beim 'iframes'- und 'object'-Element.

http://www.w3.org/TR/xhtml2/mod-embedding.html
ach gott, zu früh gefreut :(

interessant wäre es optional beides anzeigen zu können

[Björn]

Hallo Zusammen.

Ich habe einige Fragen bzgl. der Handhabung von Bildern auf einer Hopempage.

1. Wenn ich die Bilder über eine Tabelle positioniere (Anfängerarbeitsweise,was?;-)), kann man dann die Bilder automatisch an die Spaltenbreite(2 Spalten a 50%) anpassenlassen?

Guten tag,

Mit dem Attribut width geben Sie die Breite der Grafik an, und mit height die Höhe (width = Breite, height = Höhe). Notieren Sie die Maße ohne Einheiten, wird automatisch px für Pixel herangezogen.

somit kannst du die Grafik von der Größe her anpassen!

[Gunnar Bittersmann]

@@Björn:

Mit dem Attribut width geben Sie die Breite der Grafik an, und mit height die Höhe (width = Breite, height = Höhe). Notieren Sie die Maße ohne Einheiten, wird automatisch px für Pixel herangezogen.

somit kannst du die Grafik von der Größe her anpassen!

Warum das oft keine gute Idee ist, habe ich bereits erläutert.

Bilder sollten auf Webseiten in ihrer wahren Größe verwendet werden. Die Größenangaben in den 'width'- und 'height'-Attributen sollten also den wirklichen Bildgrößen entsprechen.

Die 'width'- und 'height'-Attribute sind dennoch sinnvoll, damit der Browser beim Rendern schon den Platz für das Bild freihält und nicht beim Eintreffen des Bildes (sobald der Browser die Bildgröße kennt) die Seite neu aufgebaut werden muss.

Live long and prosper,
Gunnar