Bilder auf Webseiten beschriften

Mittels CSS haben Sie zwei Möglichkeiten, Bilder auf Webseiten zu beschriften

Ersten Kommentar schreiben
Stand: 16. Dezember 2008

Bildbeschriftung per span

Mittels CSS haben Sie zwei Möglichkeiten, Bilder auf Webseiten zu beschriften: Per span für Bilder in einem Fließtextabsatz und per Defintionsliste für Bilder im eigenen Absatz. Peter Müller erklärt, wie es funktioniert.

Alle Welt spricht von semantischem HTML, aber HTML selbst macht die Auswahl eines zur Bedeutung des Inhalts passenden Elements manchmal nicht gerade leicht.

Sicher, Überschriften können als Überschriften markiert werden, Absätze als Absätze, Listen als Listen und Zitate als Zitate. Aber schon für eine so simple Sache wie eine Bildbeschriftung ist schlicht und einfach nichts vorgesehen, sodass Autoren improvisieren müssen.

Ich zeige Ihnen, wie man Bilder auf Webseiten beschriften kann, und zwar gleich auf zweierlei Art und Weise:

  • Bilder innerhalb eines Fließtextabsatzes mit span

  • Bilder außerhalb in einem eigenen Absatz mit einer Definitionsliste

Beispieldateien

Zum Üben und Selbermachen stehen Beispieldateien bereit. Das zip-Archiv enthält zwei Ordner: In "basis" finden Sie die Übungsdateien, mit denen Sie unmittelbar anfangen können zu arbeiten. Dem Ordner "fertig" entnehmen Sie, wie das Ganze am Ende aussehen sollte. - Download Beispieldateien (.zip, 47 KB)

Bilder beschriften mit span

Im Beitrag "CSS: Grafiken positionieren mit float" haben Sie einen roten Ballon mit einer CSS-Klasse namens .bildrechts gestaltet und nach rechts gefloatet:

Als Mitglied können Sie diesen Beitrag weiterlesen!

Werden Sie Mitglied und testen Sie akademie.de 14 Tage lang kostenlos!

In den ersten 14 Tagen haben Sie Zugriff auf alle Inhalte auf akademie.de, außer Downloads. Sie können in dieser Zeit ohne Angabe von Gründen stornieren. Eine E-Mail an service@akademie.de genügt. Nur wenn Sie Mitglied bleiben, wird der Mitgliedsbeitrag nach Ende der 14tägigen Stornofrist abgebucht.

Ich bin bereits Mitglied
Jetzt Mitglied werden und akademie.de 14 Tage kostenlos testen
Ich entscheide mich für folgende Zahlungsweise:
14 Tage Stornorecht:
Ich kann meine Mitgliedschaft in den ersten 14 Tagen jederzeit formlos stornieren, z.B. per E-Mail an service@akademie.de.

Inhalt

Downloads zu diesem Beitrag

Über den Autor:

bild117259

Peter Müller, Dozent und Autor, beschäftigt sich bereits seit 1995 mit dem Web und veröffentlichte zahlreiche Bücher rund um das Thema Webpublishing. Seine Erklärungen sind nicht ausschließlich für E ...

Newsletter abonnieren