FIR – Fahrner Image Replacement als Bildersetzung
Wir benutzen das span-Element als – nicht unumstrittenes – Mittel der Bildersetzung, um den umschlossenen Text über CSS auszublenden, während statt dessen ein Bild angezeigt wird.
FIR ist die ursprüngliche Bildersetzungsmethode schafft aber auf Grund der Einschränkungen in Bezug auf Barrierefreiheit einige Probleme. Der zu ersetzende Text wird in einen eigenen SPAN-Bereich gesetzt.
<p> <span> zu ersetzender Text </span> </p>Dem p-Bereich wird nun das Hintergrundbild zugewiesen.
p { background:url(image.gif) no-repeat; }Der Inhalt des SPAN-Bereiches wird ausgeblendet.
span {display:none};Probleme gibt es mit einigen (nicht allen) Bildschirmlesegeräten, die den Text ignorieren. FIR funktioniert unter Internet Explorer 5+, Opera 5+, Netscape 6+ und Safari.
Dwyer-Methode
{mospagebreak title=Dwyer-Methode}Die Dwyer-Methode ist eine Abwandlung des FIR.
Der zu ersetzende Text wird in einen eigenen SPAN-Bereich gesetzt.
<p> <span> zu ersetzender Text </span> </p>Dem p-Bereich wird nun das Hintergrundbild zugewiesen.
p { background:url(image.gif) no-repeat; }Der Inhalt des SPAN-Bereiches wird ausgeblendet.
span { display:block; height:0; width:0; overflow:hidden; }Probleme gibt es mit einigen (nicht allen) Bildschirmlesegeräten, die den Text ignorieren. Diese Methode funktioniert mit allen Browsern.
Bildersetzung nach Phark
{mospagebreak title=Bildersetzung nach Phark}Diese Methode ist geeignet für Bildschirmlesegeräte und es wird KEIN nicht semantisches SPAN-Element benötigt.
<p> zu ersetzender Text </p>Dem p-Bereich wird nun das Hintergrungbild zugewiesen.
p { background:url(image.gif) no-repeat; text-indent:-4000px; }Der Text wird mittels eines sehr großen negativen Texteinzuges aus dem Sichtbereich entfernt. Diese Methode löst das Problem mit Bildschirmlesegeräten. Schwierigkeiten gibt es mit deaktivierter Bildanzeige und aktivem CSS. Aus diesem Grund sollte diese Methode nicht für sehr wichtige Elemente einer Website eingesetzt werden.
Methode nach Gilder/Levin
{mospagebreak title=Methode nach Gilder/Levin}Diese Methode ist geeignet für Bildersetzungsgeräte und sie lößt auch das Problem bei deaktivierter Bildanzeige und aktivem CSS. Benötigt wird ein leerer SPAN-Bereich. Die Grafik wird über den Text gelegt und wird sichtbar wenn die Bildanzeige abgeschaltet ist.
<p> <span></span> zu ersetzender Text </p>
p {width:100px;height:30px;position:relative};Der p-Bereich wird nun relativ positioniert.
span { width:100%; height:100%; position:absolute; background:url(image.gif) no-repeat; }Das Bild muss einen durchgehenden Hintergrund haben, sonst scheint der Text hindurch
Inman Flash Replacement (IFR) und scalable IFR (sFIR)
{mospagebreak title=Inman Flash Replacement}Wird benutzt um den Mangel an Schriften zu beheben. Hierbei wird der Text einfach gegen ein SWF (Flashdatei) ausgetauscht unter zu Hilfenahme von Javascript.Es wird nur eine Flashdatei benötigt, der zu ersetzende Text wird bei dieser Methode in eine duplizierte Flashdatei geschrieben.
Das Problem dieser Methode liegt in den benötigten Ladezeiten. Die Seite muss erst völlig geladen sein damit durch Jvascript der Text ersetzt werden kann.